KWALIFIKACJA INF3 - TEST WIEDZY NR 4

PYTANIE NR 13.
Rozważ następujący fragment kodu HTML:
<table>
  <tr>
    <th>Imię</th>
    <th>Nazwisko</th> 
  </tr>
  <tr>
    <td>Jan</td>
    <td>Kowalski</td>
  </tr>
</table>
Zauważyłeś, że tabela nie wyświetla się poprawnie w jednej z przeglądarek. Co powinieneś zrobić?
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Jeśli tabela w jednej przeglądarce renderuje się błędnie, pierwszym krokiem jest diagnostyka: sprawdzenie DOM i kodu źródłowego w tej przeglądarce oraz komunikatów w narzędziach deweloperskich. To pozwala wykryć błąd składni, problem z CSS lub różnice w interpretacji standardu.

Pełne wyjaśnienie:

Gdy tabela HTML (np. zbudowana z <table>, <tr>, <th> i <td>) nie wyświetla się poprawnie tylko w jednej przeglądarce, najbardziej profesjonalnym podejściem jest debugowanie w środowisku, w którym występuje błąd. Dlatego właściwe działanie to sprawdzenie kodu/DOM oraz komunikatów w narzędziach deweloperskich tej przeglądarki.

W praktyce oznacza to m.in.:

  • inspekcję elementu tabeli w drzewie DOM (czy przeglądarka nie "naprawiła" błędnej składni inaczej niż pozostałe),
  • sprawdzenie, czy tabela nie jest ukrywana lub deformowana przez CSS (np. display, overflow, border-collapse, style globalne),
  • weryfikację błędów/ostrzeżeń w konsoli oraz reguł w panelu "Styles/Computed",
  • ewentualną walidację HTML w celu wykrycia niepoprawnej struktury tabeli.

Odpowiedź "Zignoruj problem, ponieważ tabela wyświetla się poprawnie w innych przeglądarkach." jest nieprawidłowa, bo zgodność międzyprzeglądarkowa jest standardowym wymaganiem jakościowym; użytkownicy mogą korzystać z różnych silników renderujących, a błąd może dotyczyć istotnej grupy odbiorców.

Odpowiedź "Zmień kod HTML na inny język programowania." jest nieadekwatna: problem dotyczy renderowania HTML (i zwykle CSS), więc zmiana "języka" nie jest sensowną metodą naprawy. Najpierw diagnozuje się przyczynę, a dopiero potem wprowadza minimalną poprawkę.

Odpowiedź "Zgłoś problem do producenta przeglądarki." bywa uzasadniona dopiero wtedy, gdy po weryfikacji okaże się, że kod jest poprawny, a błąd wynika z defektu konkretnej wersji przeglądarki. W typowych zadaniach egzaminacyjnych oczekuje się jednak podstawowej czynności: sprawdzenia kodu i zachowania strony w narzędziach deweloperskich.

Wskazówka egzaminacyjna: gdy w treści jest "w jednej przeglądarce", najczęściej testowana jest umiejętność systematycznego debugowania i weryfikacji HTML/CSS/DOM, a nie eskalacja problemu lub "obejścia" bez analizy.

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Najpierw debuguj w tej przeglądarce: otwórz narzędzia deweloperskie, sprawdź DOM tabeli i style CSS oraz komunikaty w konsoli. Różnice renderowania często wynikają z niepoprawnej składni HTML lub reguł CSS interpretowanych inaczej przez silniki.
Zweryfikuj strukturę <table>: wiersze w <tr>, komórki nagłówka w <th> i dane w <td>. Dodatkowo użyj walidatora HTML (np. W3C Validator), aby wychwycić brakujące znaczniki lub nieprawidłowe zagnieżdżenia.
Bo użytkownicy korzystają z różnych przeglądarek i wersji. Błąd może dotyczyć realnej części odbiorców, obniżać dostępność i wiarygodność serwisu. W projektach webowych standardem jest testowanie i poprawianie problemów cross-browser, a nie uznawanie ich za "nieistotne".
Przydatne są: inspektor elementów (DOM), panel stylów (Styles/Computed), podgląd box modelu, oraz konsola (błędy i ostrzeżenia). Dzięki temu sprawdzisz, czy tabela nie jest ukryta przez CSS, czy ma poprawne wymiary i czy przeglądarka nie zmieniła struktury DOM.
Tak. Nawet poprawne <table> może wyglądać "źle" przez CSS: np. border-collapse, border-spacing, display, overflow, width, line-height czy style globalne narzucone na <table> i <td>. Dlatego w debugowaniu zawsze sprawdzaj zarówno HTML, jak i reguły CSS.
Dopiero po potwierdzeniu, że kod jest poprawny (walidacja, testy) i problem występuje w konkretnej wersji przeglądarki mimo zgodności ze standardem. Wtedy warto przygotować minimalny przykład (repro) i zgłosić błąd. W większości przypadków przyczyną jest jednak kod lub CSS strony.
Usuń wszystko, co nie jest konieczne: zostaw sam HTML tabeli i minimalne CSS, które powoduje błąd. Sprawdź, czy problem nadal występuje. Taki "mini-projekt" ułatwia znalezienie przyczyny, porównanie między przeglądarkami i ewentualne zgłoszenie błędu.
Walidator wykrywa błędy składni i zagnieżdżeń (np. brak zamknięcia <tr> lub pomieszane <th>/<td>), które różne silniki mogą "naprawiać" inaczej. Usunięcie błędów walidacji często eliminuje rozjazdy wyglądu między przeglądarkami.
Zwykle nie. Jeśli problem dotyczy renderowania HTML/CSS, to najpierw trzeba zdiagnozować błąd w HTML lub w stylach, a nie przepisywać całość na inny język. Poprawa powinna być możliwie mała i celowana (np. naprawa znacznika, selektora, reguły CSS).
Częste problemy to: niepoprawne zagnieżdżenia wierszy i komórek, brak zamknięcia tagów, mylenie <th> z <td>, oraz nadpisanie wyglądu tabel przez globalne CSS. Na egzaminie opłaca się sprawdzać poprawność struktury i pamiętać o testach w narzędziach deweloperskich.
info

Statystycznie 77% uczniów zna prawidłową odpowiedź. średnio łatwe

Według specjalistów z branży: "Jeśli tabela w jednej przeglądarce renderuje się błędnie, pierwszym krokiem jest diagnostyka: sprawdzenie DOM i kodu źródłowego w tej przeglądarce oraz komunikatów w narzędziach deweloperskich."

Źródła:

  • MDN Web Docs: HTML &lt;table&gt; — https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table (dostęp: 2026-03-01)
  • MDN Web Docs: &lt;th&gt; — https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th (dostęp: 2026-03-01)
  • WHATWG HTML Living Standard: The table element — https://html.spec.whatwg.org/multipage/tables.html#the-table-element (dostęp: 2026-03-01)

Materiały:

  • Dokumentacja MDN Web Docs: elementy tabel HTML oraz narzędzia deweloperskie
  • Specyfikacja HTML (WHATWG): semantyka i parsing elementów tabel
  • Materiały o walidacji HTML (W3C Validator) i podstawach debugowania front-end

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego