Wednesday, May 25, 2011

Some VERY basic HTML

NOTE: Thanks to an observant reader, there's an error in the link coding html--my fault entirely, for being in a rush, and also trying to avoid Blogger actually 'reading' the html. I've made the corrections in RED below.

Thanks to Sarah Grimm for her post. Author Meg Chittenden once said writers are lucky because we hear voices in our heads but don't get locked up in rubber rooms. Hubster and I are at Cripple Creek most of today, so I won't be around to respond to comments as often as I'd like to. But don't let that stop you from leaving them, or sharing this post if it's at all helpful.

Back when I started my first personal website—back in the day when it was a cool thing to play with because your internet provider offered a certain amount of "free" space along with your account—I tried to figure out what the heck I was doing. I even bought a book about HTML, not that I understood it. (HTML 3 if that says anything about how long ago it was.)

Image copyright John C. Dvorak (And no, it's not real. It's a setup)

Now, most simple interfaces include automatic formatting codes, but there are a few commands I still use when you can't just highlight a word and click something that will insert the code for you. The main places I use them is when I leave blog comments, or am creating hyperlinks on my own blog. They also help me understand and find code when I'm trying to figure out why my blog or web page doesn't look right.

First, the bare bones. You signal whatever cyberspace magicians by inserting codes between < and > marks. Then you tell it to stop with a "/" symbol before the letter between the < and > marks

Okay, here's where it's going to get a little confusing, because Blogger insists that my examples are actually real HTML code. So, from here on out, I'm going to use "[" to represent "<" and "]" to represent ">".

To make something show up in bold, you use the character b (easy enough to remember, right?) So to bold something, you put [b] before the first word you want in bold and you put [/b] after the last word.

Same goes for italics, but use the letter i instead of b.

And if you want to get fancy, you can do bold italics; just remember to close the tags in the opposite order. So if you start with [i] [b], then end with [/b] [/i]

Creating links is usually programmed into the interface you're using, but it's one command I finally committed to memory, because, as I mentioned above, when things don't go right, it's nice to be able to see why, and to fix it.

Let's say I want to link to my website. The trigger for that kind of command is [a href="
The command goes IN FRONT of the text you want to be the link. In this case, let's say the text is "see my website." If the word I'd want to turn into the link is "website," then I put the [a href=" before website.

Then, after the quotes, you insert the URL of the website you want to link to. For my website, it would be

Then, close the quotes and put another ] symbol.

Next, AFTER the linked word, tell the internet magicians you're done by adding [/a]

So, the finished product would be:

See my [a href=""] website [/a]

The next (and probably last) command I learned had to do with telling the magicians that I didn't want people to be navigating away from my page. I wanted the link to open in another window. That way, my readers can have both the initial page and my website open at the same time. And this option isn't given for a lot of places that will create the basic link for you. By knowing what the link code is, I know what to look for and where to add the "open in a new window" bit.

Now, I'm sure there are lots of you who are going to say, "Just right click on the link, and you'll get the choice of where you want it to open." Trouble is, I never remember to do that, so I prefer to add a little more code so that the link will open in a new window automatically in case there are others like me out there.

The code for that is target="_blank"

You put that code after the closing quotes of the URL, before the ]

So, the final product would be [a href="" target="_blank"] website[/a]

I leave a space between the quotes and the target and have never tried it without one. It ain't broke, so I don't want to fix it.

Hope this wasn't too confusing. I had the pages explaining this flagged in my 'how to' book and had to refer to it for a long, long, time before finally committing it to memory.

Tomorrow, I'm going to be recapping the highlights of agent Rachelle Gardner's presentation on openings. Please come back.


Elizabeth Spann Craig/Riley Adams said...

Thanks for the helpful tips, Terry! I occasionally need some really basic html, myself. I used it the other day to insert blank lines--needed spaces between paragraphs in my sidebar.

Terry Odell said...

Elizabeth - yes, getting text to appear spaced out the way you want it is a good tool to have.

Elaine Baskin said...

Nice and clear. Good job. I have created several web sites, and manage them as well. It is always nice to have clear examples.

Terry Odell said...

Thanks, Elaine - aside from my brain-dead moment. Didn't realize you designed websites. We might have to talk. :-)

Patricia Stoltey said...

This is great, Terry, and I like the way you've worked around the little technical glitch when you write out the code exactly as it should be. I've forwarded this link to several of the new bloggers in my area.

Elizabeth C. Main said...

Thank you so much, Terry. What a clear description of eternally useful information.

Terry Odell said...

Patricia - I hope they find it helpful.
Elizabeth, glad it's working for you.