from Craig Sutton and Rae Weil
Dont let this be your customer!
You’ve seen the kind of website that disrespects the users – it doesn’t have the right type of graphics, is hard to decipher, and fraught with misspellings or half finished thoughts. You know what I’m talking about. It looks like it was designed in 1997 by someone’s high school aged cousin. The text doesn’t line up with the photos and the background is too busy. This is because the owner is paying $10 (or less!) a month for some “plug in your graphics here” website that promises to land them on the first page in Google!
The colors are hideous (but hey, they are the owner’s favorite colors!) and have nothing to do with the product, it features a picture of the owner’s dog Sparky (ok, Sparky may be cute…), and the site tries to tell you EVERYTHING about the company on page one, never mind focusing on the product. (The owner hates that extra white space – he could write something there or put in a piece of clip art!) Overall, the webpage is too busy, too hectic and doesn’t deliver the message.
Respect your customer. Include colors and graphics that represent your company and your products honestly and clearly. Think of what he will be seeing when visiting the site. Are the pictures relevant to his visit and what he expected to find when he clicked on your link or typed in your URL? Do your graphics make sense? Is the page clean looking and visually appealing?
Then, there are the websites that aren’t awful to look at, but provide no real detail or direction about the story they should be telling.
That’s right, I said story!
Every website should tell a story in which the user gets to write the ending. The website should have good usability design that allows the visitor to easily navigate around the pages and find the information he wants. It should be designed with clear directions about what information can be found. The information should be presented clearly and concisely with just the necessary details provided. Background stories can be included on additional pages. And, when the visitor finds that information, the website should help make the sale by having a distinct call to action. A well produced site functions as a sales tool and will easily provide a way for the consumer to make decisions about your products or services. Clear navigation allows the site visitor to make good use of his time. After all, he landed on your page for a reason – you may have something he wants!
It’s the job of your website developer to design a site for you using color psychology, well written content, and design usability to grab and hold your audience’s attention long enough for them to make a decision. Your website is often the first introduction many of your clients have to your company, or possibly the only interaction they will have. Your website’s appearance and credibility are significantly important to you company’s reputation.
Respect your customers. When they visit your website, give them an experience that delivers.
That $10/month website just isn’t going to cut the mustard…
Let’s get one thing straight: web design is a challenge. There is a surplus of options when it comes to designing your web page: colors, font choices, spacing, layout, and sizing to name but a few. If you make changes to your own website through a content management system, there are a lot of things that can disrupt the chi of your website that your designer developed. The wrong combination of fonts, colors, and imagery can spell disaster to the most elegant of designs. Here are three great tips to help you avoid some common mistakes.
#1 – Leave the fonts and colors alone, please
Consistency throughout a website is very important to maintain a professional appearance in your web presence. Design elements such as colors, layout, and fonts, need to look the same from page to page. If your content management system allows you to change fonts and colors, ignore those features. Your web designer has given a lot of thought about these basic building blocks, and you’ve paid for his/her expertise. Why second guess his/her decisions?
You can avoid inadvertently making font and color changes if you…
#2 – Don’t copy and paste from Microsoft Word
…or almost any other program, for that matter. It’s an issue of compatibility. When you copy and paste from Word to PowerPoint or Excel, you don’t expect the same results, right? It’s the same when copying content from another program to your website. Whether it’s from Word, Publisher, or another website, you’re just asking for trouble when you copy and paste. Often, unseen bits of code get copied along with your text. This code might be ignored or filtered out by the content management system you are using, but sometimes it can cause some pretty crazy behavior, such as:
- Font types get changed
- Colors and sizing goes out of whack
- Elements get pushed out of place
- Text is centered when it should be aligned or justified
- Garbled looking code appears out of nowhere
There is better way to input text into your website. First, open a basic text editor (Notepad comes free with Windows). Copy and paste your text from Word, or any other program, into your Notepad. This will remove text formatting and any hidden code that might be hidden along with the content, slimming down your information to what you need: just the text. Next, copy the text from Notepad into your website.
But what if your Word document had photos that you wanted to add?
#3 – Resize your photos before you upload them to your website
There is a lot of terminology that gets tossed around when talking about image sizing and resolution, and I’d like to clear up one point of confusion.
You may have heard people say that your images should be 300DPI for print and 72DPI for web. The second part of that statement is a myth. For the web, the ONLY numbers you need to be concerned with are pixel dimensions. Take a look at the two images below. The image on the left is 72DPI (about 4 inches wide when printed), while the image on the right is 300DPI (about 1 inch wide when printed).
Penguins at 72DPI
Penguins at 300DPI
These images look exactly the same. That’s because both images have the same number of pixels (300×225).
The term DPI stands for “dots per inch.” A 300DPI image contains more pixels for every inch of printed space than in a 72DPI image. The 300DPI image above will print smaller than the 72DPI version, as more pixels are used up for every inch of printed space.
Whether that all makes much sense or not is beside the point, which is: you should be aware of how large your image is in pixels before you upload it. The best size will vary from website to website, depending upon the amount of space available on your web page. There are a few ways to determine a good size for your website. An easy way is by trial and error. Start by uploading an image roughly 500 pixels wide. This size will likely be too large or small, so resize your image until you find a comfortable size for your website.
Subscribe to our blog so you don’t miss my next post, where I’ll be explaining more in depth about how to optimize your images for the web.
