How to Write HTML
Level of difficulty: Intermediate
In layman terms, HTML is a computer format which instructs the Web browser program how a specific Web page must be interpreted and displayed based on the tags (codes) embedded in the instruction set of the ASCII (plain text) file. HTML is actually the industry standard for creating hypertext-based contents intended to be hosted over the World Wide Web founded on the SGML concept which due to its plain text nature is easier to understand and implement compared to other more complex languages. Despite the proliferation of various tools which automate the HTML creation process by incorporating drag and drop functionalities into the utilities, there are still a great number of Web developers who write HTML codes using standard text editing tools. HTML codes in most cases can be used in a variety of Web browsers like the Netscape Navigator, Mozilla Firefox, Safari, Internet Explorer, and many others.
Materials Needed:- Text editor
- Web browser
- computer
Step 1
To begin writing HTML codes, it is important to formulate a concept on what you intend to present on your Web page. This will serve as the theme of the Web page that will be published on the Internet.
Step 2
With a concrete idea in hand, open the text editing program to create a new document. Click on the 'File' menu and select the 'Save' option.
Step 3
Normally, the first page used in a website is named as INDEX. Note that when saving files containing HTML codes, the default file extension should be HTM or HTML; otherwise, the Web browser will not recognize the file. Remember to be consistent in your file extension usage.
Step 4
With the file saved, begin with the title of the Web page to be created. Since HTML writing is based mostly on the use of pairs of tags, use the <title>Your Own Title</title> syntax to create your Web page title. This is usually displayed on the window caption bar of the Web browser.
Step 5
The next step is to add headings. Headings normally are used in a range such as h1… h6 with h1 being the most important item. To use this, simply follow the syntax <h1>Your Important Heading</h1>. Remember that you can replace the text between the tags with your preferred message. This syntax applies to all heading tags with the variance occurring at the integer portion of the tag.
Step 6
To include an entire paragraph of text in the Web page, simple use the <p>My First Paragraph.</p> syntax. Accordingly, the <em> Emphasized Word</em> tag can be used within the paragraph to put emphasis on certain texts.
Step 7
Since images are integral elements of any Web page, the HTML code uses the <img> tag with additional attributes. The src property defines the file name of the image file, while the width and height attributes are used to determine its size relative to how it will be displayed on the Web page. Another property is alt which is used to provide a short description of the displayed image. Generally the PNG, GIF, and JPEG image formats are preferred when used with Web browsers. Crude versions of these images are initially sent to the user while they are progressively being refined to achieve the final image quality.
Step 8
Links are basically used to allow the user to navigate to another Web page or website. In the case of websites created with multiple pages, the <a> tag will allow the user to go to the succeeding page or jump to another preferred page. This tag is normally used with the href option which identifies the file name of the HTML document that will be loaded when clicking on the link. Link captions normally appear as blue underlined texts.
Step 9
Save the created file. Open the Web browser and load it. Click on the 'View Source' option. This will display the HTML codes that were encoded in the text editor. The header values are automatically added when the HTML instructions are evaluated by the Web browser.