Reading Notes for Day 5 of 201
Readings: Images, Color, Text
Read HTML Media, Using Images In HTML, Common Image Types and Choosing Image Formats.
- What is a real world use case for the alt attribute being used in a website?
The alt attribute is used by screen readers to tell visually impaired people what is in photos on websites, as well as letting people know what should be there if the photo isn’t loading.
- How can you improve accessibility of images in an HTML document?
Provide descriptive alt tags and use figcaption to give a description of the loaded image that screen readers will detect.
Provide an example of when the figure element would be useful in an HTML document.
Figure, used with figcaption gives images a screen readable caption. It is useful anytime a caption to an image can help users understand what’s happening in that image, whether they are seeing impaired or not.
Describe the difference between a gif image and an svg image, pretend you are explaining to an elder in your community.
A gif is a format that’s good for animations, or when you’re not concerned about a really clear, sharp picture. An svg is good for drawings or logos or things that you want to look really sharp at any size.
What image type would you use to display a screenshot on your website and why?
I would use a png, because it would have the best change of being seen clearly.
Read Learn CSS - Using Color in CSS. Styling HTML Text Elements
- Describe the difference between foreground and background colors of an HTML element, pretend you are talking to someone with no technical knowledge.
Foreground color is like the text on a page, where background is the color of the page.
- Your friend asks you to give his colorless blog website a touch up. How would you use color to give his blog some character?
It really depend on the elements on the page, I might give sections different colors to make them stand out from each other, or put colored framed around pictures, or maybe make some text different colors to draw the eye to that content.
-
What should you consider when choosing fonts for an HTML document? How readable the font is, whether it conveys the style you want for the site, how common it is, and how it will display on multiple browsers.
-
What do font-size, font-weight, and font-style do to HTML text elements?
Font size changes, the size of the characters, font weight applies boldness, font style applies italics.
- Describe two ways you could add spacing around the characters displayed in an h1 element.
You could use letter spacing or word spacing.
Things I want to know more about
I really want to be able to use moving images, so I’m looking at info related to that, but I remember using an image carousel somewhere, and I’m trying to find that as well.