Build a Simple HTML Website in 15 Minutes
To create a simple website using HTML, you will need a text editor to write your HTML code and a web browser to preview your website.
What is HTML?
HTML is an abbreviation for “HyperText Markup Language.” HTML can also be defined as the standard markup language for creating Web pages. It is something used to mark up normal English to indicate things. HTML consists of a series of elements, These elements tell the web browser how to display the content.
HTML is the most common way to mark up web pages. It allows web developers to organize content on a web page and add links, pictures, and other media. HTML is made up of a set of elements, which are shown by tags. Tags are used to define a web page’s content and structure.
HTML is used to make a web page’s structure and layout, and it is usually used with CSS (Cascading Style Sheets) to control how the content on the page looks and is formatted. HTML and CSS are two of the most important web development technologies. They are needed to build modern, interactive websites.
Create Website Using HTML
To create a simple website using HTML, you will need to do the following:
- Create a new text document and save it with a
.htmlextension. This will be the file that contains your HTML code.
- Add the basic HTML structure to your document. This includes the
<body>tags, which define the structure of your webpage.
- Add content to your webpage by using various HTML tags. For example, you can use the
<h1>tag to add a heading, the
<p>tag to add a paragraph, and the
<img>tag to add an image.
- Use CSS to style your webpage. CSS stands for Cascading Style Sheets and is a language used to control the look and feel of a webpage. You can use CSS to change the font, color, and layout of your webpage.
- Save your changes and open the HTML file in a web browser to view your webpage.
<html> <head> <title>Welcome To My Website</title> </head> <body> <h1>Welcome to My Website</h1> <p>This is a simple webpage created with HTML in less than 5 Minutes.</p> </body></html>
How to create a simple HTML website
- First, open your text editor and create a new file.
- Add the basic structure of an HTML page by typing the following code:
<!DOCTYPE html><html><head> <title>My Website</title></head><body></body></html>
This code creates an HTML document with a
head section and a
body section. The
title element inside the
head section specifies the title of the webpage, which will be displayed in the browser’s title bar or tab.
- Next, you can add content to your website by placing it inside the
bodyelement. For example, you can add a heading and a paragraph of text like this:
<body> <h1>Welcome to My Website</h1> <p>This is my first website. It's still a work in progress, but I'm learning a lot and having fun.</p></body>
- You can also add links to other web pages or images by using the
imgelements, respectively. For example:
<body> <h1>Welcome to My First Website</h1> <p>This is my first website i created using the tutorial i found online. It's still a work in progress, but I'm learning a lot and having fun.</p> <p>Check out more technology content on <a href="https://afiaghana.com/technology/">HTML tutorial</a> for more information on creating websites.</p> <img src="image.jpg" alt="A description of the image"></body>
- When you are finished writing your HTML code, save the file with an .html extension, such as
- To preview your website, open the HTML file in a web browser by double-clicking the file or dragging it into the browser window.
That’s it! You have now created a simple website using HTML. You can continue to add more content and features to your website by using other HTML elements and adding CSS styles to customize the appearance of your website.
What are HTML attributes?
HTML attributes provide additional information about an HTML element and are used to configure the element or adjust its behavior. Attributes are always specified in the start tag of an element, and are written in the form
For example, the
href attribute is used to specify the URL of a link in an
<a href="https://www.example.com">Click here to visit example.com</a>
src attribute is used to specify the source of an image in an
<img src="my-image.jpg" alt="A description of the image">
alt attribute in the above example is used to provide a description of the image for users who are unable to see the image, such as users with visual impairments who are using a screen reader.
There are many other HTML attributes that can be used to configure and adjust the behavior of HTML elements. Some common attributes include
Common HTML attributes
The value of the title attribute will be displayed as a tooltip when you mouse over the element:
<p title="I'm a tooltip">This is a paragraph.</p>
Using Lowercase Attributes
The HTML standard does not require lowercase attribute names.
The title attribute (and all other attributes) can be written with uppercase or lowercase like title or TITLE.
However, We recommend lowercase attributes in HTML, and demands lowercase attributes for stricter document types like XHTML.
SKB Journal appreciate you a lot for reading! If you enjoyed this piece by Samuel Kwame Boadu, kindly hit the share button and help others to also see it. You can also like our Facebook page, so you know when we make new posts or Click to JOIN our Telegram Channel where we post JOBS + TIPS.