Eenvoudige prijzen HTML-sjabloon

Twee voltooide prijskaarten vormen een statische sectie

Het blok brengt de belangrijkste onderdelen van een op zichzelf staande prijsvergelijking al samen: twee kaarten naast elkaar, plannamen, weergegeven prijzen, doelgroepomschrijvingen, lijsten met inbegrepen functies en aankoopknoppen. De Solo-kaart is gelabeld voor freelancers en individuele ontwerpers, terwijl de Team-kaart wordt beschreven als een keuze voor teams van elke omvang. Deze voorbeeldbeschrijvingen geven de beoogde contentstructuur aan, terwijl de weergegeven bedragen van $74 en $199 deel uitmaken van het getoonde ontwerp van de sectie en geen algemene zakelijke claims vormen.

Dankzij de uniforme kaartstructuur kan de sectie eenvoudig in een statische HTML-pagina worden geplaatst. De Solo-kaart bevat één editorlicentie, een Figma-ontwerpsysteem en levenslange toegang tot toekomstige updates. De Team-kaart bevat een onbeperkt aantal editors, samen met het gedeelde ontwerpsysteem en de toegangselementen. Heldoranje en lichtgrijze vlakvullingen onderscheiden de alternatieven, terwijl afgeronde hoeken, witte scheidingslijnen, vetgedrukte prijzen en compacte gecentreerde spatiëring bezoekers helpen om de vergelijking snel te scannen.

Het ronde portret boven de kaarten vormt een centraal beeldpunt en de gecentreerde alinea eronder biedt ondersteunende context zonder de rij met abonnementen te onderbreken. In de context van statische HTML kan dit blok de rol van prijsvergelijking vervullen, terwijl aangrenzende secties introducties, productdetails, getuigenissen of contactgegevens bieden. De lay-out is dan ook gereed als één afgewerkte sectie, niet als een volledige statische pagina of website. Het overkoepelende project kan als HTML worden geëxporteerd zodra de bredere paginastructuur compleet is, terwijl dit blok zijn eigen prijsvergelijkingsfunctie behoudt.