Main twitter is still GoldChoiceUK.

I thought of writing this post to tell people who are interested about making their own sites (or they can drop me a line to make one ) a few resources I keep to get inspiration and learn how to code.

1. My experience

I am not being big headed in any way at all but it is important because I feel that 1-to-1 teaching is great and there is someone there to ask if you have a problem.

2. Website building magazines/books (online and offline)

Online:
There are a range of books and websites to help out with long term design.
For online forum based knowledge I recommend Boagworld. The forum offers loads of things to get people started. There may be answers to your questions there. Also go and pick up a copy of Paul Boag’s book Website Owners Manual for further tips if you have already the HTML basics and you want to learn how to take your website/team to the next level. Why not have a listen to the Boagworld Podcast which often has a special guest they have interviewed.
If you are a young budding web designer check out Scrunchup. Their newly created online magazine recommends and delivers some of the tips from real web experts.

Offline:
For offline go to a local library and find the computing section. There is a selection of books to help first time website makers. – I have a book called Build Your Own Web Site (published 1998) that I learned the basics as kid nearly 10 years ago! I don’t know if it is still around but you may find a similar book that may help you get the very basics of what code actually looks like.
Failing that you can go and order one of the many Sitepoint books available. I haven’t myself read one or had one in my hand, however I love the range and I doubt that you won’t find what you are looking for.
In the way of magazines, there are a few but I picked up an issue of Web Designer Mag from WHSmith or buy a subscription from their site. I rate this publication as it has a CD/DVD of extras and the magazine itself has tutorials and general ‘webby’ stuff and goodness.

3. Use online tutorials
Some great tutorial/hands-on resources to help you get the best out of learning how to code.

a. W3Schools is a great ‘testing’ site with tutorials and ‘sandboxes’ to test your newly learned skills.
b. The W3 Consortium is the web standard site for web standards!

4. CSS Zen Garden for ideas and style

Lovely site that shows many designs by many people and is a great way to not only learn some HTML but go one better and learn CSS too. I rate this site highly.

5. Read blogs and other articles of interest
This is where I get to show off my good web friends! I have several sources that I look at regularly and some I have written for in the past.
a. Andy Kinsey has his blog called AK Designs, and regularly writes a great piece about SEO (Search Engine Optimistion). You will also find odd other things on his site that he has written about to express his enjoyment of a service/product in the hope that you too will find it useful.
b. Clair has knowledge of web design in the PHP area. She has a blog that she updates with all kinds of things including hardware tech and software. Some really nice articles that are easy to read and provide an insight to a techie’s life.
c. Jamie Knight is an autistic guy who I started to talk to on Boagworld Forum. Jamie has a great site of really useful web information and Tech stuff.

Finally use my website to gain knowledge and through the posts and tutorials. There is no substitute for just reading and finding all you can really learn.

6. Twitter
Twitter, we all know about, is a great tool for getting help with a coding problem. Go ask some of the top designers your questions and they will be pleased (I’m sure) to help you.

I hope that you have an insight into where you can go for tech and web related articles and help.

URL’s and resources in this post (order as discussed in the post):

GoldChoiceUK: www.goldchoiceuk.co.uk
Boagworld: www.boagworld.com
Scrunchup: www.scrunchup.com
Build Your Own Web Site: (ISBN: 07460 3293 5)
Sitepoint: www.sitepoint.com
Web Designer Mag: www.webdesignermag.co.uk
W3Schools: www.w3schools.com
W3 Consortium: www.w3.org
CSS Zen Garden: www.csszengarden.com
Andy Kinsey: www.andykinsey.co.uk
Clair: http://cds-world.co.uk/blog
Jamie Knight: http://www.jkg3.com

I have been a loyal Geocities (fan?) for 3 years, updating my website and changing the look etc, but now it is time to put it to bed to rest.

I had my first ever site on Geocities and I’m in some way sad to see it go. Why?

- It was the first website I ever had up. Without Geocities I would not have got this site that you are looking at right now.
- Following on… Geocities was a great starter package for me to get to know what a web server does and how to make sites… I could experiment with it and change the layout as much as I wanted.
- I had a way I could show my friends and family what I was doing with my time and show them my skills and what sort of things I was into.
- I had not got the money for a real address.

But why not also say some bad things about it? Why not?

- I couldnt connect Geocities free to a FTP client which made it useless if I wanted to upload multiple files in one go. I would have to select the files each individually.
- There were adverts.
- There wasnt enough customisation room / space for me to go put up something really snazzy.
- Having my e-mail address in the url stopped me from sharing the website with The Whole World. Thus only close friends and family I could allow to view it.

There may be more things but anyway I enjoyed using Geocities and hope that it has changed some peoples lives in the way it did mine!

So far we have looked at ways to get feedback and the feedback you may experience.

In this final part I would like to go through how you can approach changes and how to maintain a healthy site.

With all the feedback you have (if a large amount) it may be a good idea to put it into one document to pick over.

I submit my sites for review on Twitter as I have followers that specailise in design reading my feed there. The more places, and people, you submit the url to the more views you will get from different people thus helping your design skills.

My tip: The feedback I get I could do what I described above but in Windows Vista I like to use the Snipping Tool. With that I don’t have to worry about the ‘have I copied/pasted that’ problem because I’ll have the data in .jpg format. Then I can disregard all of the pointless comments. If they are major changes they will need to be done first. Small tweeks wont be as noticable so they can be done later on.

You may like to thank your friends for helping you as they are a good second-eye for spotting mistakes, and I know I miss them occasionally.

Finally when all the hard work is done you can relax and let visitors come to your page. However… one slight catch… to maintain a healthy site you should update it often. Maybe you could have a set day in the month where you check for broken links or you may want to add new features… all to keep people interested!

You could add:
A blog – assuming current site is only a showcase
A forum – depending on type of site
You come up with something more fantastic than I can? Tell Me!

I hope you have enjoyed my 3 part blog post topic- I hope to do one again sometime.

So now you have made your site and you have hopefully used a method of getting some feedback that I described in my last article.

Now I want to tell you about types of feedback and how you may view them.

I’ve already made a few sites and submitted them for public review. I was amazed by the views that people had of them. They did like them and a few were giving me quite a bit of useful info. For example on one site they mentioned how spacing could make it look better.

Just accepting feedback is good but if all you are getting is ‘your site is good/bad’ then maybe you need to select more carefully who exactly you show the site to and who you market it for. You may need to do major tweeking.

All the marketing can be decided before you make the site as long as you get it out there and show the world how good your new site is!

If you are being criticised then always have an open mind and be ready to make site changes. That will be covered in the third and final installment of this series.

With positive comments coming your way there is nothing to worry about and you can pat yourself on the back!
However dont get too down if you have negative comments because they may help you to become a better designer.
No responses lead to a feeling of rejection so choose tthe best feedback method for you!

In the final part: Making change

I have tried flash layouts, frames, tables and layers in the hope that I would stick to a particular design. I have found that working with layers is the best way for me as I can use CSS to define the location and other style properties of items on the page.

My different layouts ALL had pros and cons to them, which I´d like to talk about here now.

The first layout consisted of only Macromedia Flash. Straight away I hear alarm bells ringing because some search engines will not pick up on Flash-only sites. I had a very curvy design for it. Later I gave the main menu the drag ability, so it could be moved around within the Flash movie. All this happened between March 2006 and December 2006.

Soon I started to listen to Boagworld.com´s podcasts, and listening to ´The Great Flash Debate´, I finally was persuaded that I should have a HTML alternative. I think that having Flash is good as most browsers/computers support that content, but a Flash-only option is not enough. So I got to work on that straight away.
During my experimenting I used frames for a while, but then I found out that some people turn frames off, thus stopping the site working if you don´t have an alternative layout. I found this a little stupid, but it all made sense. If anyone really prefers a frames layout for their site, (they are not *very* common now) I can say I know how to do them!
Frames are quite useful though as you can fit a lot into them because they will scroll if there is more than a page of text. If you have hundreds and thousands of links then you can get to them easily.

Then I used a table based design and things were much more simple. However you can only really position them in 3 places normally (left, right and centre). Later in 2007 (July/August), I decided to learn a bit of CSS, so that I could colour and position them where I want regardless of the limitations of normal HTML. This again enhanced my knowledge and reading a 400 page book certainly taught me well. I haven´t finished it yet as I have been changing my site too much.
Then I realised something was missing.

Into my life came DIV´s, a layers format, and everything was more user friendly. A DIV can be positioned anywhere you like and can even nest. All my sites are now designed with a DIV layout and I only use tables for things like data that has to be listed a certain way.

If you think this article was interesting or have something to say about it please comment!

This is the reason:
The position: in CSS will want one of 5 options.
They are absolute, fixed, inherit, relative or static.
I had been using the absolute one because I wanted it to stay in one place. In this case the middle. I used left: to define how far over I wanted it to go, and positioned it nicely with my 17" 1280×1024 resolution monitor.
Using position:absolute is wrong because people might be working with the site in a small window or their monitor might be a different resolution. For 800×600 viewers the site would be just useless!

Oh dear! That was very foolish I know. I was ending up going to other browsers (Internet Explorer 6, Firefox etc) and checking it and changing it to display correctly. That was pretty bad too as nothing ever was right.

I found a site called Web Generator, which looked pretty cool as it is a Web 2.0 utility.
I made a mock up with that and downloaded the HTML and CSS files for it.

In looking at the CSS, I found out that it wasn´t using ID for DIV layers but a class instead. I also noticed that it wasn´t using the frustrating position:absolute code, but the display:inline and float:left code. This worked for what I wanted to do.

Using a class for a DIV allows multiple DIV´s to be assigned to a single style, if you want it that is.
However ID (the individual DIV name), will only be useful for a single DIV as it works on name.