Code Fellows Reading Notes

HTML Media

What is a real world use case for the alt attribute being used in a website? Adding a text description of an image for when it fails to render/screen reader

How can you improve accessibility of images in an HTML document? Using an alt tag for the visually impaired.

Provide an example of when the figure element would be useful in an HTML document. Pairing a <figcaption> with an image

Describe the difference between a gif image and an svg image, pretend you are explaining to an elder in your community. A gif image is ideal for a simple animated image, and an svg image is useful for an image that needs to be presented at different sizes(scalable).

What image type would you use to display a screenshot on your website and why? The JPEG (typically pronounced “jay-peg”) image format is currently the most widely used lossy compression format for still images. It’s particularly useful for photographs; applying lossy compression to content requiring sharpness, like diagrams or charts, can produce unsatisfactory results.

Learn CSS

Describe the difference between foreground and background colors of an HTML element, pretend you are talking to someone with no technical knowledge. The foreground is the text color, and backgound is the color behind the text.

Your friend asks you to give his colorless blog website a touch up. How would you use color to give his blog some character? Use contrasting colors that make the text more readable, while also drawing attention & adding style to the needed elements.

What should you consider when choosing fonts for an HTML document? Readability and relation to the content.

What do font-size, font-weight, and font-style do to HTML text elements? Change the height, thickness, and other styling like italicize.

Describe two ways you could add spacing around the characters displayed in an h1 element. Properties letter-spacing and word-spacing.