Alberto• 190
@Alberto-12
Submitted
@nikkistorme
@Alberto-12
Submitted
@nikkistorme
Posted
Hi Alberto! Nikki here.
This project is so cool! Great job translating the design to the webpage. Keeping such a close eye on the details isn't easy! I have a few pieces of feedback, if you're interested.
#Accessibility
<header>
, then the bulk of the page in a <main>
, then just keep the <footer>
as it is! Inside the <main>
container I would split into two <section>
s. One <section>
for the title and description up top, and one <section>
for the remaining content.<img>
tags currently have empty alt
attributes. This is a pretty easy accessibility win for screen readers. Here's an article I like about alt
text.(I can't see the designs, so some of the following feedback could very well be irrelevant.)
background-image
property on .content
. It looks like the graphic needs to be more flush with the top right corner, so putting the background-image
on the <body>
with a background-position: top right;
could do the trick!background-image
on .content
. When the .content
container does not use the page's full width, it appears cut off. It looks like that image isn't supposed to be constrained by the .content
container, so putting it on the <body>
would probably work better in this case.max-width
mitigates having to go too big, but it helps to look).#CSS
.first-p
, .pattern2-div
, etc). I personally don't recommend this naming convention, because if you end up changing the tag for that element (like changing a div
to a section
) the name becomes confusing. If you need help choosing a CSS naming convention, I really like SMACSS, but there are plenty of alternatives out there.I know that's a lot to take in! Like I said up top, your project looks awesome and you did a fantastic job. These are just some things that could take it to the next level!
Let me know if you have any questions about anything. Keep up the great work!
Marked as helpful