SiteMesh Overview
Description: Opensymphony SiteMesh - Web-page layout and decoration framework and web-application integration framework to aid in creating large sites consisting of many pages for which a consistent look/feel, navigation and layout scheme is required.
Keywords: sitemesh, opensymphony, decorator, decoration, framework, layout, consistent look and feel, integration, java, j2ee

SiteMesh is featured in a chapter of Professional JSP Site Design.
SiteMesh is featured in a chapter of Java Open Source Programming.

You can also start by reading Will Iverson's Introduction to SiteMesh over at java.net or skip all this and download SiteMesh right away.

#### What Is It?

- SiteMesh is a web-page layout and decoration framework and web- application integration framework to aid in creating large sites consisting of many pages for which a consistent look/feel, navigation and layout scheme is required.

- SiteMesh intercepts requests to any static or dynamically generated HTML page requested through the web-server, parses the page, obtains properties and data from the content and generates an appropriate final page with modifications to the original. This is based upon the well-known GangOfFour Decorator design pattern.

- SiteMesh can also include entire HTML pages as a Panel within another page. This is similar to a Server-Side Include, except that the HTML document will be modified to create a visual window (using the document's Meta-data as an aid) within a page. Using this feature, Portal type web sites can be built very quickly and effectively. This is based upon the well-known GangOfFour Composite design pattern.

- SiteMesh is built using Java 2 with Servlet, JSP and XML technologies. This makes it ideal for use with J2EE applications, however it can be integrated with server-side web architectures that are not Java based such as CGI (Perl/Python/C/C++/etc), PHP, Cold Fusion, etc...

- SiteMesh is very extensible and is designed in a way in which it is easy to extend for custom needs.

### The Problem

There are many web application platforms that are in common use, and even more frameworks. Typically, a web-application is built for a specific framework on a specific platform (e.g. using custom JSP tag-libraries on the J2EE platform, a custom Perl collaboration API using CGI, or a pre-written application using PHP). A web-site may usually consist of many web- applications built with a variety of technologies.

However, while individually each of these web-applications may look and perform as expected, they are often hard to integrate with the page layout of the existing site and can often end up isolated, attached to the site merely by a hyperlink.

The most common reason for this is if a site is a mixture of custom developed pages/applications and pre-written 'out-of-the-box' software. This software may not be configurable enough to be given the desired look and feel of the rest of the site, or may be developed using a different technology to the rest of the site, restricting the developer from using fragments of the application in other pages of the site.

For example, how many times have you been to a site that has a very consistent feel all the way through, only to get to the 'search-results' page and wonder if you were still on the same site? Or how many times have you seen a framework or web-application that you would love to use on your site but it will not integrate with what you already have?

### The Solution

The solution is to work with the HTML that is generated by the various web-apps instead of hacking at the underlying code (although SiteMesh is primarily geared towards HTML based sites, it is built in an extensible manner allowing it to be easily adapted to other mediums such as XML, WML, PDF, etc).

Each application should produce a plain vanilla version of the HTML content it wants to display. How this is achieved does not matter - it could be a static HTML page, XML/XSL transformation, Servlet, CGI script, etc.

The HTML content is intercepted on its way back to the web-browser where it is parsed. The contents of the `<head>` tag and the `<body>` tag are extracted as well as meta-data properties of the page (such as title, `<meta>` tags and attributes of the `<html>` and `<body>` tags).

From the extracted meta-data, an appropriate Decorator is determined. A decorator can be thought of as a skin for a page - it wraps a plain looking page with a consistent look and feel. This decorator then overlays the original page.

To use SiteMesh, it needs to be installed, configured and have some decorators created. This process can be completed in minutes, and no coding experience is required. No changes need to be made to your existing web- pages/applications!

### Visual Example

2 pages are produced from different systems (one is a JSP and the other is a pre-written CGI script). Both pages are parsed and have a decorator overlaid to produce final page of a consistent look.