Archive for October, 2005

I browse a lot of websites. I mean a whole lot. Over the past few weeks I’ve really been thinking about user interaction. What things are good, easy, and will keep a user on your site for a while, and what things are bad, difficult and will make your user leave and tell all their friends they hate your website.

Those things are typically small details, the kind that make people either love you or hate you. Below I’ve outlined 7 things that absolutely drive me nuts when I’m surfing the net.

1. Do not make me wait when I get to your website. If I have to wait through a long load, or an intro with no skip button, I will leave–making your message 100% ineffective.
2. Tell me who you are, and what you do immediately. That can be a short paragraph, or even just a single sentence. But however you decide to explain your existence, make it interesting and informative enough to keep me, but short enough so I’m not reading your About Us page.
3. Don’t make me search. Give me obvious places to go next. A kind of roadmap or choose your own adventure. Your homepage needs to either have big enough links in your navigation to draw my eye away from the content, or you need to have big shiny buttons on the homepage saying “You can go here and see this, or you can go here and see that!”. Either way, I need to know how to get to the next bit of information you want to feed me.
4. Don’t make your links hidden, graphics, or any other absurd thing. When I can’t figure out how to navigate to different sections (and especially the ones I’m looking for) then I’m going to leave without giving it a thought. In the same vain, don’t make your links cutsie names. If you have a portfolio, call it a portfolio, not something like “The Stuff”, or “Mindtease”.
5. Making a splash page with a “Click to enter” button makes me want to leave right there. I’m already on your domain, why make me go through another process to get to the information I need. The more clicks I have, the less likely I am to appreciate your concern for users, which happen to be me.
6. Full screen, smaller screen, odd-shaped screen… Quit making my browser change sizes. It’s already a great size, and if your site doesn’t fit in my browser, I’ll resize it so I can see the content. I almost always have more than one website open in my browser (the advent of Tabs in Safari made that much easier) and when all of my websites all of a sudden go full screen, it makes me want to close your website and forget I ever clicked on it.
7. Popups. I don’t even have to explain this one. They are pretty much universally hated.

Well, I hope these 7 tips help you make a more user-friendly website. Think about these and any other usability issues you can in the planning stage of yours or you clients website. If it makes it to Photoshop, it’s typically too late.

The $100 question. Tables, or tableless CSS design? It seems like a catch-phrase, the new big kitsch thing, but creating a website without the use of Tables for the structural markup can make a big difference in the usability and even the search viability of your site.

The bulk of the Ariamedia site was built without the aid of tables. It is structured 100% through CSS styled DIVs, H1s, Ps, and the like.

When we started to develop the idea for the current rendition of our corporate site, we decided that adherence to the W3C web standards was going to play a large roll in the decision making influence. Hence the tableless design.

Okay, okay, it’s not completely tableless. As in this page, the use of tables, while not necessary, was the way to go. Creating tableless code for the sake of conserving code-space, maintaining readability, or just because you want to join in the crowd are all fine and dandy, but that should not stop you from using tables when tables are appropriate.

Tables are the way to go when laying out and displaying tabular data. Hence the name “Table”. When and where are up to you, but in our experience going from a table-laden, non-compliant site to our current incarnation, any time you can say the word grid, or cell, it needs to be a table.

Styling tables is just as easy as styling DIVs, Spans, or any other HTML tag.

We typically start out by defining an ID for the table itself, like #product_table, and then through inheritance, styling it’s child-elements. TH, TD, TR, can all be styled to your liking, and can offer you control over an extremely easy-to-use standard HTML tag.

You can now check out our Technorati Profile!

For those users who are color blind, surfing the web can be a hassle. Being able to tell what text is a link, and what’s not can determine the longevity of a visit. There have been a multitude of articles on developing and testing your website to ensure a color blind user will be able to distinguish the various elements of your site.

I came across a nifty little Mac App by Michel Fortin that allows you to take a look at what your site would look like if you were color blind. You can get the donationware application here at his website Michelf.com