Web Design For Idiots

So here is probably the single hardest step in designing a really eye catching and memorable website. Conceptualizing it. Before you start coding, you have to have an idea of what you want your website to look like, where you want the navigation to be, and the overall layout. The average designer working on a basic website will consider this an easy step. There are rules that you can follow to make a website that is very easy to use for the visitor. There is something called F shaped viewing. There was a study done that tracks where viewers immediately look at a website, and how they scan it. The majority of people in this study viewed a website in the same way. Have a look at this image to get a real idea of what an F shaped viewing looks like:

As you can see, no matter the layout of the website, people generally view the top left, center, and right first. On e-commerce sites, the shopping cart is generally in the top right, and page links are across the top, and the categories are on the left side. This is very standard and people are used to it.

This is great knowledge to arm yourself with, however you can not let this stifle you in creativity. Giving yourself guidlines for a good user experience is not a good excuse to have a bland website. I have seen amazingly wonderful websites that have the exact layout that I mentioned, and I have seen horrible websites with that same layout. If you take oscommerce for example, the layout of the stock install is exactly what it should be. (you can see it here). However, here you can see another website using oscommerce and the basic layout but this site has a much better impact using design, graphics, and images. (you can see it here or here).

So, now that you have looked at some examples of what good design can do to a rather bland layout, you will have to figure out how you will make your website stand out. It is all going to be different based on what you are selling, offering, and writing about. That clean look of the ono tea website might not work for you, or that very grunge look of the assault t-shirt line could be over doing it as well. This is where the designers work comes in. You have to feel out what you want the website’s design to portray and start working.

For instance, I am working on designing my graphic design company’s website. The conceptualization part was the hardest for me. My husband and I sat down and tried to figure out what we wanted to portray. With a graphics company, you can go one of two ways, really simplistic with putting a lot of emphasis on typography and the work in your portfolio, or graphic heavy with a lot of emphasis on the website’s design as a part of my portfolio.

We sat and came up with a bunch of concepts which range from simple to color heavy, and finally settled on a concept. We are combining photography with illustration in a nice clean looking design that still has a lot of graphical content. We are working on designing a horizontal layout where instead of scrolling top to bottom, you scroll left to right. Using a jquery plugin to create an animated scrolling experience ads a little more uniqueness to the design and overall layout. With a portfolio website, you can really take a lot of liberties, mainly because you are showing off your “chops”. You are not really concerned with making sure that the person finds the product that they are looking for, and you have a lot less pages to deal with. However, even with the liberties taken with a portfolio website, I will still be working with the same basic layout of navigation at the top, content in the center, and some lists on the left side to work as internal page links, similar to categories.

The moral of the story is, stick with what people know, and people will have a happier user experience, but do not let it stifle your creativity. Push the envelope a little.

Here are some sites that I feel have done an exceptional job and creating an easy to use website, with a very unique design that is unforgetable.

Sequence Branding

B.N. Weiss

We Bleed Design

---

Want to know who is offering this awesome content? Here it is! Someone who is relatively new to web design. I am new enough to still remember how absolutely frustrating it was to try and get anything done in this field, but have also been around long enough to be able to help those that are where I was a year ago. Aside from web design, I run the office of my dad's engineering business, and do book keeping by trade. I love my pets.. All 6 cats, 1 peg legged dogs, and 1 hedgehog. LOVE THEM!! Oh yea, and my husband. He lets me chase my dreams and I let him do the same. We are happy people because of it. Read more from this author

---

This entry was posted on Sunday, August 2nd, 2009 at 9:39 am and is filed under Site News, Web Design. You can follow any responses to this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.