DEV Community

Rajesh Kumar Yadav
Rajesh Kumar Yadav Subscriber

Posted on • Updated on

HTML : Creating a simple page in HTML5 (Beginner's Guide)

The following HTML example creates a simple "Hello World" web page.
HTML files can be created using any text editor. The files must be saved with a .html or .htm extension in order to be recognized as HTML files. Once created, this file can be opened in any web browser.

<!DOCTYPE html>
<html lang="en">
 <head>
 <meta charset="UTF-8">
 <title>Hello!</title>
 </head>
 <body>
 <h1>Hello World!</h1>
 <p>This is a simple paragraph.</p>
 </body>
</html>
Enter fullscreen mode Exit fullscreen mode

Let's understand each of tags -

<!DOCTYPE> - Defines the HTML version used in the document. In this case it is HTML5.

<html> - Opens the page. No markup should come after the closing tag (</html>). The lang attribute declares the primary language of the page using the ISO language codes (en for English).

<head> - Opens the head section, which does not appear in the main browser window but mainly contains information about the HTML document, called metadata. It can also contain imports from external stylesheets and scripts. The closing tag is </head>.

<meta> - Gives the browser some metadata about the document. The charset attribute declares the character encoding. Modern HTML documents should always use UTF-8, even though it is not a requirement. In HTML, the tag does not require a closing tag.

<title> - The title of the page. Text written between this opening and the closing tag (</title>) will be displayed on the tab of the page or in the title bar of the browser.

<body> - Opens the part of the document displayed to users, i.e. all the visible or audible content of a page. No content should be added after the closing tag </body>.

<h1> - A level 1 heading for the page

<p> - Represents a common paragraph of text.

Buy Me A Coffee

With all that being said, I highly recommend you keep learning!

Thank you for reading this article. Please feel free to connect with me on LinkedIn and Twitter.

Top comments (0)