Fast loading web pageNow our internet access speed has gone up but still the loading speed of page does matter a lot for visitors and for search engine robots. We can create web pages for fast loading without sacrificing much on graphics or animation part of the site. Images or animations are not the only reason for slow loading of the web pages, so we will discuss all other accepts which affect the speed of a webpage.
Use style sheetWe can define style property for every tag we use in an external style sheet. We need not define the styles for each and every tag all the time we use them. By keeping the styles in an external file we get the advantage of not reloading style sheet file for all the pages. Browsers download the external style sheet once and cache them for repeated use. The required formatting code in every page drastically reduces as styles are declared at a common place.
External LinkagesIf your page has code which collects content from other sites then that can slow down your page loading if the others sites are not as fast as yours. Speed of affiliated links, external ads, RSS feeds etc plays important role in fast displaying your page in browser. Take care while using these codes and check how fast they are loading. Some external links display small images or buttons and on further click only it downloads to full content related to that image. This helps is saving initial loading time of the page. The css file having all the style properties is cached by the browser helping in reducing the loading process of subsequent pages of the site.
Script at the endAs far as possible scripts to track visitors or counters or analytic software should be kept at the end to allow fast loading of content at the starting.
Optimizing ImagesWe can't ignore images in our web pages but we can change these images to load fast without compromising on quality of it. For displaying on web pages a resolution of 72 dpi image is enough, higher resolution than this will only increase the file size of the image without much improvement in quality.
Always define the height and width of the images within the image tag. This helps the browser to adjust the text around it before loading the image.
If you want to display high resolution images or wants your visitors to download high quality images then you can display a low resolution sample of thumbnail of the image and visitor will click the image to get the better quality one. This will help in saving the bandwidth as all high resolution images need not be downloaded.
We can keep our site logos and other common images in a common file and link them from all our pages. These images as required by all the pages the browser will load them from browser cache and every time it will not download these common images as visitors move from one page to other within your site. This will help in improving the speed of the site.
A good idea is to keep the content at the top of the page. This can be achieved by carefully designing the page and allowing the content to load first. Pushing content up
Using framework BootstrapThere are open source frameworks which can be downloaded or linked to get the style or script library. These are developed by experts so no need to invest in designing them again. You can customize them to match your changes or requirements. With the popularity of Mobile devices these frameworks helps in keeping your site mobile friendly. Because of its popularity and uses in other sites, when visitor visit your site chance that visitor browser already have these frame works in its cache so the page will load fast.
Firefox add-on Firebug and Page SpeedFirefox browser has some excellent tools in terms of add-ons know as Firebug, to this we can add page speed to identify and monitor cause of slow speed of the web pages. Check this google page on links for download of Firebug and Page Speed
Google has a collection of articles to speed up web pages.
Number of User Comments : 3
Search Engine Optimization and google articles
Webmaster tools to Diagnose problems and crawl issues
HTTP error code and messages
Search engine friendly page design
Quality Site for higher ranking in Search engines
Checklist for a new website for future ranking
Fast loading Page
Black Hat Search Engine Optimization - SEO
rel=nofollow: Preventing comment spam
robots.txt file of a site
google trends for comparing & monitoring traffic
Searching google within a site for number of pages