GNU Image Manipulation Program (GIMP)...
http://www.gimp.org/ ... for making images / graphics for the design
Sorry I didn't clarify that - what I meant is that with you can do pretty much anything with just Notepad and the GIMP. No need for anything like like the Adobe suite!
Its not called GimpShop - that's a modified/forked version of the GIMP for people used to Photoshop.
I've never used it and I'm sure its great, but I'd suggest you stick with the normal, most up-to-date and well maintained version!
Things wrong / I don't like with this code (I'll explain any if you want me to)...
No character encoding declared (this would be the first thing picked up by the w3c validator). You need a line such as...
...in the head of the page (note: above is for UTF-8 unicode, change as necessary)
You let the editor put its 'Generator' tag in there. There's no need! Even if you are using a WYSIWYG editor, why admit it!?
Body background colour should be specified in CSS (preferably in an external stylesheet)
Right... tables... ewww.
The idea of using tables in web page designs is a remnant of the awful design trends and methods of the 1990s and, whilst as good as dead in real web design, it is unfortunately is still being kept alive today by the very kind of HTML editor you are using!
Its just a horribly ugly way of doing things.
Tables are for data. If you have a table of data, believe it or not you should put it in a table!
If you want to style that table, you use CSS. But that's where their usefulness ends...
Content should go in DIV elements (<div>) and then be styled with CSS.
In most cases, design elements should be DIVs styled with CSS.
Seeing a trend here?
The idea is to split up content and design, such that the content makes sense without the design and the design can be changed without affecting the content. The content is kept in the HTML and the styling usually in a seperate CSS stylesheet (referenced/linked. in the head of each HTML document). This makes it easier to have a consistent design that can be easily edited by editing the stylesheet without having to change each page individually; something not nearly so easy with a complicated and bloated table design!
This is also about accessibility. If the design is kept in CSS, it can much more easily be disabled to make it better to display for the visually impaired, or read by a text-to-speech program for the blind. Conversely with a layout done in tables, all the content is split up between rows/columns and makes no sense and with the styling removed you will see it as a an ugly table, not as the nice design you thought it was.
If you are using Firefox, load up a well designed webpage such as
www.bbc.co.uk and go to the View menu -> Page Style -> No Style. Notice how the content by itself still makes sense without the design, despite the full design being quite busy and complex with some AJAX. None of the HTML has been changed, only the stylesheet removed. The HTML markup is good, i.e. all headings are in heading tags, etc, so that they are still known to be headings and retained even when the design is removed. Imagine how useful all this would be if you were visually impaired, or if you were writing the HTML parsing code for a text-to-speech program!
Using stylesheets also opens up all kinds of other opportunities, i.e. you can have different styles/designs that can be swapped around just by changing which one the pages are linked to. You can do this dynamically using PHP (very easy if you have a universal header.php to include at the beginning of every page) and let, for example, a visitor chose a design with larger fonts and fewer graphics. All the content and HTML stays the same - only the CSS changes.
So what tags should you be using in the body of your HTML?
Mostly this will be DIVs, paragraphs, spans and hyperlinks.
Forms and relevant input elements occasionally.
Numbered lists and unordered lists.
Tables, but used properly!
Off the top of my head, these should be all you need for about 99% of pages.
Errrm, I've kinda nattered on quite a bit there.
Basically, have a read through this...
http://en.wikipedia.org/wiki/Tableless_web_design
Read up on HTML.
Read up on CSS.
I'm sure that's answered one question, and spawned 100 more!