1. Your website must focus on capturing email addresses

2. Stuffing your home page with way too much information

3. Loading the site with slow-loading graphics (more about this can be read at Mr. Nielsen’s usability website)
4. No attempt to discern what the prospect wants

And the next four common web design mistakes related to online business are:

5. No invitation to converting. Many websites have everything in place, good design, good colors, amazing corporate image and great content. But when it comes to inviting their visitors to perform an action they fail miserably. Often I see multitudes of designs out there without contact information in every page and sometimes after reading all the content you believe that you were being informed of their products and services and not being invited to purchase from them. Determine if your website is informational, interactional or transactional. If you are after lead generation then make sure that you prepare the channels and the design to capture leads.

6. Follow trends because they are trends and not because they are useful. With Web 2.0 we are starting to see how many websites have a clean look, better navigation and better inter-browser support. Sometimes though, website owners include elements just because they are being used in their competitors website or because they thought they were cool.

Examples of this awful practice is the use of blinking text to attract attention, or the use of sound and music in Flash without the possibility of stopping it! Be careful to include only elements of design that would improve your audience experience. Also, never use sound in your site unless it is user-initiated.

7. “Let’s make some space”. The mistake of pushing the limits of the home page because we have new products and we have new banners and we have new… STOP! Instead of including new elements in your home page remove something in order to add something and always plan ahead your space.

Many websites decide that they want to include advertising banners, flash images, extra links, new headings and many other things that don’t fit into their initial conception. The recommendation is that if you find that you need new elements then redesign your site. If redesigning sounds unnecessary then those elements are probably not crucial. Adding some things here and there is ok, the problem is when your next big idea of the day ends up in the footer of your homepage.

8. The “I don’t like it mistake”. This mistake is the biggest and most often mistake in my opinion. If you don’t like your design that doesn’t necessarily mean that your web site will not appeal to your audience. When you are tempted to say to your web designer: “I don’t like it”, think for a second who is going to buy from this website? and think if they would like it.

This is specially important for “generation X business owners”. Generation X kids like video games, skateboarding, X Games, surfing and what not, but the owners of the business that sell products for this audience have difficulty to separate their own preferences with their audience preferences. The best way to avoid this mistake is to proof read your design with members of your intended audience.

For more information about web design and internet marketing make sure to visit: www.merkados.us or www.merkados.com

The new website of the city of Raleigh is, in my humble opinion, a waste of tax payer dollars. As a professional website developer and strategist and having developed hundreds of websites myself, I can tell you that this website is overpriced and under-designed.

I am going to give you ten reasons why I think that this simply doesn’t work. But before I do, I want to let you know that I spent under 10 minutes finding these reasons. In other words, if I actually had time to take a deep look at this web property, I would certainly find way more.

The problems

1. The price. At $500,000 you would think that a website would have every single bell and whistle. You would expect that it works flawlessly and that is simply has an infrastructure that is second-to-none, right? To put in perspective imagine that I could hire 20 people for 6 months straight at a salary of $50,000 a year to build a website with this budget.

Imagine what 20 people that know what they are doing can do for SIX MONTHS!!!! I mean, seriously a good team of web developers could be comprised of 10 people and if you payed $75,000 each for 5 months straight, you would have an amazing website anyways. But that is not the case. This website is full of bugs, problems, the technology it utilizes is not the latest and therefore is outdated already.

2. It doesn’t display properly in the Apple iPad.You would think that with that amount of budget, the designers would test the design in at least the most popular browsers right? Well, one of the hottest products is certainly the iPad from Apple. You would have to live under a rock to not know that.

Well, try visiting the new website from an Ipad and you would notice that the entire left bar is cut off. That simply shows that the design wasn’t created with great standards.

3. Some images are not optimized for the web. I navigated to some deeper pages and saw some images taking an extra time to load and I was kind of intrigued. Sure enough, I loaded the image by itself and noticed that the image had bean uploaded to the site without resizing or compressing for the web.

That is basic web design theory! Come on, a company that pays half of that budget would never accept mistakes like that. For those non-technical readers, let me explain something. Images on the web are different that the images for print. The images on the web have been sized and compressed to match the pixels actually needed, no more and no less. Why? Simple, the more information you have the more time it takes to load.

4. The “En Español” Section doesn’t work. You can click on the link to the Spanish section of the site and guess what? It takes a second to loan and then -nothing. It gives you the homepage again. In other words, it simply doesn’t have a Spanish section. You may say: ” oh well is under construction,” well if that is the case, then don’t include the link in your main navigation. Remove the link to the section that is under construction. Jakob Nielsen would have a heart attack if he saw this. Usability should be first.

And you would expect that a web design agency charging $500,000 for a website would be more careful with usability.

5. It contains 349 Errors, 26 warning(s) in the homepage’s markup. I simply did a quick test of markup compliance and sure enough it didn’t pass. Now, this test wasn’t performed by me, it is an automated test that allows you to see if your markup is written properly. In other words is like a test to see if I know how to write Chinese. I think it is interesting that the homepage of the site would have this many errors. I mean, think about it, this is what this people do for a living. They write in this language.

Imagine what would happen if I wrote a document for the city of Raleigh and they discovered that just in the front page of my document I had 300+ misspellings!  That would be unacceptable right? Well, it is more so when you are paying $500,000!

6. It doesn’t validate for Section 508. Even though the cities are not required to comply with the federal accessibility standard, they should do an effort to make their sites accessible, specially when you have a wide budget.

7. It doesn’t have a contact form. When you visit the contact us page in the website it simply gives you the address to contact the city along with all the traditional contact information (phones, address, etc). But what if people don’t have an email program?

Would it be better to have a contact form that people can fill out and it sends an email to the appropriate people? Well, that is the norm. Not in this website though.

8. It has an interactive flash-based map. Why am I complaining about the flash-based map? Simple. There is no better map than Google Maps. If you really want to find directions you may do so by visiting Google Maps. You can even embed the map in the site if you want for convenience. But to build a complete map application is simply not a good idea in my opinion.

9. The payment of bills is not part of the same website. The payment of bills happens in another completely different website. If you click on the link to pay bills you are redirected to another top level domain. The payment of bills happens in a website that looks completely different from this website. Why? What I think is that this part of the website wasn’t even developed new. It simply was linked to the old platform… perhaps?

10. Sloppy Design. The documents block in the lower left corner of the site contains several pdf documents that when visited with Firefox they “invade” the main content part of the page. That is simply awful looking and shows how careless the designers were.

For crying out load, the average web designer fee is from $75 to $125. So lets say that you hire 2 designers for 40 hours each (one week) to make sure that none of this problems happened before going live. You know how much money that would’ve been? About $10,000.

I think that I am done for now. I just want to vent for a second there. I would like to hear from you. Send me your comments about this by visiting Merkados.com and clicking on the contact us form.

Thanks guys,

Alex C

TIP 1. Use Color, Position, Distance and Alignment to portrait importance. In figure number one, you can see how the designer decided to use 3 different colors in one paragraph of text! The white color automatically gets less importance, the yellow text gets a nice accent and then finally the call to action is found in red (which is an excellent color for action).

Use of Color to denote difference.

TIP 2. Mantain your number of hues to a minimum. The more color that you use the more time a common user would take to decipher what is important. In order to improve usability you want to color code your actions in a way that becomes automatically intuitive to do something. For the most I would say use 3 hues, then you can add another 3 shades or 3 lights to those shades. My favorite is to keep websites to almost a monochromatic scheme and then create accents with a split complementary or even a complementary hue. Unfortunately as I progress towards finishing the design, I end up adding other hues; I have to force myself to change extra hues for shades of the same hue.

Example of a website using a limited amount of hues.

TIP 3. If you decide to go with sharp angles then go with sharp angles. If you go with rounded corners then be consistent as well. As part of the WEB 2.0 trends we have seen lots and lots of design that use rounded corners. If used properly, rounded corners look really good and make design look softer and more inviting. Unfortunately the entire experience can be thrown to the trash can with just one thing: inconsistency. The secret really is not so much having rounded corners, the secret is to maintain those treatments across the different sections of the design. As a counter-example check out image number 3. This designer decided to only use sharp angles (including the pictures). That makes the design so powerful that it immediately makes a positive impression.

Example of designer using sharp angles with consistency

That is it! I hope you guys enjoy this tutorial and really hope that it helps improve your design and gives you at least another point of view.

Until next time,

Alex A. Centeno MBA.

Digital Media Director

Merkados™