Zamieszczony kod HTML formularza zostanie wyświetlony przez przeglądarkę w sposób: <form>
stanowisko: <input type="text"> <br>
obowiązki: <br>
<input type="checkbox" name="obowiazki1" value="1" disabled checked> sporządzanie dokumentacji<br>
<input type="checkbox" name="obowiazki2" value="2" checked>pisanie kodu<br>
<input type="checkbox" name="obowiazki3" value="3">testy oprogramowania<br>
</form>
Odpowiedź D wynika bezpośrednio z kolejności elementów i atrybutów w formularzu HTML. Po napisie stanowisko: znajduje się pole tekstowe input type=text, a zaraz po nim znacznik przełamania linii br, więc tekst obowiązki: musi pojawić się w następnym wierszu. Po obowiązki: jest następne br, dlatego lista pól checkbox zaczyna się jeszcze niżej. Pierwszy checkbox ma jednocześnie atrybuty disabled oraz checked, więc będzie zaznaczony, ale nieaktywny, zwykle wyszarzony i użytkownik nie będzie mógł go odznaczyć. To ważny szczegół, bo samo disabled nie usuwa zaznaczenia z ekranu. Drugi checkbox ma checked, więc jest zaznaczony normalnie. Trzeci nie ma checked, więc pozostaje pusty. Moim zdaniem to dobry przykład na to, że w HTML często decydują małe atrybuty bez wartości, takie jak checked, disabled czy required. W praktyce przy formularzach trzeba też pamiętać, że pole disabled nie jest wysyłane z formularzem do serwera, nawet jeśli wygląda na zaznaczone. To jest zgodne z działaniem standardowych kontrolek formularzy HTML i ma znaczenie np. przy projektowaniu ankiet, paneli administracyjnych albo formularzy rekrutacyjnych.
W tym przykładzie łatwo pomylić wygląd formularza, jeśli patrzy się tylko na treść etykiet, a nie na strukturę HTML. Znacznik br wymusza przejście do nowej linii, więc układ, w którym napis obowiązki: znajduje się w tym samym wierszu co pole tekstowe albo pierwszy checkbox, nie pasuje do podanego kodu. Po polu tekstowym jest br, a po napisie obowiązki: jest kolejny br. Przeglądarka nie układa więc wszystkiego obok siebie, tylko przechodzi liniami zgodnie z kodem. Druga typowa pułapka dotyczy atrybutu checked. Jeśli checkbox ma checked, to jest zaznaczony przy wyświetleniu strony. Nie ma znaczenia, że pierwszy checkbox ma też disabled — on nadal jest zaznaczony, tylko zablokowany dla użytkownika i zwykle wygląda na wyszarzony. Częsty błąd myślowy polega na uznaniu, że disabled oznacza brak zaznaczenia, a tak nie jest. disabled oznacza brak możliwości edycji i brak wysłania wartości przy submit, nie zmianę stanu wizualnego z checked na unchecked. Niepoprawne są też warianty, w których zaznaczony jest checkbox testy oprogramowania, ponieważ trzeci input nie ma atrybutu checked. W HTML stan początkowy pola wyboru nie wynika z tekstu obok pola ani z kolejności name czy value, tylko z obecności atrybutu checked. Z mojego doświadczenia najlepiej analizować takie zadania linia po linii: najpierw układ tworzony przez br, potem typy pól, a dopiero na końcu atrybuty checked i disabled. Wtedy nie miesza się wyglądu z logiką formularza.