How to write HTML
4 min read
HTML is plain text annotated with markup. More specifically, this markup consists of tags and attributes.HTML elements are identified by tags. Most elements have a start tag and an end tag. The start tag precedes the text and contains the element name enclosed in square brackets "<" and ">". The end tag is the same as the start tag, except that the element name is preceded by a backslash.
Suppose you want to add a paragraph to a web page and the text of that paragraph says "This is a paragraph". Wrap with HTML paragraph tags. So the HTML code looks like this:
<p>This is Remote State.</p>
All you need to create a paragraph element in HTML is these three. Most HTML elements are the same: start tags, end tags, and content in between. Some HTML elements, such as (break), have only one start tag. These are called empty tags.
Element names are not case sensitive. That is, it can be written in uppercase, lowercase, or a combination of both. You can also write. However, it is considered best practice to always write the name in lowercase.
All HTML elements require tags, but very few require attributes. Attributes provide additional information about HTML elements, which may or may not be required. For example, an image element always requires a source attribute whose value is the URL or file path of the image. Otherwise, the browser will not know which image to display.
The same is true for the anchor element used to create hyperlinks. It must contain a href attribute with a value that indicates the target of the link. Otherwise, when the visitor clicks on the anchor elements, the browser does not send them anywhere.
It is not necessary to include other attributes, but it is considered a best practice. For example, a browser can render an image without the alt attribute, which contains alt text for the image. However, visually impaired readers may find it difficult to understand what the image conveys without a description of the alternative text.
Now that you understand the meaning of the attribute, make sure you understand how to find and write the attribute. The attribute is always in the start tag of the HTML element and the syntax is name = "value".
Many elements have unique attributes that affect how content is rendered on the page. The attributes can be written in any order within the start tag.However, you cannot have multiple instances of the same attribute within the same HTML tag. Before considering creating an HTML file, let's take a look at the tools you need.
How to use HTML
To get started with HTML, you need a text editor such as Notepad ++ or Sublime Text. HTML files are in standard text format, so any plain text editor will work. However, in this demo, Sublime Text works on Mac and Windows, so we'll use that editor to walk the process.
Step 1: Download the latest version of Sublime Text. Go to the Sublime Text download page and click on your operating system. The ZIP file will be downloaded.
Step 2: Open Sublime Text. Open the ZIP file and click Sublime Text in the download folder. The editor will open automatically.
Step 3: Add HTML. Copy the following HTML code and paste it into Notepad. The following sections explain the meaning of each of these elements.
<!DOCTYPE html> <html> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html>
Step 4: Save the HTML file. Select File> Save As from the Sublime menu. Name it "index.html". Save it to your desktop or another folder.
Step 5: View the HTML file in your browser. You can now open the HTML file in your browser. Double-click the file, right-click and select Open, or drag and drop the file into an open browser window. It will be as follows.
Now that you know how to use the HTML editor, let's take a look at how to write the actual code.
How to create an HTML file
To create a website using HTML, you must first create an HTML file. This file contains all the HTML code for your website and will be uploaded to your web server. Thus, when a visitor searches a website, the server sends an HTML file to the visitor's browser, which renders the page accordingly.
The following is an example of a simple HTML file that a beginner can create. Combine the code written in the steps above.
<!DOCTYPE html> <html lang=”en”> <head> <title>Remote State</title> </head> <body> <h1>Remote State</h1> <p>Hey! How are you?</p> </body> </html>
You can see below, When you double tap on the file that you saved or opened it in your browser it will look like this:
Note: Only the Heading and Paragraph tag is visible in the browser and the title is visible in the tab name.
Happy Learning! :)