From the category archives:

General

Clean Page Structure: Headings and Lists.

by Jeff on November 14, 2005

When HTML started, people put all sorts of things on their pages: there was a tag to say which font you wanted your text to be in, a tag to say you wanted it to be in the centre of the page, and so on. Now, though, that way of writing pages is out-of-date and very inefficient compared to keeping content and style separate using CSS.

What is CSS?

CSS stands for Cascading Style Sheets it is basically a way of saying once what you want your pages to look like, instead of having to repeat it in HTML all the way through the document. In old style HTML, for example, this kind of code was a relatively common sight:

Welcome to my website!
I hope you enjoy your visit.

Now, though, you can remove the font tags altogether, and just have this:

Welcome to my website!
I hope you enjoy your visit.

At the top of your website, you put a style tag, like this:

p { font-family: Arial, }

Now, instead of having to say again which font you’re using with every new paragraph, you’ve told the browser that you want every paragraph you’ve got to be in Arial.

Headings and Lists.

Thanks to CSS, you can make documents that are more ’semantically correct’ that is, they would make sense to a human reading them, instead of having to be weighed down with lots of extra presentation code. This has two great effects: it makes web pages smaller (and so faster to download), and it makes them simpler.

On a modern web page, the only things you should ever need to include apart from paragraphs of text are headings and lists. After all, web pages are just text, graphics and navigation put together in a particular order there’s no reason for things to be done as messily as they often are.

You use headings for the title and subtitles of your page they’re the HTML tags that begin with h. You might, for example, write website titlearticle title.

Lists, on the other hand, can be used for pretty much anything else that isn’t paragraphs of text. Instead of just putting links one after the other to make a navigation bar, for example, you should put them in a list, using the ul and li tags. Not only is this easier for you to read and add to, but it’s also more compatible with non-graphical browsers.

A typical list looks like this:

item 1item 2

Bold, Italic, and Images.

Of course, in practice, you’ll need a few more tags. CSS lacks any good way of making individual words bold or italicised, so you can still use your b and i tags. Images, of course, still need a tag of their own too, although you might consider putting your images in a list if you have more than one.

In theory, at least, that still means that it should be perfectly possible to create a clean looking web page using only six tags: h, ul, li, b, i and img. And, yes, it is very possible if you can stick to this attitude towards web pages, your page will be extremely clean, quick to download and fast to display. If you’ve ever sat and waited more than a few seconds for a page to load, you’ll know how important this is.

Custom Stylesheets.

One more advantage of this approach is that it lets your users view your website however they want to. There are a surprising number of users out there who are elderly or just want some consistency on the web, and they have their own CSS stylesheets to add to pages to make text bigger, for example, or make the layout simpler.

Once you’ve written your page cleanly, you can even offer visitors a choice of stylesheets yourself you can write more than one and then offer an option to switch between them. This makes redesigning your page much easier, if you ever need to, since you can simply swap one set of CSS for another and even leave the old one available for any visitors that prefer it.

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }

Building Online Communities.

by Jeff on November 14, 2005

When you’re thinking of starting a website, you have a few problems. Where will you get content from? How do you keep visitors coming back? When you make your website an online community, though, you can solve all these problems at a stroke.

The Advantages of Communities.

On a community website, people come there mainly to communicate with the other visitors your role is to set up the software that makes this possible, handling the technical side of things. Once your visitors make friends and find that people posting give them useful information (or just amusing writing), they will keep coming back, day after day, often even making time for it when they really ought to be doing something else. Even better, you don’t have to pay anyone to produce content, because the members of your community are producing more content for each other than you could ever hope to commission commercially. The only rewards they ask for are the replies they get from other members.

Altogether, this adds up to an attractive proposition. Even better is the fact that the owners of online communities tend to quickly acquire cult leader-like status thanks to their ability to make the final decision when it comes to deciding who can be part of the community and who can’t. Members don’t even slightly resent supporting them, and will donate over and over again to make the website better not only will they tolerate ads, but they’ll click on them more in an effort to support you. There are forums out there that run entirely on community contributions: the Something Awful community forums and Metafilter community weblog, for example, charge $10 and $5 respectively per membership, and yet both have tens of thousands of members.

What You Need for Your Community.

Of course, thousands of members don’t just appear overnight. To get people to start coming and writing in the hope of getting a response, you need to give them a reason to come to your website in the first place.

In many cases, your software will be what differentiates you. You’re likely to be competing with other, similar community websites, and providing better features than the next guy can drive a surprising number of visitors to your website. If you listen to and act on every request, you can’t do far wrong find out the visitors’ ideal features, and go out of your way to provide them, whatever they might be.

Another excellent way to build initial traffic to your site is to provide some data that’s rare or difficult to get elsewhere, or to organise data in a way that will be especially useful to a certain community. You could, for example, compile live stock price data in a way relevant to a certain business sector, or organise TV listings so that they show all the times a certain show can be seen, whatever channel it’s on. If you can find something unique, people will flock to it and love it.

Advertising a Community Website.

One thing to note about this kind of website is that they don’t respond well to traditional promotion few people will respond positively to an ad asking them to join a community. Why should they write for you when you’re obviously only in it for commercial gain? Instead, you should make sure your community relates to something you have a genuine interest in, and then promote it casually in other relevant communities. An ideal situation is one where the owner of an existing website doesn’t have the time for it any more, and you can move their community over to your site this kind of ‘evacuation’ can give your site a thriving community overnight.

Once you’ve got a community, of course, don’t underestimate how much promotion its members will do themselves: they will link it from everywhere they get a chance to put links, email things from it to friends, show it to people they know and get them to join the possibilities are endless. If you care for your community properly, it will pay you back many times over.

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }

Beware the Stock Photographer: Picking Your Pictures.

by Jeff on November 11, 2005

You can always tell the websites that want to be big, but aren’t. How? By the sheer number of stock photographs plastered all over the design. If you’ve ever been to a business’ website and seen one of those ubiquitous photos of a guy in a suit or a woman smiling and wearing a headset, you’ll know what I mean. Before you venture into the world of stock photography for yourself, there are a few things you need to know.

How Stock Photography Works.

Stock photography companies have libraries of photographs that they believe will be useful in graphic design. If you’re starting a site about tennis, for example, you’ll no doubt be able to find stock photos of tennis balls, tennis players, tennis courts, and so on all of which can be integrated into your design. The photographs broadly fall into three categories: landscapes (including landmarks), objects, and models (people posing in a particular way).

There are two types of stock photography: royalty-based, and royalty-free. In royalty-based stock photography, you pay a small fee each time you use an image a part of this fee will go to the company, part to the photographer, and often part to the model (if any). For the royalty-free version, you pay one flat up-front fee and get a license to re-use the image as many times as you want.

Unfortunately, when stock photography is used on the web, it pretty much has to be royalty-free: there’s just no way of tracking use in a way that would create a sensible royalty structure. This means that stock photography for the web is typically very expensive: you basically have to buy a permanent license for an image you only want to use once. This, in turn, forces people towards lower-end, cheaper stock photos, which is how we all end up with uninspiring pictures of some guy in a suit.

Is It Worth It?

In most cases, then, stock photography on the web simply isn’t worth it, at least when it comes from the established companies. You can pay absolutely hundreds of dollars and end up with images that aren’t exactly anything to write home about. If you’re a big corporation and you’re planning to use the same image for a year, then perhaps but even then it’s unlikely.

Look at it this way: not only are you going to end up paying an absolute premium to use relatively mediocre images on your site, but all your competitors will have easy access to the same ones too, and might even use them without noticing.

There are plenty of sites on the web devoted to tracking how often stock photos turn up in different contexts. Magazines regularly have to send ads back to advertisers because two ads have ended up using the same stock photo for wildly different products? Wouldn’t you be embarrassed to have some site circle that girl you put next to ‘friendly customer service’ and then present their visitors with the same picture playing all sorts of roles at other sites? I know I would be.

Cheaper Stock Photos.

Instead of jumping on the stock photo bandwagon, then, the much better alternative is this: do it yourself! In most cases, you can create stock photos that are just as good as, if not better than, the stock ones. Why pay $100 for a picture of a pencil when you have a digital camera and a pencil of your own?

If you don’t have access to the thing you want to photograph, though (you don’t own that object, or live near that place), then an excellent alternative is to go looking for appealing amateur photography. If you look around, you’ll find people with great photos who are willing to let you use them, often in exchange for nothing more than a credit and a link back.

Alternatively, you can use stock photography sites that aren’t big and ‘established’, but are more like groups of enthusiasts, doing it because they like to and charging minimal prices to get their work out there. Take a look at istockphoto.com, for example, where many photos are only $1.

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }

Avoiding the Nuts and Bolts: Content Management Software.

by Jeff on November 11, 2005

If all this talk of coding and designing scares you off, you might want to know that there is an alternative to all this. You can install a kind of software called a Content Management System (CMS) that allows you to put content up on the web without ever knowing a thing about HTML.

Fantastico.

Depending on your host, you might find that you already have a selection of CMSes available and ready to install from your cPanel. Log in, and take a look for the Fantastico script installer. If you have it, then you’ll be able to read a description of each piece of software you have available to you try out a few of the CMSes to see which ones you like.

Finding a CMS.

If you don’t have Fantastico on your host, or you don’t like what it offers you, don’t worry: there’s plenty of choice out there on the web when it comes to CMS software.

For finding free CMS software, a truly excellent resource is www.opensourcecms.com. At that site, you can use the menu at the side of the page to see lots of open source CMSes running before you commit to downloading them and installing them yourself. Textpattern, Drupal and Plone are very popular right now, so they’re a good place to start.

If you’re considering commercial CMSes as well, then you should take a look at www.cmsmatrix.org, which provides an up-to-date comparison of almost every CMS out there. Be prepared, though, that commercial CMSes can be ridiculously expensive or unnecessarily expensive.

Getting a Custom CMS Built.

If nothing out there seems to meet your needs, you might consider having a web designer build you a custom CMS in a scripting language like Perl or PHP. Any web designer worth their salt should have something basic already that they can build whatever features you want onto. This can be really good when it comes to making your website work the way you want, since the CMS will be built around your website to make it as easy as possible for you to modify.

Using a CMS.

The whole point of a CMS is to make it much easier to add content to your website and to edit the content that’s already there. Once you’ve installed your CMS, you will generally be able to log into its user system using a special admin password. This will add ‘edit’ options to the existing pages of the site, as well as giving you a ‘new page’ link somewhere to allow you to create a new page.

When it comes to actually writing the content of the pages, most CMSes will make it easy for you to copy and paste from programs like Word: they shouldn’t require any special HTML formatting. Some will require you to mark words with special symbols if you want them to be bold or italic, but it shouldn’t be too troublesome.

Changing the design with a CMS usually involves installing a template into a template folder and then selecting it in the options. Creating your own templates can be complicated, depending on what software you’re using, but it shouldn’t be any trouble for a web designer, and most template sites will provide designs in a format suitable for this kind of use

Finding a Hosted CMS.

Once you know which CMS you want, an alternative to installing it on a web host that doesn’t necessarily support it is to do a search and find a host that specifically supports your CMS. You shouldn’t have too much trouble finding a host somewhere that will support you if nothing else, you might try opensourcehost.com, which supports almost every open source CMS out there.

Using a host solution might be a little more expensive, but it will save you a lot of time in configuration and a lot of problems if anything goes wrong. Using a hosted CMS is one of the quickest ways to set up a website: you simply pay the host, log in, add your content and you’re away.

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }

All About Design: Principles and Elements.

by Jeff on November 7, 2005

A truly shocking number of web designers are unfamiliar with the basic principles and elements of design. Having never been through any formal design education, many just go with what they think ‘looks good’, with very mixed results. If you’re going to design a website, you’ll do much better if you have some idea of what you’re doing when it comes to graphic design. Here, then, is a crash course in the principles and elements most useful to web designers.

Balance.

It is important for things to be balanced. That doesn’t necessarily mean symmetry, making one side exactly the same as the other, but it does mean that you can’t make one side ’strong’ and not balance that on the other side. For example, if you use a dark colour, you should balance it with a larger area of a lighter colour. What balance allows you to do is to lead the viewer’s eye to certain parts of the page without making the page look ridiculous.

Emphasis.

If you want to make part of the page stand out from all the rest, you can give it emphasis using a variety of techniques. Grouping everything together and then moving one thing a significant distance away from them will make it a focal point, as will making it a different shape from the others, or a different colour.

Line.

The directions of your lines will give a mood to your design: as a rule, horizontal lines are calmer, vertical lines are moderately active, and jagged or diagonal lines are very active. If you were designing an austere financial news site, then, you’d use horizontal lines, while a fun site for kids would be full of lines going in all sorts of directions.

Shape.

One thing that lots of people don’t realise is that there are two kinds of shapes positive and negative and every design has both kinds of shapes. The positive ones are the ones you, the designer, actively placed on the page, while the negative shapes are the spaces created around the positive ones. Many web designers simply ignore this, leaving their negative shapes as a mess this leads to the ‘boxy’ look that many amateur pages have.

Colour.

Colour is a big subject. As soon as you add more than one colour to a page, you make the other colours look different. Some colours are complementary, and some just look terrible together. On the web, though, you should usually avoid using too many colours on one page even if they are complementary, it will look garish.

For the web, hue is more important: the best way to create a colour scheme is to use black, white, and various shades of one colour. You have to consider the brightness and intensity of your colours, to make sure you’re not overdoing things. One of the easiest mistakes to make is to use the built-in CSS colour words (background-color: red, for example) instead of creating colour codes the colour words should generally be avoided, because they’re just too intense.

Space.

You can create all sorts of illusions with the amount of space you put between your objects, and where you put it: design is often as much knowing where to put something as it is knowing what to put there. If you make things overlap, or example, the covered things appear to be at the ‘back’ while the uncovered ones are at the ‘front’.

Lots More.

This is the briefest of brief overviews, because graphic design is a surprisingly large subject, and one that’s changing all the time. If you want to get properly up to speed, it’s worth buying a book, or even taking an evening course at your local college you won’t regret it.

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }

AJAX: Should You Believe the Hype?

by Jeff on November 6, 2005

There’s a craze on the web at the moment, and that craze is named AJAX. What’s that? Well, according to some people, it’s a technology that’s going to redefine the web.

What Does AJAX Stand For?

AJAX means ‘Asynchronous Javascript and XML’. Adaptive Path came up with the term in this essay: http://www.adaptivepath.com/publications/essays/archives/000385.php. However, the word is really a bit of a misnomer: AJAX doesn’t really rely on XML at all, but rather on a Javascript function that happens to be named XMLHttpRequest.

All About XMLHttpRequest.

XMLHttpRequest was originally invented and implemented by a Microsoft team who were working on a webmail application, and it’s been around for a while now (since 1999, in fact). The reason it has suddenly come to prominence now is that Google used it in three projects, Gmail, Google Suggest and Google Maps, and in each case managed to create a much better user interface than they would have been able to otherwise.

So what does XMLHttpRequest do? To put it simply, it lets your Javascript go back to the server, fetch some new content, and write it back out onto the page all without the user having to change pages. This gives a ’smoother’ feel to web applications, as they can do things like submit forms without the whole browser window needing to go blank and reload the page. Take a look at maps.google.com now, and notice how you can drag the map around anywhere you want to go without having to reload the page. This would be unthinkable without XMLHttpRequest.

One of the biggest reasons XMLHttpRequest has become popular now is that browsers other than Internet Explorer have started to support it, mainly due to the fuss over its use in Gmail. The function is, by all accounts, a very simple one in technical terms: it was just a matter of someone having the idea.

Getting Started with AJAX.

The first thing to do to get started with AJAX, then, is to create an XMLHttpRequest object in your Javascript code. As ever, Internet Explorer has to be difficult, doing this a different way to every other browser out there. That means that you should use this Javascript code:

var ajax;
onload = function () {
if (window.ActiveXObject) {
ajax = new ActiveXObject(”Microsoft.XMLHTTP”);
} else {
ajax = new XMLHttpRequest;
}
}

What you’ve done there is declared ajax as a global variable (usable by all functions), and then created a new AJAX object when the page loads, either using ActiveX for Internet Explorer or the XMLHttpRequest function in other browsers.

The next step is to write two more functions: one to get data from a URL, and one to handle the data that comes back.

function getText(url) {
ajax.open(”GET”, url, true);
ajax.send(null);
}

ajax.onreadystatechange = function () {
if (ajax.status == “200″) {
// do things with retrieved text (in ajax.responseText)
}
}

All you need to do then is call getText from the relevant part of your code with a URL you want to get text from, and put that text wherever you want it to be in the state change function.

The most powerful thing about this approach is that the URL you send to the server can contain variables, using the old REST (question marks and equals signs) way of doing things.

That means that, using the code above, you can easily send a request to ajax.php on your server, and include the current value of, say, an input box for a username on a registration form. The ajax.php script checks whether that username is already in use, and then sends either ‘1′ or ‘0′ as its only output. All you would then need to do is check whether ajax.responseText was 1 or 0, and change the page accordingly, preferably using getElementByID.

Should I Use It?

The question remains over just how useful this is: it’s certainly good for some applications where users would otherwise have to submit data over and over again, but it’s not much use for smaller ones. AJAX coding has a tendency to take a lot of time, especially the first time you try it, and this is often time that could have been better spent on other parts of the project. In short, don’t be afraid of AJAX, but make sure you use it when you find a project that’s well-suited to asynchronous transfer don’t go trying to fit AJAX to a website that doesn’t suit it, just because you think it’s cool.

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }

Ads Under the Radar: Linking to Affiliates.

by Jeff on November 4, 2005

One way to get a good income stream without doing anything that looks very much like advertising is to add affiliate links to your content. They’re just links, they don’t annoy anyone, and you can choose where you do and don’t want to put them. Sounds ideal, doesn’t it? Read on…

How Does Affiliate Linking Work?

Step by step, it works like this:

1. You become an affiliate. This works by you going to various online stores, looking at their product range and what benefits they offer to affiliates, and then signing up as an affiliate with the store that makes the most sense.

2. You write about products the affiliate carries. This might take the form of a review, or just a casual mention in a related article.

3. You link to the product at the store, using your affiliate code in the link. This affiliate code lets the store track that the customer came from your link.

4. For each customer you send their way who actually goes through with it and buys the product, they pay you a percentage of the product’s price.

You can see the power that this model could have for a lot of sites if you have a hundred thousand visitors, it doesn’t take a very large percentage of your visitors to buy that product before it starts to add up to quite a lot of money for you.

Amazon: the Web’s Biggest Affiliate Store.

The most popular affiliate store at the moment is Amazon.com, without a doubt. Why? Because it has such a huge range of products, from books to DVDs to truly obscure things. In terms of books especially, Amazon prides itself in having a listing for everything that exists, and selling as much of it as it can. That means that whatever you want to review, the chances are that Amazon sells it you’re not as limited as you are with other online stores, where you can only make affiliate links to things they happen to be selling this week, and maybe they’ll stop selling them sometime after that.

What does this mean to you? Well, imagine you run a book review site. Without being blatant about it, at the end of each article you can put a link that says something like “read more reviews of this book at Amazon”. This link then goes to the product’s page on Amazon, where there are indeed customer reviews not to mention the option to buy the book. If it’s a good book, this approach means that many people will click the link to see the reviews, and then buy it when they’re favourable. I’ve split-tested this, and “read more reviews” produced almost twice as many conversions as “buy this book”, making it a very good strategy.

Hang on a sec, though. What about those of us who don’t run book review sites? Well, whatever your site covers, I’m sure someone, somewhere writes books about it. Just introduce a regular ‘book review’ feature, where you review the latest books in your area of expertise, and then have the ‘more reviews’ affiliate link at the end. Give books bad reviews occasionally, despite the lack of affiliate income this produces, as it gives your reviews more long-term credibility than if you seem to love everything.

Done right, a book review every week or so can be a good supplementary source of income for your website. After a while, entirely random search engine visitors will start finding your book reviews in searches, and clicking through to Amazon from your site. I have year-old reviews that regularly make a few dollars per week it might not seem like much, but over time it can add up to a pretty significant amount.

Note: If you’re worried about paying more for books than you make back, remember that you don’t even have to buy the books yourself to review them get them from a library!

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }

7 Ways to Make Your Web Forms Better.

by Jeff on November 2, 2005

Since many people who design web forms have never designed any form of any kind in their lives before, it’s hardly surprising that plenty of the results could do with a little improvement and if you’ve spent any time on the web, you’ll know just how annoying bad forms can be. In this article, then, we’ll look at seven quick and easy ways to make your web forms much better.

1. Remember the Rest of the World.

This one is a call-out to American websites especially: don’t forget that your site will have more than just American visitors! It’s very insulting to be asked to register for something, only for the site to demand my state and zip code, leaving no space for me to choose any other country or enter a postal code in any other format than five digits. To save the trouble of the whole thing, I usually just go for ‘California’ and ‘90210′ a bad entry for that person’s database, just because they didn’t consider me when they designed their form.

2. Don’t Use Huge Drop-Downs.

Likewise, though, if you are nice enough to let me choose a country, don’t make me do it from an alphabetised list of every country in the world! The same thing goes for lists of states, counties, and so on. Drop down lists that are long enough to have scroll bars are just plain difficult to use and inconvenient I’d much rather just type the name myself, thanks.

3. Always Offer Suggestions.

So someone can’t get something they filled in on a form their username or domain name or whatever was already taken. What do you do? Please don’t just say “sorry, that one’s taken, please try another”. Come up with some useful suggestions of alternatives that are available, and let me choose them easily if I like them. Do try to be more imaginative than just adding numbers to the end, though, unless you want all your users to be called ‘jane23436′.

4. Don’t Punish Double Submitters.

There are some people, let’s face it, who just aren’t all that sure how the web works. They’ve been taught that you have to double-click computer things to make them work, and so double-click they do on links, on buttons, on everything. At some point, one of these people is likely to click twice on your submit button. You should allow for this in advance, instead of punishing them for it with an error. You might even consider using Javascript to grey out the submit button once it’s been pushed once, which solves the problem in most cases.

5. Stop Being So Picky.

Come on, now, do you really need my birth in dd/mm/yyyy format? Couldn’t you figure out what I meant if I wrote a month out in words, or if I only put in a one-digit day, or a two-digit year? Of course you could. Don’t throw my input back and ask me to fix things that a little server-side scripting could just as easily fix for me.

6. Display Warnings on the Page.

There are few things more annoying than websites which pop-up those little alert boxes, causing the computer to make a loud ‘ding!’ sound as they do so. If there’s something I need to go back and fix, add the warning to the page itself, preferably with a red border or background to mark it out for my attention. Don’t make me read a dialog box, click OK, and scroll back up myself to hunt for my mistake.

7. Only Ask for What You Need.

Last but not least, this is a rule that could make so many web forms so much better. If the information you’re asking for isn’t absolutely crucial to your dealings with me, don’t ask for it. Every second I spend filling in a form is a second I spend getting more frustrated with your website, and more likely not to finish what I’ve started if something goes even slightly wrong. Your site should be set up to figure out as much as it can about me automatically. Don’t ask what language I want to use my browser tells you that in its HTTP headers. Don’t ask which country I’m from you can detect that with my IP address. Save me time, and I’ll be much more likely to appreciate your site.

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }

6 Reasons Why You Need a Website.

by Jeff on October 31, 2005

If you don’t have a website, then you might not realise all the great things they can do for you. Maybe you think there wouldn’t be any point, because your business is too small or maybe you don’t even have a business! Perhaps you think it’d be a lot of work for little reward. Or maybe you paid big bucks for a site back during the dot-com ‘boom’ days, only to get nothing but trouble out of it and shut it down a year later.

Whatever your situation is, though, you need a website, and I’m here to tell you why.

1. People Will Look for You Online.

Sooner or later, someone’s going to type your name into a search engine. What do you want them to find? Nothing? These are people who want to find you, and if you don’t have a website then you’re letting them down they expect you to be online. For many people, you might as well not exist if you can’t be found with a search engine. Not having a website is like not bothering to get listed in the phone book. Whether it’s customers or old school friends you’re hoping for, very few people are going to find you if you aren’t online.

2. Websites Cost Next to Nothing.

Once, it cost a lot to run a website but those days are long gone. There are ‘pay as you go’ services out there now charging as little as $1 per gigabyte of bandwidth. If you’re sensible about the size of your pages, that dollar could last you a whole month, or even longer! If you don’t want to pay for design, it’s never been simpler to do it yourself, or find free software to do it for you. Really, it’s never been cheaper to have a website than it is today.

3. Websites are Great Advertising.

Whatever you’re advertising your services, your products, or just yourself a website is a great way to do it. Every other kind of advertising going costs a premium, especially if you want to target a specific kind of person, and there’s no guarantee that they’re paying attention. Websites are like brochures that are free to reproduce, interactive, and quickly distributed to people who are already looking for them. No advertising medium even comes close to the ease-of-use and effectiveness of a website.

4. A Website is a Worldwide Presence.

On the web, it doesn’t matter whether someone is next door to you or on the other side of the world they can see your website just the same as anyone else can, at no extra cost to you or to them. Phone and post both cost enormous amounts long-distance, but a website lets you send information anywhere without any extra effort or expense. You can make friends and contacts in places you’ve never been and will never go suddenly, working globally is no more effort than working locally.

5. Your Website Can Make You Money.

There’s a lot of money on the web, and it’s not hard to get some the longer you’re online for, the bigger your share can get. If you have something to sell, you can sell it worldwide, thanks to credit cards. Doing business online eliminates almost every overhead there is: all you need to do is have the goods. If you’ve written something useful, you can put it out there with a few ads. You won’t get rich overnight, but you can set up a steady trickle of income… and there’s no limit to the number of trickles you can set up.

6. Your Website Can Save You Time.

Giving out information takes time, whether it’s on the phone, or in brochures, or even if it’s just emailing your family. Websites are designed to save you time. All your family and friends can read your online diary (known as a weblog), but you only had to write it once. Customers can see your whole product catalogue without ever needing to talk to you or visit you. This is the power of the web: things on it are written only once, but can be downloaded endlessly a good website runs itself, and keeps being useful to people for much longer than you’d expect.

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }

5 Steps to Understanding HTML.

by Jeff on October 29, 2005

HTML is a relatively simple language, but that doesn’t stop people from having problems with it. Why is that? It’s mainly because, while the HTML tags themselves are easy, creating an HTML document that works as intended on a web server requires you to know a few extra things that aren’t often explained. Here, then, is a guide to understanding those parts of HTML that they just don’t tell you about in the books.

Step 1: Understand Doctypes.

It isn’t often noted that valid HMTL documents don’t actually start with the tag they have one extra tag before it. This is the doctype, and it must be present right at the top of your document for it to be valid HTML.

There are only really two doctypes that you really need to know about. The HTML4 doctype looks like this:

The XHTML one looks like this:

These versions of the doctypes that are a little more forgiving if you’re a purist, you can use the strict ones instead by changing the words ‘transitional’ and ‘loose’ to ’strict’.

But what is the doctype for? Well, its purpose is simple enough: it tells web browsers exactly what version of HTML your page was written in, to help them to interpret it correctly.

Step 2: Understand HTTP Errors.

A truly shocking number of people writing HTML pages don’t know how HTTP works and they quickly run into trouble because of it. HTTP is the way a web browser communicates with a web server, and this communication includes information about your pages, such as cookies.

You don’t need to worry too much about the internals of HTTP, but it’s worth knowing that it works by the browser sending a request to the server for a certain page, and the server then responding with a code.

Your website should be set up to handle error codes well. For example, a 404 (page not found) error should show a page with links to the most useful parts of your site. Other common error codes include:

200 - OK

301 - Page moved.

403 - Forbidden (no authorisation to access).

500 - Internal server error.

For more information, visit www.w3.org/protocols.

Step 3: Understand MIME Types.

MIME types are another part of the HTML header an important one. Also known as the content-type header, they tell the browser what kind of file they are about to send. Browsers don’t rely on HTML files ending in .html, JPEG images ending in .jpeg, and so on: they rely on the content-type header. If you don’t know about this, you can have problems if you need to configure your server to send anything unusual.

Here are some common MIME types:

text/html - HTML.

text/css - CSS

text/plain - plain text.

image/gif - GIF image.

image/jpeg - JPEG image.

image/png - PNG image.

audio/mpeg - MP3 audio file.

application/x-shockwave-flash - Flash movie.

Step 4: Understand Link Paths.

One of the hardest things to understand about HTML is all the different things that you can put in an ‘href’ property. Abbreviated URLs are created using the rules of old text-based operating systems, and there are plenty of people writing HTML today who are completely unfamiliar with these rules.

Here are some examples. For each one, the assumption is that the link is on a page at http://www.example.com/example1/example1.html.

- links to http://www.example.com/example1/example2.html
- links to http://www.example.com/example1/example2.html
- links to http://www.example.com/example2.html
- links to http://www.example.com/example2.html
- links to http://www.example.com/
- links to http://www.example.com/example1

To put it simply, one dot means “in the folder we’re in now”, while two dots means “in the folder above the one we’re in now”. This can get confusing fast just look at the difference one dot can make! Be careful with it.

Step 5: Understand How to Insert Things That Aren’t HTML.

One of the most common HTML questions is how to insert things like Javascript and CSS into an HTML document. This is one of the easiest questions to answer: you simply use the link and script tags, like this:

If you enjoyed this post, make sure you subscribe to my RSS feed!

{ 0 comments }