Home > Courses > Introduction to HTML and Web Technology > Getting Started with HTML

Getting Started with HTML

Subject: Introduction to HTML and Web Technology
HTML (Hypertext Markup Language) is the backbone of any web page. It is used to structure the content of a webpage and is essential for creating websites. Here's a step-by-step guide to getting started with HTML:

Set Up Your Environment: To create HTML documents, you'll need a text editor. You can use basic text editors like Notepad (Windows) or TextEdit (Mac), but specialized code editors like Visual Studio Code, Notepad++, Sublime Text and Atom provide features that make coding easier. Make sure you have one of these editors installed on your computer.

Create a New HTML Document: Open your chosen text editor and create a new file. Save the file with an ".html" extension. For example, you could name it "index.html".

Basic Structure: Every HTML document starts with a basic structure called the "HTML boilerplate." This includes the DOCTYPE declaration, the HTML element, and the head and body sections. Copy and paste the following code into your new HTML document: 

<!DOCTYPE html>
<html>
<head>
    <title>This will appear on the title bar</title>
</head>
<body>
    This will text will apear on the broswer
</body>
</html>


Understanding the Code: 
<!DOCTYPE html>
This is the declaration that tells the browser you are using HTML5. 
<html>
The root element of the HTML document. 
<head>
Contains meta-information about the document, such as the title. 
<title>
Sets the title that appears in the browser's title bar or tab. 
<body>
Contains the visible content of the document.

Save and View Your HTML Page: Save your changes in the text editor. Now, open the HTML file with your web browser (e.g., Chrome, Firefox, Safari). You should see the words This will text will apear on the broswer" displayed in your browser along with the accompanying paragraph.

HTML Elements and Tags: HTML is made up of elements, each represented by tags. Tags are enclosed in angle brackets . Elements often have an opening tag and closing equivalent tag. For example: 

<body>...</body>


Add More Content: Experiment by adding more content or text to your HTML page. Don't worry about the organisation of the text for now, we will learn more about that later.

By: Benjamin Onuorah

Comments

Benjamin Onuorah (instructor)
Date commented: 19-Feb-2024 02:01:03pm

Hello
Temiloluwa Agosu (learner)
Date commented: 10-Apr-2024 01:34:22pm

Hi

Login to comment or ask question on this topic

Previous Topic Next Topic


Supported by