Advanced HTML and CSS

Subjects

Advanced HTML

In this module, we will cover semantic HTML elements and attributes.

Lessons

• Section elements, such as navigation and content
• Elements for embedded content, e.g., canvas and video
• Forms
• Additional elements like meter, time and progress

Lab: Define an overview page with semantic elements Lab: Define a webpage with a form

After completing this module, students will be able to:

• Understand semantics more thorough
• Use semantic elements to express content

Advanced CSS

In this module, you will learn CSS techniques for i.a. selecting elements, applying styles and positioning.

Lessons

• Selectors for targeting specific states of elements
• Pseudo-classes and pseudo-elements
• Custom fonts
• Opacity
• Animations and transitions
• Positioning techniques like flexible boxes and grid

Lab: Use advanced techniques to style a webpage

After completing this module, students will be able to:

• Use a wide assortment of techniques for selecting elements
• Weigh and use different positioning techniques
• Apply a wide range of general styling options

Browser APIs

In this module, you will be introduced to a number of browser API that are often used with developing web applications.

Lessons

• DOM API updates
• Storage (Web Storage and IndexedDB)
• Determining location
• Web workers
• Realtime communication
• Drag and drop
• Introduction to PWAs
• Overview other common APIs

Lab: Use Storage options to write and read data Lab: Use the Geolocation API

After completing this module, students will be able to:

• Build richer web applications using the covered browser APIs
• Take into account the capabilities of a browser when considering technology choices