@emestabillo
Posted
Hi Dave, well done on this project! I'm not familiar with 11ty, so I'll just share a few thoughts on UI/UX:
-
I would pick one of the planets and show it on the home page. For users who are not familiar with the design, it would be odd to find a blank page. They might think there is something wrong with the site. IRL, I imagine you'd be in talks with the client or designer.
-
The anchor tag IDs in the tabbed section can be a little hard to use on smaller devices. Maybe better to let the user decide when to scroll down instead of jumping right to the text upon button click.
-
Between 823-858px, the navbar items seems to be shifting into different layouts
-
One other minor thing is to add smoother transitions
Congrats on adding a stack to your skillset! And increasing font sizes as seen here are much better on the eyes IMO :-)
Marked as helpful
1
@emestabillo thanks so much for the feedback.
I think I've addressed most of the points you raised (I thought Earth seemed most appropriate for the Home page!)
I've struggled to make this work on mobile devices, as the links are up top but the text below the image. I've stopped the auto scroll, and will work on making the top row narrower later - I've got the issue there...
If you have a moment, could you just add a bit of advice regarding 'smoother transitions'? I had added a short one on hover - are you suggesting that should just be slower, or something bigger?
Thanks so much for the feedback - really appreciated!
1
@emestabillo
Posted
@dwhenson I took a closer look at the code and yes, you did use hover transitions on the project but it's the same code for all elements. Perhaps I was looking at the "Source" text, where background-color
and border
does not apply, therefore the global style transition: background-color 200ms linear,border 200ms linear;
also does not work on it.
'Earth' is a great choice for the home page, but maybe instead of 'Home' as the heading, use the actual planet name :-)
One more thing, if you will, is to place a bit of padding between the statistics and the bottom gutter.
1
@emestabillo thanks for the clarifications. I really struggled with that bottom gutter spacing on mobile.
1