4 Steps to Make Your Static Website Faster & More Dynamic

For advanced developers this may be common practice, but there are still far too many new websites being launched in stone-aged fashion. Today, surfers are used to fast page-views and consistent layouts which can both be achieve with some simple PHP tricks that require little to no PHP coding experience.

1. Work in .PHP instead of .HTML

If your page isn’t already a .PHP file, then you must change this in order for the include code to work. You simply have to rename the file, regardless of its content, because the .PHP extension will render your HTML code normally and in addition also render all PHP code in the file. If you want to keep the .html in the URL, it can be cloaked back to it via an .htaccess file, which we will discuss in our upcoming post.

2. Use Relative URL Paths

Using relative URL paths is crucial for faster speed and is the foundation of many other techniques, such as safe domain changes, including of files, etc. The way this is done is quite simple. Whenever linking to the root of your domain name for example, instead of using a link like this:

<a href="http://www.your-website.com/">Home</a>

You can simple use the forward-slash "/", where the "/" links to the root (in that case, the index) by default.

<a href="/">Home</a>

If the above example is understood, you would then want to link to subpages and images using the relative path as well. Linking to subpages within the root level would like:

<a href="/about.php">About Us</a>

Or grabbing images within an image folder on the root can be done with the following code:

<img src="/images/file.jpg" />

Note that this can be done from subfolders as well, considering that you remain on the same domain, the “/” will always point to the domains index. This method is not only much safer for domain changes and deeper folder structures, but also help avoid mistakes of missing the ‘www.’ or misspellings, making it also friendlier for crawlers.

3. Keep Web Page Structures Consistent

Now that your site is compatible for this method, you will want to make sure that all your html pages are consistent, meaning that the headers, menus, footers, sidebars and other sections you may be using are identical html with the same css rules. This way, once you implement includes on all the pages there won’t be any unwanted design problems.

Once you have a good idea of what code snippets will be identical, you will want to cut that out of every page and place it in its own .php file. Since the purpose of this is not only reduce disk space, but also speed up page-views and load important parts of the website first, you will want to use them for the following sections at the least:

  • One include For the JavaScript and CSS files in the Header, another for the ones in the Footer.
  • One include for each repeating menu, such as Header and Footer menus.

4. The Include Code

Now, let’s start including external files into your website. If your include file (exp. header.php) is located on the same server drive as the page requesting it, you can simply use the below code:

<?php include ('header.php'); ?>

If although, you were putting all your include files in a folder called /includes, you would target it like this:

<?php include ('includes/header.php'); ?>

Pages that are requesting an include file located a directory above the page, even if you are already on the domain root, can include that file via:

<?php include ('../header.php'); ?>

The above steps are enough to see a significant change in your websites performance if implemented correctly and can be handled with little to no PHP experience. Please feel free to add suggestions and/or comments as well as subscribing to enjoy our upcoming posts.

I'm a developer at Maximus Business.

Leave a Reply

Please feel free to give us your feedback and comment below. Please keep in mind that comments are moderated. Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>