Kelly Souza Static Site

[kellysouza]

Static Site

Congratulations! You're submitting your assignment!

Comprehension Questions

Question	Answer
Did you have to resolve any issues when running the HTML Validator? If so, what were they?	Yes, I forgot all alt tags for the images.
Why is it important to consider and use semantic HTML?	To make the HTML easier for us to understand as coders as well as making it more usable to people who use the internet in ways other than the typical visual use
How did you decide to structure your CSS?	I went top to bottom on the page covering each item. I also tried to be sure as much as possible was covered in the main css page and tweaks to the other pages.
What was the most challenging piece of this assignment?	Deciding to leave it alone and stop tweaking the small bits. Also committing a theme/design
Describe one area that you gained more clarity on when completing this assignment	Lots more clarity on placing boxes where I want them, especially the fixed sidebar as well as the footer and header.

[kariabancroft]

Static Site

What We're Looking For

Feature	Feedback
Baseline
Appropriate Git Usage	Yes
Answered comprehension questions	Yes
Page fully loads	Yes
No broken links (regular or images)	Yes
Includes at least 4 pages and styling	Yes
HTML
Uses the high-level tags for organization: header, footer, main	Yes
Appropriately using semantic tags: section, article, etc.	Yes
All images include alternate text	Yes - alt doesn't have to be in "code format" it can be in regular text
CSS
Using class and ID names in style declarations	Yes. For example, the project class on each project. The class #post1 on each article in that same section doesn't really make sense though? Why this class name? You are using IDs but they don't seem to be named very syntactically - it seems like this is mostly used to order things. How could you improve the IDs for semantics? Style note: there is at least one ID that doesn't have quotes around the ID value. (index line #21).
Style declarations are DRY	Yes - some opportunity for improvement. For ex, font-family in the styles file is used in a few different places with the same values. Also, the same values for text-shadow in the first portfolio file are duplicated which you could create one selector for and apply over multiple elements.
Overall	Don't forget to check your indentation - lots of opportunity for improvement with this. Overall, you did a nice job. I like the CSS styles you explored and the final product.

[esther-ng]

Nice job manipulating images and creating a parallax effect. I echo Kari's comment regarding #post1 being a bit confusing and room for improvement in id/class semantics/usage. Good job going back and getting the alt-text for the images -- something that was suggested to me is to consider what the image is providing to a sighted person that someone using a screen reader would miss out on. Sometimes the image is purely decorative, in which case an empty string may actually be preferred.

[esther-ng]

Doesn't appear to be used in html -- could this have been removed?

[esther-ng]

Are the h4 and p tags styled differently here? Would it have made sense to combine them?

[esther-ng]

Would it have been possible to give this div id a more contextual rather than positional name? What if you wanted to swap slide 1 with slide 2 -- would the names still make sense?

[esther-ng]

The text is a little difficult to read -- does this meet accessibility contrast guidelines?

[esther-ng]

The footer on this page appears different from the others (right icons are cut off/run off the right side of the page in Chrome). Should a footer tag be placed inside a main tag?

[esther-ng]

Is this class being used as a selector somewhere?

[esther-ng]

Missing ''

[esther-ng]

Also missing ''