Punkty Szablon HTML

Gotowa trzystopniowa sekcja dla treści statycznej strony HTML

Wyśrodkowany nagłówek i towarzyszący mu akapit określają cel sekcji, zanim pojawią się szczegóły procesu. Poniżej trzy równomiernie rozmieszczone karty zapewniają osobne obszary treści dla Kroku 1, Kroku 2 i Kroku 3. Każda karta ma taki sam układ wewnętrzny – ikonę, etykietę zapisaną wersalikami i tekst opisowy – dzięki czemu sekcja może prezentować powiązane etapy bez konieczności definiowania podstawowego schematu procesu przez otaczającą stronę.

Okrągłe strzałki tworzą widoczną relację między kartami. Pokazują, że etapy układają się w uporządkowaną sekwencję, a jasnoszara powierzchnia odróżnia każdy krok od białego tła. W statycznym kontekście HTML sprawia to, że blok doskonale sprawdza się jako przygotowany obszar „jak to działa” w obrębie szerszej strony lub serwisu. Otaczająca struktura może zapewniać nawigację, dodatkowe sekcje i kontekst nadrzędny, podczas gdy ten blok odpowiada za samo objaśnienie procesu.

Ponieważ interakcja ma charakter statyczny, sekcja komunikuje treść za pomocą odstępów, powtarzalnej struktury kart, ikon, etykiet i elementów kierunkowych, a nie kontrolek czy zmieniających się stanów. Ten gotowy układ można wstawić na statyczną stronę, a następnie dostosować za pomocą własnych tekstów, ikon, kolorów i wymiarów projektu, nie naruszając podstawowej trzystopniowej relacji.