If you’re reading this, you’re about to become an HTML coding wiz. Well, maybe not a wiz just yet. You will, however, understand the basics of what exactly HTML is and what it takes to begin to code a website.
WHAT IT IS.
What the H is HTML, you ask? HTML stands for Hyper Textual Markup Language, and is essentially the language you use to give your website a structure. HTML is made up of ‘tags’, which are keywords surrounded by carrots that describe different content within the document. Tags almost always come in pairs: the opening tag and the closing tag. For example, <p> is the opening tag for a paragraph, and </p> is the closing tag for a paragraph. Here is a visual for all of my fellow visual learners:
- <!DOCTYPE html>defines the document type to be HTML. This tag must ALWAYS come first.
- Everything between <html> and </html> describes what is in the HTML document. This tag will always follow the <!DOCTYPE html>.
- The text between <head> and </head> provides information about the document. What’s between this tag will not be visible in the browser.
- <title>Graydient Creative</title> states the title of the document.
- The text between <body> and </body> displays the content of the page.
- <h1>This is a headline</h1> is a heading.
- <h2>This is a subheadline.</h2> is a subheading. HTML allows up to six different heading sizes <h1> being the largest and <h6> being the smallest.
- <p>This is some paragraph text.<p> is a paragraph, as stated before.
- The <a href=”#”> Click me! </a> is a hyperlink tag.
- target=”_blank” tells your computer to open the hyperlink in a new tab rather than the one that is currently opened.
- <img src=”http://www.yourimageurlhere.com” alt=”I am descriptive text” /> is an image tag.
- alt=”I am descriptive text” displays the text rather than the image if the image for some reason isn’t loading. So, it is important to describe what the image is in the alt tag.
- <u>This is some underlined text.</u> underlines the text.
- <i> This is italicized text.</i> italicizes the text
- <strong> Bolded</strong> makes the text bold.
There you have it, folks! Your first step in becoming an HTML wiz is in the books. Stay tuned, as we will be discussing lists and tables next time!