Introduction to building Web Pages using HTML5 and CSS3

Introduction to building Web Pages using HTML5 and CSS3

This course is part of Frontend Development using React Specialization

Instructor: NIIT

Access provided by PALC Dev

6,037 already enrolled

4 modules

Gain insight into a topic and learn the fundamentals.

37 reviews

Beginner level

No prior experience required

1 week to complete

at 10 hours a week

Flexible schedule

Learn at your own pace

4 modules

Gain insight into a topic and learn the fundamentals.

37 reviews

Beginner level

No prior experience required

1 week to complete

at 10 hours a week

Flexible schedule

Learn at your own pace

What you'll learn

Learn to create easily accessible, attractive, and static web pages using HTML5 and CSS3

Skills you'll gain

Tools you'll learn

Details to know

Shareable certificate

Add to your LinkedIn profile

Assessments

4 assignments

Taught in English

See how employees at top companies are mastering in-demand skills

Learn more about Coursera for Business

logos of Petrobras, TATA, Danone, Capgemini, P&G and L'Oreal

Build your subject-matter expertise

This course is part of the Frontend Development using React Specialization

When you enroll in this course, you'll also be enrolled in this Specialization.

Learn new concepts from industry experts
Gain a foundational understanding of a subject or tool
Develop job-relevant skills with hands-on projects
Earn a shareable career certificate

There are 4 modules in this course

Web content is accessed by millions across the globe every day. Attractive web pages help businesses grow and provide an omnipresent experience to the viewers.

In this course you will get an understanding on how HTML5 is used to structure simple web pages from scratch and how CSS3 enhances their appearance. The customized learning environment and step-by step teaching approach of this course augments the learning experience. The real-world scenarios and challenges presented during the course will train you to resolve the different challenges that front-end engineers stumble upon in their work life.

In this learning sprint you will learn to structure a web page using HTML5 and you will also learn the anatomy of a web page , usage of various HTML elements and the tools used to build web pages quickly .

What's included

14 videos3 readings1 assignment2 programming assignments

14 videos Total 54 minutes

Context Setting 2 minutes
Anatomy of a HTML element and a HTML document 5 minutes
Watch and Repeat : Create a HTML document in notepad/text editor 3 minutes
Create a web page using commonly used HTML5 elements 3 minutes
Watch and Repeat : Downloading and Installing VS code 4 minutes
Watch and Repeat : Creating header and paragraph elements in a HTML file 6 minutes
Watch and Repeat : Creating image , anchor and list tags in a HTML file 8 minutes
Install a HTTP server to deliver web pages 2 minutes
Use Emmet Tool Kit and multi cursor feature in VS Code 2 minutes
Watch and Repeat : Emmet Toolkit and Multi-cursor 13 minutes
Practice Brief 1 1 minute
Practice Brief 2 1 minute
Practice Debrief :: Develop a web page using HTML 2 minutes
Learning Consolidation 1 minute

3 readings Total 45 minutes

IDE for creating HTML documents and W3C Compliance 10 minutes
Instructions to upload the Programming Assignment Solution 5 minutes
Develop a web page using HTML 30 minutes

1 assignment Total 30 minutes

Develop a web page using HTML5 30 minutes

2 programming assignments Total 75 minutes

The World Wide Web 30 minutes
Pentogram Font Catalog Challenge 45 minutes

In this learning sprint you will learn to semantically structure web pages which will make machines understand web pages. You will also learn how semantically designed web pages helps people with disabilities.

What's included

12 videos1 reading1 assignment1 programming assignment

12 videos Total 39 minutes

Context Setting 1 minute
Differentiate between non-semantic and semantic elements 3 minutes
Watch and Repeat : Semantic and Non-Semantic Elements 8 minutes
Identify the benefits of using semantic elements 2 minutes
Explain the use of semantic markup by screen readers for page navigation 4 minutes
Watch and Repeat : Aria Lables 4 minutes
Structure a web page using semantic HTML elements 4 minutes
Watch and Repeat : Popular semantic HTML5 elements 5 minutes
Watch and Repeat : Semantic elements like Footer, Figure and Details 2 minutes
Practice Brief 2 minutes
Practice Debrief 2 minutes
Learning Consolidation 1 minute

1 reading Total 10 minutes

Structure a Web page using Semantic and HTML5 elements 10 minutes

1 assignment Total 30 minutes

Structure a Web page using Semantic and HTML5 elements 30 minutes

1 programming assignment Total 75 minutes

Positive Work Environment Task Force Challenge 75 minutes

In this learning sprint will learn to style your web pages using CSS , web pages with only information and no styles makes it less appealing.

What's included

10 videos1 reading1 assignment1 programming assignment

10 videos Total 44 minutes

Context Setting 2 minutes
Use CSS to style a HTML page 2 minutes
Watch and Repeat : Different ways of applying styles 9 minutes
Select HTML elements using CSS selectors 3 minutes
Watch and Repeat : Select HTML elements using CSS selectors 9 minutes
Apply styles to an HTML element using CSS properties 8 minutes
Watch and Repeat : Apply styles using CSS properties 6 minutes
Practice Brief 2 minutes
Practice Debrief 3 minutes
Learning Consolidation 1 minute

1 reading Total 10 minutes

Style a Web page using CSS properties 10 minutes

1 assignment Total 30 minutes

Style a Web page using CSS properties 30 minutes

1 programming assignment Total 75 minutes

Pentogram Font Catalog Preview 75 minutes

In this learning sprint you will learn how to apply spaces using CSS box model properties. Spaces have got it's unique importance in the design.

What's included

13 videos1 reading1 assignment1 programming assignment

13 videos Total 50 minutes

Context Setting 2 minutes
Create layouts by using the CSS box model 3 minutes
Apply margin, border and padding to add more breathing space to the design 7 minutes
Watch and Repeat : CSS Box Model 10 minutes
Watch and Repeat : Standard and Alternate box model 3 minutes
Manage grouping of elements using the CSS display property 3 minutes
Watch and Repeat : CSS display property 6 minutes
Apply CSS specificity 3 minutes
Watch and Repeat : CSS specificity 6 minutes
Use BEM syntax while creating the CSS class names 1 minute
Practice Brief 1 minute
Practice Debrief 3 minutes
Learning Consolidation 1 minute