Alex BespoyasovAuthor's photo

HTML & CSS Workshop

A two-part workshop for Traktor School with an example of building a mobile app. We'll create the HTML skeleton for the app, style the page, take into account the peculiarities of the mobile interface, and keep accessibility in mind.

In Part 1, we'll build the layout of the pizza ordering app and learn how to use the right HTML tags. We'll understand what semantics is and why it is important. Will learn how to choose the right elements of forms, choose between links and buttons. Will fulfill the requirements for basic accessibility and validity.

In the second part, we'll style the page so that it looks like in the designs. We'll convert the standard browser controls into custom ones, while retaining all the functionality provided by the browser. We'll understand the difference between content and decorative images, learn how to optimize graphics and its loading. We'll talk about style composition and the BEM methodology.

Previous post: TDD: What, How, and WhyNext post: Clean Architecture on Frontend