Whitespace: Homepage Analysis

September 09, 2004 | View Comments (29) | Category: Whitespace

Summary: An analysis of how the homepage design came to be what it is now as of this writing. Damn that sentence is confusing.

As designers I don't think we place ourselves in the shoes of our viewers enough, especially when it comes to our own sites. I also don't think we realize the different types of visitors that come to our sites. In my mind I see 3 different groups of people coming to my site with 3 different objectives:

These 3 groups apply to every blog and website out there. There may be other groups, but these were the main ones that I placed my focus on when thinking about the homepage.

What I Wanted

Redesigning your own website usually comes from the fact that you are dissatisfied with something. I felt the last design wasn't as “tight” as I wanted it to be and there was too much space not being used properly. The homepage also had a restriction in that I had to keep the two opening paragraphs at a reasonable size so that the layout would work the way I wanted it to.

So for me I wanted a homepage that gave a better picture in one “snapshot” of what this site entails. A homepage where you could go directly where you wanted to or explore if your heart desired. For most blogs I have to literally roam around to get an idea of what is going on. There is no snapshot.

I also had this weird task in my head of creating a homepage that did not require a navigation bar.

The Regulars

Obviously the homepage wasn't really geared towards this group because as I said I think they go to the entry pages. However, in the comments it was enlightened to me (many times over) that the paragraph for the latest entry was a missed feature so to speak. Not everyone uses RSS and some just like to go around the web exploring so adding a paragraph was easy enough and I was allowed to keep the philosophy behind the homepage in check.

Also if you are a regular you might have forgotten about a past entry and enjoyed the discussion being carried on there. I think the homepage with the latest list of entries is an easy to go through rundown so you can go ahead an reread your favorites.

Newcomers

The homepage is mostly geared towards this group. A first time visitor coming to a homepage should be aware immediately of the design philosophy of the designer and also get an idea of what the site is about. I wanted the about page to become a single paragraph that got right to the point of what WS is and I wanted that front and center.

After that, newcomers should be able to explore the site. On most blogs if you are new to them you get to see the latest entry. For example, lets take a peek at Keith's site and see what might happen. Most of us already know that Keith's site focuses around the subject of web design. However, here and there you will find entries related to non-design subjects such as book reviews and music reviews. Pretend a newcomer was so simple-minded that he based his opinion of the site on the first entry he saw and on Keith's site that might be a music review and the only entry he can see. No longer will he visit the site because music reviews do not interest him.

Of course that is stretching things a lot since Keith does a nice job of providing the reader with enough hints throughout the site to give you an idea of what it encompasses. But you should get the point.

Search Engine Visitors

The go to the entry pages that are linked from the search engines, but if they wish to visit the homepage the same rules apply to them as the Newcomers.

Response

Well the people who were kind enough to comment seem to like the design and I am sure the ones who don't like it decided not to for one reason or another. What's funny to me is that the more complicated we try to make our designs, the greater the backlash (eg Andrei and Shea), but simple designs always seem to work. Sure these designs will almost never make it into the Vault (guy is an idiot), but what it comes down to is that they just work.

There will be minor touches here and there added to the homepage I am sure, I mean the site only has one graphic now so maybe a little bit of pizazz is needed. The homepage though reflects my philosophy concerning information. I like to get to it as fast as possible with as little distraction as possible. I will add another section that lists my favorite entries. The great thing about the this layout is that adding new section just seems to fit logically no matter where I put them.

From an aesthetic standpoint the site is “meh”. Not drop dead gorgeous, but I don't think it hurts the eyes either. From an information design standpoint however, I like to pat myself on the back (nothing wrong with some hubris here and there). But notice anyone could take this layout and beautify it up and still have the working layout. I created the perfect coloring book template :-).

I wish I could provide you with greater insight into how a design like this came to me, but it really was just an evolution of the previous design and for some reason it just seemed obvious to do something like this. So do blog homepages require two columns? The answer should be obvious. In fact, 2 columns might not be the best case in any situation for a blog's homepage.

Trackback URL: http://9rules.com/cgi-bin/mt/mt-tb.cgi/331

Comments

#1

Personally, I think the homepage is more functional now as compared to the last design. I bypassed alot of information in that design that I have paid attention to in this one. You were right in that it is now more of a portal (i think you said that in "Fall Edition" post) to the rest of the site.

Nice work. Now I need to get off my ass and start designing cleaner like this redesign.

Awesome.

Daniel (http://www.blog.adion44.com)

#2

Although I love the supa' clean, get-to-the-point modified homepage structure (I think navbars are a little overrated at times anyway), it took me about 5 secs to locate the latest blog entry when I hit the redesign for the first time. I'm still primarily a homepage reader over RSS feeds, so perhaps I'm an anomalistic Regular.

Currently, the homepage says "A directory of the life of Paul Scrivens" to me. If that's what you're shooting for, excellent work. But if not, consider perhaps swapping the 2-col wide "About" area with the latest blog entry, so the blog entry sits at left spanning 2 columns and the About area spans only 1 column at right. Even something as simple as "Latest article" beneath/above the headline might even do the trick.

Overall, very clean and well organized.

Cameron Moll (http://www.cameronmoll.com/)

#3

Like i have allways read and agreed, on the top left is the most important website object, the logo, and bellow the logo is the second most, in your case is the content.

Congratulations, the "preview last entry" is just superb under the logo

Jose Silva (http://josesilva.portaltm.com)

#4

Like I said before the new design is going to take me some time to get used to, but I do like it. Although there is one thing about the homepage that bothers me, and its not even that vital, but it leaves me wondering why you did it.

Monthly Archives has a bottom border, your "footer" or your copyright information to be more exact has a bottom border. However, recent comments does not have a bottom border. I don't know if this is part of some all knowing and greater plan to take over the world, but whatever it is, it seems to mess up the uniformity of the homepage.

Ryan Latham (http://www.unmatchedstyle.com)

#5

Nevermind, I just noticed that it does have a bottom border. Just not margin, I am a dolt.

Ryan Latham (http://www.unmatchedstyle.com)

#6

hm, I think I have seen this design before somewhere. Its great though, go minimal!

one more thing, please fix the preview stage so it fits the design too.

Harboe

#7

I disliked the old design intensely. This is an improvement. I might actually read more of your articles now! ;-p

Seth Thomas Rasmussen (http://sethrasmussen.com/)

#8

coupla things -
would be nice if you could label the latest article and the recent entries. everything else on the homepage is labeled and clear.
(very good placement of the latest article though)

try giving a border-bottom to the logo/title...just like all the columns have a border-bottom :)

overall...i really like it. very simple and clean.

Chugs (http://chugsdesigns.com)

#9

Thanks for writing up the 'why' behind this design. I found it quite enlightning. You're spot on about the information ordering (e.g. the composition) of the site, as information ordering is indeed your strong point.

What I also noticed is that the top-bar is smaller than Kottke's again. Is this the step up in the tiny-header race? Is it really just about "how has the smallest"? :P But seriously, it does complement the design perfectly.

A note about the RSS users: They might like to see the homepage as a glorified feed, but this is exactly what it _shouldn't_ look like, as these people use RSS for a reason. Or, to put it differently, the people who don't use RSS, don't use it for a reason.

Perfectionist detail: you've got a line under the copyright notice, so why not have one above the search? (I imagine it'd look a tad better, but seriously, I'm probably being a pit to perfectionistic so feel free, of course, to ignore me)

AkaXakA (http://akaxaka.gameover.com)

#10

When I looked at your homepage, this article had not appeared on Bloglines, so I thought HOMEPAGE ANALYSIS was a heading. I did not think it was the latest article, and probably would never have guessed it was the latest article. As I thought it was a heading I did not click on it to find out about it.

So something's not quite right, fmpov.

Peter 01010 (http://www.01010.org/)

#11

I'm regular, and do not go directly to the latest entry. ^_^

Zelnox

#12

Peter: If you thought it was a heading what did you think it was heading for. The underline should clue you in that it is a link. I could understand if it wasn't underlined and looked like the rest of the headings, but it also has the summary underneath it.

Also you compared it to bloglines so when you didn't see anything new in bloglines you didn't think anything new was updated on the site. Is that something wrong with the homepage or you associating something new with whatever is in bloglines?

Zelnox: You have always been the unique on in the crowd ;-)

Scrivs (http://businesslogs.com)

#13

Regarding comment #10, what do you think about putting a "read now" type link after the summary to undergird the idea it's a post?
---------
Also, what up with the latest? Do you think you might want to put a disclaimer up there? You know, just in case some bumblehead mistakenly thinks you're an expert in that area? I can here it now... "But, Scrivs' said..."

PS - I'm being purposely vague here.
---------

Mark (http://www.lightpierce.com/ltshdw)

#14

I think this new layout should be a benefit to old and new visitors because it gives everyone a choice of where they want to start. If someone has an idea of what they're looking for, the category section is right there. If they know of the other sites on your network (like WDDB), but don't know the url it is also right there.

Overall I think this is a great redesign because it gives your viewers the best chance to find the information they came for.

Roderick Howard (http://www.roderickhoward.com)

#15

Scrivs, I thought that it was a heading for the articles underneath. Perhaps a silly interpretation on my part but as Krug says "Don't make me think".

Re Bloglines, I tend to depend on it for finding what is new. But I also learn to look in certain places on certain sites for new things. I will know where to look on your homepage now.

Also, wrt "Don't make me think", I think articles and categories links could have summaries as title elements. I would guess a lot of people hover their mouses nowadays that the onhover function is used so much. It would save some visitors a lot of clicking and possible disappointment.

Peter 01010 (http://www.01010.org/)

#16

I don`t like it.
Sorry for being so crude but it's as appealing as the phonebook. The organization is incredible everything is on it's place.. but yo know it's lack of correct visual weights. It's about hierarchy, dominant, subdominant and dominated and all that design stuff.
If a were a newcomer and i've never read that incredible things you do and design i shurely say "this is so booooring! bye, bye!"

sosa (http://www.nolimit-studio.com/yosoysosa)

#17

I've been "playing" with web sites for about 3 years now on my own with no instruction other than what I can find on the net and a few books.
I recently discovered rss feeds and blogs and took a look at your homepage for the first time tonight, although I have been reading the blogs for about a month.
As a "newcomer" I was looking for information and that is exactly what I have been finding. Simple layout, easy information, and great discussions. I think you have described what I have found perfectly in your about and the design goes along with it.

wes

#18

Again, great work Scrivs.

I will have to admit that I somewhat agree with Peter. When i first saw the new design, I was in the middle of reading something on the site anyway, so I kind of knew that you were moving all the articles to the left side, comments below that, etc.

However, when this article was posted and added to the homepage, I could tell that it was a link...but wasn't sure if it was a new post, or maybe something similar to the other about information you have on there...maybe like a temporary article to explain the redesign. I think it is because it has the same weight, font, and size as the other headings (Categories, About Whitespace, etc). Maybe show a date or category under it or something to indicate that is the newest material on the site.

I really like the organization of the homepage. I am currently working on reorganizing mine so it is good to see some fresh ideas. Really jogs my brain to rethink what I already had in mine for my site.

Jeremy Flint (http://www.jeremyflint.com)

#19

it's nice, but i think i preferred the old design. I say think because i'm struggling to remember what it looked like:|

i think its that i never have liked monthly entries, ot recent comments, so in my view they use up valuable space

i would prefer to perhaps see the latest three entriy summaries on the homepage. A newcomer would find it easier to discover what the website is all about, just from the few summaries on the homepage

david arthur (http://www.justride.co.uk)

#20

"Summary: An analysis of how the homepage design came to be what it is now as of this writing. Damn that sentence is confusing."

How about the less-confusing: "Summary: An analysis of the homepage design's evolution."

Joe Grossberg (http://www.joegrossberg.com)

#21

Well, because Joe, if you've been here any length of time you'll know that it'll likely completely change again at any given moment.

It's part of the roller coaster ride which keeps people coming back.

To build on your suggestion:

"Summary: An analysis of the current homepage design and its evolution to this point in time."

Mark (http://www.lightpierce.com/ltshdw)

#22

Summary: No longer there anymore.

;-)

Scrivs (http://businesslogs.com)

#23

thanks for the intro para scrivs!!!

dru (http://www.drusellers.com)

#24

It needed to be done so I did it :-)

Scrivs (http://businesslogs.com)

#25

As a relatively newcomer, my eye is immediately drawn, rather than to the about section (which would make sense), to the coloured headline near the about section: that of the latest article. How about giving a background colour to the about section so people's eyes are drawn to that instead?

David House (http://xmouse.ithium.net)

#26

Every section has a heading except the articles. Surely you should have an ARTICLES heading. Under it have your latest article with summary (remove all caps and remove the line under the summary) and under that have the list of articles. IMHO the page would look much more balanced like that, as well as being more logical.

Peter 01010 (http://www.01010.org/)

#27

I like it. Much more so than the last design which always seemed interrupted to me.

Since I don't use feeds (yet) and you post fairly often whenever I surf over it takes me a minute to identify what you've said since I was last here.

It would be really really awesome if you did you last three entries with summary paragraphs instead of the last one. It would be an additional minor level of awesomeness if you added a heading for the recent articles.

But either way I still like it.


As a seperate note... when commenting I got this error. "Your comment could not be submitted due to questionable content: mail . com" I'm guessing it doesn't like my gmail (or hotmail) address...? But then of course... email is required... hmmm

Sunshine (http://sparklit.sparkalyn.com)

#28

Here's a comment of somebody who reads a lot, but hasn't put any wisdom in practise. Therefore you should question everything I write.

I tend to agree with sosa (16). I don't like the homepage as much as most of the other commenters.

When viewing the page my eye goes directly to the 'latest entry' and 'about whitespace'. This makes sense. However the reason why does not.

The 'latest entry' and 'about whitespace' are an anomaly on the page. Therefore they stand out. The 'main content' is this enormous block of links.

I counted a total of 72 links. All links look like they're equally important. This overload of information, or links if you want, makes you look very hard to find the information (or link) you are interested the most.

I cannot call the design of the homepage minimalistic. Nor does the lack of colors or (animated) images. A minimalistic design creates focus on the things that are there, because there's nothing else. This counts for information too.

I'm afraid you're scaring away a lot of newcomers with the large block of links. After scanning the 2 obvious places I automatically started weeding out the links that didn't made sense to me. (Especially the categories didn't made sense to me. Too many links/categories looked like they're the same, like 'CSS Focus', 'CSS Redesigns' and 'CSS Vault'.)

I also think it wouldn't hurt if you labelled the block of 'recent entries.'

Astrophix

#29

The things I like the most about the design are the colors and the fonts. Very clean space to pack in allot of content but not feel over-crowded in the process. Well done.

mike

Keep track of comments to all entries with the Comments Feed

Post a comment










Remember personal info?