Johnston - Reading Notes - Home
Code 201, Foundations of Software Development
Class 05 - Reading Notes
Readings: Images, Color, Text
HTML Media
What is a real world use case for the alt attribute being used in a website?
- If someone has a slow connection and they can't load.
How can you improve accessibility of images in an HTML document?
- You can improve accessability by using a screen reader function. If the browser doesn't support the image, you can display an image's alt as texts!.
Provide an example of when the figure element would be useful in an HTML document.
- The figure element can be useful if you want the ability to move content without affect the flow of other content.
Describe the difference between a gif image and an svg image, pretend you are explaining to an elder in your community.
- GIF, is a short animation loop, SVG is a drawing/icon that can grow or shrink depending upon the device it is being used in.
What image type would you use to display a screenshot on your website and why?
- .PNG due to its lossless nature.
Learn CSS
Describe the difference between foreground and background colors of an HTML element, pretend you are talking to someone with no technical knowledge.
- Background colors are the fill of the boxes, or fill of the entire page. It won't stand out because the purpose isn't to grab your attention.
- Foreground colors will always be on top of background colors.
Your friend asks you to give his colorless blog website a touch up. How would you use color to give his blog some character?
- I would first apply some color to the background, the color the text with a secondary color. I would use a couple of tertiary colors for other elements like borders and as well as certain lines of header text.
What should you consider when choosing fonts for an HTML document?
- Make sure font choice is available to be utilized on multiple browsers.
What do font-size, font-weight, and font-style do to HTML text elements?
- Font size, allows developers to grow or shrink a font to the desired size.
- Font Weight controls the boldness of a font.
- Font Style toggles whether or not the font is italicized.
Describe two ways you could add spacing around the characters displayed in an <h1> element.
- By adding spaces within the element itself in HTML, or utilizing the text alignment feature in CSS!.
Things I want to know more about:
https://chrisjohnston1986.github.io/reading-notes/201class05reading