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