Scribd
Upload
1 views13 pages

1.2.4 - HTML 5 Semantics, CSS and Javascript

The document discusses new semantic elements introduced in HTML5, such as <header>, <footer>, <section>, <article>, <figure>, and <figcaption>, which help define the structure and presentation of web pages. Each element serves a specific purpose, like <nav> for navigation links, <main> for main content, and <aside> for tangential content. Additionally, it mentions multimedia elements like <video> and <audio> for embedding media on web pages.

Uploaded by

Abdulhafiz Abdulsalam
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
1 views13 pages

1.2.4 - HTML 5 Semantics, CSS and Javascript

The document discusses new semantic elements introduced in HTML5, such as <header>, <footer>, <section>, <article>, <figure>, and <figcaption>, which help define the structure and presentation of web pages. Each element serves a specific purpose, like <nav> for navigation links, <main> for main content, and <aside> for tangential content. Additionally, it mentions multimedia elements like <video> and <audio> for embedding media on web pages.

Uploaded by

Abdulhafiz Abdulsalam
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 13

HTML 5 Semantics

Side Hustle Internship


HTML 5 Elements
Html 5 comes with new elements which
allow us to define the presentation and
look of our web page, HTML5 provides new
semantic elements that allow authors to
specifically define aspects of web
documents, including <header>, <footer>,
<section>, <article>, <figure> and
<figcaption> which is what we will be
going over.

2
<header></header>
This element represent a section heading
for a content an article, It can container
other element like the h1 tag, search form
or page logo.

3
<nav></nav>
The nav element is a section which
contains a link to other pages. It usually
has a <li> element listed in it to show
other available pages.

4
<section></section>
This tag simply defines a section in a
document, while it seems simple with little
significance, It proves very useful when it
comes to styling certain sections of web
page.

5
<main></main>
The <main> tag is element that defines
the main content of a document or page
and there should only be one <main>
element in a document.

6
<article></article>
The <article> element represents a self-
contained composition in a page, , which
is intended to be independently
distributable or reusable e.g a blog post.

7
<aside></aside>
The <aside> represents a section of a
page consisting of content that is
tangentially related to the content around
the aside element, and which could be
considered separate from that content.
Such sections are often represented as
sidebars in printed typography.

8
<footer></footer>
This tag defines a footer section for a
document, It contains information such as
copyright, author related information.

9
<figure></figure>
The <figure> element represents a unit of
content, optionally with a caption, that is
self-contained, that is typically referenced
as a single unit from the main flow of the
document.

10
<figcaption></figcaption>

The <figcaption> HTML element


represents a caption or legend describing
the rest of the contents of its parent
<figure> element.

11
<video></video>
The <video> tag embeds a video player on
the web page to videoplayback on the web
page.

Another similar tag which does this is the


<audio></audio> element which allows
playback of audio on our html page.

12
References
● https://developer.mozilla.org/en-US/doc
s/Web/HTML
● https://www.accessibilityoz.com/factsh
eets/html5/new-semantic-elements-in-
html/
● https://www.w3schools.com/tags/defaul
t.asp

13

You might also like