In this guide, we will cover the very basics of HTML. HTML stands for Hyper Text Markup Language, and is what every browser sees. It lays the foundation for the web pages that you view. HTML is completely open source, as you can right click > view source on any web page (unless bound by javascript to not allow right clicks, in which case there are bypasses for that as well. Still open source)
Now let's begin: We will start off with the DOCTYPE, which is the declaration that the browser uses to determine which version of HTML to render for. The most recent is HTML5, which is not a "new" version, but an upgrade of the older HTML 4.01. What this means is that HTML 4.01 will work within an HTML 5 DOCTYPE, but HTML 5 will not work with the HTML 4.01 DOCTYPE. So let's use the HTML 5 DOCTYPE so we can have full support
Now we have our DOCTYPE (This goes at the top of every HTML document) and we can move on to the foundation of the page.
Let me break this down real quick. This is the entirety of your web page. The html tag (the stuff between the angled brackets are called tags for future references) tells the browser "it's html, let's render it as such". Every tag has a closing tag, and if you notice the closing tag for html is at the end of the page, as our entire document is wrapped within it. This tells the browser to start rendering that tag, and then to stop when it reaches the closing tag. (This applies to all tags.) Then we have our head, which is the area in which we include our page's information, which remains hidden from the user, but not the browser. In this area, you would link your javascript codes, stylesheets, meta-data (all of this I will explain at a later time) and even include your page's title (what's viewed on the top of the browser or on your tabs)
Now we move onto the body, which is what the user views. Everything in between those tags will be rendered as the "body" or "content" of your HTML document. Again, this is what you see on every web page: the body.
Let's get into a couple basic tags:
Take note that all of my tags are lowercase. This is best practice, as some tags can be partially rendered using capitalization, but all tags are rendered lowercase. Use lowercase at all times to prevent any errors in your document. HTML documents are ended with .html or .htm (best practice to use .html) and can be created from Notepad I'm slightly tired so I didn't wanna get too deep into this right now, but I will be posting more for sure.
Now let's begin: We will start off with the DOCTYPE, which is the declaration that the browser uses to determine which version of HTML to render for. The most recent is HTML5, which is not a "new" version, but an upgrade of the older HTML 4.01. What this means is that HTML 4.01 will work within an HTML 5 DOCTYPE, but HTML 5 will not work with the HTML 4.01 DOCTYPE. So let's use the HTML 5 DOCTYPE so we can have full support
Code:
<!DOCTYPE html>
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Page Title</title>
</head>
<body>
<!-- This is a comment in HTML, it is completely ignored by the browser (Except when you view source) -->
</body>
</html>Now we move onto the body, which is what the user views. Everything in between those tags will be rendered as the "body" or "content" of your HTML document. Again, this is what you see on every web page: the body.
Let's get into a couple basic tags:
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Page Title</title>
</head>
<body>
<p>This is called a paragraph tag</p> <!--Browser will render this as a paragraph instead of a random block of text-->
<b>This text will be bold-faced</b> <!--This is the "bold" tag, which makes your text look like [B]this[/B]-->
<i>This text will be italics</i> <!--The italics tag, which makes text look like [I]this[/I]-->
</body>
</html>
