Wyniki egzaminu

Informacje o egzaminie:
  • Zawód: Technik informatyk
  • Kwalifikacja: INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych
  • Data rozpoczęcia: 15 grudnia 2025 10:39
  • Data zakończenia: 15 grudnia 2025 11:13

Egzamin zdany!

Wynik: 21/40 punktów (52,5%)

Wymagane minimum: 20 punktów (50%)

Pochwal się swoim wynikiem!
Szczegółowe wyniki:
Pytanie 1

Co można powiedzieć o przedstawionym zapisie języka HTML5?

<title>Strona o psach</title>
A. Jest jedynie informacją dla robotów wyszukiwarek i nie jest wyświetlany przez przeglądarkę.
B. Jest opcjonalny w języku HTML5 i nie musi występować w dokumencie.
C. Pojawi się na karcie dokumentu w przeglądarce.
D. Zostanie wyświetlony w treści strony, na samej górze.
Brawo, Twoja odpowiedź jest prawidłowa! Znacznikiw języku HTML 5 służy do określenia tytułu strony internetowej, który jest wyświetlany na karcie przeglądarki. Nie jest to opcjonalna informacja - każda strona powinna mieć tytuł dla lepszej identyfikacji i optymalizacji SEO (Search Engine Optimization). Tytuł strony jest jednym z kluczowych elementów dla SEO, ponieważ wyszukiwarki internetowe, takie jak Google, często wykorzystują tytuł strony jako główny link w wynikach wyszukiwania. Tytuł strony jest również ważny z punktu widzenia użytkownika - dobrze sformułowany tytuł może przyciągnąć uwagę potencjalnego odbiorcy i zachęcić go do odwiedzenia strony. Warto zauważyć, że tytuł nie jest wyświetlany bezpośrednio na stronie, ale na pasku tytułu przeglądarki lub na karcie strony. To ważne rozróżnienie pomaga zrozumieć, dlaczego niektóre elementy są widoczne dla użytkownika, a inne nie.

Pytanie 2

Jaką wartość w formacie RGB będzie miała barwa oznaczona kodem heksadecymalnym: #1510FE?

A. rgb(21, 16, 254)
B. rgb(21, 16, 255)
C. rgb(21, 16, FE)
D. rgb(15, 10, FE)
Odpowiedź rgb(21, 16, 254) jest dobra, bo te wartości RGB pochodzą z kodu heksadecymalnego #1510FE. W tym kodzie każda para cyfr pokazuje, jak mocno świeci dany kolor: od 00, co oznacza brak koloru, do FF, gdzie mamy pełną intensywność. W naszym przypadku, pierwsza para '15' to kolor czerwony, '10' to zielony, a 'FE' to niebieski. Jak to przeliczymy na dziesiętny, to '15' daje nam 21, '10' daje 16, a 'FE' to 254. I stąd mamy rgb(21, 16, 254). Te wartości są super przydatne, na przykład przy tworzeniu stylów CSS, gdzie kolory są podstawą. Warto ogarnąć, jak przerabiać kolory z jednego formatu na drugi – to naprawdę pomaga w projektowaniu grafiki i stron www.

Pytanie 3

Znacznik <pre> </pre> służy do prezentacji

A. znaku przekreślenia
B. treści polską czcionką
C. znaku wielokropka
D. treści czcionką o stałej szerokości
Wybór znaków przekreślenia, znaków wielokropka czy treści polską czcionką jest niepoprawny, ponieważ żaden z tych elementów nie jest związany z funkcją znacznika <pre>. Po pierwsze, znaki przekreślenia są używane w HTML do zaznaczania tekstu, który ma być przedstawiony jako przekreślony, co nie ma nic wspólnego z preformatowaniem tekstu. Element <s> lub <del> jest odpowiedzialny za takie formatowanie, a nie <pre>. Kolejną pomyłką jest zrozumienie roli wielokropka. W HTML nie istnieje znacznik, który odpowiada za wyświetlanie wielokropka w specyficzny sposób poza standardowym tekstem. W rzeczywistości wielokropek jest jedynie trzema kropkami i nie ma potrzeby go formatować w kontekście preformatowanego tekstu. Ostatnia z wymienionych odpowiedzi, sugerująca, że <pre> służy do wyświetlania treści polską czcionką, jest również błędna. HTML nie definiuje czcionek narodowych; zamiast tego, czcionki są kontrolowane przez CSS, a nie przez znaczniki HTML. Z tego powodu znaczniki <pre> nie mają żadnego wpływu na wybrany styl czcionki, a ich główną funkcją jest zachowanie formatowania tekstu, co czyni je idealnym narzędziem do wyświetlania kodu źródłowego, a nie do stylizacji typograficznej.

Pytanie 4

Która z czynności nie wpłynie na objętość zajmowanej pamięci pliku graficznego?

A. Kompresja
B. Zmiana rozmiaru obrazu przy użyciu atrybutów HTML
C. Modyfikacja rozdzielczości obrazu
D. Interpolacja
Zmiana rozdzielczości obrazu, kompresja oraz interpolacja to techniki, które zdecydowanie wpływają na rozmiar pliku graficznego. Zmiana rozdzielczości obrazu polega na modyfikacji liczby pikseli w obrazie, co bezpośrednio wpływa na jego wagę. Im większa rozdzielczość, tym więcej danych jest przechowywanych, co skutkuje większym plikiem. W praktyce, jeśli zredukujemy rozdzielczość obrazu, jego rozmiar pliku również zmaleje, co może być przydatne w kontekście optymalizacji stron internetowych. Kompresja to kolejny kluczowy proces, który może znacznie wpłynąć na rozmiar pliku. Polega ona na zmniejszeniu ilości danych w pliku graficznym, co może być realizowane bez widocznej utraty jakości. Istnieją różne metody kompresji, takie jak JPEG, PNG czy WebP, z których każda ma swoje zastosowania w zależności od rodzaju obrazu i wymagań projektu. Interpolacja, z kolei, to technika stosowana podczas zmiany rozmiaru obrazów, która polega na obliczaniu nowych wartości pikseli na podstawie istniejących. W procesie tym może dojść do degradacji jakości obrazu, co w przypadku niewłaściwego zastosowania prowadzi do niepożądanych efektów wizualnych. Zrozumienie, jak te techniki wpływają na pliki graficzne, jest kluczowe dla każdego twórcy treści, który pragnie optymalizować swoje zasoby i zapewniać użytkownikom jak najlepsze doświadczenia podczas przeglądania stron internetowych.

Pytanie 5

Jaki jest efekt działania programu w JavaScript?

var osoba = prompt("Podaj imię", "Adam");
A. przypisanie do zmiennej osoba wartości "Adam"
B. otwarcie okna z polem do edycji, w którym znajduje się domyślny tekst "Adam"
C. uzyskanie z formularza wyświetlonego na stronie HTML imienia "Adam"
D. pojawi się okno z pustym polem do edycji
Kod var osoba = prompt('Podaj imię' 'Adam') używa funkcji prompt która jest specyficznym mechanizmem w JavaScript. Funkcja ta nie przypisuje bezpośrednio wartości Adam do zmiennej osoba w sposób jawny ale prezentuje użytkownikowi okno dialogowe z domyślną wartością. To okno dialogowe zawiera pole tekstowe które umożliwia edycję przez użytkownika. Użytkownik może pozostawić sugerowaną wartość Adam lub ją zmienić wprowadzając dane. W przypadku gdy użytkownik kliknie anuluj zmienna osoba zostanie ustawiona na null. Z tego powodu odpowiedź sugerująca bezpośrednie przypisanie wartości do zmiennej nie jest poprawna. Koncepcja pobrania imienia z formularza HTML również jest błędna ponieważ nie jest to forma interakcji z formularzem a z oknem dialogowym. Formularze HTML mają swoją własną strukturę i sposób manipulacji danymi który różni się od metody używanej w przypadku prompt. Kolejnym błędnym założeniem jest twierdzenie że okno dialogowe jest puste. Prompt oferuje możliwość podania domyślnej wartości co zostało zrealizowane w przykładzie poprzez umieszczenie Adama jako drugiego argumentu funkcji. Zrozumienie różnic w działaniu funkcji JavaScript oraz ich ograniczeń jest kluczowe w projektowaniu efektywnych interfejsów użytkownika na stronach internetowych. Programiści powinni być świadomi standardów i dobrych praktyk związanych z używaniem różnych metod interakcji w aplikacjach webowych by zapewnić optymalne doświadczenia użytkownika i kompatybilność z nowoczesnymi przeglądarkami internetowymi. Funkcje takie jak prompt są wygodne lecz ich użycie wymaga zrozumienia kontekstu i potencjalnych ograniczeń bezpieczeństwa oraz kompatybilności z przeglądarkami które mogą wpływać na sposób ich obsługi w bardziej złożonych aplikacjach webowych. Dlatego nowoczesne rozwiązania często korzystają z bardziej złożonych mechanizmów jak formularze HTML z dynamicznymi stylami i skryptami które pozwalają na większą kontrolę i elastyczność w interakcji z użytkownikiem.

Pytanie 6

Jak zostanie wyświetlony formularz HTML zawarty w podanym kodzie przez przeglądarkę?

A. stanowisko: obowiązki: sporządzanie dokumentacji pisanie kodu testy oprogramowania
B. stanowisko: obowiązki: sporządzanie dokumentacji pisanie kodu testy oprogramowania
C. stanowisko: obowiązki: sporządzanie dokumentacji pisanie kodu testy oprogramowania
D. stanowisko: obowiązki: sporządzanie dokumentacji pisanie kodu testy oprogramowania
Odpowiedzi, które są określone jako niepoprawne, zawierają pewne zniekształcenia w interpretacji struktury formularza HTML. Kluczowym błędem jest nieuznanie faktu, że checkbox z atrybutem 'disabled' ma wpływ tylko na możliwość interakcji użytkownika z tym elementem, a nie na jego wyświetlanie. W rzeczywistości checkboxy, nawet jeśli są zablokowane, są nadal renderowane w DOM oraz ich etykiety są widoczne dla użytkownika. W każdej z niepoprawnych odpowiedzi brak jest również pełnej jasności dotyczącej zastosowania atrybutów i ich wpływu na interakcję z formularzem. Błędne jest przyjmowanie, że atrybuty takie jak 'checked' i 'disabled' w sposób zasadniczy zmieniają wyświetlaną treść, gdy w rzeczywistości wpływają one jedynie na zachowanie elementów formularza. Aby zrozumieć, jak formularze są renderowane w HTML, ważne jest zwrócenie uwagi na każdy atrybut i jego znaczenie. W kontekście budowania interfejsów użytkownika, zasady dostępności i użyteczności podkreślają znaczenie pełnej przejrzystości opcji, co pozwala uniknąć nieporozumień. Typowym błędem myślowym jest również utożsamianie interakcji użytkownika z prezentacją wizualną, co prowadzi do błędnych wniosków o tym, co jest wyświetlane. W przypadku formularzy ważne jest przemyślenie, jak użytkownik interpretuje i wchodzi w interakcję z elementami na stronie, a także jak te elementy są prezentowane wizualnie, aby zapewnić pełne zrozumienie dostępnych opcji.

Pytanie 7

Komunikat błędu generowany przez walidator HTML może wskazywać na

A. zamknięciu znacznika <p>, mimo że wcześniej nie był on otwarty
B. brak zamknięcia znaczników zagnieżdżonych wewnątrz znacznika <p> przed jego zakończeniem
C. niezgodną ilość znaczników <p> otwartych i zamkniętych
D. brak zamknięcia znacznika <p>
Błąd mówi, że zamknąłeś znacznik <p>, ale niektóre znaczniki wewnętrzne, jak <a>, pozostają otwarte. To nie chodzi o to, żeby zamknąć <p> bez wcześniejszego otwarcia, ale o to, że musisz zamknąć wszystkie zagnieżdżone znaczniki przed zamykaniem nadrzędnego. Jeśli to zrobisz, to wszystko powinno działać lepiej i strona powinna się wyświetlać tak, jak chcesz.

Pytanie 8

W jakiej technologii nie zachodzi możliwość przetwarzania danych wprowadzanych przez użytkowników na stronach internetowych?

A. PHP
B. AJAX
C. CSS
D. JavaScript
CSS (Cascading Style Sheets) to język stylów, który służy do opisywania wyglądu i formatu dokumentów HTML. Jego głównym celem jest kontrolowanie układu, kolorów, czcionek oraz innych aspektów wizualnych strony internetowej. CSS nie ma możliwości przetwarzania danych wprowadzanych przez użytkowników, gdyż nie posiada funkcji logiki programistycznej ani operacji na danych. Przykładowo, CSS może zmieniać kolor tła lub rozmiar tekstu, ale nie może zbierać informacji z formularzy ani reagować na interakcje użytkownika w sposób, w jaki robią to języki programowania takie jak JavaScript czy PHP. Może to prowadzić do mylnych przekonań, że CSS jest bardziej wszechstronny, niż jest w rzeczywistości, jednak jego zastosowanie ogranicza się wyłącznie do aspektów stylistycznych. W praktyce, aby przetwarzać dane użytkownika, niezbędne są inne technologie, które mogą współpracować z CSS, ale same w sobie nie są w stanie tego zrobić.

Pytanie 9

W CSS, aby ustawić wcięcie pierwszej linii akapitu na 30 pikseli, należy użyć następującego zapisu

A. p { line-indent: 30px; }
B. p { line-height: 30px; }
C. p { text-spacing: 30px; }
D. p { text-indent: 30px; }
Analizując inne opcje, można zauważyć, że zapisy takie jak line-indent, line-height, czy text-spacing nie są poprawne w kontekście wcięcia pierwszej linii akapitu w CSS. Właściwość line-indent nie istnieje w specyfikacji CSS, co czyni tę odpowiedź zupełnie niewłaściwą. Użytkownicy mogą mylić terminologię, sądząc, że line-indent odnosi się do wcięcia, jednak nie jest to termin rozpoznawany przez standardy CSS. Bardziej odpowiednią właściwością do modyfikacji wysokości linii jest line-height, która jednak nie ma związku z wcięciem tekstu, lecz z odstępem pomiędzy poszczególnymi liniami tekstu w akapicie. Użycie line-height do uzyskania wcięcia prowadzi do nieporozumień i niepożądanych efektów wizualnych. Z kolei text-spacing, będący inną niepoprawną odpowiedzią, nie jest uznaną właściwością CSS i nie wpływa na wcięcia. Dobre praktyki w projektowaniu stron internetowych wymagają znajomości standardów CSS i ich zastosowania w praktyce. Ważne jest, aby przyzwyczaić się do stosowania właściwości, które są uznawane przez wiodące przeglądarki i standardy webowe, aby uniknąć takich błędów i uzyskać zamierzony efekt wizualny. Zapewnienie, że używamy odpowiednich właściwości, jest kluczowe dla poprawności i jakości kodu CSS, który ma bezpośredni wpływ na końcowy rezultat, czyli wygląd i funkcjonalność stron internetowych.

Pytanie 10

Które ze znaczników HTML umożliwią wyświetlenie na stronie tekstu w jednym wierszu, jeżeli żadne formatowanie CSS nie zostało zdefiniowane?

Dobre strony mojej strony

A. <h3>Dobre strony </h3><h3 style=”letter-spacing:3px”>mojej strony</h3>
B. <p>Dobre strony </p><p style=”letter-spacing:3px”>mojej strony</p>
C. <div>Dobre strony </div><div style=”letter-spacing:3px”>mojej strony</div>
D. <span>Dobre strony </span><span style=”letter-spacing:3px”>mojej strony</span>
Niestety, Twoja odpowiedź nie była prawidłowa. Wybrałeś jedną z odpowiedzi zawierających znaczniki blokowe: <p>, <h3> lub <div>. Te znaczniki domyślnie zaczynają nowy wiersz przed i po swoim zakończeniu, co oznacza, że tekst zawarty w kolejnych takich znacznikach będzie wyświetlany w oddzielnych wierszach. To jest dobre podejście, kiedy chcemy utworzyć strukturę dokumentu z wyraźnie zdefiniowanymi sekcjami. Jednak w przypadku pytania, które polegało na wyświetlaniu tekstu w jednym wierszu bez dodatkowego formatowania CSS, odpowiedzi z użyciem tych znaczników są niepoprawne. W takim przypadku powinniśmy skorzystać z znacznika liniowego <span>, który nie wprowadza nowych linii. Ważne jest, aby dobrze rozumieć różnice między znacznikami liniowymi i blokowymi, ponieważ mają one istotne znaczenie dla struktury i wyglądu naszej strony internetowej.

Pytanie 11

W sekcji <head> (w elemencie <meta ... >) witryny www nie umieszcza się danych dotyczących

A. automatycznego odświeżania
B. typu dokumentu
C. autora
D. kodowania
Umieszczanie informacji o autorze, kodowaniu oraz automatycznym odświeżaniu w znaczniku <head> jest praktyką zgodną ze standardami, jednak występują nieporozumienia co do roli i miejsca deklaracji typu dokumentu. Wiele osób może błędnie zakładać, że typ dokumentu można umieścić w sekcji <head>, co jest nieprawidłowe. Deklaracja DOCTYPE, która informuje przeglądarkę o wersji HTML, musi być umieszczona przed znacznikiem <html> w kodzie. Tymczasem w sekcji <head> umieszczamy metadane, które mają bezpośredni wpływ na interpretację zawartości strony i jej interakcję z użytkownikami oraz wyszukiwarkami. Często popełnianym błędem jest mylenie tych dwóch elementów, co prowadzi do nieprawidłowego kodowania strony. Odpowiednie zrozumienie struktury dokumentu HTML jest kluczowe dla jego prawidłowego funkcjonowania; nieprawidłowe umiejscowienie deklaracji DOCTYPE może prowadzić do nieoczekiwanych zachowań w przeglądarkach, takich jak błędy w renderowaniu lub problemy z kompatybilnością. Dlatego ważne jest, aby znać zasady dotyczące tworzenia struktury dokumentów HTML, co przyczynia się do lepszej jakości kodu oraz większej wydajności stron internetowych.

Pytanie 12

Aby poprawić prędkość ładowania strony z grafiką o wymiarach 2000 px na 760 px, konieczne jest zmniejszenie rozmiarów grafiki?

A. w programie graficznym
B. za pomocą atrybutów HTML
C. za pomocą właściwości CSS, podając rozmiar w pikselach
D. za pomocą właściwości CSS, podając rozmiar w procentach
Zwiększenie szybkości działania strony internetowej z grafiką o wymiarach 2000 px na 760 px jest kluczowym zadaniem dla zapewnienia lepszej wydajności i doświadczeń użytkowników. Zmniejszenie rozmiarów grafiki w programie graficznym przed jej umieszczeniem na stronie jest najlepszą praktyką. Poprzez optymalizację obrazu możemy znacznie zmniejszyć jego wagę, co przyspiesza ładowanie strony. Programy graficzne, takie jak Adobe Photoshop czy GIMP, oferują różne narzędzia do kompresji obrazów bez zauważalnej utraty jakości. Dodatkowo, stosowanie formatów plików odpowiednich do rodzaju grafiki, jak JPEG dla zdjęć lub PNG dla grafik z przezroczystością, może przyczynić się do dalszej optymalizacji. Warto również pamiętać o technikach, takich jak lazy loading, które pozwalają na ładowanie obrazów w miarę przewijania strony, co również wpływa na szybkość ładowania. Te czynności są zgodne z zasadami SEO i wynikami stron w wyszukiwarkach, co czyni je kluczowymi dla każdego twórcy internetowego.

Pytanie 13

W kodzie źródłowym zapisanym w języku HTML wskaż błąd walidacji dotyczący tego fragmentu. <h6>CSS</h6>
<p>Kaskadowe arkusze stylów <b>ang.<i>Cascading Style Sheets</b></i>)<br>to język służący...</p>

A. Znak br nie może być użyty wewnątrz znacznika p.
B. Znacznik h6 jest nieznany.
C. Znak br nie został prawidłowo zamknięty.
D. Znak zamykający /b jest niezgodny z zasadą zagnieżdżania.
Wszystkie trzy niepoprawne odpowiedzi zawierają błędne interpretacje kwestii walidacji kodu HTML w analizowanym fragmencie. Odpowiedź dotycząca nieznanego znacznika h6 jest błędna, ponieważ znacznik <h6> jest w pełni akceptowany w HTML jako znacznik nagłówka o najmniejszym znaczeniu. Zgodnie z specyfikacją HTML5, tego rodzaju znaczniki są używane do strukturyzacji treści, a ich użycie jest zalecane dla zachowania hierarchii informacji. Kolejna niepoprawna odpowiedź, dotycząca niedomkniętego znacznika <br>, jest również myląca, ponieważ znacznik <br> jest znakiem nowej linii i nie wymaga zamknięcia, co jest zgodne z zasadami HTML. Jego użycie wewnątrz znacznika <p> jest również dozwolone, chociaż nadmierne użycie <br> do łamania wierszy w paragrafach nie jest zalecane z perspektywy semantycznej i dostępności. Wreszcie, stwierdzenie, że znacznik <br> nie może występować wewnątrz znacznika <p>, jest mylne; znacznik <br> jest specjalnie zaprojektowany do użycia w kontekście tekstu i jego umiejscowienie w paragrafach jest jak najbardziej prawidłowe. W związku z tym wszystkie te odpowiedzi nie są zgodne z aktualnymi standardami HTML.

Pytanie 14

Aby zgrupować elementy w jeden blok, jaki znacznik można zastosować?

A. <span>
B. <p>
C. <div>
D. <param>
Znacznik <div> jest używany do grupowania elementów w blok i jest jednym z najważniejszych elementów w HTML. Jego główną funkcją jest umożliwienie tworzenia struktury dokumentu oraz zarządzanie layoutem poprzez CSS. Przykładowo, można używać <div> do tworzenia sekcji na stronie, takich jak nagłówki, stopki czy kolumny, co ułatwia organizację treści i poprawia czytelność kodu. Dobrą praktyką jest stosowanie <div> w połączeniu z odpowiednimi klasami CSS, co pozwala na precyzyjne dostosowanie stylów do różnych elementów. W kontekście dostępności, użycie <div> powinno być przemyślane, aby nie wprowadzać chaosu w strukturze strony, co może być problematyczne dla technologii wspomagających. Zgodnie z wytycznymi W3C, każdy z używanych znaczników powinien mieć dobrze zdefiniowane zadanie, a <div> idealnie spełnia rolę kontenera dla innych elementów, poprawiając w ten sposób semantykę i organizację dokumentu.

Pytanie 15

W CSS jednostką miary, która jest wyrażona w punktach edytorskich, oznaczana jest symbolem

A. pt
B. in
C. px
D. em
Jednostki 'em', 'px' oraz 'in' nie są związane z punktami edytorskimi, co czyni je nieodpowiednimi w tym kontekście. 'em' jest jednostką miary, która jest zależna od rozmiaru czcionki elementu nadrzędnego. To oznacza, że wartość '1em' odpowiada rozmiarowi czcionki zastosowanemu w danym kontekście. Używanie 'em' jest korzystne w przypadku responsywnego projektowania, ponieważ pozwala na skalowanie elementów w zależności od rozmiaru tekstu. Z kolei 'px', czyli piksel, to jednostka miary, która jest niezależna od rozmiaru czcionki i oznacza stałą wartość wyrażoną w pikselach. W świecie web designu, 'px' jest często preferowane ze względu na swoją przewidywalność i prostotę. Ostatnią z jednostek, 'in', oznacza cale i jest rzadko wykorzystywana w CSS, ponieważ jest bardziej związana z drukiem i rzadko stosowana w kontekście nawigacji webowej. W kontekście druku takie jednostki jak 'in' mogą być użyteczne, jednak w projektowaniu stron internetowych ich zastosowanie jest ograniczone. Każda z wymienionych jednostek ma swoje zastosowanie, ale nie można ich stosować zamiennie z 'pt', która jest jednoznacznie związana z punktami edytorskimi.

Pytanie 16

W kodzie HTML zdefiniowano formularz, który wysyła dane do pliku formularz.php. Po naciśnięciu przycisku typu submit przeglądarka przechodzi do poniższego adresu:

../formularz.php?imie=Anna&nazwisko=Kowalska
Na podstawie podanego adresu można stwierdzić, że dane do pliku formularz.php zostały przesłane metodą:
A. SESSION
B. POST
C. COOKIE
D. GET
Wybrana przez ciebie odpowiedź jest nieprawidłowa. Wybrałeś metodę POST, COOKIE lub SESSION jako sposób przesyłania danych do pliku formularz.php, ale na podstawie widocznego adresu URL, który zawiera parametry przekazane po znaku zapytania (?), odpowiedź jest GET. Metoda POST jest również popularna w przesyłaniu danych, ale różni się od GET tym, że dane są przesyłane w ciele żądania, nie są widoczne w pasku adresu. COOKIE to mechanizm, który pozwala na przechowywanie danych na stronie klienta, nie jest to metoda przesyłania danych do serwera. SESSION to technika, która pozwala na przechowywanie informacji po stronie serwera, która jest powiązana z konkretnym użytkownikiem za pomocą identyfikatora sesji. Żadna z tych technik (POST, COOKIE, SESSION) nie powoduje, że parametry są widoczne w adresie URL, co jest charakterystyczne dla metody GET.

Pytanie 17

Jakim zapisem w dokumencie HTML można stworzyć element, który wyświetli obraz kotek.jpg oraz tekst alternatywny "obrazek kotka"?

A. <img href="kotek.jpg" title="obrazek kotka">
B. <img src="kotek.jpg" title="obrazek kotka">
C. <img src="kotek.jpg" alt="obrazek kotka">
D. <img href="kotek.jpg" alt="obrazek kotka">
Odpowiedź <img src="kotek.jpg" alt="obrazek kotka"> jest poprawna, ponieważ zawiera element <img>, który jest standardowym rozwiązaniem do wyświetlania obrazów w dokumentach HTML. Atrybut src określa ścieżkę do pliku obrazu, co jest kluczowe dla poprawnego załadowania grafiki na stronie. Atrybut alt z kolei pełni istotną rolę w zapewnieniu dostępności treści; tekst alternatywny wyświetla się w przypadku, gdy obraz nie może zostać załadowany lub jest odczytywany przez programy dla osób niewidomych. Zastosowanie odpowiednich atrybutów jest zgodne z wytycznymi W3C dotyczącymi dostępności, co pozwala na tworzenie bardziej przyjaznych dla użytkowników stron internetowych. W praktyce, prawidłowe wykorzystanie atrybutu alt jest również korzystne dla SEO, ponieważ wyszukiwarki analizują te opisy przy ocenie kontekstu strony. Ważne jest, aby zawsze stosować zarówno src, jak i alt, aby zapewnić pełnię funkcji obrazu na stronie.

Pytanie 18

Który z przedstawionych rysunków ilustruje efekt działania zamieszczonego fragmentu kodu HTML?

Ilustracja do pytania
A. rys. A
B. rys. C
C. rys. B
D. rys. D
Odpowiedzi inne niż rys. C nie są poprawne z powodu błędnego zrozumienia jak działa atrybut rowspan w języku HTML. Gdy komórka tabeli posiada atrybut rowspan oznacza to że komórka ta rozciąga się pionowo na określoną liczbę wierszy. W przypadku braku zrozumienia tego mechanizmu można błędnie przypuszczać że każda komórka zaczyna się i kończy w obrębie jednego wiersza. Taki tok myślenia prowadzi do niepoprawnego rozmieszczenia elementów tabeli jak w rys. A lub D gdzie nie wzięto pod uwagę łączenia komórek w pionie. W odpowiedzi A pierwsza komórka nie obejmuje dwóch wierszy co jest sprzeczne z kodem. W odpowiedzi B z kolei drugi wiersz zawiera dwie komórki co również jest sprzeczne z kodem który definiuje tylko jedną. Takie błędy często wynikają z braku doświadczenia w używaniu zaawansowanych funkcji HTML co może prowadzić do mylnych wyobrażeń o tym jak kod przekłada się na widok strony. Atrybuty rowspan i colspan są kluczowe w kontekście strukturalnego podejścia do budowy stron internetowych i ich poprawne użycie ma istotne znaczenie dla dostępności oraz zrozumienia danych przez użytkowników i technologie wspomagające. Ważne jest także zrozumienie różnic między tworzeniem struktury a prezentacją co jest możliwe dzięki CSS zamiast nadużywania tabel do layoutów.

Pytanie 19

Które z podanych formatów NIE JEST zapisane w języku CSS?

Ilustracja do pytania
A. C
B. D
C. B
D. A
Odpowiedź C jest prawidłowa, ponieważ atrybut bgcolor jest przestarzałą metodą określania koloru tła w HTML i nie jest częścią CSS. CSS (Cascading Style Sheets) zostało stworzone, aby oddzielić prezentację dokumentu od jego struktury. Korzystanie z CSS pozwala na lepsze zarządzanie stylem i spójność w wyglądzie wielu stron internetowych. Atrybuty HTML związane z wyglądem, takie jak bgcolor, zostały zastąpione przez deklaracje w CSS. Na przykład w CSS można ustawić kolor tła całej strony za pomocą selektora body i właściwości background-color. Takie podejście jest bardziej elastyczne i zgodne z nowoczesnymi standardami. Dzięki CSS możliwe jest stosowanie zaawansowanych stylizacji, takich jak gradienty czy obrazy tła, które nie były dostępne w prostych atrybutach HTML. Przy projektowaniu stron internetowych zaleca się, aby unikać przestarzałych atrybutów HTML, które mogą być niekompatybilne z nowoczesnymi przeglądarkami i powodować problemy z dostępnością.

Pytanie 20

Która z list jest interpretacją podanego kodu?

Ilustracja do pytania
A. Rys. D
B. Rys. A
C. Rys. C
D. Rys. B
Kod HTML zawiera uporządkowaną listę ol z dwoma głównymi elementami muzyka i filmy Każdy z tych elementów ma zagnieżdżoną listę nieuporządkowaną ul z odpowiednimi wpisami W HTML użycie listy ol oznacza że elementy główne będą numerowane Kolejność elementów w kodzie muzyka a następnie filmy jest zgodna z ilustracją C gdzie każdy element nadrzędny zawiera swoją własną zagnieżdżoną listę nieuporządkowaną ul Prawidłowe zagnieżdżanie list jest kluczowe dla struktury semantycznej dokumentu HTML co ma znaczenie dla SEO i dostępności Dobrym przykładem praktyki jest używanie odpowiednich znaczników aby zachować logiczną hierarchię Użycie ol i ul w odpowiednich miejscach pozwala na lepsze zrozumienie i interpretację treści przez przeglądarki i czytniki ekranowe Zapewnienie poprawnej struktury list pomaga również w utrzymaniu porządku w kodzie i lepszym zarządzaniu stylem za pomocą CSS

Pytanie 21

W języku HTML w celu określenia słów kluczowych dla danej strony, należy zastosować następujący zapis

A. <meta name="keywords" = "psy, koty, gryzonie">
B. <meta name="description" content="psy, koty, gryzonie">
C. <meta name="keywords" content="psy, koty, gryzonie">
D. <meta keywords="psy, koty, gryzonie">
Poprawna odpowiedź to <meta name="keywords" content="psy, koty, gryzonie">, ponieważ jest to zgodne z aktualnymi standardami HTML i poprawną składnią. Element <meta> jest używany do dostarczania metadanych, które nie są wyświetlane bezpośrednio na stronie, ale mają kluczowe znaczenie dla wyszukiwarek internetowych i innych aplikacji. Atrybut 'name' definiuje typ metadanych, a 'content' zawiera konkretne informacje, w tym przypadku słowa kluczowe, które mają być używane przez wyszukiwarki do indeksowania strony. Przykład zastosowania tego elementu w kodzie HTML wyglądałby następująco: <head><meta name="keywords" content="psy, koty, gryzonie"></head>. Warto zauważyć, że chociaż atrybut 'keywords' nie jest już tak istotny jak kiedyś ze względu na zmiany w algorytmach wyszukiwarek, to jego poprawne zdefiniowanie wciąż pokazuje dbałość o standardy HTML. Dobrą praktyką jest aktualizowanie i dostosowywanie metadanych do aktualnych trendów SEO, co może zwiększyć widoczność strony w wynikach wyszukiwania.

Pytanie 22

W przedstawionej regule CSS: h1 {color: blue} h1 symbolizuje

A. selektor
B. klasę
C. wartość
D. deklarację
Wybierając jedną z pozostałych opcji, można popaść w pułapki typowych błędów związanych z interpretacją terminologii CSS. Na przykład, uznanie h1 za wartość jest mylne, ponieważ wartość odnosi się do konkretnego stylu, czyli w tym wypadku 'blue', który definiuje kolor tekstu. Odpowiedź sugerująca, że h1 to deklaracja, również jest nieprawidłowa; deklaracja to połączenie selektora z właściwością i jej wartością – w tym przypadku {color: blue} stanowi pełną deklarację, a h1 jest tylko częścią tej struktury. Selekcja elementów za pomocą klas, co sugerowałoby traktowanie h1 jako klasy, jest kolejną nieścisłością. Klasy są definiowane w CSS za pomocą kropki, jak w .className, i służą do przypisywania stylów do wielu elementów. H1, jako znacznik HTML, ma swoje zdefiniowane znaczenie w strukturze dokumentu, które jest inne niż klasy CSS. Warto zrozumieć te różnice, aby nie wprowadzać się w błąd podczas pracy z kaskadowymi arkuszami stylów. Efektywne użycie CSS wymaga precyzyjnego zrozumienia terminologii oraz struktury reguł, co pozwala na tworzenie bardziej złożonych i funkcjonalnych projekcji w web designie.

Pytanie 23

Aby przekształcić obraz z formatu JPEG do PNG bez utraty jakości, tak aby kolor biały w oryginalnym obrazie został zastąpiony przezroczystością w wersji docelowej, należy najpierw

A. załadować obraz do programu do edycji grafiki wektorowej
B. dodać kanał alfa
C. obniżyć rozdzielczość obrazu
D. usunięcie gumką wszystkich białych miejsc
Jeśli chodzi o błędne odpowiedzi, to zaimportowanie obrazu do edytora grafiki wektorowej nie jest najlepszym pomysłem w tej sytuacji. Edytory wektorowe, takie jak Adobe Illustrator, są stworzone do pracy z grafiką wektorową, a nie z rastrową, więc operowanie na pikselach, jak dodawanie przezroczystości w miejscach kolorów rastrowych, może być trudne, a czasem nawet niemożliwe. Poza tym, zmniejszenie rozdzielczości obrazu na pewno nie pomoże w dodaniu przezroczystości, a wręcz może spowodować utratę detali i jakości, co jest sprzeczne z celem tej konwersji. Używanie gumki do wymazywania wszystkich białych plam to też nie najlepsze rozwiązanie. Jest to czasochłonne i może prowadzić do przypadkowego usunięcia innych ważnych elementów. Z mojego doświadczenia wynika, że może to zostawiać niepożądane artefakty i obniżać jakość. Dlatego kluczowym krokiem w tym procesie, żeby uzyskać przezroczystość, jest dodanie kanału alfa. Tak można skutecznie zarządzać przezroczystością w wynikowym obrazie PNG, co jest zgodne z zasadami dobrego przetwarzania grafiki rastrowej.

Pytanie 24

Aby zaprojektować kształt logo dla strony WWW sposobem przedstawionym na obrazie, należy zastosować funkcję

Ilustracja do pytania
A. wykluczenia.
B. części wspólnej.
C. różnicy.
D. sumy.
Dobrze! Wybrano poprawną odpowiedź, którą jest 'wykluczenie'. Na przedstawionym obrazie mamy do czynienia z dwoma kształtami - jeden fioletowy, drugi czerwony. Fioletowy jest nałożony na czerwony i w wyniku tej operacji powstał nowy kształt, który pokazuje tylko te części czerwonego kształtu, które nie pokrywają się z fioletowym. Właśnie tak działa operacja wykluczenia w grafice komputerowej - wynikowa forma zawiera tylko te elementy jednego obiektu, które nie nakładają się z drugim obiektem. Jest to bardzo ważne narzędzie w projektowaniu graficznym, zwłaszcza w przypadku tworzenia logotypów, gdzie często zachodzi potrzeba nałożenia jednego kształtu na drugi, ale chcemy pokazać tylko te części pierwszego kształtu, które nie pokrywają się z drugim.

Pytanie 25

Podany fragment dokumentu HTML zawierający kod JavaScript sprawi, że po naciśnięciu przycisku

Ilustracja do pytania
A. obraz1.png zostanie zniknięty
B. obraz1.png zostanie wymieniony na obraz2.png
C. obraz2.png zostanie wymieniony na obraz1.png
D. obraz2.png zostanie zniknięty
W analizie odpowiedzi należy zwrócić uwagę na działanie technologii webowych w kontekście manipulacji elementami HTML. W pytaniu przedstawiono kod JavaScript używany w zdarzeniu onclick przycisku HTML co prowadzi do zmiany stylu elementu. Jeśli chodzi o odpowiedź sugerującą że obraz1.png zostanie ukryty jest to błędne ponieważ w kodzie nie ma odwołania do tego elementu poprzez identyfikator. Manipulacja stylami CSS dotyczy jedynie elementów które zostały jednoznacznie zidentyfikowane w skrypcie. Kolejna błędna odpowiedź mówi że obraz2.png zostanie zastąpiony przez obraz1.png. W rzeczywistości w kodzie nie ma żadnego mechanizmu ani funkcji które by zamieniały jeden obrazek na drugi. Skrypt jedynie ukrywa element zmieniając jego styl display więc nie dochodzi do żadnej zamiany. Odpowiedź sugerująca że obraz1.png zostanie zastąpiony przez obraz2.png również jest błędna z podobnych powodów. Manipulacja DOM w tym przypadku polega wyłącznie na zmianie stylu widoczności a nie na modyfikacji treści czy zamianie elementów. Typowym błędem jest założenie że skrypty JavaScript dokonują zamian elementów co wymaga bardziej zaawansowanych operacji niż zmiana stylu display. Kluczowe w programowaniu webowym jest zrozumienie jak selektywne odwoływanie się do elementów za pomocą funkcji takich jak getElementById pozwala na precyzyjne kontrolowanie ich właściwości i reakcji na interakcje użytkownika co jest fundamentem tworzenia dynamicznych i interaktywnych stron internetowych

Pytanie 26

Który z poniższych znaczników wchodzi w skład sekcji <head> dokumentu HTML?

A. <section>
B. <img>
C. <span>
D. <title>
<title> jest jednym z kluczowych znaczników w sekcji <head> dokumentu HTML. Odpowiada za definiowanie tytułu strony, który jest wyświetlany w pasku tytułu przeglądarki oraz w wynikach wyszukiwania. Tytuł jest istotnym elementem SEO, ponieważ informuje zarówno użytkowników, jak i wyszukiwarki o tematyce strony. Przykład użycia znacznika <title>: <head><title>Moja Strona Internetowa</title></head>. Należy pamiętać, że tytuł powinien być zwięzły, ale jednocześnie opisowy, zazwyczaj nie powinien przekraczać 60 znaków. W kontekście standardów, HTML5, który jest obecnie najnowszą wersją HTML, wciąż podkreśla znaczenie znacznika <title> jako fundamentalnego dla struktury dokumentu. Odpowiedni tytuł nie tylko poprawia doświadczenia użytkowników, ale również zwiększa widoczność strony w wynikach wyszukiwania, dlatego jego prawidłowe użycie ma kluczowe znaczenie w web designie i marketingu internetowym.

Pytanie 27

W HTML, aby ustawić tytuł dokumentu na "Moja strona", który będzie widoczny na karcie przeglądarki internetowej, należy użyć zapisu

A. <meta name="ttle" content="Moja strona" />
B. <head>Moja strona</head>
C. <meta ttle="Moja strona">
D. <ttle>Moja strona</ttle>
Zastosowanie znacznika <title> jest kluczowe w strukturyzacji dokumentów HTML. W przypadku chęci nadania dokumentowi tytułu 'Moja strona', poprawny zapis to <title>Moja strona</title>. Znacznik <title> powinien być umieszczony w sekcji <head> dokumentu HTML, co jest zgodne z zasadami budowy stron internetowych. Tytuł jest istotnym elementem SEO (Search Engine Optimization), ponieważ przeglądarki internetowe wyświetlają go na zakładkach oraz w wynikach wyszukiwania, co wpływa na pierwsze wrażenie użytkownika oraz możliwość znalezienia strony. Prawidłowe tytuły powinny być zwięzłe, informacyjne i zawierać kluczowe słowa związane z treścią strony. Stosując poprawny znacznik <title>, zapewniasz, że strona będzie lepiej postrzegana zarówno przez użytkowników, jak i roboty indeksujące, co przekłada się na lepszą widoczność w Internecie. Warto również zwrócić uwagę na najlepsze praktyki, takie jak unikanie nadmiernej długości tytułu (zaleca się nie więcej niż 60 znaków) oraz stosowanie unikalnych tytułów dla różnych stron.

Pytanie 28

W sekcji nagłówka dokumentu HTML umieszczono ```Strona miłośników psów``` Zawarty tekst będzie widoczny

A. w treści witryny, na banerze witryny
B. w treści witryny, w pierwszym ukazanym nagłówku
C. na pasku tytułu w przeglądarce
D. w polu adresowym, za wprowadzonym adresem URL
Odpowiedź jest poprawna, ponieważ zawartość tagu <title> w kodzie HTML określa tytuł dokumentu, który jest wyświetlany na pasku tytułu przeglądarki. Tytuł ten jest kluczowym elementem SEO, ponieważ wpływa na sposób, w jaki użytkownicy postrzegają stronę w wynikach wyszukiwania. W praktyce, dobrze dobrany tytuł zwiększa szansę na kliknięcia i poprawia widoczność strony w internecie. Warto pamiętać, że tytuł powinien być krótki, zwięzły i zawierać najważniejsze słowa kluczowe, aby skutecznie komunikować, o czym jest strona. Dobre praktyki zalecają, aby długość tytułu nie przekraczała 60 znaków, aby uniknąć jego obcięcia w wynikach wyszukiwania. Dodatkowo, tytuł powinien być unikalny dla każdej podstrony, co ułatwia użytkownikom i wyszukiwarkom zrozumienie zawartości witryny.

Pytanie 29

Wskaż fragment kodu CSS, który odpowiada układowi bloków 2 - 5, zakładając, że są one oparte na poniższym kodzie HTML.

Ilustracja do pytania
A. B
B. A
C. C
D. D
Niepoprawne odpowiedzi często wynikają z błędnego zrozumienia działania właściwości float oraz szerokości elementów w układzie blokowym. Float jest potężnym narzędziem które pozwala na pływające rozmieszczenie elementów ale wymaga precyzyjnego planowania aby uniknąć niepożądanych efektów takich jak elementy wychodzące poza przewidywane miejsca. Przy wyborze błędnych odpowiedzi można zauważyć że nieodpowiednie użycie float może prowadzić do nieprawidłowego wyświetlania bloków. Na przykład brak odpowiedniego ustawienia float left lub right dla niektórych bloków może skutkować ich przesunięciem poza zamierzony układ. Dodatkowo nieprawidłowe zarządzanie szerokością bloków może spowodować że układ przekroczy dostępny obszar wyświetlania co szczególnie jest problematyczne w responsywnym projektowaniu stron. Typowym błędem jest również brak uwzględnienia clearfix co może prowadzić do nieprawidłowego przepływu kolejnych elementów w układzie. Zrozumienie jak float wpływa na otaczające elementy oraz jak kontrolować szerokość i przepływ elementów jest kluczowe w tworzeniu stabilnych i przewidywalnych układów stron internetowych. Poprawne zastosowanie tych zasad jest kluczowe dla zgodnego z dobrymi praktykami projektowania stron które są nie tylko estetyczne ale i funkcjonalne w różnych kontekstach urządzeń i środowisk użytkownika.

Pytanie 30

Do zdefiniowania listy nienumerowanej w języku HTML, jaki znacznik należy zastosować?

A. <ul>
B. <dt>
C. <ol>
D. <dd>
Aby zdefiniować w języku HTML listę nienumerowaną, należy użyć znacznika <ul>, co jest standardem w HTML. Znacznik <ul> oznacza "unordered list", czyli listę, w której poszczególne elementy nie są uporządkowane w kolejności numeracyjnej. Elementy tej listy są zazwyczaj wyświetlane z ikoną (punktami) przed każdym elementem, co podkreśla ich nienumerowany charakter. Każdy element listy jest definiowany za pomocą znacznika <li> (list item). Przykładowo, pełna struktura HTML dla listy nienumerowanej może wyglądać następująco: <ul><li>Pierwszy element</li><li>Drugi element</li></ul>. Używanie list nienumerowanych jest szczególnie pomocne w organizowaniu treści w sposób, który nie wymaga hierarchii, ale raczej prezentuje różne elementy na równym poziomie. W standardach W3C HTML5, <ul> jest zalecanym znakiem do tworzenia takich struktur, co czyni go kluczowym elementem w budowie przejrzystych i zrozumiałych stron internetowych. Implementacja list nienumerowanych w HTML jest istotnym krokiem w tworzeniu semantycznie poprawnych dokumentów, co wpływa na dostępność oraz SEO.

Pytanie 31

W HTML-u atrybut shape w znaczniku area, który definiuje kształt obszaru, może przyjąć wartość

A. rect, triangle, circle
B. rect, square, circle
C. poly, square, circle
D. rect, poly, circle
Wybór niewłaściwej odpowiedzi może wynikać z nieporozumień dotyczących atrybutu shape w znaczniku area. Odpowiedzi wskazujące na 'square' lub 'triangle' są błędne, ponieważ te kształty nie są obsługiwane przez standard HTML. W przypadku 'square', mogłoby się wydawać, że jest to po prostu inna forma prostokąta, jednak HTML nie definiuje takiej wartości dla atrybutu shape. Również 'triangle' nie jest uznawany w kontekście standardowych atrybutów; HTML nie pozwala na bezpośrednie definiowanie kształtów trójkątnych w obszarach mapy obrazów. Tego rodzaju zamieszanie może wynikać z niepełnego zrozumienia funkcji atrybutu, który jest jednoznacznie związany z prostokątem, okręgiem oraz wielokątem. Kluczowe jest, aby przyjrzeć się dokumentacji HTML oraz standardom W3C, które jasno określają poprawne wartości dla atrybutu shape. W praktyce, zrozumienie tych różnic jest istotne dla tworzenia efektywnych i dostępnych interfejsów użytkownika, gdzie każdy element jest precyzyjnie zdefiniowany i zrozumiały dla przeglądarek oraz użytkowników. Ponadto, stosowanie niepoprawnych wartości może prowadzić do błędów w renderowaniu strony, co negatywnie wpływa na doświadczenia użytkowników i dostępność serwisu.

Pytanie 32

Jakie znaczniki HTML pozwolą na prezentację tekstu w jednym wierszu na stronie, zakładając, że nie zastosowano żadnych reguł CSS?

A. style="margin-bottom: 0cm;"><div>Dobre strony </div><div style="letter-spacing:3px">mojej strony</div>
B. style="margin-bottom: 0cm;"><p>Dobre strony </p><p style="letter-spacing:3px">mojej strony</p>
C. style="margin-bottom: 0cm;"><h3>Dobre strony </h3><h3 style="letter-spacing:3px">mojej strony</h3>
D. <span>Dobre strony </span><span style="letter-spacing:3px">mojej strony</span>
Wszystkie trzy niepoprawne odpowiedzi wykorzystują znaczniki blokowe lub nieodpowiednie stylizacje, które wprowadzają nowe linie. Znacznik <p> (paragraf) domyślnie powoduje, że przeglądarki wstawiają odstęp przed i po elemencie, co zmienia układ tekstu na stronie. Zastosowanie <h3> również prowadzi do podobnych problemów, ponieważ nagłówki są elementami blokowymi, które z definicji powinny być wyświetlane w nowym wierszu. Ostatecznie, użycie <div> ma podobne konsekwencje, gdyż jest to również znacznik blokowy, co prowadzi do niepożądanego układu tekstu w nowych liniach. W kontekście tworzenia stron internetowych, zachowanie zgodności z zasadami HTML oraz CSS jest kluczowe, aby zachować porządek i estetykę strony. Elementy blokowe są idealne do tworzenia struktury, ale nie do wyświetlania tekstu w linii, dlatego w kontekście zadania, wybrane odpowiedzi nie spełniają wymogu utrzymania tekstu w jednej linii. Idealnym rozwiązaniem w takiej sytuacji jest użycie znaczników inline, takich jak <span>, które pozwalają na bardziej elastyczne formatowanie treści bez zakłócania układu.

Pytanie 33

W CSS zapis w postaci

 h1::first-letter {color: red;} 

spowoduje, że kolor czerwony zostanie zastosowany do

A. tekstu nagłówka w pierwszym stopniu
B. pierwszej litery nagłówka w pierwszym stopniu
C. pierwszej linii akapitu
D. pierwszej litery nagłówka w drugim stopniu
Zapis <span>h1::first-letter {color: red;} </span> jest w porządku, bo korzysta z pseudoelementu :first-letter, który działa na pierwszą literkę w nagłówku h1. To całkiem fajne, bo możemy w ten sposób stylizować tę pierwszą literę i nadać nagłówkom ciekawszy wygląd. Na przykład, jeśli mamy nagłówek h1 z napisem 'Witaj świecie', to dzięki temu kodowi, litera 'W' zrobi się czerwona. W CSS warto ogarnąć, że :first-letter działa tylko na bloki, takie jak nagłówki czy akapity, więc warto to mieć na uwadze, gdy coś stylizujemy. Używanie pseudoelementów to dobre podejście do tworzenia ładnych i funkcjonalnych interfejsów, a przy okazji daje nam większą kontrolę nad tym, jak wyglądają nasze elementy.

Pytanie 34

W modelu kolorów RGB kolor żółty powstaje z połączenia zielonego i czerwonego. Który kod szesnastkowy przedstawia kolor żółty?

A. #F0F0F0
B. #FF00FF
C. #FFFF00
D. #00FFFF
Kolor żółty w modelu RGB jest uzyskiwany poprzez połączenie pełnej intensywności koloru czerwonego oraz zielonego, przy zerowej intensywności koloru niebieskiego. W zapisie szesnastkowym, który jest powszechnie używany w programowaniu i projektowaniu grafiki komputerowej, kolor żółty reprezentowany jest przez kod #FFFF00. W tym kodzie pierwsze dwie cyfry 'FF' odpowiadają wartości intensywności czerwonego koloru, następne dwie 'FF' odpowiadają intensywności zielonego, a ostatnie dwie '00' oznaczają brak niebieskiego. Przykładem zastosowania koloru żółtego mogą być interfejsy użytkownika, gdzie często wykorzystuje się go do przyciągania uwagi, jak w przypadku znaków ostrzegawczych czy przycisków akcji. Kolor żółty jest również częścią różnych standardów kolorów, takich jak sRGB, który jest powszechnie używany w aplikacjach internetowych i mobilnych. Warto również zauważyć, że krzyżowanie się skali RGB z innymi modelami kolorów, takimi jak CMYK, pokazuje, jak różne systemy reprezentują kolory, co jest istotne w druku i cyfrowym projektowaniu.

Pytanie 35

Który z poniższych formatów NIE umożliwia zapis plików animowanych?

A. SWF
B. ACE
C. GIF
D. SVG
Format ACE (Archive Compressed Enhanced) jest formatem archiwum, który służy do kompresji danych, a nie do przechowywania animacji. W przeciwieństwie do formatów takich jak SWF, SVG czy GIF, ACE nie jest projektowany do obsługi grafiki ruchomej. SWF to format opracowany przez Adobe, który jest używany do tworzenia i wyświetlania animacji we Flashu. SVG to wektorowy format grafiki, który również wspiera animacje za pomocą CSS i JavaScript. GIF, z kolei, jest jednym z najpopularniejszych formatów do zapisu prostych animacji, dzięki możliwości przechowywania wielu klatek w jednym pliku. Zrozumienie różnic między tymi formatami jest istotne w kontekście tworzenia treści multimedialnych, a także w kontekście ich zastosowań w sieci. Wybór odpowiedniego formatu do animacji może mieć wpływ na wydajność ładowania strony, jakość wizualną oraz możliwości interakcji z użytkownikami.

Pytanie 36

W języku HTML zapis < spowoduje w przeglądarki wyświetlenie znaku

A. <
B. &
C. "
D. >
Znak < w HTML ma specjalne znaczenie, ponieważ jest używany do oznaczania początku znaczników, które są fundamentem struktury dokumentów HTML. Aby prawidłowo wyświetlić ten znak w przeglądarce, należy użyć encji HTML, która dla znaku mniejszości to &lt;. Użycie encji pozwala na uniknięcie nieporozumień, ponieważ przeglądarka mogłaby zinterpretować znak < jako początek nowego znacznika. Przykładowo, aby wyświetlić tekst 'A < B' w HTML, kod powinien wyglądać następująco: A &lt; B. Zgodnie z dokumentacją W3C, stosowanie encji jest kluczowe dla zachowania poprawności kodu. Dzięki temu użytkownicy mogą zobaczyć zamierzony tekst, zamiast nieprawidłowo interpretowanego oznaczenia. Warto również zauważyć, że istnieją inne encje, takie jak &gt; dla znaku większości oraz &amp; dla znaku ampersand, które również pełnią istotne funkcje w kontekście HTML. Poprawne użycie encji przyczynia się do lepszej dostępności i zobrazowania treści na stronach internetowych."

Pytanie 37

Jaka linia w języku HTML wskazuje kodowanie znaków używane w dokumencie?

A. <meta charset="UTF-8">
B. <meta encoding="UTF-8">
C. <charset="UTF-8">
D. <encoding="UTF-8">
Zapis <meta charset="UTF-8"> jest poprawną deklaracją kodowania znaków w dokumencie HTML, ponieważ jest zgodny z aktualnymi standardami W3C. Element <meta> powinien znajdować się w sekcji <head> dokumentu HTML i pozwala przeglądarkom na właściwe interpretowanie znaków w treści strony. Kodowanie UTF-8 jest szeroko stosowane, ponieważ obsługuje wszystkie znaki w standardzie Unicode, co czyni go idealnym dla aplikacji wielojęzycznych. Użycie poprawnego kodowania jest kluczowe, aby uniknąć problemów z wyświetlaniem tekstu, takich jak błędne znaki lub krzaki, które pojawiają się, gdy przeglądarka nie wie, jak zinterpretować dane. Przykładowo, jeżeli mamy stronę internetową w kilku językach, użycie UTF-8 zapewnia, że znaki diakrytyczne w języku polskim, czeskim czy niemieckim będą poprawnie wyświetlane. Warto również pamiętać, aby zawsze umieszczać tę deklarację jako pierwszą w sekcji <head>, aby zapewnić, że przeglądarka prawidłowo zinterpretuje wszystkie inne elementy. W kontekście SEO oraz dostępności, poprawne kodowanie jest istotne, ponieważ wpływa na indeksowanie treści przez wyszukiwarki oraz ich prezentację dla użytkowników.

Pytanie 38

W skrypcie JavaScript użyto metody DOM getElementsByClassName('akapit'). Metoda ta odniesie się do akapitu

A. <p href="/akapit">akapit3</p>
B. <p id="akapit">akapit2</p>
C. <p>akapit</p>
D. <p class="akapit">akapit4</p>
Metoda getElementsByClassName('akapit') w JavaScript jest metodą DOM, która zwraca kolekcję wszystkich elementów w dokumencie HTML, które mają przypisaną określoną klasę. W tym przypadku interesuje nas klasa 'akapit'. Poprawna odpowiedź to <p class="akapit">akapit4</p>, ponieważ ten akapit ma atrybut class ustawiony na 'akapit'. Zastosowanie klasy w HTML jest zgodne z najlepszymi praktykami programistycznymi, ponieważ pozwala na łatwe stylowanie i manipulowanie grupą elementów za pomocą CSS i JavaScript. Na przykład, jeśli chcemy zmienić kolor tekstu wszystkich akapitów z klasą 'akapit', możemy to zrobić jednym poleceniem w CSS: .akapit { color: red; }. Ponadto, metoda getElementsByClassName zwraca tzw. HTMLCollection, co oznacza, że możemy iterować po tej kolekcji i modyfikować jej elementy. Użycie klas w ten sposób wspiera zasadę separacji treści od prezentacji, co jest kluczowe w nowoczesnym podejściu do tworzenia stron internetowych.

Pytanie 39

Którego atrybutu należy użyć w miejscu trzech kropek w znaczniku HTML5 <blockquote>, aby zdefiniować źródło cytatu?

<blockquote ...="https://pl.wikipedia.org">
Pokojowa Nagroda Nobla jest przyznawana kandydatom, którzy wykonali największą lub najlepszą
pracę na rzecz braterstwa między narodami
</blockquote>
A. src
B. alt
C. href
D. cite
Niestety, twoja odpowiedź nie jest poprawna. Atrybut 'cite' w znaczniku <blockquote> jest używany do definiowania źródła cytatu, a nie 'alt', 'src' ani 'href'. Atrybut 'alt' jest używany w obrazach jako tekst alternatywny, który jest wyświetlany, gdy obraz nie może być ładowany lub jest odczytywany przez czytniki ekranowe. Z kolei 'src' jest atrybutem, który określa ścieżkę do obrazu lub innego zasobu multimedialnego. 'href' jest używany w znacznikach 'a' i 'link' do określenia URL strony lub innego zasobu, do którego prowadzi link. Pomyłka ta może wynikać z braku zrozumienia różnych zastosowań atrybutów w HTML. Pamiętaj, że każdy atrybut ma swoje specyficzne zastosowanie i nie są one zamienne.

Pytanie 40

W HTML atrybut alt elementu img służy do określenia

A. opisu, który pojawi się pod grafiką
B. treści, która zostanie pokazana, gdy grafika nie może być załadowana
C. parametrów grafiki, takich jak wymiary, ramka, wyrównanie
D. lokalizacji i nazwy pliku źródłowego grafiki
Atrybut <b>alt</b> znacznika <b>img</b> w języku HTML jest niezwykle istotnym elementem, który ma na celu zapewnienie dostępności treści wizualnych dla użytkowników. Gdy obrazek nie może zostać załadowany (np. z powodu problemów z siecią lub błędnej ścieżki do pliku), tekst zawarty w atrybucie <b>alt</b> zostaje wyświetlony zamiast obrazu. W praktyce oznacza to, że osoba korzystająca z technologii asystujących, takich jak czytniki ekranu, będzie miała możliwość zrozumienia, co miało się pojawić w danym miejscu na stronie. Zgodnie z wytycznymi WCAG (Web Content Accessibility Guidelines), stosowanie atrybutu <b>alt</b> jest kluczowe dla zapewnienia dostępności stron internetowych. Przykładem może być sytuacja, w której na stronie internetowej znajduje się obrazek przedstawiający produkt. Atrybut <b>alt</b> powinien zawierać opis tego produktu, co pozwoli użytkownikom, którzy nie widzą obrazu, zrozumieć jego znaczenie. Prawidłowe użycie atrybutu <b>alt</b> nie tylko poprawia dostępność, ale także może wpłynąć na SEO strony, ponieważ wyszukiwarki traktują ten atrybut jako dodatkowy kontekst dla treści wizualnych.