Skip to content

rchillard/html.haus

Repository files navigation

HTML.Haus

Website for teaching HTML to everyone. I conceived of this website after returning to web development from a long hiatus. I used this project to learn HTML5 alongside ReactJS, but while doing so, I noticed an old problem has resurfaced in the new world: HTML is often misunderstood and misused. For example, there's an ugly proliferation of div tags! Div tags have no semantic meaning, yet many sites seem to use them for everything, often in place of proper semantic tags. This website hopes to fix problems like that by educating web developers.

Large white rural house by Jesse Roberts on Unsplash

Modern user interface libraries and frameworks like Angular, React, Svelte, and Vue are increasingly being used to build web applications. This abstraction on top of the web's view layer supports building applications in components. Component driven development has been growing in popularity for years, because it makes reasoning around and maintaining complex user interfaces easier. This new paradigm represents forward progress for how frontend developers build applications.

However, this abstraction has also taken developers a step away from the raw interface of the web, HTML and CSS. With that distance can come a loss of understanding what purpose HTML serves, why semantic HTML matters, and how to combine HTML elements for great justice.

HTML.Haus helps train everyone on these topics.

Sections

  • Learn: single page tutorial that takes you from a neophyte to an intermediate understanding of HTML
  • Practice: with a memorization tool to help you remember all of the HTML tags available
  • Reference: reference for broadly supported HTML elements with their syntax, sample code, and an example
  • Tools: to help you write better, faster, and stronger HTML by writing it correctly and validating it

Resources

The following resources were consulted heavily when constructing this site. I highly recommend them:

I recommend this additional reading:

Contributing

I welcome contributions. This is a learning resource. We're better together. If you're hesitant about your idea, then open an issue and let's talk about it.