HTML setup
getting that first webpage in
Last updated
getting that first webpage in
Last updated
Let us begin with the creation of a basic HTML file!
To create an HTML file, we could use a simple text editor, like or ...
...but a code editor, like or , helps a lot!
If we open the text editor, we can copy and paste the below:
The first line tells the browser to expect an HTML document
The actual HTML begins inside the <html> tag which contains an optional lang attribute to indicate what human language the page uses
the HTML continues with the <head> tag
the <title> tag displays the page's name on the browser tab
then the <body> tag contains the actual content that the browser displays
the <p> tag represent a paragraph
Most HTML tags come paired with a closing tag
In the above example, we have </title>, </head>, </p>, </body> and </html>
Tags close in a nested hierarchy such that we cannot have an outer tag close before an inner tag closes, e.g. <body><h1></body></h1> must instead be <body><h1></h1></body>
That makes up nearly the barest-bones HTML page and after that, the possibilities become endless:
Looking at the new tags, we have:
<meta> which provides background information about the page
in this case, the tag contains an attribute charset that tells us the page uses Unicode (a "character set" that includes the alphabets and scripts of every human language)
<h1> represents a top-level heading and, as we can guess, <h2> would mean a second-level heading, and so on!
As above, we introduced <meta charset="utf-8" /> which features a tag without a closing tag that self-closes (we can also call this a self-closing tag)
Other tags that have this feature include
<link href="..." /> for stylesheets (located usually only in the <head> tag)
<img src="..." /> for images
<br />for line breaks (like pressing "shift+return" or "shift+enter" on a word processor)
Note that it has become optional to include the self-closing slash
e.g. it is OK to write just <br> but writing <br /> will prepare us later for in !