In the past I would often find myself on a project trying to remember how I had done something before. The motivation here is to provide a 'to the point' document of useful tips and code snippets. As it is a useful collection of tips and code for me, I hope it will be to you.
As I mentioned before this is a work in progress, expect this 'book' to grow in time. I am not interested in putting together a bloated document that is full of filler. I want to create something that is functional for the reader, something that they can use to quickly find that useful snippet of code that does what they need. The idea I have is that my years of being a web designer and programmer will allow me to be selective when sampling from the sea of information available on the subject!
For those of you that may find some of the contents confusing, I would suggest that you simply begin by playing around with the code and see how it looks/works in your web browser. The easiest way to do this is to create a practice HTML page where you can cut and paste the code and then make small changes to it to see how it affects things. Breaking the code snippets and then seeing how you broke it will go along way to teaching you what is happening. If you are wondering why you should bother to learn a little bit about the code behind the web pages, please take a look at my website on web design.
1. Go to your desktop and create a simple text document. On Windows all you need to do is right-click and select: New -> text Document
That will create a simple blank text document on your desktop. Name the file: practiceHTML.htm. Windows will show you a warning asking you if you want to change the file extension, just say yes. Now right click on the file and select: 'open with' and select notepad. Once inside notepad, paste in the template code found in the grey box below:
(A simple way to cut/paste text in Windows is to press and hold the Ctrl key and 'c' for copy and 'v' for paste.)
This code forms the basic structure for all HTML pages. You can now cut and paste the code samples in between these tags:
One last note: in between the <body> </body> you find what is called a comment. Comments are a way to place notes that cannot be seen in the browser . Anything in between the following characters becomes an HTML comment:
Anything inside comments will be invisible in the browser. So in the above example the word 'and' would be invisible in the browser. It is a good way to leave messages about what your are doing in the page. It can come in handy later on when someone else is working on the page or even when you are, because you may forget why you did things a certain way.