KWALIFIKACJA INF3 - STYCZEŃ 2018

PYTANIE NR 4.
W języku HTML, atrybut shape znacznika area, określający typ obszaru, może przyjąć wartość
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Atrybut shape w elemencie <area> określa kształt obszaru klikalnego w mapie obrazka.
Poprawne, zdefiniowane w HTML wartości to m.in. rect (prostokąt), circle (okrąg) i poly (wielokąt). Wartości typu "square" lub "triangle" nie są standardowymi wartościami shape.

Pełne wyjaśnienie:

Atrybut shape w elemencie <area> służy do wskazania, jaki kształt geometryczny ma opisywany obszar aktywny (klikalny) w mapie obrazka. Ten mechanizm działa w połączeniu z elementem <map> oraz atrybutem coords, który podaje współrzędne dopasowane do wybranego kształtu.

Poprawny zestaw wartości w odpowiedzi: rect, poly, circle obejmuje trzy typowe, standardowe kształty:

  • rect – obszar prostokątny (współrzędne zwykle opisują dwa przeciwległe narożniki).
  • circle – obszar kołowy/okrąg (współrzędne opisują środek i promień).
  • poly – obszar wielokąta (współrzędne są parą punktów tworzących wierzchołki).

Odpowiedzi zawierające "square" lub "triangle" są błędne, ponieważ są to intuicyjne angielskie nazwy figur, ale nie stanowią zdefiniowanych w standardzie HTML słów kluczowych dla atrybutu shape. W praktyce kwadrat nie jest osobną wartością, bo da się go opisać jako szczególny przypadek rect, a trójkąt jako szczególny przypadek poly (wielokąt o trzech wierzchołkach). To jednak nie zmienia faktu, że w samym atrybucie należy użyć wartości przewidzianych przez specyfikację.

Wskazówka egzaminacyjna: zapamiętaj, że w <area> dominują krótkie słowa kluczowe opisujące "rodzinę" kształtów (rect/circle/poly), a nie pełna lista wszystkich figur geometrycznych, które przychodzą do głowy.

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Mapa obrazka (image map) pozwala zdefiniować kilka różnych obszarów klikalnych na jednym obrazie. Realizuje się to zwykle przez elementy <map> i <area>, gdzie każdy <area> wskazuje inny link i inny fragment grafiki.
Element <area> opisuje pojedynczy obszar aktywny w mapie obrazka: określa jego kształt (np. rect/circle/poly), współrzędne (coords) oraz cel nawigacji (np. href). Dzięki temu różne miejsca na grafice mogą prowadzić do różnych adresów.
Atrybut shape wybiera typ figury, którą opisujesz w <area>. Od tej wartości zależy, jak interpretowane są współrzędne w atrybucie coords. Najczęściej spotkasz rect, circle oraz poly.
W praktyce egzaminacyjnej najczęściej pojawiają się podstawowe wartości: rect, circle i poly. Warto umieć skojarzyć je z typem obszaru (prostokąt, okrąg, wielokąt) oraz z tym, że współrzędne opisuje się w atrybucie coords.
To intuicyjne nazwy figur, ale w HTML atrybut shape używa zdefiniowanych słów kluczowych, a nie dowolnych nazw. Kwadrat da się opisać jako szczególny przypadek rect, a trójkąt jako szczególny przypadek poly, więc nie ma osobnych wartości.
Częsty błąd to dobór współrzędnych niepasujących do kształtu (np. podanie wielu punktów dla circle) albo użycie "logicznych" nazw figur, których HTML nie przewiduje. Pomaga zapamiętanie: rect i circle są proste, a poly wymaga listy wierzchołków.
Warto użyć poly, gdy obszar klikalny ma nieregularny kształt i prostokąt byłby zbyt "szeroki" (łapałby puste miejsce obrazu). Wielokąt pozwala dopasować klikany fragment dokładniej, kosztem konieczności podania większej liczby punktów w coords.
Są spotykane rzadziej niż kiedyś, ale nadal występują w serwisach z dużą ilością grafiki nawigacyjnej (np. schematy, plany, infografiki) oraz w starszych projektach. Na egzaminie warto je znać, bo sprawdzają podstawy HTML i atrybutów.
Najprościej otworzyć stronę w przeglądarce i testować klikanie w różne fragmenty obrazu. Dodatkowo w narzędziach deweloperskich można podejrzeć DOM oraz atrybuty <area>. Jeśli kształt jest zły, klik "łapie" poza oczekiwanym miejscem.
Przećwicz krótkie skojarzenia: shape wybiera typ figury, a coords opisuje jej parametry. Zrób mały przykład z <map> i trzema <area>: rect, circle i poly. To zwykle wystarcza do pytań testowych.
info

Statystycznie 69% uczniów zna prawidłową odpowiedź. średnie

W praktyce zawodowej kluczowe jest to, że atrybut shape w elemencie &lt;area&gt; określa kształt obszaru klikalnego w mapie obrazka.Poprawne, zdefiniowane w HTML wartości to m.in. rect (prostokąt), circle (okrąg) i poly (wielokąt).

Źródła:

  • MDN Web Docs: "&lt;area&gt;: The Image Map Area element" – sekcja dotycząca atrybutu shape, https://developer.mozilla.org/en-US/docs/Web/HTML/Element/area (dostęp: 2026-03-01)
  • WHATWG HTML Living Standard: "Image maps" – definicje elementów &lt;map&gt; i &lt;area&gt; oraz atrybutów, https://html.spec.whatwg.org/multipage/image-maps.html (dostęp: 2026-03-01)
  • W3C: "HTML 5.2" (Recommendation) – rozdział o image maps i elemencie area, https://www.w3.org/TR/html52/semantics-embedded-content.html#the-area-element (dostęp: 2026-03-01)

Materiały:

  • Dokumentacja MDN: element &lt;area&gt; i atrybuty map obrazów
  • Specyfikacja HTML (WHATWG): sekcja dotycząca image maps
  • Ćwiczenia praktyczne: zbudowanie &lt;map&gt; + kilku &lt;area&gt; z różnymi shape i coords

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego