Margines hipertekstowego języka znaczników (HTML) to właściwość, która określa odstępy między elementami zewnętrznymi. Może być używany w kontekście dopełnienia, przestrzeni wewnątrz elementów, do wizualnego organizowania obiektów. Marginesy mogą być konieczne dla ułatwienia czytania, a także ze względów estetycznych. Gdy elementy są stłoczone blisko siebie, może to nadać witrynie zajęty wygląd, który może zniechęcać użytkowników. Prawidłowe odstępy z marginesem HTML tworzą bardziej zrównoważony, równy wygląd, który pozostaje interesujący wizualnie, ale nie przytłaczający.
Gdy programista ustawia margines HTML, może on przyjmować maksymalnie cztery wartości. Jeśli podana zostanie pojedyncza wartość, przeglądarka przyjmie, że marginesy wokół obiektu powinny być takie same ze wszystkich stron. W przypadku dwóch wartości użyje pierwszej dla góry i dołu, a drugiej dla lewej i prawej strony. Trzy wartości wyznaczają górny margines, wymiary po bokach i dolny. W przypadkach, gdy wszystkie cztery są zdefiniowane, przeglądarka ustawi górną, lewą, prawą i dolną część zgodnie ze specyfikacją.
Każdy margines HTML zapewnia pewną przestrzeń wizualną na zewnątrz elementu. W klasycznym przykładzie projektant stron internetowych może mieć pasek nawigacyjny u góry strony. Bez marginesów następny element, jak pudełko z zawartością, od razu stykałby się z paskiem nawigacyjnym. Nie wyglądałoby to zbyt przyjemnie, a także mogłoby utrudnić użytkownikom korzystanie z witryny. Margines HTML może zapewnić przestrzeń wokół treści, tworząc odstęp między menu a treścią, aby je wizualnie oddzielić.
Projektanci mogą ustawić margines HTML jako wartość procentową lub wartość taką jak em lub piksele. Najlepsza opcja może zależeć od preferencji projektanta oraz ogólnego wyglądu i stylu witryny. Ważne jest, aby w projekcie stosować spójne pomiary. Jeśli marginesy podane są na przykład w procentach, to powinno być dopełnienie, aby uniknąć konfliktów.
Inną kwestią mogą być zmiany rozmiaru lub wyświetlania ekranu, które mogą wystąpić na urządzeniach mobilnych lub komputerach, na których użytkownicy powiększają zawartość, aby była czytelna. Jeśli projekt nie jest elastyczny, zawartość może wylewać się z pojemników, spływać ze strony lub nie być odpowiednio powiększana. Może to utrudnić czytanie witryny, a w niektórych przypadkach może spowodować uszkodzenie treści, przez co użytkownicy w ogóle nie będą mogli uzyskać do niej dostępu. Podczas testów projektanci mogą badać kilka różnych przeglądarek i eksperymentować z powiększaniem i zmniejszaniem, aby zobaczyć, co dzieje się z wyświetlaczem.