Katja-B / TeaCozy

HTML and CSS project featuring the Box Model, CSS Display, and Flexbox
https://katja-b.github.io/TeaCozy/
0 stars 0 forks source link

SUMMARY #4

Open aubreywullschleger opened 6 years ago

aubreywullschleger commented 6 years ago

Grade: Meets expectations

Summary: Nice job on this project! I love your use semantic HTML elements, your use of locally stored images, and your use of flex-box in CSS.

A couple things to work on here would be: 1. using descriptive alt attributes for your <img> elements and 2. using group selectors for any repeated styles in your CSS.

Next, as a stretch goal, I challenge you to research and implement media queries to make your page responsive for all screen widths. This is a challenge I think you are ready for based on your work with this project! Here are a couple resources to get you started: https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries and https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

Katja-B commented 6 years ago

Thank you @aubreywullschleger for your comprehensive feedback and useful references!

I have just uploaded my updated code with condensed CSS, alt text for <img> and a new semantic tag <address>. (In my next projects, I'll use <article>, <section>, <heading> and <aside> as well as the responsive media queries.)

Quick follow-up question: I can only add alt text to an image referenced in in HTML, right? I can't add an alternative description to a background image referenced in CSS, can I?