How to customize web templates on your own to create websites
that work
Web
design is time consuming and for non technical people, it
can be a nightmare. However, if you can modify from a website
template, you can build a professional web site even though
you do not know how to use HTML, CSS or other web design techniques.
This article reveals how to edit website templates for building
a professional website without much hassle.
Web templates are raw materials that need to be refurnished/edited
to be published online. Editing web-templates could include
content insertion, graphic insertion/modification, inserting
company logo, changing styles, changing links, changing flash
images etc. Editing is quite easy but in case you feel otherwise
you can always make use of template customization services
that most template providers offer at affordable costs. Some
template providers offer affordable customization services
irrespective of where you actually purchased the template
from. This article discusses the techniques that you can use
to edit your web templates effectively to create unique looking
websites.
Editing website templates effectively
For editing web templates all you would require is an html
editor like Dreamweaver, Photoshop, FrontPage or Go-live.
Most of these html editors are WYSIWYG (what you see is what
you get) kind and have a user friendly interface. You can
do two types of editing to your web-templates. One is content
editing and the other is graphics editing.
1.) Editing the content of your web templates
The template provider would have supplied you with an 'index.html'
file along with your template. This is the file that you would
require
for editing content of your templates. You can edit content
using a
text editor or an html editor software program.
Editing using text editors
Editing using text editors is the best possible way to edit
your
templates. This will ensure that your html coding remains
clean and no
unnecessary junk code is added. But of course you need to
be some what
conversant with Html to hand code your templates. Notepad
is probably
the most well-known of all text editors. Other than Notepad
some other
good and advanced text editors are editpad (editpadpro.com),
NoteTab
Light (notetab.com), and arachnophilia
(arachnoid.com/arachnophilia/index.html).
Editing using Html editors
Making use of an html editor is probably the easiest way
of editing
templates and would be useful to those who are not conversant
with
html. Most html editors are user friendly and have an easy-to-use
interface. Some well known html web template editors are Dreamweaver,
FrontPage and Go-live. To edit content of the template, all
that you
would need to do is load the index.html file in an editor.
After that
you can simply cut and paste your content where the dummy
content is
provided and you are done. Adding content would also include
changing
links, adding content to tags and changing image sources if
required.
Handy tips for content editing
1.) Make sure to change the title of all pages. The title
can be a
keyword or words that are most repeated in your content. It
can also
be a description of your webpage. For instance you can use
'Florida
tourism' as the title for a webpage related to tourism in
Florida.
2.) Change alt text of images and keep the alter text as a
keyword.
Search engines don't read images but they do ready the Alt
texts. For
instance you can use the tag 'Florida beach' for a Florida
beach
image.
3.) Make sure to add proper anchor text to all your links.
Anchor
texts are given special importance in search engines.
4.) Give proper headings to all your pages. Heading can contain
specific keywords. Headings are given using 'h1, h2, h3 ...
h6' tags.
Text with-in heading tags are given more value by search bots.
5.) Be sure to check for spelling mistakes, grammatical errors,
broken
links and misspellings before loading the site
7.) Provide contact information.
2.) Editing images and graphics
Editing images would involve changing image colors, add/remove
image
layers, add/change text used in images etc. In order to make
changes
to the images used in the web template you would need to use
the PSD
file. Almost all template providers would supply you with
a PSD file
(although some may charge you extra for the file). PSD file
is
basically a layered file that is created using Adobe PhotoShop.
This
file is compatible with many graphic editing programs. Some
good
programs that can be used to edit PSD files are Jasc Paint
Shop Pro 7,
Ulead PhotoImpact 7 & 8, ImageReady and of course Photoshop.
For more
information on PSD files you can visit adobe.com.
In case you don't have access to any of the above mentioned
software
programs for editing the templates, you may request your web
template
provider to give you BMP files instead of PSD files. A BMP
file is a
high quality bitmap image file that can be edited using any
image
editing software program.
Handy tips
1.) Change the color of images to suite and enhance your
text
visibility
2.) If needed you can also replace images used in the templates
to add
your own professional images. (One good website from where
you can get
professional images is 'gettyimages.com')
3.) Editing the styles of a template
CSS style sheets are the ones that allow you to make changes
to the
style of the webpage like changing font color, line and paragraph
spacing, font size, link color etc. Style sheets are useful
as they
allow you to make changes to many WebPages by altering one
document.
CSS can be edited using any Html editor or text editor. Although
there
are some specialized programs available that are meant specifically
for editing CSS Stylesheets like 'TopStyle' (bradsoft.com).
There are many web template providers who offer internal
style sheets
or multiple font styles. It is difficult to edit internal
style sheets
and therefore is not recommended. Always make sure to go for
template
providers who offer you with external CSS Style Sheets.
Handy tips
1.) Make sure to use contrasting text and background colors
2.) Make sure to use same font type through out a webpage.
Making use
of different font types can make reading difficult. Arial
and veranda
are best suited for online reading.
3.) Never use justification for your text as it can make reading
difficult.
4.) Provide a site map
Quality tutorials to help you with HTML
If you are not familiar with html/CSS and need some start
up lessons
then there are plenty of free resources available over the
internet
that will allow you to do just that. Some of the best ones
are 'w3cschools.com' and 'webmonkey.com'. W3cschools offers
the best
tutorials for html where as webmonkey offers the best tutorial
for CSS
Style-sheets (just type 'Mulder's Stylesheets Tutorial' in
a search
engine like google or yahoo! to reach directly to the tutorial
page).
For getting knowledge about web usability you can refer
to 'http://www.usability.gov/guidelines'. For researching
keywords for
your website content you can refer wordtracker.com or overtune.com.
There are also many sites that give step by step instructions
on how
to edit templates. One good site worth visiting in this regard
is 'template-help.com'.
Author Description
http://www.icongalore.com is a quality web portal that offers
high quality professional XP icons. Their XP icons come at
extremely affordable prices and can be used for web designing,
software applications and print media.
<More
Money Making Tips and Other Articles>
|