You have 5 seconds to impress me.
|
If you have any constructive comments, suggestions for improvements or corrections, please
|
Doing it smarter, doing it once
We all know that an image displayed on one page of your site, i.e. already downloaded, can be re-used on another page and comes from your browser's cache. That means the second time you use that image it appears almost instantly. One smart way to increase the apparent speed of your web pages is to re-use graphics and graphic elements. And it adds the appearance of a unified design to your site.
But there's more to re-use that simple graphics - and many of the following ideas greatly simplify your site maintenance and/or modification.
Download once, use often
It is also possible to have parts of your page other than images re-used in the same manner.
The following tips/tricks should not be tried unless you are confident that you fully understand them.
Suppose you use a javascript function on your pages (no, not the 'no right click' joke). If the code is in every page, it gets downloaded from your server every time a page is downloaded from your server. Why not use an external script file? It gets downloaded once from your server, and every other page will use the version in the visitor's cache, so it's quicker. Simply save the content of your script as myscript.js (for example), and just use this line in each page:
<script type="text/javascript" src="myscript.js"></script>
And the benefit is that if you need to change the script, change myscript.js and the change occurs with every one of your site's pages.
Suppose that you use a set of CSS statements on your pages. If the code is in every page, it gets downloaded from your server every time a page is downloaded from your server. Why not use an external style definition file? Again, it can be an external file, downloaded once, and used many times. Simply save the content of your CSS definitions as mystuff.css (for example), and just use this line in each page:
<link rel="stylesheet" href="mystuff.css" type="text/css">
Including common parts
It is also possible to reuse actual html code fragments (such as an entire 'top of the page' segment) that occur in every page of your site.
The following tips/tricks should not be tried unless you are confident that you fully understand them.
Server-side Includes
In the same way as your html pages can include content that previously has been cached on the visitor's computer (scripts and CSS file examples above), it is possible to break your pages down further into common 'chunks' of code that are used on every page. The actual page residing on your server includes instructions to 'include' or insert certain code segments at the server before downloading the finished page to your visitor. And, as with a browser cache, once those code segments are called the first time, they remain in the server cache so they are retrieved faster for subsequent pages.
Any of the server-side technologies require that your host server supports your choice - and many *free* web hosts do not allow any server-side stuff at all. The simplest server-side method is SSI - server-side includes. And it's easy to use and understand.
Rather than a short example here of what can be done with SSI, it's better to take a look at the excellent examples available at www.bignosebird.com
.
More powerful server-side coding can be accomplished with either ASP or the more popular PHP. Why more powerful? Because ASP and PHP are programming languages that can add many features to your code that is impossible with either HTML or javascripting (such as the 'add a comment' feature on these pages). But - you're not going to learn it overnight. Nonetheless, the server-side technologies offer the best possibilities for speedy sites, not to mention the incredible simplicity of making site-wide changes by editing only one or two files.
An example - this page uses php
The example below illustrates how far it is possible to take the concept of 'included' common sections of a page generated at the server before being downloaded to the visitor's browser.
While this example may not be entirely to your taste, it shows exactly how the file named tools.php exists on the server. That's it - nine lines of code produced this entire page. That file includes instructions to assemble what you are looking at right now. With the exception of the 'content' every other part of this page is common/equivalent to all the other pages. Since each section has already been cached at the server except for the actual 'content', the entire page is loaded very quickly at the server.
|
Begin php code |
<? |
As should be apparent, using included and common content makes maintaining the site very simple. It also makes site-wide changes very easy to implement since so many parts of every page are common, i.e. editing a single file changes every page. Not only does it provide considerably faster page appearance, it also speeds up the site maintenance - a gain in speed every webmaster appreciates.
© 2002 - halfadot smallwebs