Webdesign

DV8 · Post by **DV8** » Thu Mar 28, 2002 8:36 am

To all those bulldrekkers out there that think they know something about webdesign;

A lot of the websites out there, show a layout where the navigation is taken care of on the left-hand side of the page. I was wondering if there was some reason why this was the best thing as opposed to the right side of the screen. Does it have to do with the fact that most [English speaking] people - your target audience - read from left to right? Or is there no reason not to switch it to the right-hand side of the screen?

Adam · Post by **Adam** » Thu Mar 28, 2002 9:05 am

I think that's probably the reason. The left side seems to be the common place to put "stuff" in publications of various types; newspapers tend to have a bar running down the left hand side of the front page with a TOC, references to the other sections, etc, while software that has permanent onscreen 'navigation' controls often has it on the left hand side. [Eudora/Outlook - email boxes, Internet Explorer/Mozilla - History, Media Bar, favourites, etc]

Web content has seemed to migrate towards having primary navigation structures on the left hand side, and secondary or user-customized navigation on the right side. Since that's what so many sites do, bucking the trend risks leaving your site feeling unfamiliar to new readers.

An example of a site that /doesn't/ have a lefthand navigation bar would be MetaFilter.com, but it's a somewhat unique example because the core of the site is always right on the first page. If a site has only a few - 7 or less, let's say - core navigation elements, it's probably easier served with a topside navbar.

3278 · Post by **3278** » Thu Mar 28, 2002 11:43 am

Hello! Useability Man is here to tell you about...Navigation!

Hello, Useability Man!

Hello, kids.

When the internet's graphical user interface was initially designed, it was designed primarily by US university undergrads and professors and other English-speaking nerds. Because, as Dennis mentioned, these nerds generally read from left to right, top to bottom, navigation was usually placed on the top and left.

As time went on, it became habit, ingrained through years of use and even through specifications in the code. After all, can you easily place navigation in a fixed position on the bottom of the screen and know that no one will ever have to scroll to see it, wihtout using features older browser's can't implement? Of course not. And that's one of the most important features of navigation; it's always in the same place, and easily identifiable.

Now, kids, as a special treat, we here at Useability Man's World of Wonders are going to show you what happens when an internet-savvy nerd from 2002 tries to use a site with the nagivational elements on the lower-right!

Bang! Crash! Smash! Kerblammo!

That's right. Now, that man will survive, because we always have top-notch medical staff just waiting in the wings here at Useability Man's World of Wonders. His computer and monitor, however, won't.

Let that be a lesson to you, kids! Whenever you want to place navigational elements in a dynamic, counter-instinctual place, just think of that man shoving his face through the glass screen of his monitor. And then say it with me, kids!

"Instincts are your friends!"

That's right.

Adam · Post by **Adam** » Thu Mar 28, 2002 11:59 am

On the useability topic. I was helping my father - by this, I mean, I was telling him what to do, because he can't remember a damned thing - search for a topic on Google. He found a website, clicked on it, and looked at the top navigation bar, which had about 5-6 entries on it. He clicked on the one that said "Products", and a javascript dropdown menu appeared.

He sat there for a few seconds, then clicked again. Nothing happened, of course. The dropdown menu stayed there, until after a few seconds more he went down to the next entry on the dropdown and clicked on it.

This is why I don't use javascript dropdowns. Because while pulldown menus of various kinds are immediately intuitive to people who grok computers, they aren't found in any other kind of interface system.

3278 · Post by **3278** » Thu Mar 28, 2002 12:07 pm

Those menus can be very useful, but if you decide to use them, remember that people need a default page at the top level. In other words, if you've got a drop-down menu for Products, you need a top-level products page that they'll get if they click on Products.

Pulldowns are useful, but they must be obviously pulldowns, and they must have links for the top-level pages. All things considered, you're best off using a different means of interface.

Lektrogirl · Post by **Lektrogirl** » Thu Mar 28, 2002 1:37 pm

If a site has only a few - 7 or less, let's say - core navigation elements, it's probably easier served with a topside navbar.

A couple of my favorite websites use topside navigation bars, actually I think they're nicer (for smaller websites) than the left sidebar stuff.

Javascript dropdown menus sucks in my opinion, so do those stupid mouse-over buttons that expand to show sub-selections, argh!

<weirdness> Ummm.. as I was typing this I pressed Control+B to make "Javascript" bold and NOTEPAD popped up and had a bunch of text in it, like I was editing something about Bulldrek. </weirdness>

Wildfire · Post by **Wildfire** » Thu Mar 28, 2002 2:15 pm

It might be a result of English being read from top-left, but the reason most nav originates from the top left corner is because that's the default load of most web browsers. Even if you have only a 20x20 screen, the top left corner of the page is what you will get.

For decent sized sites I like a combination of top nav and left side nav, high level top nav, more specific side nav, aka Products is a top nav, the left nav then loads your sub choices. Most my pages don't have enough content to make that anywhere near useful, however

Lektrogirl · Post by **Lektrogirl** » Thu Mar 28, 2002 2:28 pm

I just remember some of the japanese websites I go to, most of them are made with three columns, the middle being the main, and navigation done with both left and right sides.

Jestyr · Post by **Jestyr** » Thu Mar 28, 2002 2:31 pm

Lektrogirl wrote:Javascript dropdown menus sucks in my opinion, so do those stupid mouse-over buttons that expand to show sub-selections, argh!

Could you be a little more helpful and say why they suck?

Adam · Post by **Adam** » Thu Mar 28, 2002 2:31 pm

That's a very common style now, especially amongst weblog sites that have core links and suchlike on the left, and the right side with 'faster moving' links to current content or areas customizable by the user. Examples: Slashdot.org, Kuro5hin.org, etc.

Lektrogirl · Post by **Lektrogirl** » Thu Mar 28, 2002 2:41 pm

Jestyr I prefer websites that don't have moving things on them, I want the navbars and such to be there, not moving, not flashing, not dropping down (for my convenience). I'm convinced that many websites are like this not because it provides easier navigation, but because the webmaster found out some cool (in their minds) code/script and what's to experiment.

Less, at times, can be better. Less drop downs, less animated gifs, less audio, less mouse overs, less....

Oh man, my biggest complaint of all, COMET CURSOR, what the freaking-holy-crap is with people who use that program????!!???!? Not to mention it loves finding it's way into my computer every six months or so, just from my visiting a site with it.

Nothing gets me to leave a website faster than COMET CURSOR.

DV8 · Post by **DV8** » Thu Mar 28, 2002 2:51 pm

Amen, sister.

Jestyr · Post by **Jestyr** » Thu Mar 28, 2002 4:30 pm

Likewise.

Re the javascript menus, they can be particularly useful when you've got a lot of content and you want your user to be able to navigate to it quickly. The other alternative is using nests of menu/index pages, and that requires more bandwidth, more clicking, and you have a greater chance of losing your user before they find what they want.

Pistons · Post by **Pistons** » Thu Mar 28, 2002 5:58 pm

Yeah. RPG Host, for example, is one of those. Then again, they've got a mix of navigational elements, with the most obvious (to me) being the topside navbar with drop down javascript menus.

Then there's one of my favorite sites, Deviant Art, which also has a bit of a mix of navigational elements, with the main one being on the left hand side which expands akin to folder elements in Windows Explorer.

Adam · Post by **Adam** » Thu Mar 28, 2002 6:07 pm

RPG Host is a nasty piece of shit, though.

3278 · Post by **3278** » Thu Mar 28, 2002 6:17 pm

Deviant Art is a bigger piece of shit. I've never seen a site with so much attention paid to design and so little to functionality and consistancy.

Pistons · Post by **Pistons** » Thu Mar 28, 2002 6:32 pm

Good thing I only held those sites up as examples of what Lady J was talking about, eh? I think I visit the former once in a blue moon (because the content, other than a few useful bits, frankly bores me), and I check out the latter because I'm more interested in the art than its site design.

3278 · Post by **3278** » Thu Mar 28, 2002 6:41 pm

You'd have to.

Sorry, sorry.

Pistons · Post by **Pistons** » Thu Mar 28, 2002 7:30 pm

Hehe. No biggie.

To try to get back on topic (I think?): I am, by no means, any expert on webdesign. I am interested in it, though, and I'm still learning. (Albeit a bit slowly.) But I have noticed that the trend has been migrating more and more towards simpler and uncluttered designs. Where there used to be a lot of color and doodads and whacky navigational elements (or the near-lack thereof), it's now more about 'above the fold' when possible, with color themes, smaller and more useful graphics, and so on. Heck, I'm now a big fan of using CSS, which I know has been in use for a while now (just really poorly implemented in some browsers, like Netscape 4.7 and below).

And then there's the trendy stuff; a few years ago, it was Flash. Before that, Java. Everyone and their dog was using those. Now it's XML/XHTML/DHTML. Naturally folks still use the former, and the latter will likely become more common than HTML and CSS (or so some say). I'm guessing that things which get phased out, or not used as much at least, are due to useability; it would make sense. But what else dictates whether a design element is a fad or a step in webdesign evolution?

DV8 · Post by **DV8** » Fri Mar 29, 2002 8:31 am

Pistons wrote: (just really poorly implemented in some browsers, like Netscape 4.7 and below).

Make that Netscape 6 and below.

Well, the thing that made me ask were this page, and this page. As you can see; navigation on the right. I don't know how well it'll work.

Wildfire · Post by **Wildfire** » Fri Mar 29, 2002 2:06 pm

That's fine, that's portal navigation. Its nominally designed to fit onto a page at any resolution, and unlike a bar running down the right side, its just another block which happens to be on the right. Portal nav is just blocks of data scattered wherever the designer sees fit, but the software will ensure that that block won't scroll off to the right at reasonable screen resolutions.

And another thing I remembered about left side nav - before frames were common, and when frames were the antichrist, you could simulate a side menu by making a background image 640 long by 1 tall that was a gradient or solid color for about 25 - 40% and white the rest, and tile it on your page. The overflow on higher res screens would be white and off to the right, so when you laid a table over the background, it looked like you had a side menu in color and a site in white.