Recently, I visited a friend who volunteered to help me with some database issues. Database…nothing makes me feel like a mental midget quite like database design. But, my friend is a database Einstein. Bob is a highly paid professional consultant. When our session was over he asked me to return the favor by critiquing his new website. I was horrified by what I saw. And when he told me how much he paid for the site, I really saw red! I was embarrassed to be a member of a profession where someone could pass off crap like this and call it a professionally designed website. It’s just plain malpractice! Since we live in a world where anyone can throw up a site and call themselves a “Web Designer” let’s be honest with ourselves, folks! Are you a crack designer, or just a crackpot?
1. Is your website slow?
When I clicked on Bob’s site, I patted my foot and waited for it to load. And I waited and waited and waited. Remember, on a commercial site customers are not going to wait forever. I don’t care if you have loads of fun graphics and interesting pictures, if the customer gets bored waiting for your site to load-he’s gone! Optimize your graphics and images for being viewed on the web. You can lower the quality a bit, and the item will load faster and still look good. Use Yslow (Yslow: Going From F To A) to tell you what’s wrong with your site and how to improve it.
2. Are you designing images that contain your client’s text?
This was particularly problematic with Bob’s site. His whole content area was an image. The text was inside the image. I suppose the designer did this so he could have the exact pretty font that he wanted. But, this is a big mistake so far as accessibility goes for both search engines and screen readers. They can’t read the images and there was no alternate text. Bob is starting a bed and breakfast business. Good search engine rankings are a high priority for him, as for most businesses. What you have to remember is that search engines primarily pull from text. They can glean some data from flash, JavaScript, and alt attributes on images; but those are secondary to the page’s text. It you don’t have good content and keywords, then you are not going to rank well in a search engine.
Here’s what Google has indexed for Bob’s site.
Louisa’s Porch-Welcome
1. 2. 3. 4. 5. 6. 7. stop. 1. 2. 3. 4. 5. 6. 7. stop. 1. 2. 3. 4. 5. 6. 7. stop. 1. 2. 3. 4. 5. 6. 7. stop. 1. 2. 3. 4. 5. 6. 7. stop. 1. 2. 3. 4. 5. 6. 7 …
www.bobswebsite.com/ – 6k – Cached – Similar pages
The reason why it is indexed like this, is because the only thing Google can pick up is the flash slide show.
3. Do you have bad design practices?
Tables are for tabular data. They are for rows and columns of information. Period. You don’t use tables for layout. Tables as a design element went out of vogue years ago. It may be easy to design with them, but doing so marks you as being an inexperienced designer and a loser. Tables use more bytes of markup and take longer to download. What you are trying to do is separate your presentation from your structure. Your structure is your content…your heading and the paragraphs of content. Your presentation or style is elsewhere in a CSS document. Separating the two will make your website faster, easier to update, and will improve your search engine rankings. Get rid of tables for layout. (Why Tables Are Stupid, Benefits To Hand Coding Your Website)
If you are using a CSS layout with divs, then there should be no need for spacer gifs. This is an obsolete practice. Use padding and margins in your CSS document. I laugh at spacer gifs. They are old school and mark you as a sucky designer.
4. Do you have music playing by default in the background?
I hate music on websites. I hate it when I am secretly surfing the web at church and suddenly some vulgar rap music blasts out, causing little ‘ole ladies to blush and my pastor to banish me to the parking lot. Now, sometimes clients insist on music. I have designed sites myself that included music, but I was held at gunpoint and they threatened to shoot my dog! Unless your site is for an artist or a music store-skip the music! Consider your target market. If you expect a cross section of visitors, then you have to realize they will all have different tastes in music. What pleases one will annoy another. And you don’t want to annoy your potential market. Also, music slows down your site-another big drawback in today’s world of instant gratification. Good quality music is either expensive, or hard to come by. You can’t just post up your favorite Beetles song. There are copyright issues to be considered. Avoid messing around with music. It’s just not worth it.
5. Do you have a horizontal scroll bar?
How annoying! Don’t use a horizontal cheat bar. Lay out your page so that your users don’t have to scroll up and down, and sideways, too.
6. Do you have popups and blinking banners on your website?
Blinking ads are irritating! I’d rather stick a fork in my eye than try to read something with a flashing ad above it. If you want users to stay on your site longer and want return traffic, do away with the flashy obnoxious banners, pop ups and animations. If you need to draw attention to a line, try changing the font size. You can also emphasize the old-fashioned way with bold or italics. Sometimes less really is more.
7. Do you have a doctype?
In the first line of your (X)HTML code, you specify a doctype. It tells your visitor’s browser how to parse the page. It defines which version of (X)HTML your document is using. Doctype tells browsers how you are going to code. You don’t want browsers to have to guess whether you are using HTML or XHTML or what version of those languages you may be using. If you don’t specify, then your browser will kick into quirks mode-which basically means it will guess. And it will guess wrong. Chances are your pages won’t display consistently in different browsers. You don’t want this to happen. (Choosing The Best Doctype For Your Website)
8. Do you have content faux-pas?
My sister sent out a dozen resumes looking for a CNA job. What she didn’t notice was that her helpful word processor corrected her spelling. All her resumes listed her as looking for a job as a CAN. Not too many openings for “CANs” these days. (And yes, she is a blonde!) If you write content be sure to look for errors. I find it helpful to let it sit overnight, and look at it critically with fresh eyes the next morning. Another trick is to start with the last line and read the text backwards. You’d be surprised how many errors you can find with that technique.
Even if a client provides their own content, you should still proofread it for spelling and grammar. Publishing content with spelling or other errors makes you look bad. And on that note, if the content is bad, it makes you look bad no matter who wrote it. One time I was doing a website for some sort of pyramid sales company. The guy’s content was crap, so I took the liberty of brushing it up, thinking he would be grateful. He wasn’t. When the site was published he changed it back to his original wording. I was so embarrassed by it that I never took credit for the site.
If you write the content, proofreading is even more important. Nothing is more embarrassing than making a big mistake and having a user report it to your client. So be sure to have you client look at there content to be sure their is no mistakes. Remember-spell check is your friend, and your worst enemy!
9. Do you ask for client input?
Back to my friend Bob. He talked to his designer and got a price quote, and the next thing he knew a finished site appeared. He admitted to me that he was not really happy with it-but since it was done already he kind of felt obligated. He felt like he was at fault for not being more specific. Most clients are not that nice. They are going to turn purple and scream if you pull that crap. Be sure you include the client in on your planning. Many designers will do a mock-up in photoshop to give the clients some ideas. Client interaction is the key to a successful end product. (The Reality Of Client Interaction) And remember ActiveCollab was a great way to facilitate client input. (ActiveCollab Review)
10. Do you have a contract?
I told my friend Bob that his website needed some work. I made several suggestions for necessary changes and asked if his designer could make these changes. He didn’t have a clue! You need a contract to protect both you as the designer, and also set out for the client exactly when your duty ends and what correction or changes will cost. (Get A Good Contract Section, The Reality Of Client Interaction) If you don’t have a contract-then you are an amateur.
What’s your score?
So how do you rate? There are some true crackpot designers out there-designers who take advantage of people who are not web savvy. They give us all a bad name. Let’s do our best to show them the error of their ways and help them become true professionals.
Disclaimer: All names have been changed to protect the innocent (and the guilty). So, if you see the afore-referenced designer, tell him he owes Bob a redesign. And if you see Bob….shhhhhhhh!
The Web Squeeze is sponsored by:
Did you like it? Share it!
About The Author
Jacob Haug
My name is Jacob Haug, and I spend the majority of my time in website development. I donate many hours each day helping the web community with technical aspects of website design and development. My current project is The Web Squeeze. A “NEW”, “FRESH”, Web Design and Development community dedicated to helping make the internet a better place! @JacobHaug
RSS Feed
Email Feed
TWS Podcast
@thewebsqueeze
TWS on Facebook
TWS on LinkedIn
TWS on YouTube
Delicious
DesignBump
DesignFloat
DesignMoo
Digg
StumbleUpon
Technorati
Comments
I agree with almost everything on the list. Except for the scrollbars… I can understand that unless it’s one of those fancy sideways websites you do not want a vertical scroll, makes sense. But the obsession people have with NOT scrolling is sometimes scary. Why break down all your content into tiny tabs making your user click ten thousand times before they actually find what they are looking for?
There should always be a balance, however there is nothing worse than an article split into ten pages each with 3 paragraphs (if even that) and a picture.
Excuse my rant, great post nevertheless
#8 paragraph 3. Did you do that grammar faux-pas on purpose?
@Jo
I was referring to sites that have a horizontal scroll bar….that’s just annoying. However, I do agree there might be times when you do that on purpose.
@Shanna Korby
Yep, on purpose!
Hate to rain on the parade, but geez – these are all pretty much common-sense avoidances.
great great post! and you could go on with the list of errors you see while surfing the web…
@Mark
Yeah, this article was geared toward those crackpot designers, that still have not learned the proper ways! GRR!
Great post Jacob!
Common sense yes, but these things are often forgotten but even established designers on occasion. There’s definite positives to be had by stopping and checking yourself.
Nice article. I can proudly state that I don’t suck.
It should be noted, however, that Google may rank a site very high despite poor design.
I made a site for a client who runs a rental cottage, and she’s constantly trying to get more search engine traffic than her neighbour, who also has one. My site was designed with valid standards compliant XHTML, CSS, and all the right moves, while the neighbour’s is built with tables and a lot of images of text. Despite that, her site always ranks in the top three results of relevant keywords, and mine only in the top 20 or so.
I realize this could be for many reasons, but I’m pretty sure it’s because she’s been around so long that they get a lot of traffic to that site, and I suspect that for Google, good site design is secondary to high traffic.
That doesn’t bode well for us designers, because while we can control the quality of the design, we can’t generate loads of traffic off the top. Gotta start somewhere!
This article isn’t about “Design” at all. It’s all about development best practices. An article about “Design” would include topics like usability, layout, fonts, colors, typography and relevance of the message to the design. Not load time, the use of tables, contracts and so on. Development is not design.
Point 3: Use of DIVs over tables.
Funny thing is a lot of the big players including Zeldman and Clarke say that moving over to using DIVs instead of tables is almost just as bad and that you should use as few display elements, such as DIVs and SPANs as possible but instead relying on CSS selectors and semantic elements to build your site. Just throwing in a bunch of DIVs may work but that doesn’t mean that’s how you should do it.
Point 5: No scroll bars, especially horizontal.
This one is opinion based, especially the part about designing your page so your user doesn’t have to scroll. this just perpetuates the fallacy users do not scroll and that anything below the fold is lost. Every recent study has shown that this is not the case, not even remotely. Over 90% of users scroll the majority of the page and 70% scroll until they hit the bottom. The same could be said of horizontal scrolling. There’s nothing wrong with it and if it’s used intelligently it can work very much to the user’s advantage. I keep seeing this one all over the place and I just can’t fathom why people still get it wrong when all the data says it’s fine.
Point 7: Define a DOCTYPE.
While I agree this is a developer tip, not design. Design relates to the visual and interactive aspects of a website. This is only important to browsers and as such even though I, like many designers, do development work I still wouldn’t call this part of design as it’s not part of the design process but the development process. When I do development I’m a front-end web developer. The rest of the time I’m a web designer.
Taking these things into context I would put myself at a perfect score even though while I know I’m not a sucky designer I know I’m not a hot shot either. And even following these things I could still use comic sans and florissant pink on a posh french restaurant’s website.
I think you might want to add a piece about design choices based on context as that’s a large part of what makes a good designer; someone who can tell when something is appropriate and when it’s just fluff.
@Brain McCarrie
I however, respectfully disagree. I was writing this article for web designers. My defection of a web designer is a person who creates web sites. Usually a web designer only designs the look of the web page and hands it over to the web developer. But more and more, a web designer “DESIGNS” in the traditional sense, which includes building the structure as well as just designing the look of it. Plus, I like the title of the article…hehe!
excellent article. So true what you said. there are so many losers out there trying to pass off their stuff as professional. Keep up the good work
Trackbacks
Toggle Trackbacks
[... Recently, I visited a friend who volunteered to help me with some database issues. Database...nothing makes me feel like a mental midget quite like database design. But, ...]
[... Recently, I visited a friend who volunteered to help me with some database issues. Database...nothing makes me feel like a mental midget quite like database design. But, ...]