For many code newbies, the thought of coding a new website fills them with horror and makes them break out in hives. There are those of us, though, who love the dream of building a website from scratch. It’s a pleasure to create and see something you’ve touched develop into a functioning and useful web destination. You want to know how that feels, so you’ve decided to get started and build a site. What’s the best way to start? Getting familiar with some HTML coding basics is a fantastic first step.
We’ve gathered four pointers and tips that every new HTML programmer should know. In our guide, we show you how to create a basic HTML page. The skills we provide you in this article are every coder’s foundation and are essential to becoming a web developer. With our HTML coding basics under your belt, you’ll be able to start building knowledge and improve your programming proficiency. Let’s get started!
Enter the Markup
Here we are the ground floor, folks. Markup is the text used to dictate a webpage’s appearance. At its most basic level, a website is lines of text and links—everything else comes later. Markup controls how the text and links are displayed. It’s essential to know how to begin markup; from there, it’s your gateway to the wide world of HTML.
For HTML markup, angle brackets are the king. Bracketed text are formatting instructions, so use your brackets carefully. The first pair of brackets open a markup formatting instruction (a tag), and the second one closes the tag. The second tag often includes a slash to indicate closure. For instance, if you want the line “I ate too much pizza!” to be italicized, you would write it as:
<i>I ate too much pizza!</i>
This will be displayed as:
I ate too much pizza!
Use a free online HTML editor to check your work as you go; online HTML editors are handy tools that allow you to test your code before implementing it. Online HTML editors often provide quick links to popular tags, which is a great way to keep learning HTML as you go.
Build the Body
All HTML pages can be broken down into two main parts: the head and the body. While the head contains page management instructions and is a vital page aspect, the body is where you’ll spend a lot of your time as a fledgling code puncher. The body is where you’ll place your markups and text, and it’s where the page gets developed.
Now that we’ve examined the concept of markups and tags, we can build a simple webpage. Please note that, except for the page title, we’re working in the page’s body section. For your reference, h1 indicates a heading, and p indicates a paragraph.
<html> <head> <title>Too Much Pizza</title> </head> <body> <h1>Oh, No!</h1> <p>I ate too much pizza!</p> </body> </html>
Now, drop the above code into an HTML editor and save the resulting file as a text file named “page.html.” When you open the saved file using a web browser, you’ll bring up a homemade web page. Pretty cool, right?
While you won’t be able to parlay these quick HTML coding basics straight into a six-figure coding gig, our guide gives you the underlying foundational skills that are essential to becoming a quality software developer. Great things have small beginnings, and your career is no exception. Build on our simple lessons and, before you know it, you’ll be a web-developing fool.