Design comparison
Solution retrospective
thanks for any feedback
Community feedback
- @pikapikamartPosted about 3 years ago
Hey, great work on this one. The layout in desktop is really good, responds well and the mobile state is really good as well.
Some addition suggestions to what Teegamtee already said:
-
The
alt
for the website logo should be more descriptive, right now, the only text that we could use is the name of the project itself from fem, thealt
could bealt="project tracking"
or if you have a better one. Do not use as well words like "logo, icon, image, picture" as a value foralt
attribute. -
The list of links in the
header
should have been wrapped insidenav aria-label="primary"
element. So that users will know that this is a navigational links. -
On the
schedule a demo
link, you should add ahref
attribute so that it will be properly accessible. Right now, you can't tab on it because the browser doesn't know what it does even if it is aa
tag. Add thehref
. -
On mobile layout, the hamburger menu toggler needs to be a
button
element and not adiv
. Making it abutton
will make it more accessible. -
The hamburger
button
should have alsoaria-label="hamburger dropdown toggler"
so that users will know that thisbutton
does. Also, it should have aaria-expanded
attribute that will be dynamically changed via javascript. This will allow a user to be informed that a dropdown has appeared. -
Also, even if you properly made it a
button
the ordering is not proper in your html. What should happen is that, when I use my keyboard to toggler the dropdown, the dropdown appears right, then when I use the tab on my keyboard again, I should be on the links, but it doesn't , because the ordering is wrong. Thebutton
should come before the list of links:
<button /> <dropdown />
Aside from those, really great work.
Marked as helpful0 -
- Account deleted
Hi,
Desktop view looks nice and the transition to smaller screen sizes is ok, but it kind of weird how everything is on the left of the screen just after switching to mobile view but not the
powerful insights...
text.And you have a little problem, go to mobile view and activate the mobile menu then return back to desktop and see what happens to the navigation bar.
Keep coding👍.
Marked as helpful0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord