HTML Fundamentals
HTML is meant for semantics ( give meaning to your text). There are common tags used often when designing a website. This article discusses about these tags.
<!DOCTYPE html>
This is the document type declaration used to inform the browser about the version of the HTML used in the document. You should always start your html document with this.
P.S: DOCTYPE is not a HTML element, it is simply how the document should be interpreted by the browser.
<html>
This is the root or the top level element. All the other elements are the descendants of this element.
<head>
This comes after the opening html tag. This is the container for meta data ( provides additional information about HTML document.) The <meta> elements contain name and content attributes.
The title also goes in here. Anything within the head won’t appear in the body of the web page.
<body>
This defines the document’s body. This is where all the contents that one reads on the website goes. Lists, images, headlines, paragraphs and all the tags that display content go in here.
Displaying text
Tags that help in displaying text include;
Get Nelson Muchonji’s stories in your inbox
Join Medium for free to get updates from this writer.
Paragraphs. <p> is for paragraphs.
Headlines. There are six headlines and each has a number after h to show the level of the headline. h1 is the most important headline and should only be used once on a page.
Lists. There are two types of lists, ordered lists and unordered lists. For ordered lists, you always start with <ol> tag and for unordered list you start with <ul>. After the opening tag, is always followed with <li> for list item. There are also description lists, which are most used for writing long definitions.
Hyperlinks. Hyperlinks allow us to link documents to other documents or resources, link to specific parts of documents, or make apps available at a web address.
Media
Images. <img> tag is mostly used when an image is being attached to a site. However, there are times when <figure> or <picture> element is used.
Video. You can include video to your page using the <video> element. The video element has several attributes that you need to know such as controls to be able to markup well. You can also embed videos from other sites such as YouTube. YouTube will provide you with the needed embed link.
If you haven’t yet installed the editor you can check previous videos below:
- Getting started with HTML
- Getting started with web design
- This week’s tutorial below
