Learn HTML Part 2

Are we feeling good about our HTML knowledge? Last week in Learn HTML Part 1 we covered the tags & formatting. This week we continue with formatting, more specifically hierarchy.

Header Tags

Headers usage is good blogging practice, these help with SEO keywords (always good practice to use your keywords in a header tag) and it also helps for structure purposes and people that don’t view web pages in usual manner, vision impaired etc.

<h1>This is h1 text.</h1>

<h2>This is h2 text.</h2>

<h3>This is h3 text.</h3>

<h4>This is h4 text.</h4>

<h5>This is h5 text.</h5>
<h6>This is h6 text.</h6>

You would use your main header as an H1 and sub headers in subsequent order, the H6 being the smallest header.

Basic Tags & Attributes

The biggest problem I’ve found in my post editors is the line spacing issues. This can drive me up a wall, especially when I lose my paragraphs completely and I have to search and find the sentence that starts a new paragraph 100 times. Interviews can be the worst!

A web browser interprets line-spacing a few ways, the major one being the paragraph tag:

<p>This is a paragraph.</p>

But say you just want a line break? You would use one of the few tags that is a stand-alone:

<br />

See that tag above? It has the close within the tag, you will find this in a few tags and it can play havoc with your Blogger post – because you’ll get an error message if you don’t have that closer /.

Another tag that has that closer within the tag is the Horizontal Rule tag. It adds a line in your post. It is used usually as a separator.

<hr />

Another stand alone tag is the Image tag, which is also one of your basic tags:

<img src=”image.jpg”/>

With this tag we are introducing some more advanced features, that are called attributes. All HTML tags can have attributes. An attribute will provide additional information about the tag. Attributes are ALWAYS shown in the start tag (never the end tag) and they always come in pairs, called a name/value pair:


The value is always put within quotes – “value”, but a funny thing to remember when using a platform like Blogger – it will change all your “value” to ‘value’ but you can still enter it in your template as “value”. Just something to remember when searching for a code string that you might have inputted.

Let’s take a look at that image code string again:

<img src=”image.jpg”/>

Your tag is <img />

Your attribute is src=”image.jpg”

Source = src
This is telling the browser where to find your image. Most bloggers will use what we call are “hard coded” image, meaning it is hosted somewhere and you give the full link, like this:

<img src=”http://yoururl.com/image.jpg” />

HTML Links

<a href=”http://www.prajunkee.com”>This is a link</a>

Once again an attribute appears.

Your Link tag is <a> link </a>

The attribute is href=”URL”

In the attribute area you would insert the URL of the page you would like your text to link to. In the area between tags, where it says This is a link, you would insert the text you would like to link.

You can wrap a link tag around an image also, bringing together two tag strings:

<a href=”http://www.prajunkee.com”><img src=”http://yoururl.com/image.jpg” /></a>

HTML Links – The target Attribute

<a href=”http://www.prajunkee.com” target=”_blank”>

This is a very important Attribute because it is telling the browser how to open the link. You want your readers to stay on your page when clicking an outside link, so you want to utilize the target attribute of _blank.

Here are the different target attributes:

_blank = Loads in a new window
_self = Loads in the same frame as it was clicked (when using frames, which is outdated way of designing a page)
_top = Loads in the full body of the window it was clicked in
_parent = Loads in the parent frameset (when using frames, which is outdated way of designing a page)

HTML Links – The name Attribute

<a name=”authors”>Reviews By Author</a>

This is how some bloggers have a menu at the top of their posts with internal links that take them to different spots in that post. Very useful if you have a HUGE post with lots of information or a glossary. You would put an anchor or your header “Reviews By Author” with the name of “authors” and then at the top of the post you would link to it:

<a href=”#authors”>Reviews By Author</a>

You use the name, and precede it with a # which is telling the browser to look within the current page. You should never have the same name twice. And if you want to link to an ANCHOR within another page — say you want your Review Policy & Contest policy on one page, but want a different link in your menu system, you would simply precede it with the page link:

<a href=”http://www.parajunkee.com/review.html#authors”>Reviews By Author</a>


Welcome to the world of hexadecimal notations or HEX for short. HEX is the combination of RGB values (red green blue) in a code that your browser will understand.

The lowest value is 0, (HEX 00) the highest value is 255 (HEX FF). It is specified in HEX by 3 pairs of two-digit numbers that start with a # sign. Repeating pairs can be shortened now to a three digit, for example:

#000000 = Black = rgb(0,0,0) = #000
#FFFFFF = White = rgb(255,255,255) = #FFF

It can be confusing, but it is recommended that you take a look at a site with all (or most) the HEX numbers listed, like: http://cloford.com/resources/colours/500col.htm

List Time

Bullets and Numbers, there are two types of list that do this. One is called an ordered list and the other is called an unordered list.

Bullets = unordered
Numbers = order

Unordered = <ul> </ul>
Ordered = <ol> </ol>

These tags just tell your browser that you are about to start a list and what kind of list it is, but you also have to tell the browser what list items you want in this particular list.

List Item = <li> </li>

So the list will look like this:

<ul>Types of Lists
<li>Ordered Lists</li>
<li>Unordered Lists</li>

  1. An Ordered List
  2. Is in Order…1. 2. 3
  3. Their is hierarchy…1 must go before
  4. 2 and so forth…
  • An Unordered List
  • Is not in any order…
  • Your Bullets can go in any order

See how I closed it right after the last list item? If you don’t close your lists, your next paragraph will be directly behind your last list item.

There is also what they call a Definition List and it is set up a little differently, you now have the tag <dl> that defines the list and the item <dt> with it’s definition <dd>:

<dd>- a statement expressing the essential nature of something</dd>

It will look similar to this:


– a statement expressing the essential nature of something
Do we now feel smarter? You should. I highly recommend if you are interested in coding HTML to learn the basics and then purchase a WYSIWYG program like Adobe Dreamweaver. Programs like that are your assistants. They fill in the blank and you can use them as a guide as you code. Good luck!


Reader Question of the Week:

“What’s your thought on NDA (non-disclosure agreements) for ARC’s and beta readers? I have a friend who is writing his first book, and asked me to beta for him, and just sent me a NDA to sign. I don’t have issue with it, but thought it a bit strange that I haven’t had to sign one before for any publisher or author I have previously worked with.” – Laura

I think an NDA is a potentially good idea. Not as a legality issue, but more of an understanding between both parties so they know this is REAL. Especially inexperienced parties that don’t technically do this for a living…yet. A reminder that what I have within my possession is someone’s work and if it gets out it has the ability to put a major crimp in the publishing process. For example…Midnight Sun by Stephanie Meyer. Maybe your friend is trying to protect himself…especially since this is his first time. He probably looked around on the web and saw someone posting about getting Beta Readers to sign NDAs. I myself have never signed an NDA from an author or publisher. I have been told…DON’T LEAK THIS ON YOUR BLOG…or else. But, I find that protecting my reputation is a lot more motivating then any legal contract. But, I wouldn’t have a problem signing one, since I never have the intention of passing around, or leaking information that isn’t ready to be leaked. I wouldn’t think anything of it. Maybe ask your friend where he got the idea to do the NDA. It might explain his reasoning.

Book Blogging News:

Sketchy Covers & Flattery

Last week I was searching NetGalley and I cam upon a book called SKETCHY. The cover stopped me in my tracks. Not because it was awesome, but because I thought it might be book three of the ASHES trilogy. But, it wasn’t. It was just a cover that looked very similar to Ilsa Bick’s masterpiece ASHES trilogy covers. So, I posted about it on Facebook. I didn’t want it to be a big deal…just a check out this cover comparison type of post. Here is the Facebook post.  I didn’t expect the reaction that the post received, Bick’s fans seemed angered by the imitation cover and even Bick herself joined in on the conversation. The reason I’m mentioning it here, is because of the wonderful post that Ilsa Bick did about the covers. I thought it was a wonderful way to handle things…check it out here.

Why you should always ask permission…

Last week we also discussed passing around ARCs and just a few days later relations between Indies & Book Bloggers were tested yet again. A Book Blogger decided she would offer her eBook copy that was sent to her for review to another Writer/Blogger. It was obvious that the Book Blogger knew this was wrong, because she stated in her offering “it has to be on the down low”. Well it wasn’t kept on the down low, in fact the person she offered the eBook to went and spilled the beans…the result was a tagged (Aurora linked to Laura’s facebook friend page) Facebook post by writer/blogger Aurora Martinez, that had the screen shot of the offering:

Urgent Message for all Authors I am not trying to cause an uproar but I am in a bad place. Someone has stolen some Arcs and betrayed the trust that Authors must have in their Book Bloggers and Reviewers. Beware of Laura [REDACTED]. She is a Pirate! {source}

I’m sure it immediately resulted in Laura being inundated with threats and mean comments, which was the intention of such a very inflammatory post. “I am not trying to cause and uproar” is quite unbelievable since it was directly linked to Laura’s account to promote retaliatory behavior and “someone has stolen some ARCs” implies malicious and devious behavior…stolen ARCs? That makes me think of someone in a black cat suit pilfering in your safe and taking your ARCs.

The blogger in question, Laura immediately jumped in on the conversation and wrote an apology letter (which has since been removed – but her comments are still up), saying she knew she was in the wrong and regrets it…but she isn’t a pirate. Which she isn’t. I’m not defending what she did, she shouldn’t have offered the eBook, but I also don’t think the other blogger/writer should have come out with that someone stole ARCs and is a pirate. Then call in the question trust of Book Bloggers and Reviewers. Then in comments claimed that Laura was bullying people…and sending others to bully the whistle blower Gail on goodreads (I saw one negative review on goodreads) Like we need anymore insanity in the relationships between Indies and Book Bloggers. This is a very unfortunate event that his been blown WAY out of proportion. It will only result in more distrust between Indies and Book Bloggers — it is something that should have been handled in private.  I’m unfortunately of the opinion that again something that should have been handled internally was intentionally blown out of proportion to try and attract attention. Shame on Laura for trying to pass on the eBook without the author’s permission, but she did good with coming back with an apology. She probably should have just apologized and then stepped away. And Shame on Aurora for making a Mountain out of a Molehill the girl apologized, if someone was bullying I would ask her to look in a mirror, because this had CRUSADE written all over it. For some reason she wanted to see Laura get flayed…and even as Laura apologized she gave no slack. I think like anything else…we have to look at the intensions of the post.

What did we learn from this interaction?

  1. ALWAYS ask the author if you have permission to pass on their ARC.

Happy Thursday. Talk Less. Read More. Blog with Integrity.

[divider top=”1″]
Ask A QuestionHave a question? Fill out the form by clicking on the button to the left. This will go into a spreadsheet to be looked over at a later date and hopefully answered on this blog. This is completely anonymous, you do not have to leave your real name. Urls will not be included in your question unless it pertains to the question.