Feedback requested: my tribute page to Ray Dolby

Feedback requested: my tribute page to Ray Dolby
0

#1

Hello :grin: After giving a bunch of people advice on their tribute pages, I figure I should post my own and ask for feedback on it, too. Here it is:

[Ray Dolby Tribute for FCC] (http://codepen.io/stewartmurrie/full/pymRXW)

I’d love to hear your thoughts on any aspect: code, design, styles, whatever. Especially feel free to call me out on advice I’ve given but not followed myself!

EDIT: the code is also on GitHub if you’re interested:

http://stewartmurrie.github.io/fcc-tribute/


#2

Not bad for a professional UI/UX/design engineer.

On the PC I had to scroll back up to read the second column, and the content was a bit crowded.

Despite these minor issues, I think you might have some potential! Keep it up!


#3

Stewart, I really like your tribute page. It is well organized and everything scaled well for responsiveness.
Nice Work!


#4

Haha, thanks @bnoden :grin: I don’t know if having the sidebar with additional content is a good idea or not, and I see what you mean about having to scoll up to read it. It was interesting trying to get it to layout how I wanted though, good learning exercise.

When you say that it’s a little crowded, do you mean the text is too small and hard to read, or that the elements are too tightly packed together?


#5

This is beautiful. I can tell you put a lot of effort into it. Great job!


#6

Too close together. Some whitespace wouldn’t hurt. I don’t (as a hypothetical user) understand why there are columns.

Also, Ray left us with a legacy robust with blue links on a blue backgound.


#7

Fair point. The two columns for the main body text made more sense before I added the sidebar (to keep the line length down on desktop browsers). Going back to single column would probably be a better choice now, and would give more room to play around with spacing.

Yes, yes he did :slight_smile: I wonder whether I should try to find link colours that work for both light and dark backgrounds, or eschew consistency and style each differently?

Thanks for the great feedback!


#8

Hey Stewart,

I noticed some images loaded a tad slow.

https://tinypng.com/ might help with compressing large pictures in the future.

Other than that, look’s great on desktop and mobile!

Joseph

Edit: I ran your html on W3C’s HTML Markup Validation Service and it looks like it caught some errors ( e.g. Error: No p element in scope but a p end tag seen., etc.). Not too many though.

And while I was at it, I figured I might as well lint the CSS too lol. No complaints from W3C CSS Validation Service and only some suggestions came up from CSS Lint. Just note, some people think the stuff that comes out from CSS Lint are overkill, but either way, it’s an opportunity to learn something from what it spits out.


#9

Great pro-tips @joechan3!


#10

I was trying to tell you 3 days ago, but kept getting the 500 error… I really liked your page, so I forked it and did some things. I’ll accept reverse feedback.
http://codepen.io/bnoden/full/aZzJXV/

I generally have no interest in doing anything with static webpages, more interested in building applications.


#11

Very nice! The link colour is definitely an improvement and I think the whole thing looks great in mobile, but the layout of the aside gets a little loose at desktop sizes (the star and the readmore sit awkwardly for me). Thanks for taking the time to play with my page, very cool of you!