The Essentials of Building a Fully Optimized Business Website

The best website is not necessarily the best looking website. There are several factors to consider for a well designed and fully optimized website. If your client shows you a website that glitters and shimmers but doesn't meet what the client wants, it is not a good website at all.

Yes, it is easy to agree with your client and work on his design specification. But as a professional web developer, it is your obligation to make sure the client understand everything. Because there is a possibility that your client will lose any number of customers because what he thinks of his design specification might not work well for some reasons. It means you must be willing to diplomatically tell your client that his wrong with his ideas.

Generally, a good business website should appear quickly on a screen. It should be consistently very easy for beginners as well as experienced users to navigate. Importantly, the website should be attractive when viewed with any of the major browsers and should look better in any screen sizes (responsiveness). Users should be able to quickly find what they’re looking for on the site.

Essentials of Building Websites

Fast Load

There are many design techniques to cut a page downloading time. Use HTML text as much as possible in designing a website. More often, designers will just slice an image from a PSD to save time working on style sheets. Use image sprites for background and graphic icons. In fact, there are CSS frameworks today that use glyphicons which are lighter than image icons. As much as possible, do not use nested table. Use divs and classes in your HTML instead.

If you’re using CMS like wordpress, compressing and reducing graphic files is easy without destroying the graphics quality. You can use various plug-ins like EWWW Image Optimizer and WP Smush.it by wpmudev. Also, it is important to minify and compress your HTML, CSS, and JavaScript. And place all your JavaScript links as much as possible in the footer area. This way, it will load first your HTML elements before the browsers make any JavaScript action.

Moreover, it is also important to avoid rendering blocking JavaScript and CSS on your website internal pages. An example of this is a welcome pop-up or modal window when a new user visits a home page. To check your website’s loading speed and performance, you can use pingdom.com or google pagespeed insights. They are free to use and reliably provide you a detailed evaluation of your site fixes to optimize the loading speed.

Easy Navigation

Many internet users got lost in navigating a website. Problems in viewing a website are not fault of the inexperienced user but rather the web designer who designed the user interface (UI). This is true; a badly designed navigation layout could lead the visitor to jump off to another website. To prevent this from happening, you need to make sure that your navigation tools are easy and user-friendly.

You’ve probably seen many websites that uses a consistent navigation bar on the left side of every page on the site. This is done so visitor can better understand how to navigate through the site. If you go to smashingmagazine.com and wpmudev.com, you’ll see that the same navigation bar is consistent throughout the website.

No matter how complex the website is, you should be able to organize the topics and subtopics to make navigation easy. If you’re building websites for eCommerce and your main navigation is in the header area, you need to have a mega menu where visitor can easily navigate throughout hundreds of product categories and sub-categories. If you go to zalora.com.hk and lazada.com.ph you will see how easy it is to navigate using their drop-down mega menu.

Cross-Platform Compatibility

As a web designer, making your website’s elements to be consistent on all browsers is one of the major complex workaround to deal with. More often web designers tend to look for browser issues after the website’s 90% completion. I tell you; the more you do this process the more likely you will get fired by your boss.

I suggest checking your website elements from all browsers while doing HTML markups and CSS coding can save you time and effort. This is way better than fixing it later in the development. This will help you identify minor issues during the process and help you speed up the development.

Also, a well designed website can able to adapt various sizes of screen device such as mobile, tablet, and wide-screen monitors. Especially today that more and more people are using smart phones where they can browse the internet easily and fun.

Content Readability

To give your site an impact to your visitors, design your website’s pages that are easy to skim in finding pertinent information. A good website pages should have a Title, Heading, introduction, and well formatted body content.

If you are using CMS like Joomla or WordPress, formatting your content is a breeze.  Using the latest text and visual (WYSIWYG) editor you can format your content the way you want. This CMS feature can make your website pages content easy to update and allowing you to add relevant images. Also, don't mess up your content by placing too much banner ads within the content area.

In conclusion:

A technically stunning website that ignores many really important things will end up as a website that doesn’t work. Use coding standards and best practices to make sure your website is fully working and optimized  for your client. By doing this, you simply make everything easy for your visitors. And of course, for your clients to make a passive income and high return of investment (ROI).