I encourage you also to try out these tips in comments to this post! Feel free to doodle and see how it comes out. You'll never know unless you try it!
The method of formatting text on the Web is called HTML. This stands for HyperText Markup Language. We "mark up" parts of our text to tell other people's browsers how to render (show) it.
So if I want a part to be italic, I put marks around the part that I want to be italic. The marks are called tags. A tag consists of a <, a tag name, maybe some attributes, and a >. An attribute is just a word with a = and a value (usually the value is in quotes). The close tag is a tag consisting of <, /, the tag name that it is closing, and >. Close tags are usually required, but sometimes they are optional.
- <b> - Bold. Whatever is inside b tags is bold.
I ate a <b>really</b> big burrito.
I ate a really big burrito.
- <i> - Italic. Whatever is inside i tags is italic.
I read <i>Pride & Prejudice</i> yesterday.
I read Pride & Prejudice yesterday.
- <a> - This tag is called an anchor tag. It signals something which the user can click, and specifies in the href attribute what url the browser should display when it is clicked.
<a href="http://knitswithasilentk.blogspot.com">My blog</a>
These are three tags which are usually allowed in comments. Blogger has this message above the box where you type in comments: "You can use some HTML tags, such as <b>, <i>, <a>". If you use "Blog This" from your Flickr photo page, you can also use these tags to format text or insert links.
If you blog, and you don't use these tags, it is because you are using a WYSIWYG editor. WYSIWYG = What You See Is What You Get. The default view for Blogger is WYSIWYG, and if you want something bold or italic you highlight the thing you want to be bold or italic, and then click on the bold B or italic I. But if want to do it in comments, then you might find these helpful. You will also see raw tags if you click on the "Edit Html" tab.
Now you know that < and > have special meanings. If you try and type them into your blog or comments, it is possible that they will be interpreted as tags. But if you want them to show up, here is how to do it:
- <: <
- >: >
- &: &
I've given you ampersand too, because as you see, it has special meaning as signalling that there is a special character.
46 > 0
46 < 90
Feather & Fan
46 > 0
46 < 90
Feather & Fan
More cool tags
These tags are typically not permitted in comments, but can be handy if you're writing your own blog.
- <hr> - Generates a horizontal line. This does not have an end tag.
Above the line. <hr> Below the line.
Above the line.
Below the line.
- <del> - strikes out. Whatever is inside del tags has a line through it.
I <del>need</del>want more yarn.
needwant more yarn.
This tag used to be s and strike, but were deprecated and replaced with del.
- <br> - line break. This does not require a close tag, and I have never seen one.
One line<br>next line
- <p> - paragraph break. This does not require a close tag, but it is optional. It is like br only most browsers put space after the newline.
One paragraph<p>next paragraph
Remember that the user's browser determines how the page looks, not you, your server, or your browser. Your server tells the browser the content, with the markup indicating what to do, but the browser (whether it's IE, Firefox, Opera, or a reader to a blind person) determines what to do about it.
- <blockquote> - Takes the text within the tags and formats it with space, as if it were a quote or poem.
Here is a quote: <blockquote>To be or not to be;<br>That is the question.</blockquote>
Here is a quote:
To be or not to be;
That is the question.
- <pre> - Preserves spaces and newlines in enclosed text. You may have noticed that newlines don't seem to create extra space (Blogger has a setting by default that converts lots of newlines into <br> tags.). This tag lets the browser know it should honor things exactly as you have typed them, and use a fixed-width (typewriter) font.
<pre>One space: Two spaces: 5 spaces end
that was five spaces too.</pre>
One space: Two spaces: 5 spaces end
that was five spaces too.
A note on styles
If you use Blogger (I'm not sure how other blogging software works - this might apply also) part of the template indicates the font, size, background color, etc., for the whole blog. Blogger uses CSS (Cascading Style Sheets) to define named styles. If you are composing a blog entry and click on the "Edit HTML" tab, you will notice that if you used Blogger's buttons to style your text, say in italic, it does not show <i> as I have described above. Instead, you will see a span tag: <span style="font-style: italic;">. Feel free to use this tag in place of the i tag. As usual, don't forget to close it. Similarly, Blogger uses <span style="font-weight: bold;"> instead of the b tag. These only work within a CSS system with these styles defined; the i and b tags are in the HTML standard and should work everywhere.
In future posts, I will explain more, such as how to insert photos into blog entries. If you have any special requests, please feel free. As always, corrections and clarifications are always welcome.