HTML: The Basics
So, you want to learn more about HTML. Great! You’ve come to the right place. Keep reading to learn more about HTML basics and what it is used for.
What is HTML?
HTML stands for hyper text markup language, and it is the standard markup language that web developers use to build websites and web pages.
Essentially, HTML serves as the building blocks for a webpage because it tells a browser how to display website content. How does it do this? HTML has different elements that are used to create different sections, paragraphs, and links. These elements can also deal with more specific details like font size and italicized or bolded text.
While HTML isn’t considered programming language, it is the standard web markup language across the world.
Ways HTML is used
HTML is used in several cases: in building websites and webpages, for jumping between websites (since HTML is used for embedding links on a webpage), and for organizational purposes (either through headings, paragraphs, or pages on a website).
So, how does HTML work?
A website consists of several HTML pages, for example, a homepage, an About Us page, and a Contact Us page. HTML pages end in .html or .htm.
Web browsers read the HTML files and display them visually so users can browse the content.
HTML elements, tags and attributes, control how content is displayed by a browser. Tags control where an element begins and ends and attributes control specific characteristics about an element, for example, its size, colour, or font.
Element
There are three parts to an HTML element: opening tags, content, and closing tags.
Opening tags:
Opening tags are used to show when an element begins, and they are enclosed by angle brackets (< or >) on either side.
Content:
This is more straightforward. Content is the text, images, or videos that users see when they scroll through the site.
Closing tags:
Closing tags end the elements, and they are also enclosed by angle brackets. However, they aren’t exactly the same as opening tags. They also include a forward slash before the element name.
When these aspects are all put together, they form an HTML element.
Empty (or void) elements, which have no content, are the exception to this configuration. They do not require closing tags.
Every HTML page will include the <html>, <head>, and <body> tags, but other tags like heading tags (<h1>, <h2>, <h37>, etc.) and paragraph tags (<p>) can also be used.
Attributes
Elements can also include attributes that contain specific information about style and design — things you want to show up visually but not through text.
An attribute is broken into two parts: attribute name and attribute value.
The attribute name identifies the information that needs to be conveyed through the attribute and the attribute value provides more details to make this possible. Attributes with the same class can be targeted and treated the same way.
Building an HTML page
Now that the basics of HTML elements have been covered, we can move on to bigger things. HTML elements can’t exist on their own. Instead, they are combined with other HTML elements to form a functional web page.
Here are some essential elements that make up a web page:
Doctype
This is a required element that makes sure everything in your document stays organized.
HTML element
This element sets the primary language for the rest of the document, and it also wraps all the content on the page.
Head element
In this element, you can place all the content you want behind-the-scenes on your page — content you don’t want your webpage users to see. This can include things like page description, keywords, and CSS, for example.
Viewport element
This element ensures that your webpage loads at the correct width for the device it is being viewed on.
Title element
This is simple: the title element is the title of your page. It will also be the name of the browser tab it is being viewed in.
Body element
This element contains everything on your page: text, videos, images. If you want users to see it, it should go in this element.
This just scratches the surface of HTML. Reach out to us if you want to know more about how our HTML programming will be used to build your website!
Visit our online portfolio today or contact us.
The expert designers of the Coco’Nuts’ studio are here to help!
Contact us by email at info@creativecoconuts.ca
Talk to you soon!
SOFTWARE WE LOVE
Adobe Creative Cloud*– For Graphic Design & Photo Editing
WEBSITE HOSTING COMPANIES WE LOVE
Host Armada – For Cloud and Dedicated Server Hosting
