Phone and FAX
Tel: 0845 121 1194
Fax: 0845 121 1195
Whenever you start playing seriously with CSS you will notice that there are a lot of differences in the way pages render in different browsers. One of the more useful tips that was given to me when I was starting out is to use a master CSS file that resets default properties so all browsers have the same starting point. You can then use another CSS file to make it look pretty. These master CSS files can be found online all over the Internet.
But the problem with this approach is that these ‘master’ CSS files are often huge behemoths that systematically go through every possible element and make them all exactly the same.. It works but can be seen as using a sledge hammer to hang a picture. Perhaps a more appropriate approach is to use a cut down version that only goes through the elements used on the page. Every time you add a new type of HTML element, you add in the relevant CSS into your master CSS file that resets the padding, margin, colours, font weight etc of that element.
So, in general, master CSS files are a great idea, but can mean there is a lot of redundant and unused code. Just make sure you go through the file after you’re done to remove any unneeded CSS elements.
There’s nothing more frustrating than waiting for a web page to load. In fact most internet users will not wait more than 10 seconds. So if you want to hold on to your visitors and lower your bounce rate try the following design tips to speed up your page load times.
Multimedia Files: Music files, flash animation and video clips can slow down your website dramatically. If you have a piece of music or a movie that you really want your viewers to access try providing a link to an online player instead of embedding the file on your webpage.
Templates: Website templates are cached by the web browser on first load so any subsequent pages using the same template load much faster.
Images: Excessive use of images can slow down a website hugely. If you do need to use several images on your site, for instance in photo galleries, ensure that their individual file sizes are as small as possible. Software such as Adobe Fireworks can compress images for web use.
HTML: Well written HTML, CSS and the use of minimal images results in fast loading pages. Optimise your code by removing repeated or redundant HTML tags.
Background Images: When creating headers and footers use background instead of full images. The visual effect will be the same for the viewer but the page will load much quicker.
Once you have finished your website build or redesign check your pages to see how long they take to load. There are various browser plugins available to help make your job easier.