London 9-Leila Farsani-HTML / CSS Project 1-Week 2 - #270
Conversation
jonnywyatt
left a comment
There was a problem hiding this comment.
Looks good! Lots of good use of page structure.
| <!-- Remember: Use semantic HTML tags like <header>, <main>, <nav>, <footer>, <section> etc --> | ||
| <header> | ||
| <h1>Mathsli</h1> | ||
| <h3>Do you love Maths? </h3> |
There was a problem hiding this comment.
There's no content below this heading, so it makes more sense as a <div /> or a <p />
| </header> | ||
| <main> | ||
| <section> | ||
| <article class="article1"> |
There was a problem hiding this comment.
article is suitable for content that will be shown on other web sites eg newspaper articles or blog posts
| <main> | ||
| <section> | ||
| <article class="article1"> | ||
| <h1>About Mathsli</h1> |
There was a problem hiding this comment.
There should only be one h1 on each page. Use it to wrap the title that best describes what the page is about
| <article class="article1"> | ||
| <h1>About Mathsli</h1> | ||
| <h4>Mathsli helps you to learn and love Maths.</h4> | ||
| <img src="https://clipartion.com/wp-content/uploads/2015/11/what-are-the-top-biggest-brain-damaging-habits-magical-maths.jpg" |
There was a problem hiding this comment.
For a content image like this, set alt text to something that describes the image (eg 'A picture of a human brain working like a mechanical machine' or something)
| <h2> | ||
| We are here to help. | ||
| </h2> | ||
| <button><a href="#">More About US</a></button> |
There was a problem hiding this comment.
It's invalid to wrap a in button. If it looks like a button, but it acts like a link, just use a and style it like a button using CSS
| <h4>Mathsli helps you to learn and love Maths.</h4> | ||
| <img src="https://clipartion.com/wp-content/uploads/2015/11/what-are-the-top-biggest-brain-damaging-habits-magical-maths.jpg" | ||
| alt=""> | ||
| <h2> |
There was a problem hiding this comment.
I think this is a good choice & correct as h2 because it's the next level down from the preceding heading (h1) and has content after it 👍
| We are here to help. | ||
| </h2> | ||
| <button><a href="#">More About US</a></button> | ||
| <h3> |
There was a problem hiding this comment.
This isn't a heading, it doesn't have content after it, better as a p
| </article> | ||
| <section> | ||
| </main> | ||
| <textarea name="comment" |
There was a problem hiding this comment.
Every form element should have a label associated with it, to help screen reader users. A placeholder isn't a good substitute as it disappears when the user clicks on the input box.
| } | ||
|
|
||
| .items:first-child > a{ | ||
| color: var(); |
Volunteers: Are you marking this coursework? You can find a guide on how to mark this coursework in
HOW_TO_MARK.mdin the root of this repositoryYour Details
Homework Details
Notes
What did you find easy?
What did you find hard?
What do you still not understand?
Any other notes?
View rendered README.md