UI Development FundamentalsHTML Structure & Semantic Markup

76 items

1

Basic Form Elements

Slides / Video
2

Tables for Tabular Data

Slides / Video
3

Comments in HTML

Slides / Video
4

Semantic Layout Elements

Slides / Video
5

What Semantic Markup Means

Slides / Video
6

The div and span Generic Containers

Slides / Video
7

Block-level vs Inline Elements

Slides / Video
8

HTML Attributes: id, class & Globals

Slides / Video
9

Images and the img Element

Slides / Video
10

Links and Anchor Elements

Slides / Video
11

Links and Anchor Element

Quiz
12

Text Content Elements

Quiz
13

Nesting and Element Hierarchy

Quiz
14

Div and Span Containers

Quiz
15

Head Metadata Basics

Quiz
16

id and class Attributes

Quiz
17

Form Elements

Quiz
18

Basic HTML Document Structure

Quiz
19

Heading Elements

Quiz
20

Semantic Sectioning Elements

Quiz
21

Block vs Inline Elements

Quiz
22

Void Elements

Quiz
23

Image Element and alt

Quiz
24

Comments in HTML

Quiz
25

Benefits of Semantic Markup

Quiz
26

Semantic vs Non-Semantic

Quiz
27

List Elements

Quiz
28

Elements, Tags, and Attributes

Quiz
29

Table Elements

Quiz
30

HTML Lists: Ordered, Unordered, Description

Slides / Video
31

Text Formatting Elements

Slides / Video
32

Paragraphs & Text Content Elements

Slides / Video
33

Text Formatting Semantics

Code Quiz
34

HTML Comment Syntax

Code Quiz
35

Image Source and Alt

Code Quiz
36

Figure and Figcaption

Code Quiz
37

Global Attributes

Code Quiz
38

Table Cell Elements

Code Quiz
39

Div vs Span Usage

Code Quiz
40

Head Metadata Elements

Code Quiz
41

List Item Nesting

Code Quiz
42

Anchor Href Attribute

Code Quiz
43

Paragraph and Line Break

Code Quiz
44

Description List Structure

Code Quiz
45

Basic HTML Document Structure

Code Quiz
46

Semantic Layout Elements

Code Quiz
47

Semantic vs Non-Semantic

Code Quiz
48

Void Elements

Code Quiz
49

Block vs Inline Nesting

Code Quiz
50

Heading Hierarchy

Code Quiz
51

Headings and Content Hierarchy

Slides / Video
52

Void vs Container Elements

Slides / Video
53

Nesting and Element Hierarchy

Slides / Video
54

The head Section and Metadata

Slides / Video
55

Semantic vs Non-Semantic Elements

Flashcard
56

HTML Comments

Flashcard
57

Tables for Tabular Data

Flashcard
58

Block vs Inline Elements

Flashcard
59

Images and the Alt Attribute

Flashcard
60

Common HTML Attributes

Flashcard
61

Nesting and Element Hierarchy

Flashcard
62

The Title Element

Flashcard
63

Basic HTML Document Structure

Flashcard
64

Links and the Anchor Element

Flashcard
65

What Semantic Markup Means

Flashcard
66

Purpose of the Head Element

Flashcard
67

Headings and Document Outline

Flashcard
68

Paragraphs and Text Formatting

Flashcard
69

Form Elements Basics

Flashcard
70

Anatomy of an HTML Element

Flashcard
71

HTML Lists

Flashcard
72

Semantic Layout Elements

Flashcard
73

Void (Self-Closing) Elements

Flashcard
74

Meta Tags and Character Encoding

Flashcard
75

Basic HTML Document Structure

Slides / Video
76

Anatomy of an HTML Element

Slides / Video
Code QuizBeginner

Figure and Figcaption

Identify the misuse of the figure caption element.

Codehtml
<figure>
  <img src="chart.png" alt="Sales chart">
  <caption>Quarterly sales</caption>
</figure>

What is the bug in this markup?