Now to get a little more realistic. It is true that some purists have been able to make this dream a reality even today and more and more people are starting to use CSS in their websites. However the people who build browsers (e.g. Firefox, Internet Explorer, etc) can’t agree on how CSS is supposed to work. This means that website builders (at least the very expensive professional ones) have to spend hours and hours working on little ways to make CSS work for everyone.

I really want to encourage you to use CSS but you will probably find that you have to use a combination of the old ways of building websites and CSS. We will cover this in more detail in this blog from time to time.

This surprises me because I kind of assume that domain names will get set up correctly when you use one by the guys who look after your domain name.

So when you buy and start using a name make sure it works both with and without the www. Id it doesn’t work without the www then find someone who can make sure it does or alternatively move your name to somewhere that does things properly.

You would be amazed at how many people will search for your site without using the www and of course if your name doesn’t work right then they will often assume that your site is dead and go somewhere else.

This boils down to things like A records and dns but you probably don’t want to be bothering about this – just make sure they both work and if they don’t get on to the person who administers your domain.

If you do want to know what to do then first check that you have A records for both the domain name without www and with www – this can be checked through a domain control panel.

Once you have designed and built your web site you will need to copy the files from your computer onto the computer (aka server) where your site will now reside so everyone can see it.

There are various free ftp programs available on the Internet (a popular one at the moment is SMART FTP. It’s not the one I use but then I use the one I do because I always have and not because it’s a good one (which is why I’m not telling you what it is).

When you sign up for some hosting from an ISP (Internet Service Provider) they will give you some information about ftp. You will get a server address (often ftp.yoursitename but sometimes some numbers seperated by dots), a username and a password.

Somewhere you will have to put this information into your ftp software. This varies as to where the information goes but I recommend reading the software’s information to find out.

Most ftp system used port 21 (you will probably not have to do anything about this but I mention it in case you get a port number that confuses you).

Once you have set up your ftp program and connected to your server (computer where your site will live on the Internet) you will get the option to transfer files from your machine to the server. Pay attention to what you are doing and if you are making a major change I always like to have a backup of any files that I am overwriting. I have had occasions where files have not transfered properly and so cause all kinds of problems on a website – it is always wise to make sure you have copies of everything.

Then when you have uploaded (or updated) things I recommend testing it. I’ve been caught out more times than I’d like to mention with not checking things. The typical thing to do is to forget to upload some images when you upload a file. You will be annoyed if you forget so its best to make sure you’ve got it right straight away – saves on the stress.

Here is a little bit of html (that displays an image in a page):

<img src=”whereTheImageIs” border=”0″ alt=”this text shows when images are turned off in the browser” />

An html file is just a simple text file with the html code written in it.

Thankfully there are standards for html so that everyone who builds a browser can make sure that the websites all display in the way they were intended to. Anyone who has ever built a website will know that the last sentence was ironic. Browser developers don’t always agree with the standards and so they build things a little differently. Not long ago it seemed that Microsoft has gone it alone and intended to use html that no one else was using but this seems to have been pretty much ironed out now. Anyway these browser wars have resulted in a problem for web builders because we now have to check our pages in as many browsers as we can because they all do something a little different.

I’m going to say a quick word about CSS here. CSS – which stands for Couldn’t Standardise Sheets (actually it stands for Cascading Style Sheets) is a way to remove the formatting from the layout of a webpage. What this means is that you tell your CSS what font you want to use and then if you want to change the font you just edit the style sheet and the whole site picks up the change. It can also be used for layout. On the surface it sounds brilliant but in usage it is complex beyond understanding. Browsers do all kinds of different things with CSS and to be honest its a nightmare. Although I should recommend using them you may find it easier to use other methods of laying out your webpage (most of us use a combination of layout techniques – but more of that another time).

In the good old days there was just simple HTML and it was all in capital letters. We jocks who started the Internet revolution (ah who can ever forget putting those first images on a web page – heady days indeed) used to write everything in plain old HTML. Then someone invented WYSIWYG web design and things got a whole lot easier. However to suit the new fangled browsers that could display images and the new web site building software HTML was expanded and improved. We have now reached the stage where we even had to add another letter to the name of the language (now whose living on the edge). So we now use XHTML and its now all in lowercase.

Don’t be put off by that new high tec X this isn’t a new freedom movement but is simply a slightly more developed form of HTML – I guess HTML as it probably should have been originally. XHTML is a form of XML (don’t worry about XML for now).

Essentially this means that all html tags now have to have a closing tag (a tag is what html uses to describe things, like the image tag shown above) and where html doesn’t have a closing tag we have to make the end of the tag look like this />

So here are a couple of tags:

<br> (html)  <br /> (xhtml) = line break

<p></p> (html and xhtml) = paragraph

<img> (html) <img /> (xhtml) = image tag

<a><a/>(html and xhtml) = link or anchor tag

Most of the time you won’t need to worry about html because your web design software will take care of it but it does help to have a little idea of what it’s all about so you can tweak things.

In a lot of software programs if you want a smaller image you just get hold of the little handles on the sides of the image and pull them in to make the picture smaller, don’t you?

Never do this for a website!!!!

Now there may be the odd exception to this rule if your particular software is idiot proof and will take care of resizing for you but if you get in the habit of not doing it this way you won’t ever be caught out.

On a website when you drag the sides of an image in you are not actually making the image smaller. Instead some code is being added to the page to tell the browser to display the image smaller. Note the word “display”. The picture is the same size as it was before (e.g. huge) but the browser is being told to make it display small.

So then what you want to do is to make the picture small (small = fast loading) and tell the browser to display it the right size.

You do this with some image editing software. I’m afraid they all work a little differently so I can’t give you a blow by blow account here but you are looking for something that says resize, or adjust dimensions, etc.

When you get the right dialogue box in your software there will probably be options for size (e.g. the size you want to resize your image to). You don’t want to resize an image by inches, cm, or mm. You will want to resize by pixels (a pixel is one dot on a monitor). You resize in pixels because monitor sizes are measured in pixels so it makes working out the dimensions on a website that much easier – just trust me on this one.

Also you may see a choice between image size and canvas size. If you are resizing a photo then these are pretty much the same thing but if you are creating an image and resizing it you will find the canvas size is the size of the whole image and if you resize the canvas but not the images on it then they will take up more of the canvas (if that makes sense).

You need to decide how big to make your image. This will very much depend on how big you are making your website, or how big your website actually is. Also remember that the bigger you make an image the slower it will load into the viewers browser. So you want it as small as is reasonably possible whilst still keeping the impact of the image.

Some sites like to put great big images on that spread across the page. I think these look really nice but sadly this was of doing things comes at a cost to the content and speed of the website. It’s up to you.

Then you tell your software to make the image the right size for your requirements.

Now I need to add a word about resolution. You may hear people speak about resolution size (often dots per inch or dpi) and they will say that you need to set this to 75dpi for the web. This is wrong information. A very long time ago when people resized by dpi then this would reduce a big image to something reasonable for the web. However dpi has no effect on file size. Within the image file is a setting that tells a printer what to print the image at and this is where dpi comes in (the usual setting is 300dpi for a print by the way) but this setting has nothing to do with the final file size of the image. The only thing for you to think about for images that display on screen is the pixel size (length and height of the image).

So set your image size to whatever you have decided is right in pixels and ignore any talk of dpi. It took me a long time to work this out for myself (because I started back in the dark ages when people thought dpi mattered to file size) but you get the information straight away.

Click your save or apply button and you have your file resized and ready for the web.

• jpg (jpeg)
• gif
• png

The last one – png is a fairly new standard and is still not fully supported by older browsers. If you don’t care that older browsers won’t see it then you may want to risk it and use png for your site.

However the other two options (jpg and gif) have been viewable in browsers for a very long time.

In general jpg is better for photos and images with lots of gradients and fancy stuff in, whereas gif is better for images created on a computer out of shapes. These days most of the time you will end up using jpg but its up to you.

jpg is a lossy format which means that you lose information in an effort to try and make the image small. I’m not going to bother with details here but if you look carefully at a highly compressed jpg image you will notice the places where the information has been removed to make the file smaller.

Again, as a rule of thumb, you should be compressing your images down to about 75% or above – anything lower and the image starts to show its compression. It does depend a lot on the image and what detail and colours are in it but you can often see a preview of the image as you compress it in your software. If in doubt go bigger rather than smaller.

Why bother compressing at all?

Well the smaller the image the faster it will load in the browser and fast is always a good thing on the Internet.

Few sites need to go to the trouble of a dedicated server. Dedicated servers are for businesses where the website is critical and very big. Most of us don’t need a server and can happily survive sharing a server with other businesses and organisations.

Remember that you can always upgrade your hosting later if you find out that you need more power or more features.

Hosting will nearly always include some email features as well. If you need lots of email boxes you should take this into account when you sign up.

Also you will probably want some kind of statistics information – this is usually fairly basic but it can help you a lot to know what is going on. If your web space doesn’t have a statistics package then consider something like Google Analytics – you get better information but it does require adding some code to your web pages.

You will also need a way to get your website up to the web server – you will normally use something called FTP (file transfer protocol) to do this. When you sign up for some hosting you should get some details about this but it is essentially a username and a password and an address like ftp.mywebsite.com (just an example – yours will be different).

Here are some simple guidelines (ignoring email requirements):

Basic Sites with 5 to 50 pages = basic web hosting package

Bigger web site = basic to mid level hosting package (if your site is massive and your business depends on it you may consider a dedicated server).

E-commerce website = package with a database (e.g. mysql, etc) or and server software (e.g. PHP, etc)

CMS (Content Management System) or Blog = as E-commerce

Linux or Windows or something else for hosting?

The vast majority of the Internet runs on Linux or Unix servers. Don’t be sucked into Windows just because you find it familiar. The way you use your site will not be much different whatever kind of hosting you are using. Whilst Windows has improved in more recent years it is still not as secure (in my opinion) or as fast (in my opinion) as Linux. Most times you will find yourself having to pay more for Windows hosting and it really is not worth the extra money (in my opinion).

What is PHP?

PHP is a server side scripting language. In essence it is a programing language that you can use to write stuff for your website to do. It is often used when a connection to a database needs to be made. Don’t confuse it with Javascript which is a browser side scripting language. PHP runs on the computer that hosts your website and Javascript runs on the computer of the person viewing your website. PHP for stuff that has to be done at the server and Javascript for all those fancy bells and whistles that make your website more user friendly (this is a big generalisation but hopefully it helps).

There are many other server side scripting languages like ASP, JAVA, Pearl, RubyonRails, etc. but PHP is by far the most popular.

What is mysql?

MySQL is a database program that runs on a server (the computer where your website sits on the Internet). It allows you to create shopping systems, content management systems, etc. There are lots of other databases that do the same thing but mysql is the most popular.

Warning: Sometimes your site will go down

Every now and then (although not very often) your website will stop working and you won’t be able to bring it up in a browser. DON’T PANIC!! This happens from time to time. As I said at the beginning, the Internet is a network of computers and sometimes computers stop working and need to be restarted. If your site disappears it means somewhere a computer has crashed and needs restarting. If you pay for hosting this will happen pretty quickly if it’s your sites computer that has crashed. However sometimes the problem lies elsewhere and it may not be your web hosting companies problem. I’ve had websites that I couldn’t reach but others I knew could. There is a technical reason for this but I don’t want to bother you with it here.

The trick is to leave things for an hour or so and if you still can’t see your site you should try contacting your hosting company.

There are lots of other things to say about hosting and domains etc but that will have to be in other posts.

Free hosting at its best is like my brain – it goes slow and stops a lot. This may not bother you but it will bother your site users. In the worst cases you get adverts with free space and you can’t use a domain name with it. This means your organisation looks a little dodgy and even if people do make it to your site they will get bombarded with flashing monkeys and subjected to screaming yellow blobs – not nice.

My advice to you if you are considering some free space is: pay up you tight wad!

Hosting doesn’t need to be expensive but if you don’t pay anything your organisation will suffer – guaranteed.

In my opinion if you want to see your next birthday you are better off paying for some good web hosting from a good hosting company.

WARNING!

Before we go any further I have to issue a security warning. Connecting your computer to the Internet opens up all kinds of security issues, especially if your computer is connected to a network. Only attempt this if you really know what you are doing and are happy to take that risk – you have been warned.

However if you do want to host on your own machine you will need:

1. DSL, Cable or other high speed permanent connection to the Internet. You cannot do this with a dial-up connection.

2. Get a DNS hostname for your computer. There are various ways of doing this – just explore the Internet and you will find some free services. However you will need a static IP from your ISP (Internet Service Provider) and not a dynamic one which is what most of us have (this will probably cost you more money per month – hosting for yourself  is not a cheap and free option.

3. Set up your Router (if you have one) to forward the web traffic (Port 80) through to your server (the computer where your website will be).

4. Make sure any firewalls you have will let your traffic through. If you set everything up but can’t get a connection through then this is the first thing to check.

5. Get yourself some web server software (Apache is the most popular and one of the most secure) and set it up on your server. You can test this is working from the server. You may also need to set up some software for databases and running server programs (e.g. mysql and php – are the most popular options).

6. Put your website in the location that has been defined by your server sofware in step 5. Test it!

If you are really serious about this then take a look at http://www.boutell.com/newfaq/creating/hostmyown.html where there are more detailed instructions.

The Internet is simply a network of computers. There are some parts of that Network that work faster than others and so you want to get your site on the bit that is fast. The quickest part of the Internet is often referred to as the “backbone”. This is essentially the fast cables that link the worldwide Internet together – much faster than your telephone line.

Now you could in theory use your own computer for hosting but there are many reasons why this is a bad idea. I would certainly recommend getting yourself some paid for hosting.