This is an exciting time for web developers and web users. In recent years, technology and techniques have evolved that allow for fantastic designs. Much of this evolution is manifested as looks and layouts with fancy buzzword names. “Responsive,” “minimalist,” “flat,” “metro.” As with many trends, there are excellent showcases of the designs and annoying misuses of them. I want to draw attention to some of these misuses below.
Wasted Space in Minimalist Designs
Minimalism is the practice of reducing fluff and streamlining websites. When done correctly, this is very pleasing to the eye and makes finding what you want easy. But when taken to far, your page becomes pointless. Removing all the useful information and content in favor of empty space is annoying. You are forcing the user to go to another page in order to find anything out when you have prime real estate to spare.
Minimalism should be about making content front and center instead of banners, logos, and other fluff. It is about showing the user only what is necessary, in order to make their experience more pleasant. Don’t remove the content to minimize; remove the fluff!
Huge Photos or Logos Instead of Content
Huge photos taking center stage is “in.” It’s what all the cool kids are doing, and it’s what you want to do. When done correctly, these huge photos are great. The problem with huge photos is that they take away space for that valuable content mentioned above. Every once in a while, a site embracing this trend will throw up a photo on the main page… and that’s practically it. Sure, there may be some navigation up top, or fineprint in the footer, or a slight spattering of hard to read text. But the primary purpose of the page is to showcase a big-ass photo.
And that’s not the point. Photos are to break up text. It’s a splash of color and appeal to keep the visitors attention. In the vast majority of cases, a picture should only be supporting material. It’s not the main product, its the window dressing. Go ahead. Use photos. Use big photos. But don’t substitute the content of the site with a big photo, supplement the content.
Limited Contrast Colors
To be fair, this is not a new problem. It has been around since the dawn of the website era. In the past however, this problem was largely relegated to smaller websites. Now however, with the advent of flat design and the more subdued look of modern websites, this problem is more mainstream. Sites with grey text on white backgrounds are a dime a dozen now.
Content should pop out at the user, even with a subtle, subdued design. If the background is light colored, it should be very light colored and the text very dark. If the background is dark, it should be very dark and the color very light or plain white. Having to strain the eyes to read a website is a turn-off to visitors. Contrast, contrast, contrast!
With the advent of pop-up blockers in every major web browser, unwanted pop-up windows have all but disappeared. However the use of modal windows has grown significantly, and they are heading down the road that killed off pop-ups. Some people might know of modals as lightboxes, and they look something like this:
These rebooted pop-up windows are very useful when done sparingly and in appropriate places. An example of an excellent modal is to show enlarged photos when a thumbnail is clicked. In that use case, they prevent separate page loads, and keep the user where they were.
But they are frequently abused, as in the case of the website screenshot above. That website displays this modal on their home page without provocation. This means every time someone visits their home page, they are assaulted by this message, whether they’ve seen it before or not. Modals should NOT automatically fire on a page load. Especially with an ad or a site registration form. You are keeping your customers from the good stuff on your page. Use modals sparingly and in a support role, when prompted, only.
Intro Videos or Animations
With very few exceptions, loading should be considered evil. Waiting for content to load is unacceptable. There are only a handful of seconds before a web surfer determines whether to stick around or not. You want to impress upon them as much good information as you can in that time. A loading message is not good information. You should not have long loading, flashy content in most situations. If you’re doing something that requires loading simply because you can or to showcase a skill or catchy talent, don’t do it. Content is king, don’t overdo the presentation and sacrifice the content (a theme seems to be arising here).
One Page When Multiple Will Do
Look, someone has got to say it. Sometimes content deserves to be broken up into multiple pages. Yes, having everything on a single page and then scrolling through it, or using navigation to jump around can be cool, and keeps users from having to load pages. It seems like a logical extension of the don’t reload the page paradigm that AJAX forms and data retrieval allow. But please don’t put random, unrelated items on a single page. It’s confusing, makes utilizing search engines a pain, interferes with social sharing, and deviates from what is expected for no good reason. Each page of your website should have a single, well-defined, clear purpose. When that purpose is fulfilled, make a new page.
These annoyances that I have listed can be done tastefully and effectively, but doing so requires careful planning and execution by a skilled developer and designer. If you are a developer and/or designer yourself, remember content is what the visitor is looking for. Your job is to present that content in an easily navigated, efficient, and logical form. Please don’t abuse modern tools and design!