Personal Portfolio and Responsive Web Design done!

Code Feedback
1

Just finished the personal portfolio and the Responsive Web Design curriculum. Can’t wait to get started with the JavaScript part!

Would love your feedback on my personal portfolio page: https://codepen.io/robaish/full/dyveEdd

4 Likes
2

I like the clean look of the page. Just a few observations after a quick once over:

  • There is no <navbar> element. I think you want <nav>.
  • Speaking of the nav menu, you have it set to display: none on narrower view ports. Don’t you want everyone to have access to the menu :slight_smile:
  • Also, you can’t have <div>s in the <ul> like that. The <li>s must be direct descendants of <ul>.
  • Technically, the white numbers on green circles do not have enough color contrast to meet accessibility standards. You can use the WebAIM color contrast checker to make sure you have enough contrast.
  • If I make my browser shorter, the squiggly arrow above the First Principles heading starts to overlap the content above it.
1 Like
3

Thanks for the feedback, great points! True, got lazy with building a hamburger menu for mobile :sweat_smile:

The <nav> as a list is a bit of an issue for me – I don’t know how to divide the <nav> content into left and right parts without using <div> s. Apparently people are divided whether to use lists in navs at all.

4

I would take a look at the flex-grow property.

I would be interested to know who these people are. I think it is pretty standard to use lists for navigation menus.

1 Like
5

Thanks for the tip.

CSS Tricks is my go-to resource. These two articles sum up the debate pretty well:

6

WCAG does not require that lists be used in navigation so technically you do not have to. And of course you will always find at least someone who doesn’t think you should ever use them :slight_smile: The articles you gave are from 2013. One thing about accessibility is that it is often fluid and best practices change over time. Eight years in Internet time is like 90 years in people time :slight_smile: I’m not saying you should totally disregard those articles, they make some valid points. But if you search for “accessible navigation menus” you will find that the overwhelming majority of info you find on them is going to recommend that you use a list because it is currently accepted as a best practice.

So I wouldn’t say that “people are divided” on this topic. The overwhelming majority of accessibility experts will say to use lists.

2 Likes
7

Thanks for the input. Don’t have a strong opinion on this, just seemed like something of a debate with hundreds of comments :slight_smile: Will default to unordered lists from now on.

8

Great Effort , keep coding :heart_eyes:

1 Like