HTML Introduction

In order to make information available on the World Wide Web, we need to develop a website using HTML (HyperText Markup Language). The language describes how the information is to be displayed in a web browser. On top of HTML which creates and present information, CSS (Cascading Style Sheets) is required to format the information into a uniform, consistent and pleasing nature. I learned HTML with videos on youtube ( Learn HTML in 12 Minutes)

A HTML file consist of elements, such as header, paragraph, numbered list etc, and these elements are represented by tags such as h1, h2 and h3 for headers, p for paragraph and nl for numbered list. Elements must be encased in <> and elements comes in pairs, the opening tag, and the closing tag which has a / before the element in the angle brackets.

content goes here...

Some elements do not have a closing tag, such as a break which adds a line, or a photo. Hence, the tagname must end with a slash (/)

To insert a photo, the tag "img" can be used, but the source of the image as well as the size must be specified in the tag.

< img src: "file location" width = "x" />

The file location is found with the folder that the HTML file is in as a starting point. Hence, the file can be specified by including the file name if the picture is in the same folder as the HTML file, using ../ to look in the parent folder or using your computer file directory (C:\Users\Name\Documents...). The size of the picture can also be specified by the number of pixels. In order to not have the picture look distorted due to a difference in given differing aspect ratio and the picture aspect ratio, you can just specify the width or the height.

HTML files are edited with text editors such as Notepad++, Brackets and Atom. In order to display the HTML document, the HTML file must be opened with a web browser such as chrome by dragging the file into the browser. However, in order for a website to be available for the public to view on the web, a server is requried. I used github to host my website by uploading my files into the website which creates a link for the public to view. The default file to open when using the link is index.html, which is why it is the name of the homepage of my website.

Steps

  1. Created a text document name "index" and change the file type to HTML.
  2. Opened the file using the text editor (I used brackets)
  3. Start the document with < html > and end it with < /html > to show that the following code is written in HTML
  4. Worked on the header and a title "My First Webpage
  5. Worked on the body with content in it, such as my photo and introduction to myself.
  6. Saved the file and dragged the file from my file explorer into google chrome to open it.
  7. Preview the HTML file using Chrome, and make necessary changes.