This article is designed for the person in a new band who has been given the labour intensive job of running the band's website! Website promotion is a big subject with many contradictions that take time to discuss, so I'm just going to concentrate on how to layout the opening page (index.html) in a way that will maximize your success rate.
Top tip: write simple clean code. Scrappy code may increase the webpage's loading time to beyond what is acceptable, or render the webpage unusable, with clean code you almost don't have to worry about browser compatibility. Don't forget, we don't all use the same browser and have the same screen resolution. Clean, validated code may increase your music sales by as much as 25% without having to change the look of your website or spend money on promotion.
HTML AND HEADER LAYOUT
<DOCTYPE> *important* this is what it looks like -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Every HTML page should have the document type declaration so browsers like: MSIE v.5-6, Mac v.5, Mozilla, Konqueror and html validators like: http://validator.w3.org/ know what they are looking at.
<HTML> and <HEAD> *important* this is what they look like -
These are the opening tags for HTML and HEAD. Between the HTML tags are the entire contents of the page. The HTML tag will close at the end of the document. The HEAD tag contains the META information used by browsers and search engines.
<TITLE> *important* this is what it looks like -
<title>YourBandName indie rock band TownName</title>
Keep the title meta tag very short, around 5-8 words (40 characters including spaces). Put your band's name first. Most search engines use the title not the keywords.
<DESCRIPTION> *important* this is what it looks like -
<meta name="description" content="YourBandName an indie rock band in TownName supporting AnotherBandName.">
Basically you need a readable short sentence without punctuation of no more than 20 words (150 characters including spaces) that starts with YourBandName and ends in a full stop.
<KEYWORDS> * not so important* this is what it looks like -
<meta name="keywords" content="YourBandName, AnotherBandName, band, indie, rock, TownName">
Actually the keyword meta tag almost lost its total effectiveness ages ago due to people spamming it! Include it anyway though as the odd search engine and directory still use it. Only include the most frequently used keywords contained within the webpage.
<CONTENT-TYPE> *important* this is what it looks like -
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
The content-type meta tag tells the search engine and browser that the document should be rendered as plain text and interpreted as HTML. It also contains character encoding information (in this case ISO-8859-1), which is very important for how the webpage is interpreted and displayed by the browser.
<CSS> *important* this is what it looks like -
<link rel="stylesheet" type="text/css" media="screen" href="scripts/style.css">
I've found that search engines like Cascading Style Sheets (CSS). They also help with the clean, simple and consistent coding of the website, and will ultimately reduce the time it takes to make any future style changes. Need some help? Try: http://www.w3.org/Style/CSS/
<SCRIPT> *important* this is what it looks like -
Put your script code into an external file (note: the .css and .js files have been put into a directory called scripts). This will cut down on the amount of code within the header tags and speed up the parsing of the webpage.
<SHORTCUT ICON> *fun/promotion* this is what it looks like -
<link rel="SHORTCUT ICON" href="http://www.YourBandName.com/favicon.ico">
The best link in the world to your website is from the fan's favorites. Remind the fan to add you to their list, although it's best when they want to add you to their favorites because they like your website! You can make your site stand out from the crowd by inserting an icon into their favorites list. Here's how:
Create an image/logo 16x16 pixels and 16 colours in a drawing package.
Save the image as favicon.gif (the file extension is up to you at this point) The image must end up as favicon.ico. Get IrfanView (www.irfanview.com - it's free!) to make the conversion as you can't just rename the file.
Convert 'favicon.gif' by using 'Save As' 'favicon.ico' (in IrfanView).
FTP the favicon.ico file to the same top level folder as index.html.
Fun, with a few rewards.
</HEAD> tag closed -
That's the end of the header information.
page 1/3,continued