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: 24 kwietnia 2026 08:27
  • Data zakończenia: 24 kwietnia 2026 08:57

Egzamin zdany!

Wynik: 26/40 punktów (65,0%)

Wymagane minimum: 20 punktów (50%)

Nowe
Analiza przebiegu egzaminu- sprawdź jak rozwiązywałeś pytania
Pochwal się swoim wynikiem!
Szczegółowe wyniki:
Pytanie 1

Jaką funkcję spełnia atrybut value w polu formularza XHTML?

<input type="text" name="name" value="value">
A. czyni pole jedynie do odczytu
B. definiuje maksymalną długość pola
C. określa nazwę pola
D. określa domyślną wartość
Atrybut value w polu formularza XHTML nie ustawia pola tylko do odczytu. Aby uczynić pole nieedytowalnym, powinno się użyć atrybutu readonly, który blokuje możliwość edycji zawartości pola przez użytkownika, ale nadal pozwala na jego przesłanie wraz z formularzem. Value nie ogranicza długości pola tekstowego w formularzu. Aby ograniczyć liczbę znaków, jakie użytkownik może wprowadzić, stosuje się atrybut maxlength, który bezpośrednio określa maksymalną dozwoloną liczbę znaków. Wartości ustawione przez atrybut value mogą również być dłuższe niż to ograniczenie, ale w momencie przesyłania formularza tylko część widoczna w polu zostanie przesłana. Atrybut value nie wskazuje na nazwę pola. Do tego celu używa się atrybutu name, który definiuje nazwę pod jaką dane z tego pola będą przesłane na serwer. To błędne zrozumienie funkcji atrybutu value może wynikać z mylenia jego zastosowania z logiką działania innych atrybutów formularzy XHTML. Atrybut value jest kluczowy do ustawiania wartości domyślnych, co jest istotne w kontekście poprawy użyteczności formularzy i zwiększenia komfortu użytkownika.

Pytanie 2

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" content="psy, koty, gryzonie">
B. <meta name="keywords" = "psy, koty, gryzonie">
C. <meta name="description" 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 3

Który kod HTML spowoduje identyczne formatowanie jak przedstawione na obrazku?

W tym paragrafie zobaczysz sposoby formatowania tekstu w HTML


  1. <p>W tym <i>paragrafie zobaczysz sposoby formatowania</i> tekstu w HTML</p>

  2. <p>W tym <b>paragrafie <i>zobaczysz</i> sposoby formatowania</b> tekstu w HTML</p>

  3. <p>W tym <i>paragrafie <b>zobaczysz</b> sposoby formatowania</i> tekstu w HTML</p>

  4. <p>W tym <i>paragrafie </i><b>zobaczysz</b><i> sposoby formatowania</i> tekstu w HTML</p>

A. Odpowiedź B
B. Odpowiedź A
C. Odpowiedź D
D. Odpowiedź C
Wybór odpowiedzi C jest trafny, bo stosujesz odpowiednie znaczniki HTML, aby osiągnąć zamierzony efekt formatowania. Przykład świetnie pokazuje, jak używać znaczników <i> i <b>, które służą do pochylania i pogrubiania tekstu. Znak <p> to z kolei paragraf, który odseparowuje tekst i zaczyna nową linię. Tutaj znacznik <i> przed słowem 'paragrafie' sprawia, że jest ono kursywą, a <b> wokół 'zobaczysz' wyróżnia go na pogrubionym tle. To takie podstawowe zasady HTML, które pokazują, jak można różne style formatowania łączyć, żeby uczynić treści bardziej estetycznymi i przyjemnymi do czytania. Warto pamiętać o odpowiednim używaniu znaczników, bo to nie tylko poprawia wygląd, ale też dostępność treści, co jest ważne dla osób korzystających z czytników ekranu. Z mojego doświadczenia, im lepiej rozumiesz te zasady, tym łatwiej tworzyć strony, które będą dobrze odbierane przez użytkowników.

Pytanie 4

Wskaż styl CSS za pomocą którego został uzyskany przedstawiony efekt.

  • psy
  • koty
  • chomiki
  • świnki morskie
  • rybki
A. ul li:active { background-color: DodgerBlue; }
B. ul li:nth-child(odd) { background-color: DodgerBlue; }
C. ul li:hover { background-color: DodgerBlue; }
D. ul li:nth-child(even) { background-color: DodgerBlue; }
Dokładnie tak, poprawna odpowiedź to 'ul li:nth-child(even) { background-color: DodgerBlue; }'. Użycie selektora :nth-child(even) pozwala na zastosowanie stylu CSS do każdego parzystego elementu listy, co można zaobserwować na załączonym obrazku - każdy drugi (parzysty) element ma niebieskie tło. Jest to praktyczne rozwiązanie stosowane m.in. w celu poprawy czytelności długich list danych, gdzie koloryzmowanie na przemian pozwala na łatwiejsze zlokalizowanie poszczególnych elementów. Pamiętaj, że CSS oferuje wiele innych pseudoklas pozwalających na zastosowanie różnych efektów w zależności od stanu lub położenia elementu na stronie. Przy wykorzystaniu pseudoklas CSS warto odwoływać się do standardów i dobrych praktyk branżowych, takich jak unikanie nadmiernego zagnieżdżania selektorów, co może utrudniać czytelność i utrzymanie kodu.

Pytanie 5

Na podstawie kodu widocznego na ilustracji można stwierdzić, że

Ilustracja do pytania
A. nie przypisano wartości do zmiennej nazwisko.
B. podano nieprawidłowy argument do funkcji alert.
C. nie zadeklarowano funkcji wyswietlNazwisko.
D. funkcja wyswietlNazwisko(nazwisko) musi być wywołana wewnątrz innej funkcji.
W tym kodzie funkcja wyswietlNazwisko(nazwisko) jest poprawnie zadeklarowana, a komunikat przekazywany do alert() też jest w porządku. Problem wcale nie leży w samej funkcji, tylko w tym, że wywołujemy ją z argumentem nazwisko, który nigdzie wcześniej nie został zdefiniowany ani nie ma do niego przypisanej żadnej wartości. Silnik JavaScript widzi wywołanie wyswietlNazwisko(nazwisko); i szuka zmiennej o nazwie nazwisko w aktualnym zasięgu (scope). Ponieważ jej nie znajduje, zgłasza błąd ReferenceError: nazwisko is not defined. To jest klasyczny przypadek braku inicjalizacji zmiennej przed użyciem. W praktyce, żeby to naprawić, trzeba najpierw zadeklarować zmienną, np.: var nazwisko = "Kowalski"; albo let nazwisko = prompt("Podaj swoje nazwisko:"); i dopiero potem wywołać funkcję: wyswietlNazwisko(nazwisko);. Dobra praktyka w JavaScript to zawsze jawne deklarowanie zmiennych przy użyciu let lub const (ewentualnie var w starszym kodzie) oraz nadawanie im czytelnych, przewidywalnych wartości początkowych. W aplikacjach webowych takie zmienne często pochodzą z pól formularza, np. z document.getElementById("nazwisko").value, i dopiero ta wartość jest przekazywana jako argument funkcji. Moim zdaniem warto wyrobić sobie nawyk, że zanim użyjesz jakiejś nazwy w wywołaniu funkcji, sprawdzasz, czy na pewno istnieje jej deklaracja w odpowiednim zasięgu i czy ma sensowną wartość. Dzięki temu unikniesz wielu irytujących błędów w konsoli i łatwiej będzie debugować kod.

Pytanie 6

Które z wymienionych par znaczników HTML mają identyczny efekt wizualny na stronie internetowej, jeśli nie zastosowano żadnych stylów CSS?

A. <b> i <strong>
B. <meta> oraz <title>
C. <p> oraz <h2>
D. <b> i <big>
Odpowiedź <b> i <strong> jest poprawna, ponieważ oba znaczniki służą do wyróżniania tekstu, przy czym nie mają one różnicy w wizualizacji, jeśli nie zastosowano żadnych stylów CSS. Z punktu widzenia semantyki HTML, <strong> jest znacznikiem, który wyraża większe znaczenie dla zawartego w nim tekstu, co jest korzystne dla dostępności oraz SEO, ale wizualnie, bez dodatkowych stylów, obie etykiety wykazują te same cechy. Przykładowo, można ich używać w sytuacjach, gdy chcemy wyróżnić ważne informacje w artykule lub nagłówku. Zastosowanie tych znaczników zgodnie z dobrymi praktykami HTML pozwala na lepsze zrozumienie struktury strony przez wyszukiwarki oraz czytniki ekranu, co ma znaczenie w kontekście dostępności. W związku z tym, wyróżnianie tekstu za pomocą <b> i <strong> jest nie tylko estetyczne, ale także funkcjonalne, wspierając zarówno użytkowników, jak i algorytmy wyszukiwania.

Pytanie 7

Aby zdefiniować stylizację tabeli w języku CSS w sposób, który umożliwi wyróżnienie wiersza, na który aktualnie najeżdża kursor myszy np. innym kolorem, należy użyć

A. pseudoklasy :visited
B. pseudoklasy :hover
C. pseudoelementu :first-line
D. nowego selektora klasy dla wiersza tabeli
Pseudoklasa :hover jest techniką CSS, która pozwala na zastosowanie stylów do elementu, gdy użytkownik na niego najedzie kursorem myszy. Dzięki temu można w prosty sposób wyróżnić wiersze tabeli, co zwiększa interaktywność i czytelność danych. W przypadku tabeli, aby wyróżnić aktualnie wskazywany wiersz, należy użyć reguły CSS, która odnosi się do elementu <tr> (wiersza tabeli) z zastosowaniem pseudoklasy :hover. Przykładowy kod CSS może wyglądać następująco: table tr:hover { background-color: #f0f0f0; } co spowoduje, że tło wiersza zmieni się na jasno szare, gdy kursor myszy znajdzie się nad tym wierszem. Taki sposób formatowania jest szczególnie przydatny w przypadku długich tabel, które mogą być trudne do przeglądania. Pseudoklasa :hover jest powszechnie stosowana w projektowaniu stron internetowych, w zgodności z W3C CSS Specification, co zapewnia jej szeroką kompatybilność z różnymi przeglądarkami. Warto także zauważyć, że można łączyć pseudoklasę :hover z innymi selektorami, aby uzyskać bardziej zaawansowane efekty wizualne.

Pytanie 8

W języku HTML, aby uzyskać efekt taki jak na przykładzie, należy zastosować konstrukcję

Duży tekst zwykły tekst

A. <p><big>Duży tekst</p> zwykły tekst
B. <p><big>Duży tekst</big> zwykły tekst</p>
C. <p><strike>Duży tekst</strike> zwykły tekst</p>
D. <p><strike>Duży tekst zwykły tekst</p>
W języku HTML, użycie znacznika <big> jest właściwym sposobem na zwiększenie rozmiaru tekstu, co w efekcie pozwala na wyróżnienie go w kontekście pozostałej treści. Znacznik ten jest jednak przestarzały i niezalecany w nowoczesnych praktykach, ponieważ CSS oferuje bardziej elastyczne i zaawansowane metody stylizacji. Przykładowo, zamiast stosować <big>, można wykorzystać stylizację CSS, aby uzyskać podobny efekt, co zwiększa kontrolę nad wyglądem elementów. Ponadto, zastosowanie znacznika <p> jako kontenera dla tekstu zapewnia semantyczną strukturę dokumentu, co jest zgodne z wytycznymi W3C i poprawia dostępność. Przykładowo, użycie CSS może wyglądać tak: <p style='font-size: 1.5em;'>Duży tekst</p>zwykły tekst, co jest bardziej zalecane dla zachowania zgodności ze standardami. Warto pamiętać, że unikanie przestarzałych znaczników i stosowanie CSS zwiększa elastyczność i estetykę projektów HTML.

Pytanie 9

W języku JavaScript zdefiniowano funkcję potega. Funkcja ta

function potega(a, b = 2) { ... return wynik; }
A. wymaga podania dwóch argumentów przy wywołaniu
B. może być wywołana z jedną wartością
C. nie przyjmuje żadnych argumentów
D. nie zwraca wartości
Odpowiedź 3 jest poprawna, ponieważ funkcja potega w JavaScript została zdefiniowana z jednym parametrem obowiązkowym (a) oraz jednym parametrem opcjonalnym (b) z domyślną wartością wynoszącą 2. Oznacza to, że można ją wywołać z jednym argumentem, a wtedy drugi argument przyjmie wartość domyślną. Taka konstrukcja jest użyteczna w przypadku, gdy chcemy zapewnić elastyczność wywołania funkcji bez konieczności podawania wszystkich argumentów. W praktyce, użycie wartości domyślnych pozwala na tworzenie bardziej zwięzłego kodu i łatwiejsze utrzymywanie funkcji. Standard ECMAScript 2015 (ES6) wprowadził możliwość definiowania wartości domyślnych dla parametrów funkcji, co jest obecnie powszechną praktyką w JavaScript. Dzięki temu programiści mogą lepiej zarządzać przypadkami, w których nie wszystkie dane wejściowe są dostępne, co pozwala na unikanie błędów związanych z nieokreślonymi wartościami i zwiększa efektywność kodu.

Pytanie 10

W CSS, aby zmienić kolor tekstu dowolnego elementu HTML po najechaniu na niego myszą, należy wykorzystać pseudoklasę

A. :active
B. :visited
C. :coursor
D. :hover
:hover jest pseudoklasą wykorzystywaną w CSS do stylizacji elementów w momencie, gdy użytkownik na nie najedzie kursorem. To bardzo przydatne narzędzie, pozwalające na interaktywne zmiany wyglądu strony internetowej, co znacznie poprawia doświadczenia użytkownika. Przykładem zastosowania może być zmiana koloru tekstu linków. Można to osiągnąć, definiując odpowiednie reguły CSS, takie jak: `a:hover { color: red; }`, co spowoduje, że linki zmienią kolor na czerwony, gdy na nie najedziemy. Pseudoklasa :hover jest zgodna z W3C CSS, a jej zastosowanie w projektowaniu stron zapewnia lepszą dostępność i intuitwność interfejsu. Warto pamiętać, że efekty hover powinny być subtelne i dobrze przemyślane, aby nie odwracać uwagi od głównych treści strony, ale jednocześnie umożliwić użytkownikom szybkie zauważenie działań, które mogą podjąć.

Pytanie 11

Jaką wartość przyjmie zmienna po wykonaniu poniższego fragmentu kodu w JavaScript?

var w=0;
var i=1;
for (i = 1; i < 50; i++)
{
    if (i%2 == 0)
        w += i;
}
A. liczbie naturalnych liczb parzystych większych od 50
B. liczbom naturalnym, które są nieparzyste i mniejsze od 50
C. suma naturalnych liczb parzystych, które są mniejsze od 50
D. suma wszystkich naturalnych liczb nieparzystych, które są większe od 50
Kod przedstawiony w pytaniu jest fragmentem programu JavaScript, który ma za zadanie zsumować wszystkie liczby parzyste mniejsze od 50. Początkowo zmienna w jest ustawiona na 0 i reprezentuje sumę, którą będziemy obliczać. Pętla for zaczyna się od i=1 i iteruje do i<50 zwiększając wartość i o 1 w każdej iteracji. Wewnątrz pętli znajduje się instrukcja warunkowa if, która sprawdza, czy liczba i jest parzysta, co oznacza, że jej reszta z dzielenia przez 2 wynosi 0. Jeśli warunek jest spełniony, liczba i jest dodawana do zmiennej w. W efekcie po zakończeniu pętli zmienna w zawiera sumę wszystkich parzystych liczb mniejszych niż 50. Przykładem praktycznego zastosowania takiego algorytmu może być sytuacja, w której musimy szybko obliczyć sumę określonego zbioru liczb spełniających dane kryterium, co jest częste w analizie danych lub generowaniu raportów. Konstrukcje takie jak pętla for i operator modulo są podstawowymi narzędziami w programowaniu, pozwalającymi na efektywne przetwarzanie danych i automatyzację złożonych operacji obliczeniowych, co jest zgodne z dobrymi praktykami w branży IT.

Pytanie 12

Jak można zmodyfikować nałożone na siebie fragmenty obrazu, nie zmieniając innych elementów?

A. Kanał przezroczystości
B. Przycinanie
C. Wykres histogramu
D. Warstwy
Warstwy są kluczowym elementem w edycji grafiki komputerowej, umożliwiając precyzyjne zarządzanie różnymi elementami obrazu. Dzięki zastosowaniu warstw, użytkownik może na przykład oddzielić tło od obiektów na pierwszym planie, co pozwala na edytowanie jednego z tych elementów bez wpływu na resztę kompozycji. Zastosowanie warstw jest szczególnie przydatne w programach graficznych, takich jak Adobe Photoshop, GIMP czy CorelDRAW, gdzie umożliwia łatwą manipulację oraz efektywną organizację projektu. Dzięki warstwom można również stosować różne efekty i style, takie jak cienie, przezroczystości czy gradienty, co pozwala na stworzenie bardziej złożonych i interesujących grafik. Warto również zauważyć, że korzystanie z warstw jest zgodne z najlepszymi praktykami w branży, jako że sprzyja to lepszej organizacji pracy oraz ułatwia wprowadzanie zmian w projekcie. Uczy to również umiejętności przydatnych w pracy zespołowej, gdzie różne osoby mogą pracować nad różnymi warstwami równocześnie, co zwiększa efektywność i kreatywność procesu twórczego.

Pytanie 13

Który z znaczników ma na celu organizację struktury tekstu w HTML?

A. <head>
B. <u>
C. <style>
D. <h6>
Znacznik <u> służy do podkreślenia tekstu, co nie ma nic wspólnego z tworzeniem hierarchii treści. W dzisiejszych standardach HTML, podkreślenie tekstu powinno być używane bardzo ostrożnie, ponieważ może wprowadzać w błąd czytelników i wyszukiwarki, sugerując, że tekst jest linkiem do innej strony. W praktyce, znaczenie podkreślenia powinno ograniczać się do przypadków, gdzie jest to konieczne, a nie stać się domyślnym sposobem na wyróżnienie treści. Z kolei znacznik <head> pełni rolę sekcji nagłówkowej dokumentu HTML, w której znajduje się metadane, takie jak tytuł, skrypty czy style. Nie ma on żadnego zastosowania w kontekście budowania hierarchii tekstu, ponieważ nie wpływa na sposób, w jaki treść jest wyświetlana na stronie. Ponadto, znacznik <style> jest używany do definiowania stylów CSS, co również nie ma związku z hierarchią tekstu. Typowe błędy myślowe, które prowadzą do takich niepoprawnych wniosków, mogą wynikać z mylenia celów różnych znaczników HTML. Każdy znacznik ma swoje specyficzne funkcje, a ich niewłaściwe użycie może prowadzić do nieefektywnej struktury strony oraz negatywnie wpływać na doświadczenia użytkowników i SEO. Zrozumienie roli każdego elementu w HTML jest kluczowe dla tworzenia przejrzystych i funkcjonalnych stron internetowych.

Pytanie 14

Znaczniki HTML <strong> oraz <em>, które mają na celu podkreślenie istotności tekstu, pod względem formatowania odpowiadają znacznikom

A. <b> oraz <i>
B. <b> oraz <u>
C. <i> oraz <mark>
D. <u> oraz <sup>
Wybór błędnych znaczników HTML często wynika z niepełnego zrozumienia różnicy między semantyką a formatowaniem. Znacznik <u> służy do podkreślenia tekstu, co może być mylące w kontekście oznaczania ważności treści. Oznaczanie tekstu w ten sposób nie dostarcza żadnej informacji o jego znaczeniu, co jest kluczowe w tworzeniu dostępnych i zrozumiałych stron internetowych. Użycie <sup> oznacza tekst w indeksie górnym, co również nie ma związku z akcentowaniem ważności. W przypadku <b> i <u>, oba znaczniki służą do formatowania, ale ignorują istotne aspekty semantyki, co może prowadzić do nieporozumień w interpretacji treści przez przeglądarki oraz urządzenia asystujące. Użycie <i> oznacza tekst w kursywie, jednak podobnie jak <b>, jest to czysto wizualne formatowanie bez znaczenia semantycznego. W praktyce, nadmierne poleganie na takich znacznikach bez zrozumienia ich ról w kontekście semantyki prowadzi do tworzenia stron, które są mniej dostępne i mniej przyjazne dla użytkowników. Kluczowym elementem budowy nowoczesnych aplikacji webowych jest stosowanie odpowiednich znaczników, które nie tylko prezentują treść, ale również przekazują jej znaczenie, co jest podstawą dobrego UX oraz SEO.

Pytanie 15

W języku JavaScript, funkcja Math.pow() wykorzystuje się do obliczenia

A. pierwiastka kwadratowego liczby
B. wartości bezwzględnej liczby
C. wartości przybliżonej liczby
D. potęgi liczby
Funkcja Math.pow() w JavaScript służy do obliczania potęgi liczby, co oznacza, że można jej użyć do podnoszenia liczby do wybranej potęgi. Poprawna składnia tej funkcji to Math.pow(base, exponent), gdzie 'base' to liczba, którą chcemy podnieść do potęgi, a 'exponent' to wykładnik. Na przykład, aby obliczyć 2 do potęgi 3, używamy Math.pow(2, 3), co zwraca 8. Ta funkcja jest niezwykle przydatna w różnych kontekstach programistycznych, takich jak obliczenia matematyczne, grafika komputerowa, czy modelowanie rzeczywistych zjawisk. W praktyce, korzystając z Math.pow(), można zrealizować wiele bardziej zaawansowanych obliczeń, takich jak obliczanie wartości funkcji wygładzających, symulacji fizycznych czy operacji na danych statystycznych. Kluczowe jest, aby pamiętać, że w JavaScript dostępne są również operator potęgowania (**), wprowadzony w ECMAScript 2016, co czyni kod bardziej czytelnym, na przykład 2 ** 3 również zwraca 8. Warto być świadomym tych narzędzi, aby optymalizować i upraszczać kod w swoich projektach.

Pytanie 16

W podanym przykładzie pseudoklasa hover spowoduje, że styl pogrubiony zostanie przypisany

a:hover { font-weight: bold; }
A. wszystkim odnośnikom, które były wcześniej odwiedzane
B. każdemu odnośnikowi bez względu na jego bieżący stan
C. odnośnikowi, gdy kursor myszy na niego najedzie
D. wszystkim odnośnikom, które nie były odwiedzane
Pseudoklasa hover jest jedną z najczęściej używanych pseudoklas w CSS stosowaną do stylizacji elementów HTML w momencie, gdy użytkownik najeżdża kursorem myszy na dany element. W podanym przykładzie kodu CSS zastosowano pseudoklasę hover dla elementów a czyli odnośników. Oznacza to, że gdy kursor myszy znajdzie się nad jakimkolwiek odnośnikiem, jego styl zmieni się na pogrubiony dzięki właściwości font-weight: bold. Jest to bardzo przydatne w interaktywnej stylizacji stron internetowych, ponieważ pozwala użytkownikom na wizualne odróżnienie elementów, z którymi mogą wchodzić w interakcję. Praktycznym zastosowaniem tej pseudoklasy jest zwiększenie użyteczności i estetyki strony poprzez subtelne wskazanie elementów interaktywnych, takich jak menu nawigacyjne czy linki w treści. Warto pamiętać o zachowaniu spójności stylizacji dla wszystkich stanów odnośników, co jest zalecane jako dobra praktyka w projektowaniu responsywnych interfejsów użytkownika. Pseudoklasa hover, jako część kaskadowego arkusza stylów, pozwala na dynamiczną interakcję z elementami strony, co znacząco wpływa na doświadczenia użytkownika.

Pytanie 17

Funkcja przedstawiona w kodzie JavaScript ma na celu

Ilustracja do pytania
A. pokazać wynik mnożenia a przez n
B. wyświetlić kolejne liczby od a do n
C. zwrócić wynik potęgowania an
D. zwrócić iloczyn kolejnych liczb od 1 do a
Wśród przedstawionych odpowiedzi, niektóre mogą wydawać się kuszące, ale są niepoprawne z powodu złego zrozumienia działania pętli for i operacji arytmetycznych w JavaScript. Opcja, że funkcja miałaby wypisać kolejne liczby od a do n, jest błędna. Kod nie zawiera żadnej instrukcji wyświetlania czy logowania, a jedynie operacje arytmetyczne i zwracanie wyniku. Podobnie, wypisywanie wyniku mnożenia a przez n jest niepoprawne, gdyż funkcja nie wykonuje jednokrotnego mnożenia a i n. Zamiast tego, wykonuje wielokrotne mnożenie a, co jest typowe dla operacji potęgowania. W końcu, mylne byłoby sądzenie, że funkcja oblicza iloczyn kolejnych liczb od 1 do a. Taki proces wymagałby zagnieżdżonej logiki, iteracji po zmiennej innej niż a, co nie jest obecne w danym kodzie. Błędne odpowiedzi mogą wynikać z niepełnego zrozumienia jak działa pętla for lub jak przypisuje się wartości w operacjach iteracyjnych. Kluczową umiejętnością jest umiejętność odczytywania i interpretowania kodu w kontekście wykonywanych operacji, co wymaga doświadczenia w pracy z językiem programowania i jego strukturami kontrolnymi.

Pytanie 18

W języku HTML sposób na zdefiniowanie kodowania polskich znaków to

A. atrybut znacznika <meta>
B. atrybut znacznika <p>
C. znacznik <charset>
D. znacznik <title>
Inne opcje, które rozważono jako poprawne, nie są odpowiednie do określenia kodowania znaków w HTML. Znacznik <charset> nie istnieje w standardzie HTML, co czyni go niewłaściwym wyborem. Kodowanie znaków nie jest definiowane przez atrybut znacznika <p>, który jest używany głównie do formatowania tekstu, a więc nie ma wpływu na kodowanie znaków. Warto również zauważyć, że znacznik <title> jest stosowany do nadania tytułu dokumentu, który pojawia się na karcie przeglądarki, ale nie ma on związku z kodowaniem znaków. Wybór odpowiedniego kodowania jest kluczowy dla zachowania integralności tekstu, a niewłaściwe przypisanie może prowadzić do problemów z wyświetlaniem znaków i błędów w interpretacji treści. Często użytkownicy mylnie zakładają, że inne znaczniki HTML mogą mieć wpływ na kodowanie, co prowadzi do nieporozumień. Dlatego istotne jest, aby być świadomym roli znacznika <meta> w kontekście kodowania znaków, zwłaszcza w przypadku języków z diakrytykami, takich jak język polski.

Pytanie 19

Podczas działania skryptu JavaScript został w konsoli wygenerowany błąd związany z działaniami na atrybucie elementu DOM. Z komunikatu wynika, że próbowano ustawić atrybut dla

Ilustracja do pytania
A. obrazu.
B. odnośnika.
C. paragrafu.
D. tabeli.
Twoja odpowiedź była prawidłowa. Błąd 'Uncaught TypeError: Cannot set property 'src' of null' jest związany z próbą przypisania wartości do atrybutu 'src' nieistniejącego elementu DOM. Atrybut 'src' jest charakterystyczny dla elementów HTML obrazu, czyli <img>, i służy do określenia źródła obrazka. Gdy masz do czynienia z błędem tego typu, najczęściej wynika to z próby manipulacji atrybutem 'src' obrazu, który nie istnieje w strukturze DOM, co może wynikać na przykład z błędu w selektorze. Pamiętaj, że przed przypisaniem wartości atrybutu, warto upewnić się, że dany element DOM faktycznie istnieje. W przeciwnym razie, jak w tym przypadku, JavaScript zwróci błąd. Zrozumienie charakterystyki błędów i potrafiące identyfikowanie ich przyczyn jest kluczowe w procesie programowania.

Pytanie 20

Który z przedstawionych kodów XHTML sformatuje tekst według podanego wzorca?
Ala ma kota
a kot ma Alę

A. <p>Ala ma <b>kota</i><br> a <b>kot</b> ma Alę</p>
B. <p>Ala ma <b>kota</b><br> a <i>kot</i> ma Alę</p>
C. <p>Ala ma <b>kota<br> a <i>kot</i> ma Alę</p>
D. <p>Ala ma <b>kota</b><br> a <b>kot</b> ma Alę</p>
Poprawna odpowiedź to <p>Ala ma <b>kota</b><br/>a <i>kot</i> ma Alę</p>. W tym kodzie XHTML tekst 'Ala ma kota' jest odpowiednio sformatowany dzięki zastosowaniu znaku <b>, który definiuje tekst pogrubiony, oraz <i>, który oznacza tekst kursywą. Ponadto <br/> jest używane do wstawienia przerwy w linii, co jest zgodne z praktykami formatowania tekstu w HTML/XHTML. Zgodnie ze standardami W3C, XHTML jest stricte oparty na XML, co oznacza, że wszystkie elementy muszą być poprawnie zagnieżdżone i zamknięte. Użycie <i> w drugiej części tekstu jest poprawne, ponieważ wskazuje na pewną formę wyróżnienia, a jednocześnie zachowuje semantykę. Przy tworzeniu stron internetowych ważne jest, aby formatowanie tekstu było zarówno estetyczne, jak i zgodne z regułami semantycznymi, co ta odpowiedź spełnia. Przykładowo, tekst ten można umieścić w dowolnym dokumencie HTML, aby zachować poprawne formatowanie, co wpływa na czytelność.

Pytanie 21

Kod umieszczony w ramce spowoduje wyświetlenie liczb

Ilustracja do pytania
A. 1 2 3 4 5 6 7 8 9 10
B. 1 3 5 7 9
C. 2 4 6 8 10
D. 2 4 6 8
Analizując błędne odpowiedzi można zauważyć że nie uwzględniają one poprawnego działania instrukcji continue w kodzie PHP. Ta instrukcja pomija pozostałe kroki bieżącej iteracji pętli jeśli warunek jest spełniony. Pierwsza odpowiedź 2 4 6 8 nie uwzględnia liczby 10 która także spełnia warunek parzystości i powinna być wypisana co jest błędne w kontekście działania pętli do wartości 10 włącznie. Druga propozycja 1 3 5 7 9 jest wynikiem niepoprawnego zrozumienia działania operatora modułu i instrukcji continue które eliminują liczby nieparzyste z wyjścia. Wyświetlenie tylko nieparzystych liczb oznaczałoby brak zastosowania instrukcji continue lub jej odwrotność co jest sprzeczne z kodem. Ostatnia propozycja 1 2 3 4 5 6 7 8 9 10 zakłada że wszystkie liczby od 1 do 10 są wypisywane co ignoruje kluczowy wpływ instrukcji continue na przebieg pętli. Taki wynik mógłby wskazywać na brak warunku eliminującego liczby nieparzyste co jest błędne w kontekście kodu. Typowym błędem jest tu niepoprawne rozumienie działania instrukcji sterujących jak continue które pełnią kluczową rolę w przepływie sterowania w pętlach programistycznych i powinny być zawsze dokładnie analizowane aby uniknąć błędnych wniosków i nieoczekiwanych wyników w programach. Operator modulo to również istotny element w zrozumieniu działania kodu służący do łatwego sprawdzania podzielności i warunków logicznych co jest powszechnie stosowane w wielu językach programowania do optymalizacji i filtrowania danych. Kod ilustruje również jak za pomocą prostych warunków można efektywnie zarządzać dużymi zbiorami danych w aplikacjach co jest kluczowe w optymalizacji algorytmów i poprawie wydajności systemów informatycznych.

Pytanie 22

Jakiego elementu HTML brakuje, aby walidator HTML zgłosił ostrzeżenie lub błąd?

A. co najmniej jednego <h1>
B. <title>
C. <meta name="author" content="....">
D. <link>
Element <title> jest kluczowym składnikiem dokumentu HTML, odpowiedzialnym za definiowanie tytułu strony, który jest wyświetlany na pasku tytułowym przeglądarki oraz w wynikach wyszukiwania. Zgodnie z wytycznymi W3C, każdy dokument HTML powinien zawierać ten element w sekcji <head>, aby zapewnić poprawną strukturę oraz ułatwić indeksowanie przez wyszukiwarki. Brak <title> może prowadzić do ostrzeżeń lub błędów w walidacji, ponieważ wpływa to negatywnie na zarówno SEO, jak i dostępność strony. Przykładem poprawnej implementacji może być:<head><title>Mój pierwszy dokument HTML</title></head>, co zapewnia odpowiednią reprezentację treści strony w kontekście przeglądania i wyszukiwania. Dobrym zwyczajem jest, aby tytuł był zwięzły, a jednocześnie zawierał istotne słowa kluczowe, które odnoszą się do tematu strony. Nie należy zapominać, że właściwie skonstruowany tytuł wpływa na doświadczenia użytkowników oraz ich postrzeganie witryny.

Pytanie 23

Na podstawie filmu wskaż, która cecha dodana do stylu CSS zamieni miejscami bloki aside i nav, pozostawiając w środku blok section?

A. aside {float: left; }
B. nav { float: left; } aside { float: left; }
C. nav { float: right; } section { float: right; }
D. nav { float: right; }
W tym zadaniu kluczowe jest zrozumienie, jak naprawdę działa float, a nie tylko samo skojarzenie, że „left to lewo, right to prawo”. Wiele osób myśli, że wystarczy ustawić jeden element na lewo, drugi na prawo i wszystko magicznie się poukłada. W praktyce przeglądarka trzyma się bardzo konkretnych reguł: najpierw liczy kolejność elementów w HTML, potem dopiero stosuje float i układa je możliwie jak najwyżej i jak najbliżej odpowiedniej krawędzi. Jeśli nada się float tylko dla aside albo tylko dla nav, to zmienia się ich pozycja, ale układ trzech bloków nie spełni warunku z zadania: aside i nav nie zamienią się miejscami z pozostawieniem section w środku. Przykładowo, samo float: left na aside niczego nie „zamieni”, bo element i tak pojawia się jako pierwszy w kodzie, więc będzie u góry, tylko że „przyklejony” do lewej. Z kolei ustawienie nav na prawą stronę bez odpowiedniego floatowania section prowadzi do sytuacji, gdzie section nadal zachowuje się jak normalny blok, zwykle ląduje pod elementami pływającymi albo obok nich w sposób mało przewidywalny dla początkującego. Częsty błąd myślowy polega też na tym, że ktoś próbuje wszystkim elementom dać float: left, licząc na to, że przeglądarka „ułoży je po swojemu”. Wtedy jednak wszystkie te bloki ustawiają się w jednym kierunku, w kolejności z HTML, więc nie ma mowy o świadomym „zamienianiu miejsc”. Brak zrozumienia, że float wyjmuje element z normalnego przepływu i wpływa na to, jak kolejne elementy zawijają się wokół niego, prowadzi właśnie do takich błędnych odpowiedzi. Z mojego doświadczenia lepiej jest najpierw narysować sobie prosty schemat: w jakiej kolejności idą znaczniki i które z nich mają pływać w prawo, a które zostać w naturalnym układzie. Dopiero wtedy dobiera się konkretne deklaracje CSS. Takie myślenie przydaje się nie tylko przy float, ale też przy nauce flexboxa czy grida, gdzie kolejność w DOM i własności układu też grają ogromną rolę.

Pytanie 24

Aby uruchomić kod JavaScript w przeglądarce, potrzebne jest

A. debugowanie
B. przetwarzanie na kod maszynowy
C. kompilowanie
D. interpretowanie
Wykonywanie kodu JavaScript wymaga zrozumienia różnych procesów, które mogą mylnie sugerować, że debugowanie, zamiana na kod maszynowy czy kompilowanie są kluczowe w tym kontekście. Debugowanie to proces identyfikacji i naprawy błędów w kodzie, który odbywa się już po interpretacji kodu. Kiedy kod jest uruchamiany, programista może używać narzędzi debugujących dostępnych w przeglądarkach, aby analizować działanie skryptu, co jednak nie jest wymogiem do jego wykonania. Zamiana na kod maszynowy oraz kompilowanie dotyczą języków programowania, które nie są interpretowane, a ich kod źródłowy jest przekształcany do postaci zrozumiałej dla procesora przed uruchomieniem. Przykładem mogą być języki takie jak C++ czy Java, które wymagają złożonego procesu kompilacji. W przypadku JavaScript, silnik interpretuje kod w czasie rzeczywistym, co pozwala na natychmiastowe wykonanie skryptów bez wcześniejszego kompilowania, co jest dużą zaletą w kontekście tworzenia aplikacji webowych. Pojęcie kompilacji może prowadzić do nieporozumień, ponieważ niektóre nowoczesne narzędzia, takie jak TypeScript, mogą wymagać kompilacji, ale to nie zmienia faktu, że czysty JavaScript jest interpretowany. Dlatego kluczowym elementem pracy z JavaScript w przeglądarkach jest zrozumienie jego interpretacyjnej natury oraz umiejętność korzystania z narzędzi dostępnych dla programistów.

Pytanie 25

W przedstawionym kodzie HTML zastosowany styl CSS jest stylem ```

To jest przykładowy akapit.

```
A. zewnętrznym
B. lokalnym
C. dynamicznym
D. nagłówkowym
Styl CSS zastosowany w podanym kodzie HTML to styl lokalny, ponieważ jest zdefiniowany bezpośrednio w tagu HTML za pomocą atrybutu 'style'. Taki sposób definiowania stylów pozwala na przypisanie unikalnych stylów do konkretnego elementu na stronie, co jest szczególnie przydatne, gdy chcemy szybko zmienić wygląd jednego elementu bez wpływania na inne. Przykładem lokalnego stylu jest ustawienie koloru tekstu akapitu na czerwony, co można zaobserwować w atrybucie 'style="color:red;"'. Warto zauważyć, że lokalne style mają wyższy priorytet od stylów zewnętrznych i wewnętrznych, co oznacza, że jeśli ten sam element ma przypisany styl zewnętrzny, lokalny styl go nadpisze. W kontekście standardów CSS, lokalne style są zgodne z zasadami kaskadowości, która określa, jak łączyć różne źródła stylów. Z perspektywy użyteczności, chociaż lokalne style mogą być wygodne, ich nadmierne stosowanie prowadzi do trudności w utrzymaniu kodu, dlatego zaleca się ich używanie w ograniczonym zakresie.

Pytanie 26

W poniższym kodzie CSS czcionka zmieni kolor na żółty

a[target="_blank"]
{
  color: yellow;
}
A. tekstu akapitu
B. odnośników, które otwierają się w nowej karcie
C. odnośników, które otwierają się w tej samej karcie
D. każdego linku
Prawidłowa odpowiedź wskazuje na zastosowanie selektora a[target="_blank"] w języku CSS. Ten selektor odnosi się do wszystkich odnośników HTML, które otwierają się w nowej karcie przeglądarki dzięki użyciu atrybutu target z wartością "_blank". Stylizacja tych odnośników na kolor żółty jest możliwa przez przypisanie właściwości color z odpowiednią wartością. Jest to praktyczne podejście, które pozwala na wizualne wyróżnienie linków otwierających się w osobnych zakładkach. Takie podejście jest zgodne z dobrymi praktykami projektowania stron internetowych, gdzie wskazane jest, aby użytkownicy mieli wyraźne sygnały o nietypowych działaniach linków. W kontekście dostępności webowej, takie stylizowanie wspiera użytkowników w szybszym orientowaniu się w sposobie działania poszczególnych elementów interfejsu. Separacja stylu i treści zgodnie z zasadami CSS umożliwia bardziej elastyczne zarządzanie wyglądem strony i ułatwia utrzymanie spójności wizualnej na całej witrynie. Przykład ten ilustruje, jak CSS może wpływać na interakcję użytkownika z elementami strony, co jest kluczowe w procesie tworzenia przyjaznych i intuicyjnych interfejsów użytkownika.

Pytanie 27

W języku CSS stworzono określony styl. Sekcja sformatowana tym stylem będzie miała obramowanie o szerokości

div {
    border: solid 2px blue;
    margin: 20px;
}
A. 2 px oraz marginesy wewnętrzne tego obramowania
B. 2 px oraz marginesy zewnętrzne tego obramowania
C. 20 px oraz marginesy wewnętrzne tego obramowania
D. 20 px oraz marginesy zewnętrzne tego obramowania
Odpowiedź 2 px oraz marginesy na zewnątrz tego obramowania jest prawidłowa ponieważ w definicji stylu CSS ustawiono właściwość border z wartością solid 2px blue co oznacza że element będzie miał obramowanie o grubości 2 pikseli z niebieskim kolorem Dodatkowo użyto właściwości margin z wartością 20px co wskazuje że element ma margines zewnętrzny o szerokości 20 pikseli na każdej stronie Właściwość margin w CSS odnosi się zawsze do przestrzeni na zewnątrz granic elementu co odróżnia ją od padding który dotyczy marginesu wewnętrznego Praktyczne zastosowanie takiego stylu można znaleźć w projektach gdzie projektant chce oddzielić elementy od siebie zachowując równomierne odstępy W ten sposób można tworzyć przejrzyste i estetyczne układy na stronach internetowych Zastosowanie border pozwala również na wizualne wyróżnienie elementów co jest często wykorzystywane w interfejsach użytkownika aby podkreślić ważne informacje Dobrą praktyką jest używanie takich stylizacji aby poprawić czytelność i funkcjonalność strony poprzez jasne rozgraniczenie sekcji oraz zapewnienie odpowiednich odstępów między nimi zgodnie z zasadami UX

Pytanie 28

Na ilustracji przedstawiono strukturę bloków na stronie internetowej. Który z poniższych fragmentów CSS odpowiada takim ustawieniom? (Dla uproszczenia pominięto właściwości dotyczące koloru tła, wysokości oraz czcionki)

Ilustracja do pytania
A. #pierwszy {float:left; width:30%; } #drugi {clear:both; width:70%; } #trzeci {float:left; width:70%; } #czwarty {clear:both; }
B. #pierwszy {float:left; width:30%;} #drugi {float:left; width:70%;} #trzeci {float:left; width:70%;} #czwarty {clear:both; }
C. #pierwszy { width: 30%; } #drugi { width: 70%; } #trzeci { width: 70%; } #czwarty { width: 100%; }
D. #pierwszy{float:left; width:30%;} #drugi {clear:both; width:70%;} #trzeci {clear:both; width:70%;} #czwarty {float:left; width:100%;}
Odpowiedź pierwsza jest prawidłowa, gdyż prawidłowo wykorzystuje właściwość float w stylach CSS, aby uzyskać pożądany układ bloków na stronie internetowej. Float pozwala elementom przemieszczać się na lewą lub prawą stronę kontenera, co jest kluczowe w tworzeniu layoutów. W tym przypadku #pierwszy, #drugi i #trzeci mają ustawione float:left, co umożliwia ich równoległe ustawienie w poziomie aż do momentu, gdy szerokości kontenera są zapełnione. Następnie blok #czwarty wymaga clear:both, aby przemieszczać się poniżej wszystkich poprzednich elementów z ustawionym float. To powszechna technika stosowana w projektowaniu responsywnych układów stron, gdzie równoległe pozycjonowanie elementów pozwala na efektywne wykorzystanie przestrzeni. Float w połączeniu z odpowiednimi szerokościami procentowymi pomaga tworzyć elastyczne projekty, które dobrze skalują się na różnych urządzeniach, co jest zgodne z nowoczesnymi standardami web developmentu. Ponadto zrozumienie działania float i clear jest fundamentem przy tworzeniu klasycznych layoutów typu grid przed wprowadzeniem nowoczesnych rozwiązań takich jak Flexbox czy CSS Grid, co pokazuje zrozumienie podstawowych zasad CSS.

Pytanie 29

W CSS właściwość font-size może przyjmować wartości według słów kluczowych

A. z zestawu xx-small, x-small, smali, medium, large, x-large, xx-large
B. jedynie big i smali
C. tylko smali, smaller, large, larger
D. wyłącznie smali, medium, large
Właściwość font-size w CSS pozwala na określenie rozmiaru czcionki za pomocą zestawu wartości słownikowych, które obejmują xx-small, x-small, small, medium, large, x-large oraz xx-large. Użycie tych słów kluczowych jest zgodne z wytycznymi CSS i zapewnia spójne i zrozumiałe podejście do projektowania. Przykładowo, definiując klasę CSS dla nagłówka, możemy zastosować: h1 { font-size: large; } co skutkuje odpowiednim zwiększeniem rozmiaru czcionki, co jest zgodne z hierarchią typograficzną dokumentu. Zastosowanie wartości słownikowych zwiększa czytelność i dostępność treści, ponieważ są one zrozumiałe zarówno dla programistów, jak i dla przeglądarek. Ponadto, korzystając z tych wartości, projektanci mogą łatwiej dostosować wygląd strony do różnych urządzeń, co jest kluczowe w kontekście responsywnego web designu. Warto również wspomnieć, że wartości te są niezależne od jednostek miary, takich jak em czy px, co sprawia, że są bardziej elastyczne w użyciu.

Pytanie 30

W zaprezentowanym fragmencie kodu HTML zdefiniowano pole input, które można opisać jako

<input type="password" name="pole">
A. dopuszcza jedynie wprowadzanie wartości liczbowych
B. ukrywa znaki, które zostały do niego wprowadzone
C. pokazuje znaki, które zostały do niego wprowadzone
D. zawiera domyślny tekst „pole”
Pole input z atrybutem type="password" służy do wprowadzania danych, które powinny być ukryte przed wglądem osób trzecich, takich jak hasła. Wprowadzone znaki są zastępowane na ekranie innymi symbolami, najczęściej kropkami lub gwiazdkami, co zabezpiecza przed odczytem hasła przez osoby patrzące na ekran. Ten mechanizm jest standardem w aplikacjach webowych, dbającym o bezpieczeństwo użytkowników. W praktyce, pola typu password są używane w formularzach logowania oraz rejestracji, gdzie ochrona danych osobowych i wrażliwych jest priorytetem. Ważne jest również, aby takie pola były osadzone w bezpiecznych kontekstach, np. na stronach korzystających z protokołu HTTPS, co zapewnia szyfrowanie przesyłanych informacji. Ponadto, deweloperzy powinni stosować się do dobrych praktyk, takich jak implementacja mechanizmów zapobiegających atakom typu shoulder surfing poprzez odpowiednie umiejscowienie i stylowanie pól password. Warto również pamiętać o testowaniu funkcjonalności takich pól, aby upewnić się, że ukrywanie znaków działa prawidłowo na różnych urządzeniach i przeglądarkach, co jest kluczowe w zapewnieniu spójnego doświadczenia użytkownika oraz zachowania bezpieczeństwa.

Pytanie 31

Jakie oprogramowanie NIE JEST systemem do zarządzania treścią (CMS)?

A. WordPress
B. Apache
C. Joomla
D. Mambo
Joomla, WordPress i Mambo to systemy zarządzania treścią, które umożliwiają użytkownikom tworzenie oraz zarządzanie treściami na stronach internetowych. Każdy z tych CMS-ów ma swoje unikalne cechy, które przyciągają różne grupy użytkowników. Na przykład, Joomla jest często wybierana do bardziej złożonych projektów, które wymagają zaawansowanego zarządzania użytkownikami i treściami, podczas gdy WordPress jest szczególnie popularny wśród blogerów i małych firm ze względu na swoją prostotę i bogaty ekosystem wtyczek. Mambo, z kolei, był jednym z pierwszych systemów CMS, który zyskał popularność, jednakże jego rozwój został w pewnym momencie wstrzymany. Wybór jednego z tych systemów jako niewłaściwego może wynikać z nieporozumienia dotyczącego funkcji i zastosowania tych narzędzi. Często użytkownicy mylą rolę serwera, który hostuje aplikację, z rolą samej aplikacji. Zrozumienie, że Apache jest serwerem, a nie systemem zarządzania treścią, jest kluczowe. W kontekście projektowania i wdrażania rozwiązań internetowych, ważne jest, aby dostrzegać różnice między infrastrukturą a aplikacjami, które na niej działają. Właściwe zrozumienie tych konceptów pozwala na lepsze projektowanie architektury systemów oraz lepsze dostosowanie narzędzi do konkretnych potrzeb projektu.

Pytanie 32

W języku JavaScript trzeba zapisać warunek, który będzie prawdziwy, gdy zmienna a będzie jakąkolwiek liczbą naturalną dodatnią (bez 0) lub zmienna b przyjmie wartość z zamkniętego przedziału od 10 do 100. Wyrażenie logiczne w tym warunku ma formę

A. (a>0) || ((b>=10) && (b<=100))
B. (a>0) && ((b>=10) || (b<=100))
C. (a>0) || ((b>=10) || (b<=100))
D. (a>0) && ((b>=10) && (b<=100))
Pierwsza odpowiedź (a>0) || ((b>=10) || (b<=100)) jest niepoprawna, ponieważ używa operatora || w kontekście sprawdzania wartości zmiennej b w sposób, który nie ogranicza jej do przedziału od 10 do 100. Wyrażenie (b>=10) || (b<=100) oznacza, że b może być mniejsze niż 10, co jest sprzeczne z wymaganiami dotyczącymi przedziału. W związku z tym, ta konstrukcja może dopuścić do sytuacji, w której b ma wartość poniżej 10, co nie jest akceptowalne. Kolejna niepoprawna odpowiedź (a>0) && ((b>=10) || (b<=100)) wymaga, aby obydwa warunki były prawdziwe, co również prowadzi do błędnego sprawdzenia. Operator && wymusza spełnienie obu warunków, a zatem jeśli a jest większe od 0, ale b jest mniejsze niż 10, cała konstrukcja zwróci false, co czyni ją nieodpowiednią dla zadanych wymagań. Ostatnia niepoprawna opcja (a>0) && ((b>=10) && (b<=100)) również jest niewłaściwa, ponieważ zamiast umożliwić elastyczność w spełnianiu warunku, wymaga, aby obydwa warunki były prawdziwe jednocześnie. W kontekście zadania, nie możemy narzucić, aby a i b musiały być prawdziwe w tym samym czasie, co uniemożliwia skuteczne sprawdzenie jednej z opcji, przez co odpowiedź nie spełnia wymagań zadania. W związku z tym, wszystkie te odpowiedzi są niepoprawne w kontekście zadania, które wymaga dwóch odrębnych warunków do spełnienia.

Pytanie 33

Parametr face elementu <font> jest używany do wskazania

A. koloru czcionki
B. nazwa czcionki
C. rozmiaru czcionki
D. efektów czcionki
Odpowiedzi sugerujące, że parametr face dotyczy barwy, wielkości lub efektów czcionki opierają się na nieprawidłowym zrozumieniu funkcji znacznika <font>. Chociaż kolory czcionek można faktycznie definiować w HTML, to odpowiedzialny za nie jest inny atrybut – color. Warto zauważyć, że barwa tekstu jest istotnym elementem projektowania stron, ale jest to niezwiązane z parametrem face. Wielkość czcionki z kolei jest regulowana przez atrybut size, co również jest osobną kwestią. Efekty czcionki, takie jak pogrubienie czy kursywa, są osiągane za pomocą atrybutów takich jak bold i italic, natomiast face precyzuje wyłącznie nazwę czcionki. Powszechnym błędem w myśleniu jest zakładanie, że wszystkie aspekty stylizacji czcionek są ze sobą powiązane w jednym parametrze. Kluczowe jest zrozumienie, że HTML i CSS mają różne role w tworzeniu stron internetowych. HTML skupia się na strukturze dokumentu, podczas gdy CSS odpowiada za jego wygląd. W przypadku nowoczesnych praktyk kodowania, atrybut face jest uznawany za przestarzały, co sprawia, że korzystanie z CSS jest bardziej efektywne i zgodne z aktualnymi standardami projektowania stron. Zamiast polegać na starych metodach, warto dostosować się do współczesnych technik kodowania, które oferują większą elastyczność oraz lepsze wsparcie dla responsywności stron.

Pytanie 34

Kolor zapisany w systemie RGB, o wartościach rgb(255,128,16), jaki będzie miał odpowiednik w kodzie szesnastkowym?

A. #008010
B. #ff8010
C. #ff0f10
D. #ff8011
Odpowiedzi, które nie są poprawne, można analizować pod kątem błędów w konwersji wartości RGB na format szesnastkowy. W pierwszym przypadku, kolor zapisany jako #008010 nie odpowiada podanym wartościom RGB, ponieważ składowa czerwonego ma wartość 0 zamiast 255, co sprawia, że kolor ten jest odcieniem zieleni, a nie pomarańczowym. Kolejną niepoprawną odpowiedzią jest #ff0f10, w której składowa zielona wynosi 0, zamiast 128. W efekcie otrzymujemy kolor dominujący w czerwieni z odrobiną niebieskiego, co nie odpowiada oryginalnemu kolorowi. Ostatnia niepoprawna odpowiedź, #ff8011, różni się jedynie w ostatniej cyfrze od poprawnej odpowiedzi. Zwiększenie wartości niebieskiej do 11 zamiast 10 prowadzi do niewłaściwego odcienia, ponieważ zmienia balans kolorów i nie odwzorowuje oryginalnego koloru RGB. Wszystkie te błędy ilustrują znaczenie dokładności w konwersji wartości kolorów, co jest kluczowe w projektowaniu graficznym i webowym.

Pytanie 35

Aby uruchomić skrypt JavaScript, potrzebne jest oprogramowanie

A. serwer WWW
B. serwer MySQL
C. debugger JavaScript
D. przeglądarka internetowa
Aby uruchomić skrypt JavaScript, niezbędne jest posiadanie przeglądarki internetowej, ponieważ JavaScript jest językiem skryptowym, który działa bezpośrednio w środowisku przeglądarki. Przeglądarki, takie jak Chrome, Firefox czy Safari, zawierają silniki JavaScript, które interpretują i wykonują kod skryptowy. Przykładem może być użycie funkcji 'console.log()', która umożliwia wyświetlanie danych w konsoli przeglądarki. Ponadto, standard ECMAScript, na którym oparty jest JavaScript, określa zasady i funkcje tego języka, a przeglądarki implementują te standardy, co zapewnia spójność działania skryptów. Użytkownicy mogą również używać narzędzi deweloperskich, dostępnych w przeglądarkach, do debugowania i optymalizacji skryptów, ale podstawowym warunkiem uruchomienia kodu JavaScript zawsze będzie przeglądarka internetowa. W obecnych czasach, JavaScript stał się kluczowym elementem tworzenia interaktywnych aplikacji internetowych, co podkreśla jego znaczenie w ekosystemie webowym.

Pytanie 36

Który z poniższych fragmentów kodu HTML sformatuje tekst zgodnie z wymaganiami? (zauważ, że słowo "stacji" jest wyświetlane w większej czcionce niż pozostałe słowa w tej linii)

Ilustracja do pytania
A. Odpowiedź 4: D
B. Odpowiedź 1: A
C. Odpowiedź 3: C
D. Odpowiedź 2: B
Odpowiedź B jest prawidłowa ponieważ używa znacznika big do zwiększenia rozmiaru czcionki dla słowa stacji wewnątrz paragrafu. Znacznik big jest standardowym sposobem na zwiększenie tekstu w HTML chociaż obecnie rekomendowane jest stosowanie CSS do takich stylizacji co pozwala na oddzielenie treści od prezentacji. Przykładowo można użyć CSS w stylu inline lub w oddzielnym arkuszu stylów aby uzyskać ten sam efekt co zwiększa elastyczność i spójność projektu. Warto pamiętać że HTML5 wprowadza pewne zmiany i deprecjonuje niektóre znaczniki co wymaga ciągłego aktualizowania wiedzy dewelopera. Znacznik big mimo że działa w większości przeglądarek może być mniej przewidywalny w przyszłości w porównaniu z CSS. Rozdzielenie stylów od struktury dokumentu jest dobrą praktyką programistyczną co ułatwia zarządzanie kodem oraz poprawia dostępność stron internetowych. Pamiętaj by regularnie analizować i aktualizować swoje projekty zgodnie z najnowszymi standardami HTML i CSS.

Pytanie 37

Liczba 0x142, przedstawiona w kodzie JavaScript, przyjmuje formę

A. ósemkową
B. szesnastkową
C. dziesiętną
D. dwójkową
Liczba 0x142 jest zapisana w systemie szesnastkowym, co oznacza, że jest reprezentowana w bazie 16. W systemie szesnastkowym posługujemy się cyframi od 0 do 9 oraz literami od A do F, gdzie A odpowiada 10, B to 11, C to 12, D to 13, E to 14, a F to 15 w systemie dziesiętnym. Przykład zastosowania tego systemu można zauważyć w programowaniu oraz w różnych standardach, takich jak HTML, gdzie kolory są często reprezentowane w formacie szesnastkowym, np. #FFFFFF dla bieli. Można także spotkać się z systemem szesnastkowym w adresacji pamięci oraz w reprezentacji liczb dużych, co jest szczególnie przydatne w kontekście programowania niskopoziomowego i systemów wbudowanych. Zrozumienie różnych systemów liczbowych, w tym szesnastkowego, jest niezbędne dla każdego programisty, szczególnie podczas pracy z danymi binarnymi, hex i podczas obliczeń niskopoziomowych.

Pytanie 38

Jak nazwana jest technika dołączania arkusza stylów do dokumentu HTML użyta w podanym kodzie?

<p style="color:red;">tekst</p>
A. Styl wewnętrzny
B. Styl wpisany, lokalny
C. Styl alternatywny, zewnętrzny
D. Styl zewnętrzny
Styl wewnętrzny to metoda w której reguły CSS są zawarte w sekcji head dokumentu HTML w znaczniku style Jest to przydatne w przypadku gdy stylizacja ma obejmować wiele elementów w pojedynczym dokumencie ale nie wymaga globalnego zastosowania Styl wewnętrzny jest bardziej zorganizowany niż styl wpisany ale nadal nie jest najlepszym rozwiązaniem dla dużych projektów ponieważ utrudnia współdzielenie stylów między wieloma stronami Styl alternatywny zewnętrzny odnosi się do sytuacji gdy mamy dostępne różne arkusze stylów które mogą być wymiennie stosowane do tej samej strony internetowej Jest to zaawansowana koncepcja rzadko stosowana w praktyce ale przydatna w projektach gdzie użytkownicy mogą wybierać różne motywy graficzne Styl zewnętrzny to najbardziej zalecana metoda stylizacji gdzie wszystkie reguły są zapisane w osobnym pliku CSS który jest linkowany do dokumentu HTML Pozwala to na łatwe zarządzanie i aktualizację stylów w całym projekcie Jednym z typowych błędów jest mylenie stylu zewnętrznego ze stylem wpisanym oba rozwiązania służą do różnych celów Styl zewnętrzny daje strukturę i pozwala na współdzielenie stylów między stronami co poprawia spójność wyglądu całego serwisu oraz ułatwia jego utrzymanie w przeciwieństwie do bardziej chaotycznego podejścia stylu wpisanego który może prowadzić do zduplikowanego i trudnego w zarządzaniu kodu

Pytanie 39

Które z poniższych poleceń JavaScript zmieni kolor tekstu na niebieski w paragrafie oznaczonym w HTML?

<p id="jeden">Kwalifikacja EE.01</p>
A. document.getElementById("jeden").style.color = "blue";
B. document.getElementById("jeden").style.background-color = "blue";
C. document.getElementById("jeden").background-color = "blue";
D. document.getElementById("jeden").color = "blue";
W języku JavaScript do zmiany stylu elementu HTML używamy obiektu style powiązanego z danym elementem. W przypadku zmiany koloru tekstu w akapicie używamy właściwości color. Poprawna składnia to document.getElementById("jeden").style.color = "blue";. Funkcja getElementById pobiera element o podanym identyfikatorze w tym przypadku jeden. Następnie poprzez przypisanie wartości blue do style.color zmieniamy kolor tekstu wewnątrz tego elementu na niebieski. Jest to zgodne z praktykami programowania w JavaScript ponieważ separacja stylów od treści jest istotna dla czytelności i utrzymania kodu a użycie style pozwala na bezpośrednią modyfikację właściwości CSS. Dobre praktyki sugerują aby stylowanie umieszczać w plikach CSS jednak JavaScript daje możliwość dynamicznej modyfikacji stylów co jest użyteczne w interaktywnych aplikacjach webowych. Przykładowo podczas tworzenia dynamicznych interfejsów użytkownika możemy reagować na różne zdarzenia zmieniając style elementów w odpowiedzi na działania użytkownika co zwiększa responsywność i atrakcyjność aplikacji.

Pytanie 40

Dla celu strony internetowej stworzono grafikę rysunek.jpg o wymiarach: szerokość 200 px, wysokość 100 px. Aby zaprezentować tę grafikę jako miniaturę – pomniejszoną z zachowaniem proporcji, można użyć znacznika

A. <img src="/rysunek.png" style="width: 50px">
B. <img src="/rysunek.png" style="width: 25px; height:25px;">
C. <img src="/rysunek.png" style="width: 25px; height:50px;">
D. <img src="/rysunek.png">
Wybór innych opcji, takich jak <img src="/rysunek.png" style="width: 25px; height:50px;"> czy <img src="/rysunek.png" style="width: 25px; height:25px;"> prowadzi do nieproporcjonalnego wyświetlenia obrazu, co skutkuje jego zniekształceniem. Ustalenie zarówno szerokości, jak i wysokości w stylach CSS sprawia, że obrazek jest zmuszony do dopasowania się do tych wymiarów, co narusza jego naturalne proporcje. To podejście jest niezgodne z zaleceniami dotyczącymi responsywności, które sugerują, aby ograniczać się do jednego wymiaru, co pozwala drugiemu na automatyczne dostosowanie. Typowym błędem jest przyjęcie, że podanie obu wymiarów w pikselach zawsze przyniesie optymalny efekt wizualny, co jest mylące i może prowadzić do złego doświadczenia użytkownika. Zniekształcenie obrazów nie tylko obniża estetykę strony, ale także może wpływać na jej użyteczność oraz SEO. Dobrą praktyką jest również używanie atrybutów 'alt' w znacznikach obrazów, aby poprawić dostępność i SEO, co nie zostało uwzględnione w żadnej z opcji. Warto także zauważyć, że stosowanie odpowiednich formatów obrazów i ich optymalizacja pod względem rozmiaru pliku są kluczowe dla przyspieszenia ładowania strony.