Common Web Design Mistakes
- Common Web Design Mistakes
- 1. No Search Box?
- 2. No Visible Call To Action?
- 3. Browser-Based PDF Files
- 4. Silence Please! (Background Music)
- 5. Text Heavy Page
- 7. Empty Or Weak Page Titles
- 8. Ad-like Banners and Images
- 9. Inconsistent Design
- 10. Opening New Window Or Tab
- 11. Not Listing Your Prices
- 12. Splash or Intro pages – (especially those built in Flash)
12 Common Web Design Mistakes. In no particular order… portfolio website examples, web design inspiration, personal portfolio website, portfolio web, web design portfolio template, a simple web design portfolio.
1. No Search Box?
The web is a…web, a network of information acting as a library for us, the end-user. People should be able to find information easily and efficiently and we do this by using a search engine.
But what do people do once they land on a website which doesn’t feature a search box, usually located in the top right corner somewhere?
A Search box is particularly handy when trying to navigate through a content-heavy site (perhaps a site containing a Blog) looking for a specific product or page.
Read More: 10 SEO Competitor Analysis Tool
Allowing users to search via a keyword, you can display a list of related pages, putting the user in control of where they go next. Make sure your search box can handle grammatical variations or misspelled words because we, people, are not perfect.
You can even use Google’s Custom Search feature as an option.
2. No Visible Call To Action?
Simply put, tell people what you would like them to do as soon as they land on your site. The whole point is to deliver information to them as quickly and efficiently as possible.
Place incentive and emphasis on key content areas and let people know what they will receive by clicking on a certain button or accessing a certain page. Steer clear of terms such as “click here” or “read more” and instead be a little more specific.
By using terms such as “Get your free quote here” or “view more ladies’ shoes” it tells people what they will actually receive and that there is an incentive.
Also, avoid using arrows pointing to a product or flashing / animated graphics to highlight an image or button. Keep it clean and straight to the point.
3. Browser-Based PDF Files
Where possible, make sure PDF content is converted into plain text format and displayed in HTML. Benefits include; a new tab or PDF plugin is not required to view the content;
content is scan-able and picked up by search engines; content is mobile device friendly; printing the content is simple;
does not disrupt the flow of the users’ browsing experience; fonts become easier to read and so on and so forth.
Read More: SEO Affiliate Programs of 2021
PDF files should be used for large documents such as annual reports or manuals and even then there should be a ‘download’ option to reduce the need for opening a large PDF in your browser.
4. Silence Please! (Background Music)
Do not, at any moment in time, play an audio file when your site loads. Background music is not recommended at any time even if you are a music site.
People look for efficiency and not something which disrupts their browsing flow.
If you really need to play some music because it relates to what you do, have an option where users can use a music player or widget which puts them in control.
5. Text Heavy Page
This isn’t a newspaper or novel, it’s a web page. Content should be concise, straight to the point and designed at a readable font size with the clever use of white space to make it easy for the human eye to ‘breath’ when reading.
People ‘scan’ a web page for content and do not read every single word. You can use techniques such as; Bullet points/lists; highlighted keywords or underlined keywords; plain English (less jargon); the ‘Inverted Pyramid.’
Quick information + great call to actions = contact!
6. Fixed Font Size
Sadly, as we try to design great-looking websites, we often overlook the effectiveness of fonts and tend to design text which is a specific color and size to fit in with the design. Common Web Design Mistakes.
This can be a nightmare when using a mobile device and you have restricted zoom. Even if you are using a personal computer it can be a struggle to read the text and hence, you get fed up and leave the page.
You will notice some sites which have a + or – icon in the top right-hand corner or you will notice a specific letter (usually the letter ‘A’) displayed in 3 different sizes.
Allowing people to select which font size they want is a great way to make your information readable and accessible. Also if you are on a mobile device and need to view in portrait mode, this works a treat!
7. Empty Or Weak Page Titles
Common Web Design Mistakes – Do not leave your title tag empty or use words such as “Welcome” or “The” a the beginning of the sentence. Take advantage of your title tag’s power by displaying informational keywords.
An example would be “Sydney’s Most Affordable Designer Couches” and then you can add your business name to the end of it. Don’t go crazy by writing a paragraph or trying to sell a story.
8. Ad-like Banners and Images
Common Web Design Mistakes – Make sure any banners, images, or graphics on your site do not look like ads.
People are very aware of what ads look like and how they break their navigation flow and because of this, they will also disregard anything which looks like an ad. It’s human nature.
The same applies to displaying videos on your site. If they are on autoplay this is a major deterrent to people because it reminds them of online video ads which are on autoplay.
I don’t know about you but when I’m on YouTube and have to put up with autoplay video ads, it drives me insane!
9. Inconsistent Design
Common Web Design Mistakes – Pick a style, pick a color theme and stick to it. Create a nice ‘flow’ to your site. It creates a sense of familiarity with the user. Avoid using different layouts and designs on different pages.
10. Opening New Window Or Tab
This has to be one of the most annoying issues when using a mobile device. If a link contains a “_blank” target element (which opens a link in a new window) make sure you warn the user by adding something like “(Opens in new window)” next to the link.
Designers often use the ‘open new window’ trick because they think it’s the best way to keep people on their site.
This is the reason why smart designers use a ‘breadcrumb’ navigation system as it allows people to track back to previous pages instead of clicking on the ‘back button.
11. Not Listing Your Prices
Common Web Design Mistakes – If you are listing your products on your site, list the prices! When a user is searching for “pink leather shoes” (you never know) they tend to open a few tabs and browse through products.
If 1 of those tabs (could be your site) does not contain pricing while the others do, guess who misses out?
Displaying prices also creates a sense of trust between you and the potential customer.
Even if you are not selling the actual product on your site, listing the price allows the customer to make an informed decision to visit your physical store to make the purchase without having to call your store or send an email.
Don’t make the process for the potential customer longer because it gives them the sense that you don’t actually want to make the sale or want their business.
12. Splash or Intro pages – (especially those built in Flash)
In my opinion, this is completely outdated. I remember when Flash was at its peak in terms of popularity, basically every 2nd site had some type of creative Flash splash or intro page with the heart-wrenching “skip intro” link or the biggest no-no, the “enter” link.
From a UX and Usability perspective, the person has already made the decision to visit your site, so there is no need to give them a shut door option. It only creates another barrier between your site and the person.
Splash pages should never be visible on an eCommerce site especially if you are selling products. Personally, I would completely avoid using Flash whenever and wherever possible.
Explore the splendor of HTML5 + CSS3 if you require animations or look into jQuery libraries and tool kits.
A solution can be, research the option of using an overlay banner which takes up 25% of the screen and allows the user to close the box if they wish.
This is a great idea if you need to display key information to the user once they land on your site or if you want to display a special promotion.
Many sites use an overlay banner to display the benefits of signing up for an e-newsletter.
It’s difficult to adhere to every single web design standard and best practice checklist, however, you can do your best by trying to add as many user-friendly elements to your site.
This also depends on your own needs, for example, a travel Blog will have different needs and objectives to a lady’s shoe store. Common Web Design Mistakes.
Work out what your target market expects, research which features will be of benefit to your target market, and how they can be applied to your site.
Finding a balance is key and the most important piece of advice we can give you is a TEST! Test out various elements against each other to see how they respond to understand which element works better.