Structuring Web pages with HTML : Headers, Footers, and Semantic Elements

Structuring Web pages with HTML : Headers, Footers, and Semantic Elements

<HEADER>

HTML headers are crucial for organizing content on a web page. They range from to, with being the main heading and for smaller subheadings. Using these headers properly helps make your content more readable and structured. Plus, they’re important for SEO because search engines use them to understand and rank your content. So, by using HTML headers well, you make your web pages easier to read and better for search engines.

<FOOTER>

A footer in HTML is the section at the bottom of a webpage. It often contains important information like copyright notices, contact details, or links to privacy policies and social media pages. Adding a footer helps visitors find this information easily and makes your website look more professional. It's created using the <footer> tag and is usually styled with CSS to match the overall design of the site. Using a footer is a great way to organize your webpage and provide valuable information to your users.

<ARTICLE>

An article in HTML is a section of a web page that contains standalone content, like a blog post or news story. It's marked up using the tag. This tag helps browsers and search engines understand that the content inside it is a complete piece on its own. Using the tag is good for organizing your web page and improving SEO, making it easier for people to find and read your content online.

<SECTION>

The <section> tag in HTML is used to define different sections of content on a web page. It helps to organize the page into distinct parts, like chapters in a book. For example, you might use <section> tags for the introduction, main content, and conclusion of an article. Using <section> makes your HTML code more readable and helps search engines understand the structure of your content better. This can improve your site's SEO and make it easier for visitors to find the information they need.

<NAV>

The <nav> element in HTML is used to define a section of a web page that contains navigation links. These links help users move around different parts of a website, like the home page, about page, contact page, and more. Using <nav> makes your site more accessible and easier to navigate. It also helps search engines understand the structure of your website, which can improve your site's visibility in search results. By organizing your navigation links inside a <nav> element, you create a better experience for your visitors.

<ASIDE>

In HTML, the <aside> element is used to define content that is related to the main content but not essential to its meaning. Think of it like a sidebar that contains additional information, like ads, links to related articles, or author bios. This helps keep the main content focused while still providing useful or interesting extras. Using <aside> correctly can make your webpage more organized and user-friendly.

Written by,

Md. Sybeen Abrar Prohor, Samia Bhuiyan, Shajeeah Juwairiya, Naznin Choity

BRAC University