Advantages & Disadvantages to Web Templates

In today’s booming internet market, there are so many companies competing for every single user that what ends up making or breaking the deal almost always has directly to do with the website design of the company. The user usually decides within the first 5-15 seconds whether or not they are going to remain on that site, making first impressions imperative. So, as the owner of a company, you ask yourself what type of website you need to make you stand out above your competitors and if going with a template is the right answer. You’ve heard a lot about templates and how much time and money they can save you. In this article we will examine the use of templates and their advantages and disadvantages. Of course, ultimately, it is up to you; these are just suggestions, but remember, the internet is growing daily and in order to remain competitive in your field you must place a high priority on your web presence.

Firstly, for those of you not too familiar, a template is a pre-made layout, usually designed for specific themes, that has a set color scheme and outline. The basic look of the website will always remain the same, but the user can purchase this template and modify the information on it to directly represent their company. If the template is set up properly, the time and effort required to do this is very minimal compared to the amount of time it takes to design and implement a unique website. However, if the template has not been set up properly the time it could take to rectify this and obtain the desired result could be much, much longer and usually requires the help of a certified programmer.

To examine templates more closely, let us look at their advantages. Firstly, templates usually have a good basic design and layout, making them very user friendly. Second, they are very cost effective and will save you a lot of time. Third, the person who designed the template usually has quite a bit of experience and a good idea of what colors to use and how simple to keep the site to make navigating easier. Fourth, the designs are usually relatively the same on each page making your website more consistent and less confusing to the user. Fifth, updating your website is fairly quick and straightforward. Finally, most templates have a section that is un-editable, making it impossible to destroy or change the basic design, which can be a big plus for those of you that are less experienced with web design basics.

On the other hand, there are many disadvantages to using a web template. First and foremost, it is not original. Because it is readily available to purchase on the net, you can assume that if it is a design that appeals to you, it appeals to many others as well, and has probably already been purchased and is being used by many companies worldwide. This tends to happen a lot, if you have ever noticed; while browsing through the web, you come across many companies of the same genre that have almost the exact same layout. I noticed this recently while browsing through some online florists. So many of them looked exactly the same making it rather repetitive and boring, on top of which, the user will no longer be able to remember which site is yours. Yes, it looks nice, but with all the competition on the web today, the idea is to stand out, not to blend in. Therefore, originality is a must. Second, many of the templates available were created before all of the information was out on how to maximize your website and how the search engines worked, therefore many are database driven, and therefore are not recognized by search engines, which means that although your site may look nice, no one will be able to find it.

Third, many templates are very rigid in that they have many sections that you cannot edit, making the modifications very frustrating. If you have a text box that has a predetermined size and your text does not fit within that area, you are at a loss. Also, if there are specific details that you do not particularly like in the template, you are often stuck with them and unable to modify them. Fourth, you are on your own. Working with a template means that once you purchase the template, it is up to you to decipher how to edit and/or add information to it. You don’t have the advantage of being able to call your developer and ask him/her any questions or for some help if you get stuck. Lastly, unless a template has been created with the last few years at most, it is often outdated and will not be optimized for today’s internet market in order to make your web presence noticeable.

In conclusion, it is really up to you, as the owner, to decide which route you want to take. If you want to browse through some online templates to get some ideas of what you would like in your website, they are very helpful, but in terms of actually creating your website, you will realize that if you go with a reputable company that has a knowledgeable staff who is constantly updating themselves on the latest internet trends, that your website will generate a lot more interest and present a much more defined and sophisticated image. Since the internet is becoming, more and more, the place where businesses are looking to find new clients and/or sell their products, it should be looked at the way you examine your office and/or store. How much money is spent every day on businesses redoing their offices, renovating their stores, buying new furniture, décor, etc..? If this type of money was being invested into presenting a better online image, the margin of profit in regards to money being spent / earned would increase exponentially. It is your decision, but if it was up to me, and I had the choice to design a store that would look identical to my competition but cost me very little, or spend the money to create my own, unique look and appeal, I would go for the latter. You want your company to stand out and create an image of its own, one that can be remembered, and to do this, you need to go with the experience of a qualified web design company.

CSS Validation and HTML

HTML validation and CSS validation are controversial issues with some people. This article discusses some of the issues that have come increasingly to the fore in web development. The article will also provide a practical method that overworked webmasters can use to improve their website.

What does Validating HTML or CSS Mean? For those who are unfamiliar with what validating a web page means, it basically refers to using a program or an online service to check that the web page that you created is free of errors. In particular, an HTML validator checks to make sure the HTML code on the web page complies with the standards set by the W3 Consortium (the organisation that issues the HTML standards). There are various types of validators - some check only for errors; others also make suggestions about your code, telling you when a certain way of writing things might lead to unexpected results. A CSS validator checks your Cascading Style Sheets in the same manner; basically, most will check them to make sure that they comply with the CSS standards set by the W3 Consortium. There are a few which will also tell you which CSS features are supported by which browsers. Note that validating your web page does not ensure that it will appear as you want in various browsers. It merely ensures that your code is without HTML or CSS syntax errors. Ensuring that your code appears correctly in different browsers require cross browser testing.

Why Validate Your HTML Code?

1. It Helps Cross-Browser, Cross-Platform and Future Compatibility Although you may be able to create a web page that appears to work on your favourite browser (whatever that may be), your page may contain HTML errors (or CSS errors) that do not show up with that browser due to an existing quirk or bug. Another person using a different browser that does not share that particular bug will wind up viewing a page that does not show up correctly. It is also possible that later versions of your browser will fix that bug, and your page will be broken when people use the latest incarnation of the browser.

2. Search Engine Visibility When there are errors in a web page, browsers typically try to compensate in different ways. Hence some browsers may ignore the broken elements while others make assumptions about what the web designer was trying to achieve. The problem is that when search engines obtain your page and try to parse them for keywords, they will also have to make certain decisions about what to do with the errors. Like browsers, different search engines will probably make different decisions about those errors in the page, resulting in certain parts of your web page not being indexed. The safest way, it is held, is to make sure that your web page validates error-free.

3. Professionalism Even if you test your web site with all the various browsers in existence on all the platforms in use (Mac, Linux, Windows, FreeBSD, etc) and find that it works perfectly in all, errors in your site reflect poorly on your skill as a web developer. The issue is two-fold: firstly, a poorly coded web page reveals that either the web designer does not know his stuff or is a sloppy worker; secondly, it affects his marketability.

The Importance of E-Commerce Web Design and CSS

Today’s technology is strengthening at a tremendous speed; the internet has become a vital resource for the majority of the population and counting. More and more people are exponentially learning to use the internet on a daily basis. The internet is a BOOMING industry as you may know.

The majority of all users out there are on some type either a desktop or a laptop computer and this has usually been the case. So designing “to fit” was never really a large issue for web developers until recently more and more users are purchasing and services there internet capable handhelds, cell phones, tablets of all shapes and sizes. The most flexible type of layout that can fit across the majority of these platforms is what is called a liquid layout. It’s a mix of html, PHP/ASP or any flavor code but most importantly CSS. CSS, short for Cascading Style Sheets, a new feature being added to HTML that gives both Web design developers and users more control over how pages are displayed. With CSS, designers and users can create style sheets that define how different elements, such as headers and links, appear.

These Style Sheets can then be applied to any Web page. This is a dynamic way to centralize the looks or style of any web site. This can also be applied when using different screen size. With your flavor of code added with CSS you can have the server displays the page to auto-detect which type of browser and or machine the viewer is looking at your site on, therefore it can auto-fit to the best perspective and layout, thus actually delivering your site to all users out there no matter what screen size or ratio they are viewing your site on. This a huge factor when developing one’s site and almost always goes overlooked when choosing a developer or firm to create your companies web site.

Now, if you do not plan ahead in the development stages you can lose a large percentage of viewers coming to your site. It’s one thing getting your traffic there, and to have a snazzy or flashy web design but allowing 100% of the viewers to actually see your site is a point this is far too often overlooked.

Why you should convert to CSS

Introduction

What is CSS? - I hear some of you ask. Well, CSS stands for Cascading Style Sheets and they have been around since the early 1990's believe it or not.

The Wikipedia definition (changed so that it makes sense!) is as follows:

CSS (Cascading Style Sheets) is a language that describes the presentationform of a structured document.An XML or a HTML based document does not have a set style, but it consists of structured text without style information. How the document will look when printedon paper and viewed in a browser or maybe a cellphone is determined by a style sheet. A good way of making a document look consistent and easy to update is by using CSS, which Wikipedia is a good example of.

So, why should we use CSS?

There are many benefits of utilising CSS on your web pages. Before you skip to the disadvantages, I can tell you now that the advantages easily outweigh the bad points. Below is a short, descriptive list of reasons to make the change:

Save on bandwidth

The more HTML code you use, the large the file size of the page. It doesn't take a genius to work that one out - so the most obvious solution is to cut down on the amount of HTML (something that Yahoo! might want to consider sometime, probably saving them ยฃ100,000's). CSS will certainly help to cut down on the amount of code you use, for example, replacing all of your tags (which are now obsolete by the way) with simple style declarations.

In reducing your file size, you will in turn reduce the amount of bandwidth your website consumes each month, hopefully saving you money. Typically, a heavy HTML coded website can measure up to 80KB's in size (without taking images or other media into consideration) - using CSS can cut down the file size by approximately 30-40% - a potentially massive saving if your website is popular. To find out how much bandwidth you would save, check out this bandwidth calculator, provided by CJ Website Hosting.

Cleaner, clearer looking code

Usually, CSS code is written in an external style sheet - you can however, use inline styles. Because of this, not only will your page load faster because a) external files are cached by most browsers and b) a stylesheet loads in unison with your web page - it also makes for much cleaner, clearer code.

Still not convinced? Take the example below as hard evidence:

This code is written without CSS:

Welcome to my website

My website is entirely written using HTML, nothing else.

You can achieve exactly the same result using the following CSS...

body{font-family:verdana,arial,helvetica;font-size:100%;}h3{font: bold 140% verdana;color:#C71585;}#content{color: #00FFFF;}

...and the following (tiny piece of) HTML code:

Welcome to my website

My website is written using the latest in web technology!

Much nicer, I'm sure you'll agree.

Easy to update = less time consuming = cheaper to maintain!

If you use an external CSS file (which I advise you to do), simply changing the style declarations in this one file will allow you to change the appearance of your entire website. For instance, in the example above, you could quite easily instruct the browser to render the heading tag to the right of the page or you could make the content wrap at 100 pixels - all by changing the CSS. Don't get me started on what you can achieve with bulleted lists!

Accessible pages and DDA compliance

Visitors who are blind or visually impaired will prefer a CSS designed website far more than one not using CSS.

This is due to the fact that CSS follows web standards endorsed by the World Wide Web Consortium. Because of this, special web browsers (such as text only browsers which read the content out-loud to the visitor) can interpret the content on the page.

CSS will help make your website DDA compliant. The DDA is the Disabilities Discrimination Act, the Act makes it "unlawful for a service provider to discriminate against a disabled person by refusing to provide any service which it provides to members of the public", specifically mentioning websites.

Another benefit of using CSS is variable font sizes. CSS will allow you to specify a font size as a percentage, doing so will allow visitors with poor eye sight to enlarge the text size. Tip: Try increasing the font size of a page by holding down ctrl and scrolling the wheel of your mouse (if it has one). You will notice that most websites do not allow you to increase the font size (unless you are using the Firefox browser which forces it) because they use pixel measurements. And those that work but use tags (such as Google) are actually breaking the accessibility guidelines.

Generally, websites designed in css are accessible on all sorts of devices including mobile phones and PDAs. The majority of hand held devices will simply ignore the CSS, leaving behind a readable (but bland) web site behind. A table design however is likely to render too wide for the viewable region.

Increase your popularity in SERPS!

Sorry, there I go again with the acronyms. SERPS stands for Search Engine Result Pages - the set of links returned by a search engine in response to a user query.

I can imagine that some of you are thinking "pull the other one! How can using CSS make my website rank higher in Google or MSN!" - well, extensive use of tables and obsolete tags can confuse search engine spiders which crawl your website for content. Some can even confuse code with content, although the major search engines seem to be very good at stripping out every possible HTML tag or JavaScript snippet - but it takes up valuable processing power that they would rather spend elsewhere.

It doesn't take a genius to work out that, like humans, the search engine will start reading from the top of your web page and just like humans they want to find out how relevant this page is as soon as possible - so cutting down the amount of code will make it easier for the robot to find the relevant text. Research suggests that you will also score "brownie points" with search engines for having standards compliant code that can be rendered across all mediums.

Tip: A combination of well written HTML code, fully utilised CSS and unique, well referenced content is the key to a higher search engine ranking.

Disadvantages of using CSS

As previously mentioned, there arn't any real disadvantages of using CSS - the pros far outweigh the cons. To put it another way, CSS 'div based' design versus table based design is a bit like comparing Liverpool Football Club to Gresley Rovers. There's only ever going to be one winner and everybody knows it.

So on to the only disadvantage I can think of...

Old browser issues

Old browsers, such as the early versions of Netscape and Internet Explorer. may have a hard time displaying CSS, especially as CSS-2 is now available to use and only the most recent browsers support it.

The solution? Download the latest browser! Which reminds me of potentially one more disadvantage; giving yourself a headache whilst attempting to get your website to look identical in Internet Explorer and Firefox - doh! Oh well, practise makes perfect.

In Conclusion

If you are interested in re-designing your website to use CSS, I would start by learning the basics. Find a simple CSS tutorial on the web and work your way through some more complex CSS examples. Then, have a go at doing your own!

4 Most Common Web Site Templates Mistakes

Using a web site template right out of the box is a very common mistake new web designer’s make. One of the cool things about the web is that it’s so visual. Using a web site design template can save any new web developer a lot of time and effort. But like any tool, you can get into trouble if you don’t pay attention.

Color combinations, layout, and graphics are the key design elements in any web site template. Each web site should be designed around the subject matter, ease of use, and accomplish any special goals or end result. A lot of new web site designers get lost in the visual effects, which can have negative effects on user friendliness and search engine optimization.

If you look at some of the most popular web sites, the common element is simplicity and ease of navigation. There are few dancing bears, flash intros, or exploding special effects. And almost everyone has text navigation for the most part. They may have some very well designed graphics, and a few design elements but keep it simple for the user.

User friendliness and easy navigation should adhere to the two-click rule. This is a simple rule that implies any user should be able to find what they want on any given web site in two clicks. With the short attention span and impatient attitude of most surfers, you need to give them what they want fast. You normally only have about 5 seconds to grab their attention.

I use templates a lot to save time and effort on a new design. Some I’ve developed myself, some I’ve bought that give me at least a 70% solution. They may have some graphics that go with my subject matter and/or some colors and layout that suit my purpose for the web site. But they also may be missing some key elements.

Most web site templates have great visual effects and good color combinations. But many lack several important elements for both users and our friends the search engines. Here’s a list of common mistakes I see all the time when a web designer uses a web site template.

1. Navigation – Menu issues
2. No Sitemap
3. Ignoring the fold position
4. No H1 or H2 designated headline and sub headlines

Graphic, pull down, popup or other methods of displaying menus can look good but sometimes confuse the user and are invisible to the search engine bots. These are two good reasons to use a text menu somewhere that show all necessary navigation links.

Sitemaps are important for the same reason as above. Both users and search engines can see a snapshot of everything on your web site and get to it quickly. This improves your chances to get indexed quickly and gives the user that two click ability.

The fold position is where the bottom of the monitor breaks off the view of the page. All important information should be displayed above that line if at all possible. Don’t make the user scroll if it’s not necessary. Any navigation, special links, attention getters, or critical information should always display above the fold line.

H1 and H2 designate important info to the search engine bot. A common good search engine optimization is to put your keywords in the first headline that the user sees. Of course the headline should also induce the reader to continue to read the web page.

It’s pretty easy to fix all these issues during the initial design stage. Even though I’ve created 100’s of web sites I still use a checklist. The devils in the details and everything you can do to make it easy for the user and the search engines, the more successful your web site will be.

A web site template can be a big time saver but you need to insure that the end result has all the necessary features both users and the search engines. Make your web site both user and search engine friendly by making these small changes or additions.

About Web Templates

WEB TEMPLATES

A web template is a tool used to separate content from presentation on the web design, and to the massive production of web documents. It runs in the context of a template system. Websites often require regular content updates, and standardization of appearance. A news website, for example, needs to be daily updated. Each news item will be contextualized by a standard presentation (page layout, structure, etc.). A typical strategy to automate this standardization is:

1. choose a web template system to maintain the website;
2. specify the "presentation standards" through web templates;
3. specify and update the content on a database.

WEB DESIGN

Web design is the design of web pages, websites and web applications using HTML, CSS, images, and other media. Web design is part of starting a website (web development) which can include web server configuration, writing web applications and server security.

A website is a collection of information about a particular topic or subject. Designing a website is defined as the arrangement and creation of web pages that in turn make up a website. A web page consists of information for which the website is developed. For example, a website might be compared to a book, where each page of the book is a web page.

A website typically consists of text and images. The first page of a website is known as the Home page or Index. Some websites use what is commonly called an Enter Page. Enter pages might include a welcome message, language/region selection, or disclaimer. Each web page within a website is an HTML file which has its own URL. After each web page is created, they are typically linked together using a navigation menu composed of hyperlinks.

Once a website is completed, it must be published or uploaded in order to be viewable to the public over the internet. This is done using an FTP client. Once published, the webmaster may use a variety of techniques to increase the traffic, or hits, that the website receives. This may include submitting the website to a search engine such as Google or Yahoo, exchanging links with other websites, creating affiliations with similar websites, etc.

A relatively new technique for creating websites called Remote Scripting has allowed more dynamic use of the web without the use of Flash or other specialized plug-ins. Leading the various techniques is Ajax, although other methods are still common, as Ajax is not a fully developed standard.

WEB PAGES

A web page or webpage is a resource of information that is suitable for the World Wide Web and can be accessed through a web browser. This information is usually in HTML or XHTML format, and may provide navigation to other web pages via hypertext links.

Web pages may be retrieved from a local computer or from a remote web server. The web server may restrict pages to a private network, e.g. a corporate intranet, or it may publish pages on the World Wide Web. Web pages are requested and served from web servers using Hypertext Transfer Protocol (HTTP).

Web pages may consist of files of static text within the web server's file system (static web pages), or the web server may read files of computer code that instruct it how to construct the (X)HTML for each web page when it is requested by a browser (dynamic web pages). Web page is the main type of (and a referential for) web document.

WEB TEMPLATES SYSTEM

A web template system is a kind of "View subsystem" in a Model-View-Controller (MVC or similar) design pattern, to separate presentation from content, on web document production. A web template system is characterized by:

1. Template engine: the software, it processes input, transforming into web document. It have two typical entities on input:

a) Web template: a recipe with web document fragments, to transform content into web documents.

b) Content resource: a input supplier, like a SQL database or a XML file.

2. Template language standards: the language of the recipe.

Websites often require regular content updates, and standardization of appearance. A news website, for example, needs to be daily updated. Each news item will be contextualized by a standard presentation (page layout, structure, etc.). A typical strategy to automate this standardization is:

1. choose a web template system to maintain the website;
2. group news items into sets, with different presentation needs;
3. specify the "presentation standards" through web templates, for each set of news;
4. specify a content resource to generate or update the content of each news item.

The idea behind the "template method" is to separate content (data) from presentation (data representation), and to separate business-logic from presentation-logic. It have many advantages in using:

1. Ease of design change
2. Ease of interface localization
3. Possibility to work separately on design and code by different people at one and the same time
4. Etc.

PAGE LAYOUT

Page layout is the part of graphic design that deals in the arrangement and style treatment of elements (content) on a page. Beginning from early illuminated pages in hand-copied books of the Middle Ages and proceeding down to intricate modern magazine and catalog layouts, proper page design has long been a consideration in printed material. With print media, elements usually consist of type (text), images (pictures), and occasionally place-holder graphics for elements that are not printed with ink such as die/laser cutting, foil stamping or blind embossing.

Since the advent of personal computing, page layout skills have expanded to electronic media as well as print media. The electronic page is better known as a (GUI) graphical user interface. Page layout for interactive media overlaps with (and is often called) interface design. This usually includes GUI elements and multimedia in addition to text and still images. Interactivity takes page layout skills from planning attraction and eye flow to the next level of planning user experience in collaboration with software engineers and creative directors.

A page layout can be designed in a rough paper and pencil sketch before producing, or produced during the design process to the final form. Both design and production can be achieved using hand tools or page layout software. Producing the most popular electronic page (the web page) may require knowledge of markup languages along with WYSIWYG editors to compensate for incompatibility between platforms. Special considerations must be made for how the layout of an HTML page will change (reflow) when resized by the end-user. cascading style sheets are often required to keep the page layout consistent between web browsers.

Website Template Design: Identifying the Target Market

With any type of marketing and advertising, identifying and developing an understanding of the target market is the most important step. These people are same as the people targeted through traditional media, the only difference is they are a little more computer literate and can be anywhere in the world.

You can also make use of an interactive tool by asking your audience to give you feedback. If you can analyze that information well, it will help you further define your On Line market. Proper identification of the target market makes it easy for you to plan effective marketing activity and also helps you develop a winning sales message. By knowing the specific concerns of your market, you can tailor your message to focus on solutions to those concerns.

Setting up your Web site also depends upon your target market. Besides your basic design requirements such as fast loading images and easy navigation, you must consider how to get your visitors attention, convince them to explore your site, and make a purchase or get them to willingly give you their e-mail address.

While writing your headlines and Web copy, always keep in mind the types of people that will be visiting your site. Always consider their demographics such as accessibility, age, income level etc. Choosing interactive software and free content will benefit your visitors and allow you to follow up and make more sales.

Two directions define the challenge of choosing the best target markets. First, your target market should be narrow enough, as it allows efficient marketing. At the same time, the target market should be large enough to have ample sales potential to support the company. Identifying one or two characteristics that most customers have in common defines a company's target market.

Segmenting Markets

There are many ways to segment a market. Identifying which niche makes up a target market is difficult. Major problem is that some niches are more valuable than others and contribute more to the bottom line.

Ranking group of customers by the amount purchased, the frequency of purchasing, and how recent the order was can identify segmentation. When this type of analysis is performed, it is called recency, frequency, and monetary (RFM) analysis. The result of this analysis will help you identify who are the good customers and who have been ranked badly.

Other ways to segment a market are geography, lifestyle patterns and demographics. By correlating these indicators you will come to know the buying patterns of your customers, but they don't actually explain why customers buy.

The more your target market is narrower you can focus your marketing communications on specific customer needs. This helps in increasing the confidence of potential customers - that the company understands their needs; this confidence in turn leads to a closer relationship and increased loyalty. Loyal customers are more profitable than new customers. Narrowing the niches served increases revenue and profits.