Web template terms and what they mean
Back to Website articlesBuilding a website from scratch can be difficult; particularly if you are new to the internet or to building websites. Using a web template can save you a lot of time because most of the work has already been done for you. An ideal template will have everything you need except the unique content you want to put into it.
An important term that is not usually on a web template label, but one you should understand, is Markup Language. Markup Language is a combination of words and symbols that give information on how a document should appear when viewed by an end user. Markup Language is not seen by the end user of a program (a word processor or a web browser, for example), but the program sees it, and structures and formats the document it displays to the end user based on the instructions given in the Markup Language. All web pages are programmed in a Markup Language.
Common types of downloadable website templates
Here's a list of some information about common terms used by designers that offer free (or even paid) templates:
HTML Template
A basic HTML template is great for someone new to web design to assist you with learning basic page markup and syntax.
HTML stands for HyperText Markup Language. HyperText Markup Language is the basic skeleton used to build all web pages. It's actually a very simple programming language (and you should learn it if you haven't already; you can get a good grasp of the concepts within an hour).
HTML tells your web browser how to display a web page to you, the viewer. Not only does it tell a web browser the structure of data the page, it can also format elements in the page such as text and pictures, or turn them into links to other pages (however it's usually a better idea to use CSS to format your content on a web page, see below). HTML.net has a well-explained html tutorial split into 15 lessons. They also have a CSS tutorial you should check out after understanding the basics of HTML.
CSS
Most web templates, regardless if they are labeled as containing CSS, use CSS for formatting.
CSS stands for Cascading Style Sheets. Although HTML can format elements in a page such as text, CSS offers you more control in formatting your web site's content and also makes it easier to update your site's appearance later on, if you get the urge to change some formatting options, such as page background color, font colors and sizes, etc. If you format your web pages with CSS, and later feel like changing your font on all pages from Arial to Times New Roman, you only need to update one central file; whereas if you built your site only in HTML you will have to go through every page and change each instance of your font formatting.
Once you have learned HTML, it's a good idea to learn CSS. It's slightly more detailed than HTML, but easy to follow because of the similarity between the two languages.
XHTML Template
XHTML/CSS templates are excellent to use for page structure and presentation.
If you know HTML 4.01, you pretty much know XHTML 1.0; the main difference being in how you code the formatting of your content. XHTML 1.0 is a recommended authoring language by the W3C.
XHTML stands for eXtensible HyperText Markup Language. It is a combination of HTML 4.01 and XML. XML, a markup language similar to HTML but much stricter, requires you to define your own tags. Some tags used with HTML are deprecated (still supported but should be avoided because support will eventually be dropped in the future). XHTML is not just a stricter form of HTML 4.01, it actually extends HTML because like XML, allows one to define their own tags if needed.
This strictness helps ensures browsers will interpret markup the same, and the extensibility and portability of the code has been touted by many, including the W3C for some time, to be the best way to markup web pages. Strict XHTML definitely makes for cleaner code overall. The extensibility factor of XHTML markup might allow other future methods of surfing the internet to be developed using the same standard.
With cleaner markup from XHTML and the ability of CSS to separate the content and presentation of web pages, you may not need to worry anytime soon about the current or future compatibility of your website with many new internet browsing mediums predicted. With the release of HTML5, specifications for XHTML5 are currently being developed. Wikipedia has more information on XHTML and W3C recommendations.
PSD Template
PSD templates are great if: you are familiar with editing graphics with a sophisticated graphics program, if they are fully layered, are pre-sliced, and have an accompanying web page with valid markup so you can export your edits to a web page easily.
A PSD template is the image file that was used to initially design a template. Often referred to as "source code", PSD files are generated using a graphics software program called Adobe Photoshop. Most templates begin in some sort of graphics program, and a large number of designers choose Photoshop when beginning their creations. PSD templates usually allow the acquirer a much larger range of self-customization than templates without PSD source code. In a PSD template, different elements in the graphic layout of the design are still easily editable because they are each on their own layer, whereas a graphic JPEG element has already had it's background and text layers flattened into one layer.
Be aware that with PSD templates you will need to have a copy of Adobe Photoshop installed on your system to edit them. If you cannot afford Adobe Photoshop to edit the PSD file, there are other less-expensive graphics programs that claim to support editing PSD files although this author has not tested them.
Editing a PSD may seem difficult to someone who is not familiar with professional grade graphics software, but there are numerous tutorials online that can assist one with getting familiar with Photoshop. Also be aware that just because the template is labeled a PSD template, does not mean that all the layers are editable; the designer may have flattened some of the layers beforehand. You will want to check if the PSD you are getting is pre-sliced. If it isn't, that's another thing you will need to learn to be able to successfully export your edited design into your web page. If the PSD template doesn't come with slices, chances are it also doesn't come with it's own XHTML/CSS page(s) that work with it.
Flash Template
Flash is a technology that can be embedded into a web page to add animation, sound, interactivity, eye candy, forms, videos and games. According to Adobe.com, their Flash Player reaches 99% of internet-enabled desktops in mature markets. Using Flash can make an otherwise plain web page really stand out, if you don't overdo it.
Similar to a PSD template, if your template has the FLA (source code for the Flash movie) included, you will need Adobe Flash Professional, and a good knowledge of the program to edit it. Another less-costly and easier to learn program used to make flash animations is Swishmax. Be aware that Swishmax source code is SWI, not FLA. You cannot edit one in the other.
The W3C validator FAQ has information for the correct method to insert SWF files into XHTML so that your website with flash objects validates correctly.
Web Template Terms and What They Mean is ©Copyright 2011 webtemplateszone.com
Be sure to check out our free websites and flash templates here.

