Please review my newest blog design

It doesn't matter if you do all the error checking in the world, or if you have the most beautiful graphics, if your site or application design isn't usable, it's not going to do well. Get input and advice on usability and user interface issues here.

Moderator: General Moderators

User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Please review my newest blog design

Post by RobertGonzalez »

So I have been playing around a little bit with hacking my Wordpress theme. This time around I wanted to throw a little JS goodness into the mix.

I also wanted to do something different in the way of a layout since most layouts for blogs tend to go either two column or three column. I prefer no columns.

Anyway, if you feel so inclined, would you please play around with the blog for a bit at http://www.robert-gonzalez.com/ and tell me what you think? I am specifically looking at this from a usability angle, though it would be nice to hear anything else that you might want to add.

Test how you will. Let me know what I forgot to add to it.

PS There is, so far, one known issue: When CSS is off but JS is on my navigation links (Bloggers, Categories, Archive) do not properly href to their content. I am working on that. If anyone knows how to use jQuery to see if CSS is disabled, I would love to hear your solution.

PPS There is another major non-issue that I want to tell you about. The design is written in standard XHTML and standard CSS (a few CSS 2 goodies). That means that the rendering works, for sure, in Safari, Opera and Firefox. I refuse to hack this layout for IE. In fact, I am certain that bits of it do not work in IE and I am fine with that. I am working on a notice to IE users to that effect but will not be able to test this until tomorrow when I get to work.

PPPS This was supposed to post about seven hours ago, but it was 2:30 in the morning, and embarassingly enough, I fell asleep in the middle of it. :oops: I guess I am not the code monkey I used to be.
User avatar
Eran
DevNet Master
Posts: 3549
Joined: Fri Jan 18, 2008 12:36 am
Location: Israel, ME

Re: Please review my newest blog design

Post by Eran »

I went over it and these are my thoughts, hope it will be taken as constructive criticism:
1. The design is clean if a bit bland. There isn't much variation in the color palette, the reflection below the logo is a little clich`e, and the design feels a little flat - despite the dropshadow under the posts (in fact it somehow accentuates it).
2. What resolution did you test it in? If I resize the window, the 'recent rant' list opens a second scroll-bar. Double scroll bars are a big no-no.
3. The aforementioned list and the about block to the left are always present even when opening a post. It is semi-annoying to have to scroll over it each time. (Update: I later realized you can remove this using the summary link. But it isn't very obvious)
4. The spacing between the lines in the post is HUGE. It makes each post appear much longer than it is actually is and is tiring mentally.

Check out those links -
http://www.wellstyled.com/tools/colorsc ... ex-en.html - An excellent color palette generator. You can also choose variations like pastel etc.
http://webtypography.net/toc/ - Elements of typography applied to the web. It is very over the top, but some good points can be deduced out of it.
User avatar
John Cartwright
Site Admin
Posts: 11470
Joined: Tue Dec 23, 2003 2:10 am
Location: Toronto
Contact:

Re: Please review my newest blog design

Post by John Cartwright »

I have to say I found your blog really clean and easy to navigate. I really don't have any comments aside from the fact that I enjoyed a couple of your posts, including the one where you wrote about baby instructions, and linked the digg article.
Image

I seriously hope this article is a joke :lol:
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Re: Please review my newest blog design

Post by RobertGonzalez »

@pytrin: thanks for the comments. I will review them tomorrow morning and see if I see anything that you are talking about (I already do, for the record...).
Jcart wrote:I have to say I found your blog really clean and easy to navigate. I really don't have any comments aside from the fact that I enjoyed a couple of your posts, including the one where you wrote about baby instructions, and linked the digg article.
Image

I seriously hope this article is a joke :lol:
Maybe it is. Maybe it isn't. :wink:
User avatar
Eran
DevNet Master
Posts: 3549
Joined: Fri Jan 18, 2008 12:36 am
Location: Israel, ME

Re: Please review my newest blog design

Post by Eran »

By the way, I liked your post on yellow ledbetter. It is a known easter egg amongst PJ fans, and they change the lyrics every time they perform it live. I've seen so many variations of attempted translations, but that was on the better ones :)
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Re: Please review my newest blog design

Post by RobertGonzalez »

pytrin wrote:By the way, I liked your post on yellow ledbetter. It is a known easter egg amongst PJ fans, and they change the lyrics every time they perform it live. I've seen so many variations of attempted translations, but that was on the better ones :)
Yeah, that one had me in stitches. I knew about the changes to the song for every performance. I also like seeing the may differing opinions on the lyrics to that song.

Sadly, I was one of those that tried to piece the words to that song together way back in 1993 (man, am I dating myself with that tidbit or what?).
User avatar
Kieran Huggins
DevNet Master
Posts: 3635
Joined: Wed Dec 06, 2006 4:14 pm
Location: Toronto, Canada
Contact:

Re: Please review my newest blog design

Post by Kieran Huggins »

Image
MAKE ME FRIES!
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Re: Please review my newest blog design

Post by RobertGonzalez »

Can you see dems?

Ok now, enough. Back on topic. :)
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: Please review my newest blog design

Post by pickle »

I like columns - it helps me get to the content quicker. I'm not a fan of how you've got stuff laid out. At 1024 x 768, I can see the title & first line of your first blog post, before I have to scroll. Granted, you've provided a link to toggle the summary, but if I wasn't doing a website review, I probably wouldn't have stuck around long enough to figure it out. What about if you just had "Who is this Robert dude?" and "Recent rants and commentary" visible with a link to expand them if desired? For first time users, the actual content of your blog would be more readily visible.

The "Register", "Log in"... link text is too small. They look fine at 10pt (tsk tsk - you should be using ems. Incidentally - don't look at my website's CSS ;)).

I think your line-height in the "Who is this Robert dude?" box and in your posts is too high. It looks like you're trying to fill up space - and trying too hard.

I love the soft gradients you have in your navigation and "Who is this Robert dude?" boxes. The gradient in your blog posts should match that, but it seems too short.

The drop shadow around the posts is a bit too obvious (for my tastes)

When you shrink the window enough, the "Summary" section gets a vertical scrollbar - why not just grow it?

Blue, black, and white is my favourite pallete - so I love the colour scheme.

Your "Categories" and "Archive" lightbox don't populate unless I'm looking at the homepage.
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Re: Please review my newest blog design

Post by Benjamin »

Just giving first impressions here.

1. Something with the header and navmenu messes with my eyes. It could be the yellow on blue, or the blue below the black. It's not pleasing.
2. The link colors against the white background look great.
3. As a first time visitor I see "Recent rants and commentary" but I don't know what they are about. Maybe a short blurb about that.
4. Same with "And your thoughts?"
5. The colors on the boxes look good, and they match the link colors, but they do not match the header colors.
6. The fonts are a *tad* too big for my taste, and I normally complain about fonts being too small.
7. I think I'd ditch the "Wacha lookin fer". It's playful, but causes me to think the rest of the site may not be credible.
8. I clicked to hide the recent topics menu, but when I clicked on a topic, the menu displayed on the next page and didn't disappear until the page had completed loading. That is very agitating for me. (Using firefox 2.0)
9. I like the added line spacing, but it may be a tad too much. This may be related to the large font-size.
10. I would put the PHP code in a div with a border, and use the css overflow attribute to separate it from the topic body. (Very nice to have it at least color coded)
11. "You must be logged in to post a comment.", I prefer more user friendly phrases such as "Please login to submit a comment" or "Login or Register to post a comment".
12. Back to top links are great, I especially like the scroll up feature.
13. Even after looking at the site for a while it's hard for me to understand the purpose. The title is "One Mans Voice". I don't know what your voicing. You may want to elaborate on that.

Overall it's a good site. Great use of multiple technologies and putting them all together. I'm absolutely horrible at color schemes so considering that your a programmer the colors are decent but they need improvement. Wordpress seems to be a bit slow although I didn't confirm that it's not latency caused by my lan or internet connection
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Re: Please review my newest blog design

Post by RobertGonzalez »

Sweet. Thanks for the feedback. I will be going over all of this within the next few days. I especially like your points astions. Thanks for taking the time to review my stuff.
User avatar
JayBird
Admin
Posts: 4524
Joined: Wed Aug 13, 2003 7:02 am
Location: York, UK
Contact:

Re: Please review my newest blog design

Post by JayBird »

You have lost your RSS feed indicator in the URL bar
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Re: Please review my newest blog design

Post by RobertGonzalez »

Hmmm, I'll have to look into that. There were no changes, that I am aware, to the underlying code. I may have just missed a template tag somewhere.
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Re: Please review my newest blog design

Post by RobertGonzalez »

Ok, so I messed around with the design a bit and actually decided to change it dramatically. I was wondering what you all thought about the changes.

For reference, I looked at each one of the posted critiques and looked for ways to improve upon them:
I went over it and these are my thoughts, hope it will be taken as constructive criticism:
1. The design is clean if a bit bland. There isn't much variation in the color palette, the reflection below the logo is a little clich`e,
and the design feels a little flat - despite the dropshadow under the posts (in fact it somehow accentuates it).
-- I added variant nav link colors and overall links colors to add some color to the scheme.

2. What resolution did you test it in? If I resize the window, the 'recent rant' list opens a second scroll-bar. Double scroll bars are
a big no-no.
-- Fixed

3. The aforementioned list and the about block to the left are always present even when opening a post. It is semi-annoying to have to
scroll over it each time. (Update: I later realized you can remove this using the summary link. But it isn't very obvious)
-- Renamed the box, changed the toggler text, added a link inside the box

4. The spacing between the lines in the post is HUGE. It makes each post appear much longer than it is actually is and is tiring
mentally.
-- Reduced from a 24pt line height to an 18pt line height

=======================================================================

I like columns - it helps me get to the content quicker. I'm not a fan of how you've got stuff laid out. At 1024 x 768, I can see the
title & first line of your first blog post, before I have to scroll. Granted, you've provided a link to toggle the summary, but if I
wasn't doing a website review, I probably wouldn't have stuck around long enough to figure it out. What about if you just had "Who is
this Robert dude?" and "Recent rants and commentary" visible with a link to expand them if desired? For first time users, the actual
content of your blog would be more readily visible.
-- I did play with this a little, but not much

The "Register", "Log in"... link text is too small. They look fine at 10pt (tsk tsk - you should be using ems. Incidentally - don't
look at my website's CSS ;)).
-- Fixed

I think your line-height in the "Who is this Robert dude?" box and in your posts is too high. It looks like you're trying to fill up
space - and trying too hard.
-- Agreed, and the box is removed for the most part (if comments don't fetch then the box shows)

I love the soft gradients you have in your navigation and "Who is this Robert dude?" boxes. The gradient in your blog posts should
match that, but it seems too short.
-- Handled

The drop shadow around the posts is a bit too obvious (for my tastes)
-- Handled

When you shrink the window enough, the "Summary" section gets a vertical scrollbar - why not just grow it?
-- Fixed

Your "Categories" and "Archive" lightbox don't populate unless I'm looking at the homepage.
-- Fixed

=======================================================================

1. Something with the header and navmenu messes with my eyes. It could be the yellow on blue, or the blue below the black.
It's not pleasing.
-- Changed colors

2. The link colors against the white background look great.
-- Trying a different color link. Still a bold color. Just different.

3. As a first time visitor I see "Recent rants and commentary" but I don't know what they are about. Maybe a short blurb about that.
-- Made it a little simpler and added titles

4. Same with "And your thoughts?"
-- Same same

5. The colors on the boxes look good, and they match the link colors, but they do not match the header colors.
-- Changed boxes altogether

6. The fonts are a *tad* too big for my taste, and I normally complain about fonts being too small.
-- I made more space on the screen and changed the line height and bottom margin for paragraph tags

7. I think I'd ditch the "Wacha lookin fer". It's playful, but causes me to think the rest of the site may not be credible.
-- Done

8. I clicked to hide the recent topics menu, but when I clicked on a topic, the menu displayed on the next page and didn't disappear
until the page had completed loading. That is very agitating for me. (Using firefox 2.0)
-- This bugged me too so I made the recents closed by default with a link to open them

9. I like the added line spacing, but it may be a tad too much. This may be related to the large font-size.
-- This should be better now

10. I would put the PHP code in a div with a border, and use the css overflow attribute to separate it from the topic body.
(Very nice to have it at least color coded)
-- I boxed it and bordered it.

11. "You must be logged in to post a comment.", I prefer more user friendly phrases such as "Please login to submit a comment" or
"Login or Register to post a comment".
-- Done

13. Even after looking at the site for a while it's hard for me to understand the purpose. The title is "One Mans Voice". I don't
know what your voicing. You may want to elaborate on that.
-- I need to work on this. I have the tagline, but no place to put it yet
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: Please review my newest blog design

Post by pickle »

I like this better. 3 things though:

- I think the mouseover colour for the navigation bar is too subtle. I'd suggest a brighter, higher contrasting red/magenta/pink/fuscia.
- I think the difference between the background white and the blog entry background blue is too subtle. Totally up to personal taste, but I'd make it a bit more discernible.
- It's a bit jarring (usability wise), to click the "Hide Recent Items" link below the recent items, but then have to go up to your menu to show them again. What if you had the "Hide Recent Items" link centred & in a stylized bar. That bar would always appear, and when the Recent items are hidden, it would say "Show recent items". A toggle switch in one place, rather than 2.


Edit: 4th thing
The links in your lightboxes are different sizes than the links in your "Recent..." section. They should at least be the same size as each other, and probably the same size as your "Recent..." sections.

Edit: 5th thing
It works almost perfectly in IE7. The only thing I noticed was the text for the second "Hide Recent Items" overlaps the image.
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
Post Reply