Aiden Portfolio finished!

Code Feedback
1

Hey guys, it’s been so long since I started this journey. Zero regrets! Here’s the last html&css challenge: the portfolio. Please tell me what do you think :smiley:
https://codepen.io/aiden22/pen/PoWpZbw

2

Your page looks good @Aiden22. Some things to revisit;

  • The nav links are hard to see. Not enough contrast with dark text on a dark background. I think it’s even harder to see when expanding the hamburger menu on smaller screens.
  • While the hover effect is okay what about those that don’t have the ability to hover…id est, smaller screens?
    • What about those that use the keyboard to navigate? There’s no focus so they don’t even know when they’re over the projects.
3

Your portfolio looks great.
I will agree with @Roma , the nav links dont stand out enough and my attention is mostly drawn towards only because i have made the same project^^
Even as someone who can hover, i found the hidden projects to be too…hidden. Dont get me wrong, i like the effect, but if you dont happen to hover over them, you might not even realize there is something beneath :stuck_out_tongue:

1 Like
4

Agree with this one, maybe make the preview screenshot or the project title visible by default and the other elements fade in on hover

5

Hey guys! Thank you very much for your feedback! much appreciated :smiley:
Here are the changes I did:

  • Navbar now more visible.
  • Desktop version: Put a “Put your mouse over me” text to make the cards effects more visible.
  • Mobile version: Disabled the hover effect on the cards (all of them are visible now).

The only problem I found is the one that @Roma commented about the keyboard users: I can’t find a way to make the hover effect with a ‘tab’ action. As you can see, if you tab in this section, you pass all over the links to see the project BUT the hover effect won’t appear (I guess you need a mouse).

6

Here’s a hint. When a keyboard user tabs through the page they focus on areas of the page. Much the same as the hover
Notice when you tab through now you see a “box” around each of the items in the navbar. That’s called focus. Notice though that it currently doesn’t have the same effect as when a mouse user hovers.
Hope that helps.

7

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.