───✱*.。:。✱*.:。✧*.。✰*.:。✧*.。:。*.。✱ ───
Links
- What makes the internet a “web” of pages
- Browsers (mainly just Chrome) use your navigation habits for targeted advertisement
- Web pages are not linear—links are used to explore different topics and sites
- IE: On Wikipedia, you can navigate from Baseball to Baseball Bat
<a>
- By default, anchor tags have blue text, and are underlined
- Link to another place, including internal pages and external websites
- External links use absolute URLs
- IE:
https://wikipedia.org
- IE:
- Internal links use relative URLs, relative to current page (or start with
/
to be relative to root)- You can also link to specific IDs within the same page with
#id
- IE:
index.html
,../../index.html
,/index.html
,#footer
- You can also link to specific IDs within the same page with
Images
- No one likes a website with just text; images make websites more appealing to everyone
- “A picture is worth ten thousand words” — Confucius
<img>
- Alt text is for accessibility and as fallback text if the image fails to load
- You can also use images as a link for
<a>
tags, but you need thetarget="_blank"
attribute - There are three common image formats, along with many others
.gif
→ animated images.jpg
or.jpeg
→ smaller, no alpha channel, lossy.png
→ larger, transparency, lossless- Many more, including
.jxl
,.avif
,.webp
(and vector graphics such as.svg
)
<figure>
- Captions that appeals under images
- Typically explain images or give credit to the image source
<figcaption>
includes the actual text within the figure:
<figure>
<img src="..." alt="...">
<figcaption>Some Image</figcaption>
</figure>
───✱*.。:。✱*.:。✧*.。✰*.:。✧*.。:。*.。✱ ───