Hello all!

On my previous journal I expressed how happy I was that you can use HTML on Weasyl submissions, comments, and journals. Reason being is, if you don't know, I am a web designer. I work with HTML all day at my job. I am proficient at HTML and CSS. I mainly focus on styling. I also just REALLY like making things pretty. So this was a very nice perk for me. And I saw a few people wanted tips/ refreshers- so I thought it would be nice to have a few journals breaking down some fun things you can do and proper HTML.

You CAN also use markdown formatting- it seems easy enough but I don't know it off hand. The guide is pretty simple though.

NOTE: Be sure to practice in the comments! See the bottom of this journal

---

---

Basics and introduction

This will be the lamest of the guides since this is the "follow these simple rules" guide. It's important to show it before I actually show you some tags. What's a tag? It's an element when read by something that supports HTML changes something or adds something (or can remove something). There are a lot of different types of tags out there, some for text, some for formatting, some for images, a lot!

What makes up a tag?
You need brackets, opening and closing <> and a valid element within the brackets for the beginning bracket.

EXAMPLE: <p> , <h1> , <b>

Most tags need an ending tag (I will go over exceptions at the bottom). Ending tags consist of opening and clothing brackets <> a slash / and then the same element within the brackets. The tags opening and clothing MUST MATCH.

EXAMPLE: </p> , </h1> , </b>

Here are some examples of COMPLETE tags

<p>Your text goes here </p>
<h1>Your text goes here </h1>
<b>Your text goes here </b>

Think of BBCode
Most of you know what that is. The general markup of BBCode is the same as HTML.. Beginning tag and ending tag. Bracket, element, bracket to begin. Bracket, slash, element, bracket to end. Only difference are less elements, some different elements, and the brackets used are [] instead of <>

The BBCode for bold is [b] your text in here [/b] - this would make "your text in here" bold. The [b] and the [/b] are beginning and end tags.

[b] is the beginning tag
[/b] is the ending tag

Exception to the rule?
There ARE tags that DO NOT require an ending tag. Only these specific tags can render correctly like this. But what they DO need is a / before the >
So it would be bracket, element, slash, bracket. < element />

EXAMPLE: <img /> , <hr />

That is all that is needed. So for instance, to display an image it would be this:

<img src="URL HERE" />

There is a beginning bracket <
img is the element for "image"
src is the element for "source"
A URL within the src attribute
A slash / , then an ending bracket >

This says "this element will be an image and it's source is here.
If we are yo use this image as the source, and the code above, this is the result:

FINAL UPDATE: Seems images (img tag) will not be supported~

---

---

Conclusion for this part

I know this part was DRULE and BORING, but it is REALLY important to type out tags correctly and understand why. We will go over more fun things next time I PROMISE. For practice, let's try these tags:

<b>YOUR TEXT HERE</b> - bolded text like this
<i>YOUR TEXT HERE</i> - italic text like this
<u>YOUR TEXT HERE</u> - underlined text like this

PRACTICE BY COMMENTING IN THIS JOURNAL BELOW

---

---

Outline of what we will be going over

• Headers: h1, h2, h3, h4, h5, h6
• Paragraphs and spans (including color)
• Text Aligning and divs
• Review of color styling!
• Links and blockquotes
• Lists! The three types
• Horizontal lines and break lines
• Tips
• Other things I come across