When I started my first blog I used to do lot of experiments to make it look better. Be it the colour combination, fonts, images or even page load speed. I have tried many different things to make my blog look more beautiful and optimized. Like many people who started blogging few years back, the first blogging platform I used was Blogger. Customizing the Blogger template was not an easy task. Also there were only limited number of “plugins” were available for Blogger.
After a couple of years I have moved to self hosted WordPress platform. As we all know WordPress is fantastic software and is one of the most popular platforms for blogging. It is also used as a CMS (content Management system) as well as the powerhouse behind many popular websites. I have tried many different things on my WordPress blog also. During all these years I learned lot of new things. Like the Search Engine Optimization (SEO) practices, web design standards are also very important to make a blog or website more effective, search engine and user friendly and popular. In this article I am sharing many of these design tips that you may find interesting.
The 45 plus Web Design Tips I Learned from Blogging are listed below. Please share your thoughts and tips also. You can use the comments section to improve and update the below list.
45 Plus Most Basic Web Design and Webmaster Tips
1. Your website niche at first glance
This is very important. Average internet users do not stay on a page or website for more than few seconds unless they find the website and its content useful. So design your site is such a way that it should clearly tell the visitors what the site is all about.
2. Let your Page/Post Title tell half of the story.
This is a good and essential practice. If you write a post or design a page, the page or post title should indicate what you are presenting in the page. keywords can be a part of the title and URL.
3. Colour Choices on Web Pages: Contrast and Readability
Usually pages with very little contrast make things difficult to read. Similarly too much contrast results in extreme vibration and will result in reduced readability. For example white text on black background or yellow text on black background or red on black all results in decreased readability. When you choose colour scheme for your website choose a colour scheme with effective colour contrast that results in increased readability. Avoid too many bright colours on a website that make it distracting and difficult to read.
4. Build a site with clear hierarchy
Organize your site content with clear hierarchy. You can categorise and present the hierarchies using well designed menus and text links
5. Make sure that every page is reachable
You need to make sure that every page is reachable. Make sure that if you have large number of pages split it into multiple pages and categorize them. Use static text links to reach every other other page.
6. Avoid fancy fonts that are unreadable
There are many fancy fonts available. But should I use those in my website? In majority of the cases NO. If you have content rich site then better to avoid fancy fonts. Stick to the standard web fonts.
7. Reduce the usage of Flash and similar objects
Users might get annoyed with excessive usage of Flash and similar objects in your web page. The number of people who wait for 30 seconds to load a page definitely belongs to a minority. Also the effect of flash on web page load speed also needs to be considered.
8. Use text instead of images to display links.
It is advisable to use text instead of images or flash to create menu or navigation links. Search Engine crawler doesn’t recognize text contained in images.
9. Don’t use images to display important names and content
This is also important since the sites popularity depends heavily of search engine. As we said earlier Search Engine crawler doesn’t recognize text contained in images.
10. Find all the broken links in site and fix it.
You must find out any broken links in your site or blog. If the page is removed you need to provide proper error page with error code 404.
- Read Related Article: 10 Tools To Check Broken Links in Website
11. Usage of browser specific styles
If you are using browser specific CSS styles then there should be an alternative definition of CSS style to support other browsers. For example for certain version of IE you may need to provide different set of CSS style classes to support certain features.
12. Avoid using auto start Audio and/or Video
The audio or video files which starts automatically when the page loads may irritate the user. Provide the option to start the video or audio files if they are really interested in watching the video or to listen the audio.
13. Optimize the images used in your website.
Image optimization is really important to boost the performance of your website. Also do not use images which are not clear or blurred.
- Read Related Article:How to Optimize Images for Blog and Websites
14. Use Title and ALT Tag for images
This is useful for your customers as well as for search engines. If your browser is not able to load the image file, it can display the alternate description of the images which is provided using the ALT tag.
15. Accurate and descriptive TITLE and ALT tags
Title and ALT tags are the actual descriptions and that must be accurate and should be descriptive about your images.
16. Use Heading tags properly.
You must use heading tags like H1, H2 etc to arrange your content and to maintain proper formatting of the content.
17. Test your website for any CSS or HTML errors.
You must test your website to find out any HTML or CSS errors exists in your website pages. You need to correct them. CSS and HTML errors not only created problems during page rendering but also decreases the overall quality of your web page.
- Read Related Article: How to Test Your Website Completely – Validate HTML,CSS , RSS, ATOM,Mobile compatibility
18. Avoid hidden text or hidden links.
Google says “Hiding text or links in your content can cause your site to be perceived as untrustworthy since it presents information to search engines differently than to visitors.” As they said if your site has hidden links the site may be removed from the Google index and will not appear in search results pages. Hidden test includes using white text on a white background or even setting the font size to 0.
19. Avoid duplicating contents across multiple pages
Google is targeting sites which have duplicate content. Duplicate content attracts Google penalty and eventually your site may get removed from search engine index.
- Read related article: Fix Duplicate Site Content: Avoid Google SERP Drop and Duplicate Content Penalty
20. Provide a Site Search Feature.
This is another must have feature for any website. Webmaster should provide a search feature on every page so that the website visitors and users can search and find the page or content what they are looking for. You can even use Google custom search or Bing custom search for this purpose.
21. Avoid horizontal scroll and present long content in multiple pages.
Make sure your site never goes horizontally beyond the width of the screen. If your single post or article is too long you can consider mult page presentation of your content.
22. Visible links and use of anchor text
Links should be easily recognisable and the visited links should be in different colour. The standard blue colour is the optimal colour for links. You need to include a relevant anchor text on your links.
23. Avoid scrolling text, blinking links etc.
Both features are used long ago and are not at all relevant and user friendly now.
24. Provide text-only alternatives to rich-media content
By providing text-only alternatives to rich-media content and functionality will make it easier for screen reader services as well as for search engines to crawl and index your site.
25. Don’t clutter the website with too many things.
Keep it simple unless you have strong reasons to do so. Content rich websites can adopt simple themes that highlight the niche rather than making the site flashy and graphics dominated.
26. Avoid unnecessary redirects and new windows.
If the content is in the same site do not open them in a new window or tab unless there is a justifiable reason for that. Also avoid unnecessary redirect and browser window resizing.
27. Better to use consistent theme
Follow consistent theme across the website. Also make the colour combination constant across multiple pages.
28. Use less number of plug-in
If you are using Blogging platforms like Blogger, WordPress etc try to use less number of plug-in. This will not only improve your page load speed but also the dependency to multiple pieces if tools that may need individual upgrade process
29. Provide HTML and XML sitemaps
You can create an HTML site map for internet users and XML sitemap for search engine bots. This is essential. You can submit the XML sitemaps to Search engines manually or by adding them into robots.txt file.
310. Make content rich websites
Content is the king and search engine treats content rich websites like kings. If you maintain blogs try to make quality content with minimum of 350 words.
31. Check your content for spelling and grammar mistakes
Use any tool to check grammar and spelling before publishing the content.
32. Less Frames, Less tables Better Website
Code-content ratio will have a negative impact based on the number of HTML tables and frames used in a page. Search engines and screen readers may find issues to crawl frames contents. CSS styles can be used as a replacement of tables.
33. Test website cross browser compatibility
Your website should be rendered properly on all browser or at least all major browsers. The market share of all popular internet browsers shows the intensity of the competition. It is very important to test your website on all major browsers at least.
- Read related article: Top 10 Tools To Test Cross Platform Browser Compatibility
34. Make your website mobile friendly
The numbers of people who browse internet using their smart phones are increasing day by day. This indicates how important is to have a mobile version of your website.
- Read Related article: How to Create Mobile Version Of Your Website or Blog?
35. Test your website on different screen resolutions
This is another important point. People are using different screen resolutions in many different devices. So it is critical to make sure that your website and pages appear properly in all these resolutions.
- Read Related Article: How To Test Your Website in Different Screen Resolutions
36. Always provide contact information
Always provide contact information so that your customers or website visitors can contact you for various reasons. It if a good practice and will give more credibility to your site.
37. Always provide “About” page.
People prefer to interact with others when they have access to their profiles. An about us page will give the users an opportunity to read about the people behind the website of blog. This will not only gives more credibility but also helps to develop a community around your blog or website. Google recently enabled content authorisation in search result pages.
38. Use simple and URL pattern
Avoid using URL’s with many URL parameters and URLs which has too many characters. Keyword can be part of the URL and may improve the search engine ranking of the particular webpage.
39. Social media branding
Brand your website by creating social media communities in Twitter, Facebook, Google+ etc. Encourage people to join the communities.
40. Provide subscription options
If your website publishes periodic contents or if you are maintaining a blog you can provide options to subscribe newsletters or RSS feeds. This will not only give users to get periodic updates in their inbox but also improve the readership of your website or blog.
41. Do not link to blacklisted sites.
Search Engines especially Google blacklists website and blogs for various reasons. If you have any links pointing to those sites please remove them before it affects your websites rankings.
- Read related article: 5 Important steps to avoid Search Engine Blacklisting.
42. Submit your website or blog to search engines and directories
Submit your website and blogs to search engines like Google, Yahoo, and Bing etc. and to directories like DMoz and Yahoo directories.
- Read related articles: Submit URL to Yahoo, Google and Other Search Engines and Directories
43. Use GZip compression and caching
These methods will improve the page load speed. You can configure GZip compression, caching etc by configuring server parameters. If your hosting server is Apache you can use .htaccess files to do all these optimizations
- Read Related Articles: Speed up website -Compress CSS/JavaScript using GZIP/DEFLATE compression – Optimization Tips -Part 2
- Top Tips to Speed Up website – Website and Blog Optimization
44 Minification for faster content download
You can minify Scripts and CSS style sheets or can combine them for faster download from server and to improve your websites speed.
45. Use necessary Meta tags
Certain Meta tags are required to provide information to user agents as well as search engine bots. Meta tags like Title, Description etc should be there on all pages.
46. Use CDN to improve load speed
You can use the content delivery network (CDN) to improve the website load time. Distributed content always reduce the load on website hosting server.
Before you go, subscribe to get latest technology articles right in your mailbox!.