Reduce Website Response Time by Implementing CSS

There are massive sluggish websites out there. Their loading time, oops, very slow.
If you are web designer / developer, you should aware that there are still tons of web users still using dial-up modems.

Despite of the facts I am in broadband connection, as a web developer, I always test my website response time with slower connection such as dial up. Response time is one of accessibility aspects. Your visitor will definitely close the browser or type another URL if your website still has not finished loading in certain time. Don't believe me? Try it yourself, and let see if you are still patience enough :)

I have some tricks that you can apply to your web site:

Avoid using images in HTML instead try to use background images and CSS
It's possible to achieve advanced presentation effects using CSS without putting any images in HTML, for example site navigation, web site background, etc. The advantage of doing this is when the browser loads web pages; it downloads the HTML part first. After it displayed, it continues downloading the CSS file and the images as well.

Design your web site layout using Layer + CSS, not tables.
Tables are considered very slow compared to HTML layer such as DIV. Moreover, layer needs less HTML code thus the amount of HTML code can significantly reduced. It means the response time can be reduced. Normally, before displaying the web site content, browsers need to read through tables twice, first to figure out the structure, and then determine the content. Once again, this process just slower the response time.

As I described, CSS offers many advantages in designing web. It also gives great flexibility, for example web designer can easily changing the layout and web site theme in the future without changing the HTML code.