HOME

TheInfoList



OR:

A web template system in web publishing allows web designers and developers to work with ''web templates'' to automatically generate custom
web page A web page (or webpage) is a World Wide Web, Web document that is accessed in a web browser. A website typically consists of many web pages hyperlink, linked together under a common domain name. The term "web page" is therefore a metaphor of pap ...
s, such as the results from a search. This reuses static web page elements while defining dynamic elements based on web request parameters. Web templates support static content, providing basic structure and appearance. Developers can implement templates from
content management system A content management system (CMS) is computer software used to manage the creation and modification of digital content ( content management).''Managing Enterprise Content: A Unified Content Strategy''. Ann Rockley, Pamela Kostur, Steve Manning. New ...
s, web application frameworks, and
HTML editor An HTML editor is a program used for editing HTML, the markup of a web page. Although the HTML markup in a web page can be controlled with any text editor, specialized HTML editors can offer convenience, added functionality, and organisation. Fo ...
s.


Overview

A ''web template system'' is composed of the following: * A template engine: the primary processing element of the system; * '' Content resource'': any of various kinds of input
data stream In connection-oriented communication, a data stream is the transmission of a sequence of digitally encoded signals to convey information. Typically, the transmitted symbols are grouped into a series of packets. Data streaming has become u ...
s, such as from a
relational database A relational database (RDB) is a database based on the relational model of data, as proposed by E. F. Codd in 1970. A Relational Database Management System (RDBMS) is a type of database management system that stores data in a structured for ...
,
XML Extensible Markup Language (XML) is a markup language and file format for storing, transmitting, and reconstructing data. It defines a set of rules for encoding electronic document, documents in a format that is both human-readable and Machine-r ...
files,
LDAP The Lightweight Directory Access Protocol (LDAP ) is an open, vendor-neutral, industry standard application protocol for accessing and maintaining distributed Directory service, directory information services over an Internet Protocol (IP) networ ...
directory, and other kinds of local or networked data; * '' Template resource'': ''web template''s specified according to a
template language A template processor (also known as a template engine or template parser) is software designed to combine ''template''s with data (defined by a data model) to produce resulting Electronic document, documents or Computer program, programs. The ...
; The template and content resources are processed and combined by the template engine to mass-produce web documents. For purposes of this article, web documents include any of various output formats for transmission over the web via
HTTP HTTP (Hypertext Transfer Protocol) is an application layer protocol in the Internet protocol suite model for distributed, collaborative, hypermedia information systems. HTTP is the foundation of data communication for the World Wide Web, wher ...
,
HTTPS Hypertext Transfer Protocol Secure (HTTPS) is an extension of the Hypertext Transfer Protocol (HTTP). It uses encryption for secure communication over a computer network, and is widely used on the Internet. In HTTPS, the communication protoc ...
, or another
Internet protocol The Internet Protocol (IP) is the network layer communications protocol in the Internet protocol suite for relaying datagrams across network boundaries. Its routing function enables internetworking, and essentially establishes the Internet. IP ...
.


Template engine


Example

With the model typically held in a relational database, the remaining components of the MVC architecture are the control and view. In the simplest of systems these two are not separated. However, adapting the
separation of concerns In computer science, separation of concerns (sometimes abbreviated as SoC) is a design principle for separating a computer program into distinct sections. Each section addresses a separate '' concern'', a set of information that affects the code o ...
principle one can completely decouple the relationships. For example, the view template may look like this: Sites

Then, the control template loads the view, and then uses
XPath XPath (XML Path Language) is an expression language designed to support the query or transformation of XML documents. It was defined by the World Wide Web Consortium (W3C) in 1999, and can be used to compute values (e.g., strings, numbers, or ...
addressing to insert components from a database, for instance: preserveWhiteSpace = false; $doc->Load('view.html'); $titlenode = $doc->createTextNode("Like this"); $xpath = new DOMXPath($doc); $xpath->registerNamespace("h", "http://www.w3.org/1999/xhtml"); $query = "//h:* data-xp='title'comment()"; $entries = $xpath->query($query); foreach ($entries as $entry) echo $doc->saveXML(); ?>


Kinds of template systems

A web browser and web server are a client–server architecture. Sites often also use a
web cache A web cache (or HTTP cache) is a system for optimizing the World Wide Web. It is implemented both client-side and server-side. The caching of multimedia and other files can result in less overall delay when web browser, browsing the Web. Parts o ...
to improve performance. Five templating system types are classified based on when they replace placeholders with real content and assemble pages. * Server-side – run-time substitution happens on the web server * Client-side – run-time substitution happens in the web browser * Edge-side – run-time substitution happens on a proxy between web server and browser * Outside server – static web pages are produced offline and uploaded to the web server; no run-time substitution * Distributed – run-time substitution happens on multiple servers Template languages may be: * Embedded or event-driven. * Simple, iterable, programmable, or complex. * Defined by a consortium, privately defined, or de facto defined by an open implementation. Ownership influences the stability and credibility of a specification. However, in most jurisdictions, language specification cannot be copyrighted, so control is seldom absolute. The source code of the template engine can be proprietary or
open source Open source is source code that is made freely available for possible modification and redistribution. Products include permission to use and view the source code, design documents, or content of the product. The open source model is a decentrali ...
. Many template systems are a component of a larger programming platform or framework. They are referred to as the "platform's template system". Some template systems have the option of substituting a different template language or engine.


Language support

Programming languages A programming language is a system of notation for writing computer programs. Programming languages are described in terms of their syntax (form) and semantics (meaning), usually defined by a formal language. Languages usually provide features ...
such as
Perl Perl is a high-level, general-purpose, interpreted, dynamic programming language. Though Perl is not officially an acronym, there are various backronyms in use, including "Practical Extraction and Reporting Language". Perl was developed ...
,
Ruby Ruby is a pinkish-red-to-blood-red-colored gemstone, a variety of the mineral corundum ( aluminium oxide). Ruby is one of the most popular traditional jewelry gems and is very durable. Other varieties of gem-quality corundum are called sapph ...
, C, and
Java Java is one of the Greater Sunda Islands in Indonesia. It is bordered by the Indian Ocean to the south and the Java Sea (a part of Pacific Ocean) to the north. With a population of 156.9 million people (including Madura) in mid 2024, proje ...
support template processing either natively, or through add-on libraries and modules. JavaServer Pages (JSP), PHP, and
Active Server Pages Active Server Pages (ASP) is Microsoft's first server-side scripting language and engine for dynamic web pages. It was first released in December 1996, before being superseded in January 2002 by ASP.NET. History Initially released as an a ...
(ASP with
VBScript VBScript (Microsoft Visual Basic Scripting Edition) is a deprecated programming language for scripting on Microsoft Windows using Component Object Model (COM), based on classic Visual Basic and Active Scripting. It was popular with system admi ...
,
JScript JScript is Microsoft's legacy dialect of the ECMAScript standard that is used in Microsoft's Internet Explorer web browser and HTML Applications, and as a standalone Windows scripting language. JScript is implemented as an Active Scripting eng ...
or other languages) are examples, themselves, of web template engines. These technologies are typically used in server-side templating systems, but could be adapted for use on an "edge-side" proxy or for static page generation.


Static site generators

Static site generators are engines that use flat text input files like markdown and asciidoc to generate a
static web page A static web page, sometimes called a flat page or a stationary page, is a web page that is delivered to a web browser exactly as stored, in contrast to dynamic web pages which are generated by a web application. Consequently, a static web page ...
. Examples of this include Jekyll (Liquid,
Ruby Ruby is a pinkish-red-to-blood-red-colored gemstone, a variety of the mineral corundum ( aluminium oxide). Ruby is one of the most popular traditional jewelry gems and is very durable. Other varieties of gem-quality corundum are called sapph ...
), Hugo ( Go templates), and Pelican ( Jinja2, Python).


Static HTML Editors

HTML editor An HTML editor is a program used for editing HTML, the markup of a web page. Although the HTML markup in a web page can be controlled with any text editor, specialized HTML editors can offer convenience, added functionality, and organisation. Fo ...
s often use web template systems to produce only
static web page A static web page, sometimes called a flat page or a stationary page, is a web page that is delivered to a web browser exactly as stored, in contrast to dynamic web pages which are generated by a web application. Consequently, a static web page ...
s. These can be viewed as a ready-made
web design Web design encompasses many different skills and disciplines in the production and maintenance of websites. The different areas of web design include web graphic design; user interface design (UI design); authoring, including standardised code a ...
, used to mass-produce "cookie-cutter"
website A website (also written as a web site) is any web page whose content is identified by a common domain name and is published on at least one web server. Websites are typically dedicated to a particular topic or purpose, such as news, educatio ...
s for rapid deployment. They also commonly include themes in place of CSS styles. In general, the template language is used only with the editor's software. FrontPage and Dreamweaver were once the most popular editors with template sub-systems. A Flash web template uses Macromedia Flash to create visually interactive sites. Many ''server-side template systems'' have an option to publish output pages on the server, where the published pages are static. This is common on
content management system A content management system (CMS) is computer software used to manage the creation and modification of digital content ( content management).''Managing Enterprise Content: A Unified Content Strategy''. Ann Rockley, Pamela Kostur, Steve Manning. New ...
s, like Vignette, but is not considered out-server generation. In the majority of cases, this "publish option" doesn't interfere with the ''template system'', and it can be made by external software, as Wget.


Server-side systems

People began to use server-side dynamic pages generated from templates with pre-existent software adapted for this task. This early software was the
preprocessor In computer science, a preprocessor (or precompiler) is a Computer program, program that processes its input data to produce output that is used as input in another program. The output is said to be a preprocessed form of the input data, which i ...
s and macro languages, adapted for the web use, running on CGI. Next, a simple but relevant technology was the direct execution made on extension modules, started with SSI. Many ''template systems'' are typically used as ''server-side template systems'': Technically, the methodology of embedding programming languages within HTML (or XML, etc.), used in many "server-side included script languages" are also templates. All of them are Embedded complex languages. There are also
preprocessor In computer science, a preprocessor (or precompiler) is a Computer program, program that processes its input data to produce output that is used as input in another program. The output is said to be a preprocessed form of the input data, which i ...
s used as server-side template engines. Examples:


Edge-side systems

Edge-Side template and inclusion systems. "Edge-side" refers to web servers that reside in the space between the client (browser) and the originating server. They are often referred to as "reverse-proxy" servers. These servers are generally tasked with reducing the load and traffic on originating servers by caching content such as images and page fragments, and delivering this to the browser in an efficient manner. Basic Edge Side Includes (ESI) is an SSI-like language. ESI has been implemented for content delivery networks. The ESI template language may also be implemented in web browsers using JavaScript and Ajax, or via a browser "plug-in".


Client-side systems

Many web browsers can apply an
XSLT XSLT (Extensible Stylesheet Language Transformations) is a language originally designed for transforming XML documents into other XML documents, or other formats such as HTML for web pages, plain text, or XSL Formatting Objects. These formats c ...
stylesheet to XML data that transforms the data into an XHTML document, thereby providing template functionality in the browser itself.
Other systems implement template functionality in the browser using
JavaScript JavaScript (), often abbreviated as JS, is a programming language and core technology of the World Wide Web, alongside HTML and CSS. Ninety-nine percent of websites use JavaScript on the client side for webpage behavior. Web browsers have ...
or another
client-side scripting A dynamic web page is a web page constructed at runtime (during software execution), as opposed to a ''static web page'', delivered as it is stored. A server-side dynamic web page is a web page whose construction is controlled by an application ...
language, including: *
Mustache A moustache (; mustache, ) is a growth of facial hair grown above the upper lip and under the nose. Moustaches have been worn in various styles throughout history. Etymology The word "moustache" is French, and is derived from the Itali ...

SquirrellyHandlebars


Distributed systems

The most simple form is transclusions (HTML frames). In other cases
dynamic web page A dynamic web page is a web page constructed at runtime (during software execution), as opposed to a ''static web page'', delivered as it is stored. A server-side dynamic web page is a web page whose construction is controlled by an application ...
s are needed. Examples: *
Ajax Ajax may refer to: Greek mythology and tragedy * Ajax the Great, a Greek mythological hero, son of King Telamon and Periboea * Ajax the Lesser, a Greek mythological hero, son of Oileus, the king of Locris * Ajax (play), ''Ajax'' (play), by the an ...
* Rich Internet application


See also


References

{{Reflist 9
Free ecommerce website themes
MG Technologies Blogs and Information Portal of Website Themes.


External links


JavaScript template libraries
comparison from 2009
Enforcing Strict Model–View Separation in Template Engines

A Double-Model Approach to Achieve Effective Model–View Separation in Template Based Web Applications

A PHP template engine comparison with graphic charts

Comparisons/benchmarks of some Python template-engines and some generic thoughts about template-engines

web-mode.el is an emacs major for editing web templates
Scripting languages * Web design