Top Web Hosting Reviews
Top Web Hosting Provider of The Month:
Top Web Hosting
Visit Bluehost.com | Read Bluehost Review

>> Web Hosting Geeks // Web Hosting Articles // Web Design  


Creating a Basic Web Design Template








A "template" is simply a design format which you can apply to all (or most) of the pages in your web site. The first advantage of using a "template" system is that it allows you to make your most important design decisions at the beginning, and then just focus on content. The second advantage is that it allows you to quickly create new pages based on your standard design.

The disadvantage is that many template-based websites look homogenized and seem to lack a unique character. Designers who sell templates tend to use the same formats over and over again, insert the same generic images, and use the same techniques.

Just as important, templates are often not ready-to-go right out of the box. They almost always need modification, and often modifying a professionally prepared template is difficult because the designer will have used techniques you may not fully understand or are specific to the tools he or she used to create it.

So it is preferable not to think of a web template as the kind of thing you buy from an online template store. Rather just think of it as a basic page format that can be used over and over again. The best template is therefore one that uses "standard" techniques that can be modified without the use of specialized tools or programs (like Front Page or Dreamweaver).

Creating a Basic Template

If you are not familiar with web design, try working with a "bare bones" template to begin with. There are two ways you can go. You can work with basic html and tables, or you can create your basic template with CSS. Since CSS is rapidly becoming the new standard, it is probably better to begin with CSS -- especially if you have not yet become used to constructing web pages with tables.

CSS stands for "Cascading Style Sheets", but at the beginning it is not important to understand what that means. What is important is to understand that CSS allows you to create a set of formatting parameters in a "style sheet" (a seperate file) which you then can very easily apply to your individual pages. In other words, you seperate the "style" from the "content".

A simple style sheet can contain just three or four design elements. Here is an example which you are free to copy (right click and "Save target as" to a location on your hard drive, then change its name to "sample-1.css".)

Style Sheet Sample (be sure to change its name to "sample-1.css").

This template contains a definition for the body text, a header component (with a background image), a "navbar", and a definition for two headline styles, h1 and h2.

Now that you have a style sheet you can begin building your web site by creating a basic home page. Here is an example which embeds the style sheet referred to in the previous paragraph. You can get the html code by just opening the page in a browser window, looking at the "Source" code, and saving the resulting file on your hard drive as, for instance, "sample-1.html".

Now you should have two files in the same location on your hard drive -- "sample-1.css" and "sample-1.html". You can get the image file by just right clicking on the image in the sample page and saving it to the same location on your hard drive.

Your second step will be to create the pages referenced in the "navbar", so make sure you think of names for these pages before proceeding (e.g., howitworks.html, products.html, about.html, sitemap.html, contact.html). Then build your hyperlinks into the navbar. (Look at the code of the sample file to see how it is done.)

Once you have your basic home page with links, this then becomes your template. Just save it as "howitworks.html", "products.html", etc., and make the changes to the specific pages.

The result (once you upload it all to your host server) will be a basic, functional website containing a number of properly interlinked pages. It will also be search engine friendly because the design is not cluttered with scripts, and the most important elements are clearly laid out at the top of the page.

For more web design tips and techniques see the Linknet Marketing Resource Library.

Rick Hendershot is a marketing consultant, writer, and internet publisher who lives in Conestogo, Ontario, Canada. He publishes several websites and blogs, including The Linknet Network of Websites. This network provides an inexpensive way to advertise your website, and get as many as 100 low cost links.


MORE RESOURCES:

Blue Archer Expands Nonprofit Web Design Services With New Constituent ...
Reuters
4 /PRNewswire/ -- Blue Archer, a web design and marketing firm located in Shadyside, recently debuted inTouch, a web-based constituent management program ...

and more »


aedesigns.net Launches Free Web Design and Development Tool
PR.com (press release)
New Orleans, LA, November 07, 2009 --(PR.com)-- “With the introduction of our new Free Web Design and Development Tool we are able to give our clients easy ...



Homeless Vet Needs Web Design Job
Nextgov
Gonzalez told me he needed a job, and had some experience in Web design through a past internship with Oracle. So, if you want to help and have a Web design ...



PR-Inside.com (Pressemitteilung)

Good Web Design Involves Understanding Of Seo
OfficialWire (press release)
Good web design involves more than an understanding of good aesthetics. Get a web developer that also knows SEO by Lawrence Perry While many companies think ...
The Growing Trend of Hiring Dedicated SEO Services from IndiaPR-Inside.com (Pressemitteilung)
How to Communicate With Your Search Engine Optimization ExpertOnline PR News (press release)
How to rank you website with the help of expert SEO UK ServicesPrfire (press release)
Prfire (press release)
all 80 news articles »


Web Design Company in Tamilnadu, Software Company in Tamilnadu
BigNews.biz (press release)
Sharon technology is one of the Best Web Design Company to outsource your web designing needs in India. Our web designers specialize in fresh clean web ...



Web Design and Advertising
Sparxoo (blog)
In the first part of our interview with Deirdre Zahl, Sparxoo's Senior Designer, we outlined the basics of web design. ...

and more »


Team Leader Web Design
Bizcommunity.com
Achievement Awards Group, based in Westlake Business Park requires an innovative individual with the ability to lead the creative direction of the web team. ...



AEdesigns.net Launches Free Web Design and Development Tool
Your-Story.org (press release)
New Orleans, Louisiana ( Your-Story ) November 5, 2009 – “With the introduction of our new Free Web Design and Development Tool we are able to give our ...

and more »


PR-Inside.com (Pressemitteilung)

Web Design Ireland, Web Hosting, SEO Marketing with Hosting & Web Solutions
PR-Inside.com (Pressemitteilung)
Web Design Ireland, Web Hosting, SEO Marketing with Hosting & Web Solutions. We have noted that most website/seo companies out there do not stick by their ...



PR-Inside.com (Pressemitteilung)

Pod1 web design furnishes Romo fabrics with a luxury new web presence
PR-Inside.com (Pressemitteilung)
Deborah Richmond, account director at Pod1 Web Design Company in London, said: “We are really happy to be working with Romo, this is a brand that is unique ...

and more »

Google News





 
 
 

© 2004 - 2008 "Web Hosting Geeks" | Web Hosting Reviews | Customer Reviews | RealMetrics Reviews | Hosting Articles | Directory | Partners | Contacts
Over 7000 articles: web hosting, web development, domain names, ecommerce, web design, site promotion, ppc advertising, seo, site promotion and many others.
Web hosting reviews, ratings and awards are not based on any incentives or commissions. Names and trademarks are the properties of their respective owners.
A direct link to Web Hosting Geeks (http://webhostinggeeks.com) must be provided in order to use any of the above information. Contact us for more info.

Partners: Hosts by speed, Cheap Website Hosting, Free Website Hosting, Cheap Web Hosting, Top 10 Web Hosts, Top 10 Web Hosting Deals, Best Website Hosting, Free Web Hosting, Free Web Hosting, Dedicated Server Hosting, Adult Web Hosting, Web Hosting Discussions, Dedicated Server Reviews, Best Web Hosting, Web Hosting Discounts, HostProfessor.com, rsuog, halyava, PHP Website Hosting Services, Web Hosting Reviews, Hosting Uptime, Best Web Hosting Reviews, Cheap Webhosting, Web Hosting, Flash Templates, CMS Templates, Web Hosting Reviews, Website Hosting Reviews, Web Hosting Providers, Best Web Hosting, Top Web Hosting, RSUOG Web Hosting