The First Ever Steemit HTML/Coding Tutorial

in #coding8 years ago (edited)

There are many reasons to learn to code. You can make your own website, create cool applications, and maybe even make some cool things for steemit!

So, let's get started with HTML. HTML stands for Hyper Text Markup Language. It is the foundation, the structure of any website. Generally, to make the beginning of a website, this is what you use. All HTML documents are described by things known as tags.


Here are the Basic tags that almost every webpage has:

As you can see, all tags start with a (except for the !DOCTYPE html and a few others). To fully integrate html, you need both the starting and ending tags.

and end with a

Now, let's get into the meanings of these tags.

: This is a way of declaring to your browser that the page will be in html.

: This tag is very important, as all of your other tags have to be inside of it, between the starting and ending tags.

: This is where you put things such as the title of the tab, and other things that are not in the body of the html.

: This is where almost all of the content goes. When you start making a website, you will need to put what you want to write or display inside of these tags.


Some important tags:

 
: You can input this anywhere in your html, and it defines a line break. This is one of the few tags that does not need both and opening and a closing. It is used if you want to go down to the next line, but don't want to start a new paragraph. It can also be used in conjunction with a paragraph to make that paragraph double spaced.

This is a test paragraph.

This is another test paragraph, on a different line

If you run this, here is what it would look like:

: This is how you can make links in html. You can change the url inside the quotes of href into any website you want to link to. The text outside the starting tag is the text that you want to make clickable. Here is an example on how to use it:

Here is what the output would look like, along with that paragraphs from above:

I will leave you with one more tag, which can be considered very important.

: This is the image tag. Whenever you want to put an image on a website or webpage, you can use this image tag. You can change the src tag to whatever image source you would like, and the height and width tags to however many pixels you would like to. Here is a usage example: 

And here is what it would look like, once again with the paragraphs from above:


I hope you guys enjoyed this intro tutorial to html! You can check out w3schools.com to find an html editor and to learn more!

Note: I apologize about making all of the code snippets images. Steemit had issues with it the first time and treated the snippets as real code for the post.

Sort:  

Great start for a tutorial. I think that everyone should at least learn one language because of how useful coding is nowadays.

Hi, I agree that a little HTML can help a lot here on Steemit. I am not too terribly skilled in HTML, but I believe under your example of Basic tags that almost every webpage has, you need a closing html tag. If inserting that tag causes you problems, you may want to insert it as an image. Just a suggestion. Great idea to post the first Steemit HTML tutorial. Keep up the good work. Upvoted for what it's worth :)

Oh, I guess I forgot to put that in. Thanks for reminding me!

Coin Marketplace

STEEM 0.18
TRX 0.14
JST 0.029
BTC 60535.47
ETH 2656.26
USDT 1.00
SBD 2.46