What is an SHTML Index?

HTML (Hypertext Markup Language) is used for creating webpages on the Internet. The introductory page of most websites is named “index.html” and is intended to provide navigational links for the site. When this page contains special instructions called Server Side Includes (SSI), the page must be saved as index.shtml, thereby creating an SHTML index page. Including an SSI directive or server instructions on the index page can greatly simplify the task of maintaining accurate site navigation, not just from the SHTML index page itself, but from all pages within the site.

Proper site navigation is a critical feature of any website, but navigation links can be broken by deleting or adding pages, or moving content around. This can mean tediously editing navigation code on each of the remaining pages to account for the changes. Using an SHTLM index strategy, only a single navigation file need be edited for the changes to be reflected dynamically on all pages within the site, as the content of that single file can be embedded on the fly into every page in the site.

To use SSI one need only include an SSI directive or line of SSI code in the HTML page and save it SHTML. This SSI directive instructs the server to paste additional content into the body of the webpage before serving it. The additional content in this case would be a separate HTML file residing on the server that contains the site’s menu code. The menu code is inserted at the point in the webpage where the SSI directive is located. By placing an SSI directive on every page in the site, you can update navigation site-wide by editing just the single menu file.

The SSI directive looks like this: <!--#include file="menu.html" --> where the menu.html file can be named anything. After embedding the one-line directive into the HTML page, the page must be saved with the .shtml extension. No other action is required except to create the menu page itself and upload it to the server. The menu file is saved with the .html extension and does not require header tags. As a simple example, the content of the menu.html file might look like this:

<ul>
<li><a href="#">First Link Named Here</a></li>
<li><a href="#">Second Link Named Here</a></li>
<li><a href="#">Third Link Named Here</a></li>
<li><a href="#">Fourth Link Named Here</a></li>
</ul>

By pasting the SSI menu directive into each page in the website, all pages will display this content. If a webpage is deleted or moved, just edit the menu.html file and all pages will display the updated navigational links.

Since SHTML directives can also be used to serve other dynamic content apart from menu navigation, an SHTML index page doesn’t necessarily have to include an SHTML index, but navigation menus are highly encouraged and help search engines to crawl the site. Broken navigation links only hurt site traffic and search engine placement.

Additional uses for SSI include adding headers or footers throughout a site, time and date, displaying last-modified information, or to output the results of a CGI script such as a page counter. To take advantage of SHTML index and webpages, the Web server hosting the domain must offer Server Side Includes with the hosting plan. If it does not, the host will serve SHTML pages without parsing them, meaning the server will not carry out the SSI instructions.

Many examples of different SSI directives are available by searching. Web browsers can display SHTML index and wepages as easily as HTML index pages, requiring no additional plug-ins or features.