1
00:00:07,180 --> 00:00:11,830
Let's dive in more to talk about a team of five.

2
00:00:11,830 --> 00:00:17,680
And we are going to start with a HTML5 semantic.

3
00:00:19,090 --> 00:00:23,440
Let's look at the definition for semantic.

4
00:00:24,310 --> 00:00:34,750
They are the elements that have a specific meaning and purpose and convert the structure and organization

5
00:00:34,750 --> 00:00:37,930
of the content on a web page.

6
00:00:38,590 --> 00:00:48,130
And they provide a way to describe the meaning of different parts of a web page and make it easier for

7
00:00:48,130 --> 00:00:58,390
search engines and HTML5 like we spoke about, introduce this new server element and that provide more

8
00:00:58,390 --> 00:01:02,500
meaning and context to a web page content.

9
00:01:02,710 --> 00:01:11,530
And as we said in the previous video that HTML5 introduces several new semantic elements, and these

10
00:01:11,530 --> 00:01:16,840
elements provide more meaning and context to a web page.

11
00:01:16,960 --> 00:01:25,870
And these elements also can help search engines and assistive technologies better understand the content

12
00:01:25,870 --> 00:01:34,570
of a web page and can make it easier for developers to create web structured and well-organized web

13
00:01:34,570 --> 00:01:35,470
pages.

14
00:01:35,830 --> 00:01:46,930
So in short, HTML5 help us to structure our application in more descriptive way than using these could

15
00:01:46,930 --> 00:01:49,700
old ways by using Dave.

16
00:01:49,720 --> 00:01:51,160
Dave, Dave and Dave.

17
00:01:51,370 --> 00:02:00,600
Any way we want to have content that are related together by with a HTML5, we have new element.

18
00:02:00,610 --> 00:02:04,150
So let's look at some of these new elements.

19
00:02:04,150 --> 00:02:11,590
And in the next video we will have a look at the demo, how we are going to explain this element.

20
00:02:11,590 --> 00:02:14,080
For the meantime, just follow me.

21
00:02:14,470 --> 00:02:14,860
All right.

22
00:02:14,860 --> 00:02:22,780
So the first element or semantic element is called header, and this one represents a container for

23
00:02:22,780 --> 00:02:27,490
introductory content or a set of navigation links.

24
00:02:27,490 --> 00:02:31,690
So the name is even descriptive header of a web page.

25
00:02:31,690 --> 00:02:37,780
And the next video, like I said, I will demo for you to see how we are going to make use of all these.

26
00:02:37,990 --> 00:02:48,010
The next is NAV element, and this represents a section of a page that contains navigation links.

27
00:02:48,010 --> 00:02:53,280
So the name, like I said, is even more descriptive, the navigation links.

28
00:02:53,290 --> 00:03:01,660
So if you want to have enough bar with some links and we are going to use NAV element in the previous

29
00:03:01,660 --> 00:03:08,380
version to be able to create enough links, we are going to put them inside Divs.

30
00:03:08,620 --> 00:03:16,960
The next element is called article and this one represents a self contained composition in a document

31
00:03:16,960 --> 00:03:20,950
such as a blog post or a forum post.

32
00:03:20,950 --> 00:03:24,990
So don't worry if all these are not clear to you.

33
00:03:25,000 --> 00:03:29,380
The next video I will show them to you for you to understand it well.

34
00:03:29,680 --> 00:03:31,690
So let me give you an example here.

35
00:03:31,690 --> 00:03:37,560
Let's say that we have a blog application where users can block all right.

36
00:03:37,570 --> 00:03:39,670
Or can create post.

37
00:03:39,670 --> 00:03:46,710
So all these posts, we can group them into a container called article.

38
00:03:46,720 --> 00:03:53,860
So with the previous version, we always use divs and the next element is called section.

39
00:03:53,980 --> 00:04:02,710
And this section represents a thematic grouping of content such as chapters, headings or sections of

40
00:04:02,710 --> 00:04:03,880
a document.

41
00:04:03,880 --> 00:04:08,770
And again, I will show you to see how this one also works.

42
00:04:08,950 --> 00:04:16,870
And the next is we have what is called a site, and this one will represent a section of a page that

43
00:04:16,870 --> 00:04:25,780
contains content that is related to the main content such as sidebar information or pull codes.

44
00:04:25,900 --> 00:04:26,410
All right.

45
00:04:26,410 --> 00:04:28,460
The next one is footer.

46
00:04:28,480 --> 00:04:30,520
This one is more descriptive.

47
00:04:30,550 --> 00:04:36,250
It represents the container for the footer of a document or a section.

48
00:04:36,250 --> 00:04:45,130
And we also have main and the main element is used to represent the main content of a document where

49
00:04:45,130 --> 00:04:50,260
we have a lot of these new elements, but these are the commonly used ones.

50
00:04:50,410 --> 00:04:54,820
As you move on, I'll be exposing some of these new elements to you.

51
00:04:54,820 --> 00:05:00,280
Or better still, you can also go around and find more about these elements.

52
00:05:00,400 --> 00:05:07,660
Well, so this element we are going to use them in our project, how we want to structure our application.

53
00:05:07,660 --> 00:05:11,440
Then we can choose any of these new element.

54
00:05:11,440 --> 00:05:16,270
In the next video I will show you how these elements are going to be used.