HTML Essential Training (2020)

HTML Essential Training (2020)

2h 46mBeginner2020-02-19

Authors

Jen Simmons

Jen Simmons

Designer and Developer Advocate

Course details

Hypertext Markup Language (HTML) is the foundation of website and web application development. It allows you to ensure that your content is understood by both segments of your audience: the people who watch, read, or listen to your content, and the computers that display it. In this course, learn how to craft excellent HTML with the pieces that HTML itself has to offer. Instructor Jen Simmons highlights all of the fundamental concepts you need to use HTML thoughtfully. She focuses on semantic markup: tagging content as what it is, and not just for formatting, convention, or convenience. This has far-reaching impact for those who consume the web differently; it ensures that when a screen reader or a system (like a search engine) consumes a page, it knows exactly what it contains and how to categorize that information.

Topics include:
- The basic syntax of HTML elements
- Formatting content
- Displaying images
- Creating links
- Global HTML attributes
- Building navigation
- Structuring content
- Building forms
- Creating tables

Skills covered

HTMLWeb StandardsWeb DesignFront-End Web DevelopmentEssential TrainingWeb DevelopmentOpen Source

Concepts

Introduction

  • What is HTML

HTML

  • The role of HTML

Formatting Text

  • The syntax of HTML elements
  • Paragraphs
  • Headlines
  • Bold and italics
  • Lists
  • Quotes
  • Dates and times
  • Code, pre, and br
  • Superscripts, subscripts, and small text

Understanding the Power of HTML

  • Debugging HTML
  • HTML attributes
  • ARIA roles
  • Formatting HTML
  • Weird characters

Linking and Navigation

  • Links
  • URL paths
  • Navigation

Images and Graphics

  • Images
  • Image formats
  • Responsive images
  • Responsive width
  • Responsive pictures
  • Figure and figcaption

Media

  • Audio
  • Video
  • Captions and subtitles
  • Embedding other media through iframes

More Ways to Identify Content

  • Supporting languages
  • Generic elements - div and span

Putting It All Together

  • The HTML page
  • Document head
  • Structuring content
  • Examples of putting it all together

Forms and Interactive Elements

  • HTML form basics
  • More on forms
  • Additional form element types

Structuring Tabular Data

  • When to use tables
  • Building table rows

Conclusion

  • How to keep learning and HTML specifications
80,000 Toman