How To Teach An Old Dog… #7

June 11, 2012 by  
Filed under Header Web Design

Good, clean, seamlessly running code – did I really say that? From where I’m sitting now, that looks like the dying wish of a terminally ill dinosaur…(me). I was starring at my (blank) screen, wondering how in the name of you-know-who how to start coding my first web page. Where’s my instructor, patiently leading me by the hand through all the infernal complexities? Where’s my mentor and guide, telling me, “Patience grasshoppa – you will know when the time is right?” I’ll tell you where they are – sitting on some tropical beach, sipping a fruity umbrella drink and laughing their collective a…. Sorry – stress makes me digress…

I figure, if I’m feeling a little nervous and ‘out in the cold’ you must be too. I stewed for a while and then it hit me (unfortunately, it wasn’t a coconut falling from a palm tree…). THE WEB! …and I actually do have a great teacher. I just don’t like to ask him stuff too often – I get the feeling right now he still thinks I’m a person of at least moderate intelligence and I want to keep that fantasy alive a little longer for him…

The web has all the answers you’ll ever need to get your first (and successive) page(s) up and running – the whole point of the web is to share information and boy, do people ever take that to heart! Before I start twitching and digress again, here’s a great resource address to find a lot of answers – they’ve got answers to stuff I didn’t even knew existed! Type in your browser’s address bar and you’ll pop up a page with the mother lode of (X)HTML command code or markup. This is only one of many references available to you – whichever one you decide to use, keep it handy as you’re going to need it baby….

Here’s how the flow goes… An element (the thing you want to format like a header, paragraph etc) is usually indicated by an abbreviated form of the element eg: ‘p’ for paragraph, ‘h’ for header etc. The element is enclosed by (the brackets) that delineate an element – the element and the brackets together are a tag. The element name appears in the opening or start tag that serves as the ‘on’ switch for a command. This is followed by the text you want to appear in the browser as a result of that command and finally the closing or end tag that is the ‘off’ switch for the command. The start tag, the content and the closing tag all together are the markup. Still with me? Good – I’m going to turn this over to you then because I blew a gasket a while back and the drool is pooling on my lap…

Seriously though, this isn’t really that bad – you’ll soon see the common tags in your sleep and until then, keep your cheat sheet close by and you’ll be able to stumble your way through. Here’s a couple of examples, just so you can see a visual description of my ramblings…

The header line of this installment for example would be written as follows:

<h>How To Teach an Old Dog New Tricks</h>

That would be followed by the paragraph command and content:

<p>Seriously though, this isn’t really that bad…</p>

A couple of things: keep tags lower case (not required for HTML but a must for (X)HTML) and remember – use the / (forward slash) not the \ (back slash) which won’t work in tags or URL’s. (That’s completely the opposite of where I came from but hey – you can teach old dogs new tricks. At least, I sure hope so!)