Wyniki egzaminu

Nowy egzamin

Informacje o egzaminie:

Zawód: Technik informatyk
Kwalifikacja: INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych
Data rozpoczęcia: 18 lipca 2026 16:42
Data zakończenia: 18 lipca 2026 16:56

Egzamin zdany!

Wynik: 29/40 punktów (72,5%)

Wymagane minimum: 20 punktów (50%)

Nowe

Analiza przebiegu egzaminu- sprawdź jak rozwiązywałeś pytania

Przebieg egzaminu

Pochwal się swoim wynikiem!

Facebook

X.com

Szczegółowe wyniki:

Pytanie 1

Po wykonaniu instrukcji języka JavaScript x = Math.ceil(2.4); wartość zmiennej x będzie wynosić

A. 3

B. 8

C. 4

D. 2

W tym przykładzie kluczowe jest zrozumienie, co dokładnie robi funkcja Math.ceil() w JavaScript. Ta funkcja zawsze zaokrągla liczbę w górę do najbliższej liczby całkowitej, i to niezależnie od tego, jak mała jest część ułamkowa. Dla wartości 2.4 najbliższa liczba całkowita „w górę” to 3, więc po wykonaniu instrukcji x = Math.ceil(2.4); zmienna x przyjmie wartość 3. Nie interesuje nas tu klasyczne zaokrąglanie matematyczne do „najbliższej” liczby, tylko zawsze w stronę dodatniej nieskończoności.
W standardzie ECMAScript Math.ceil() jest jedną z podstawowych funkcji do pracy z liczbami, obok Math.floor() (zaokrąglenie w dół) i Math.round() (zaokrąglenie do najbliższej liczby całkowitej). Dla porównania: Math.floor(2.4) da 2, Math.round(2.4) też da 2, a tylko Math.ceil(2.4) zwróci 3. W praktyce webowej takie funkcje są często używane np. przy dzieleniu elementów na strony (paginacja), liczeniu ilości stron w wynikach wyszukiwania, obliczaniu liczby wierszy w siatce (grid), czy przy przeliczaniu miejsc w koszyku, kiedy musisz zawsze „doliczyć” pełną jednostkę.
Moim zdaniem warto od razu wyrobić sobie nawyk, żeby przy liczbach zmiennoprzecinkowych w JavaScript pamiętać o różnicach między ceil, floor i round, bo to są podstawowe narzędzia przy każdym kalkulatorze, module cenowym, przeliczaniu czasu trwania, dzieleniu zadań na porcje itd. Dobra praktyka jest też taka, żeby zawsze jasno nazywać zmienne, np. totalPages = Math.ceil(itemsCount / itemsPerPage); – od razu widać, że chodzi o zaokrąglenie w górę.
Podsumowując: poprawna odpowiedź to 3, bo Math.ceil() zawsze przesuwa wynik do najbliższej większej lub równej liczby całkowitej. Dla 2.4 jest to właśnie 3.

Pytanie 2

Zawartość kodu w języku HTML umieszczona w ramce ilustruje zestaw

<ol>
 <li>Pierwszy</li>
 <li>Drugi</li>
 <li>Trzeci</li>
 </ol>

A. numerowanej

B. skróconych

C. wypunktowanej

D. linków

Fragment kodu HTML używa tagu <ol> co oznacza listę numerowaną. Tag <ol> jest skrótem od ordered list i jest używany do tworzenia listy elementów, które są automatycznie numerowane przez przeglądarkę. Wewnątrz tego tagu znajdują się tagi <li>, które oznaczają poszczególne elementy listy. Każdy z tych elementów będzie wyświetlany z kolejnym numerem w przeglądarce internetowej. Na przykład w przypadku zamieszczonego kodu HTML przeglądarka wyświetli listę z numerami 1 2 3 przed elementami Pierwszy Drugi Trzeci. Listy numerowane są użyteczne w sytuacjach gdy ważna jest kolejność elementów na przykład w instrukcjach krok po kroku lub rankingach. Tworzenie list numerowanych z użyciem <ol> jest zgodne ze standardami HTML i jest dobrym rozwiązaniem gdyż pozwala na łatwe zarządzanie kolejnością elementów bez konieczności ręcznego numerowania co redukuje ryzyko błędów i automatycznie aktualizuje numerację w przypadku dodania bądź usunięcia elementów z listy.

Pytanie 3

Jakie będzie wynik działania programu napisanego w JavaScript, umieszczonego w ramce, kiedy wprowadzisz wartość 5?

var n, i;
 var a = 1;

 n = prompt("Podaj n:", "");

 for (i=n; i>=2; i--)
     a*=i;

 document.write("Wynik ",a);

A. 125

B. 625

C. 60

D. 120

Niepoprawne odpowiedzi wynikają z niezrozumienia działania pętli i operatora *= w języku JavaScript. Program implementuje algorytm obliczający silnię, co oznacza wielokrotne mnożenie kolejnych liczb całkowitych malejących aż do wartości 2. Niezrozumienie, że silnia n to iloczyn n*(n-1)*(n-2)*...*2, prowadzi do błędnych odpowiedzi. Początkowa wartość zmiennej a ustawiona na 1 jest kluczowa, ponieważ działa jako neutralny element mnożenia. Każda iteracja pętli zmniejsza wartość i, a *= i oznacza, że a jest mnożone przez bieżącą wartość i, co jest często źle interpretowane jako dodawanie lub niedokładne mnożenie. To typowy błąd przy próbie szybkiego zrozumienia kodu bez analizy krok po kroku. Kolejnym częstym błędem jest złe zrozumienie zakresu działania pętli for, która w tym przypadku działa od wartości n aż do 2 włącznie, co jest istotne, bo mnożenie przez 1 nie zmienia wyniku, ale jest częścią klasycznej definicji silni. Dla danych wejściowych 5, poprawnym wynikiem jest 5*4*3*2*1, co daje 120, a inne wartości jak 125, 60 czy 625 wskazują na błędne założenia lub niepełne zrozumienie mechanizmu działania pętli i mnożenia w kontekście silni.

Pytanie 4

Jaką kompetencję społeczną ma osoba, która potrafi wyrażać swoje zdanie i bronić swoich racji, nie naruszając przy tym granic własnych ani innych ludzi?

A. asertywność

B. konformizm

C. empatia

D. akomodacja

Asertywność to kompetencja społeczna polegająca na otwartym wyrażaniu własnego zdania i obronie swoich racji z poszanowaniem granic - zarówno własnych, jak i innych osób. To postawa równowagi: ani uległa, ani agresywna. Dlatego opisaną kompetencją jest asertywność.

Pytanie 5

Aby uzyskać akapit, w którym słowo „zaznaczony” jest wyróżnione znacznikiem <mark>, a słowo „istotny” oznaczone jako ważne <em> - z poprawnym otwarciem i zamknięciem znaczników - należy zastosować kod:

<p>Tekst może być <mark>zaznaczony albo <i>istotny</i> dla autora</mark></p>

<p>Tekst może być <mark>zaznaczony albo <em>istotny</em> dla autora</mark></p>

<p>Tekst może być <mark>zaznaczony</mark> albo <em>istotny dla autora</p>

<p>Tekst może być <mark>zaznaczony</mark> albo <em>istotny</em> dla autora</p>

Poprawny kod to

<p>Tekst może być <mark>zaznaczony</mark> albo <em>istotny</em> dla autora</p>

Każdy znacznik obejmuje dokładnie to słowo, którego dotyczy: <mark> wyróżnia „zaznaczony”, a <em> oznacza „istotny” jako ważny - i oba są zamknięte. Znaczniki nie zachodzą też na siebie nieprawidłowo. Dlatego ta wersja jest poprawna.

Pytanie 6

Zademonstrowano efekt stylizacji CSS oraz kod HTML. W jaki sposób należy ustawić styl, aby uzyskać takie formatowanie?

A. .first-line {font-size: 200%; color:brown;}

B. p.first-line {font-size: 200%; color:brown;}

C. #first-line {font-size: 200%; color:brown;}

D. p::first-line {font-size: 200%; color:brown;}

Odpowiedź p::first-line {font-size: 200%; color:brown;} jest prawidłowa, ponieważ selektor ::first-line w CSS służy do formatowania pierwszej linii tekstu wewnątrz elementu blokowego, takiego jak <p>. W tym przypadku formatowanie odnosi się do zmiany rozmiaru czcionki na 200% i koloru na brązowy, co jest zgodne z efektem prezentowanym na obrazie. Jest to powszechna praktyka, gdy chcemy wyróżnić pierwszą linię tekstu, nadając jej specjalny wizualny akcent. Warto zaznaczyć, że selektory pseudo-klasowe, jak ::first-line, są częścią specyfikacji CSS i umożliwiają bardziej precyzyjne i kontekstualne formatowanie treści, co jest zgodne z najlepszymi praktykami w projektowaniu stron internetowych. Tego typu rozwiązania zwiększają czytelność i estetykę tekstu. W praktyce, stosowanie ::first-line jest szczególnie przydatne w projektach wymagających subtelnych wyróżnień tekstowych, takich jak artykuły prasowe, blogi czy strony promujące treści literackie. Taki styl programowania jest zgodny z zaleceniami W3C, co czyni go nie tylko efektywnym, ale i standardowym podejściem w tworzeniu nowoczesnych stron internetowych.

Pytanie 7

Skrypt w języku JavaScript, który zajmuje się płacami pracowników, ma na celu stworzenie raportu dla osób zatrudnionych na umowę o pracę, które otrzymują wynagrodzenie w przedziale 4000 do 4500 zł, w tym przedziale obustronnie domkniętym. Jakie jest kryterium do wygenerowania raportu?

A. umowa == 'praca' || (pensja >= 4000 && pensja <= 4500)

B. umowa == 'praca' && (pensja >= 4000 || pensja <= 4500)

C. umowa == 'praca' || (pensja >= 4000 || pensja <= 4500)

D. umowa == 'praca' && (pensja >= 4000 && pensja <= 4500)

Odpowiedź, którą wybrałeś, to umowa == 'praca' && (pensja >= 4000 && pensja <= 4500). To jest faktycznie odpowiednia opcja, bo spełnia warunki do wygenerowania raportu. To ważne, żeby oba warunki były spełnione – pracownik musi mieć umowę o pracę i pensja powinna być w zakresie od 4000 do 4500 zł. Na przykład, jeśli ktoś zarabia 4200 zł, to wtedy wszystko gra i raport się pojawi. W programowaniu używanie operatorów logicznych, takich jak '&&', jest kluczowe, bo pozwalają one precyzyjnie ustalić kryteria. Dobrze zrozumiane operatory '&&' i '||' pomagają unikać niejasności i błędów w logice, a to jest podstawa dobrego pisania kodu.

Pytanie 8

Deklarując var x="true"; w języku JavaScript, jakiego typu zmienną się tworzy?

A. Liczbowego

B. Logicznego

C. Nieokreślonego (undefined)

D. String (ciąg znaków)

Odpowiedzi wskazujące na inne typy danych, takie jak typ logiczny czy liczbowy, zawierają istotne nieporozumienia dotyczące sposobu, w jaki JavaScript zarządza danymi. Typ logiczny w tym kontekście oznaczałby, że zmienna mogłaby przyjmować tylko wartości 'true' lub 'false', co jest mylnym założeniem, ponieważ 'true' jest tutaj częścią tekstu, a nie wartością logiczną. Z kolei typ liczbowy byłby właściwy dla zmiennych takich jak 1, 2 czy 3, które reprezentują liczby całkowite lub zmiennoprzecinkowe. W przypadku zadeklarowanej zmiennej 'var x="true";', wartość, która jest przypisywana, jest w rzeczywistości ciągiem tekstowym, mimo że zawiera słowo kluczowe 'true'. Typ danych 'undefined' z kolei oznacza, że zmienna została zadeklarowana, ale nie przypisano jej żadnej wartości, co również nie odpowiada sytuacji przedstawionej w pytaniu. Zrozumienie typów danych w JavaScript jest kluczowe dla unikania błędów typowych, zwłaszcza w kontekście zmiennych, które mogą być używane w różnych operacjach. W praktyce, to zrozumienie typów pozwala programistom lepiej zarządzać danymi i pisać bardziej niezawodny kod. Warto również pamiętać, że JavaScript automatycznie konwertuje typy w wielu sytuacjach, co może prowadzić do niezamierzonych rezultatów, dlatego proszę zwracać szczególną uwagę na przypisania i operacje wykonywane na zmiennych.

Pytanie 9

W CSS określono styl dla stopki. Jak można zastosować to formatowanie do bloku oznaczonego znacznikiem div?

#stopka { ... }

A. <div class = "stopka"> …

B. <div "stopka"> …

C. <div title = "stopka"> …

D. <div id = "stopka"> …

Poprawnie – zapis #stopka w CSS oznacza selektor identyfikatora (ID), więc w HTML musimy użyć atrybutu id="stopka" dokładnie z tą samą nazwą. W CSS znak # wskazuje, że styl jest przypisany do elementu o konkretnym identyfikatorze, a nie do klasy czy czegokolwiek innego. Dlatego jedynym prawidłowym sposobem podpięcia tego stylu do bloku div jest konstrukcja: <div id="stopka">…</div>.
W praktyce wygląda to tak:
CSS:
#stopka {
background-color: #333;
color: white;
padding: 20px;
}
HTML:
<div id="stopka">To jest stopka strony</div>
Przeglądarka łączy selektor #stopka z elementem, który ma id="stopka" i nakłada na niego zdefiniowane właściwości. Identyfikator powinien być unikalny w obrębie całego dokumentu HTML, co jest zgodne z zaleceniami W3C i ogólnie przyjętą dobrą praktyką. Do jednego ID odwołujemy się w CSS przez #, a w JavaScript przez document.getElementById("stopka").
Moim zdaniem warto zapamiętać prostą zasadę: # w CSS = id w HTML, kropka (.) w CSS = class w HTML. Gdy projektujesz layout strony, zwykle elementy typu nagłówek, stopka, główna nawigacja mają unikalne ID, bo występują raz na stronie. Natomiast powtarzalne elementy (np. kafelki z produktami) dostają klasy. Dzięki temu kod jest czytelniejszy, łatwiej się go utrzymuje i unikamy dziwnych konfliktów stylów. Dobrą praktyką jest też używanie opisowych nazw, np. id="stopka" zamiast skrótów typu id="s1", bo po miesiącu nikt nie pamięta, co to znaczyło.

Pytanie 10

Skrypt na stronę WWW stworzony w języku PHP

A. jest realizowany po stronie klienta

B. jest wykonywany po stronie serwera

C. jest przetwarzany w taki sam sposób jak JavaScript

D. może działać bez wsparcia serwera WWW

Kod PHP jest przetwarzany po stronie serwera, co oznacza, że wszystkie instrukcje napisane w tym języku są wykonywane na serwerze, a nie na komputerze klienta. Kiedy użytkownik żąda strony internetowej, serwer WWW interpretuje kod PHP, generuje odpowiedni HTML i wysyła go do przeglądarki. Dzięki temu możliwe jest dynamiczne tworzenie treści, uzależnionej od danych wejściowych użytkownika czy zawartości bazy danych. Przykładowo, w aplikacjach internetowych takich jak systemy zarządzania treścią (CMS) czy platformy e-commerce, PHP pozwala na generowanie różnorodnych widoków i interakcji w oparciu o aktualne informacje. Kluczowym aspektem dobrej praktyki w programowaniu w PHP jest separacja logiki aplikacji od warstwy prezentacji, co wspiera łatwiejsze zarządzanie kodem i jego utrzymanie. Warto również zaznaczyć, że PHP współpracuje z różnymi systemami baz danych, co umożliwia przechowywanie i przetwarzanie dużych ilości danych. Na przykład, w typowej aplikacji webowej można wykorzystać PHP do komunikacji z bazą MySQL, co pozwala na dynamiczne ładowanie treści w odpowiedzi na interakcje użytkownika.

Pytanie 11

Jaką funkcję pełni atrybut name w polu formularza, np. <input type="text" name="login">?

A. określa nazwę pola, pod którą dane trafiają na serwer

B. ustawia pole jako tylko do odczytu

C. ogranicza maksymalną długość pola

D. określa wartość domyślną pola

Atrybut name nadaje polu formularza nazwę, pod którą jego wartość jest przesyłana na serwer. To po niej skrypt odbierający (np. w PHP przez $_POST["login"]) rozpoznaje konkretne pole. Bez name wartość pola zwykle nie zostanie wysłana. Dlatego name określa nazwę pola w formularzu.

Pytanie 12

Aby naprawić uszkodzoną tabelę w bazie MySQL, należy wykonać polecenie:

CHECK TABLE

FIX TABLE

REPAIR TABLE

RESOLVE TABLE

Uszkodzoną tabelę w MySQL naprawia polecenie REPAIR TABLE, po którym podaje się nazwę tabeli, na przykład REPAIR TABLE klienci. Próbuje ono odbudować strukturę i indeksy tabeli, gdy ulegnie ona uszkodzeniu, np. po nagłym wyłączeniu serwera. Pokrewne CHECK TABLE służy do wcześniejszego wykrycia problemu. Do samej naprawy używa się jednak REPAIR TABLE.

Pytanie 13

Walidacja strony internetowej polega na

A. zestawie działań mających na celu zwiększenie liczby odwiedzin

B. sprawdzeniu jej w celu usunięcia błędów

C. reklamowaniu strony

D. umieszczaniu treści w sieci

Proces walidacji strony internetowej polega na systematycznym sprawdzeniu jej zawartości oraz struktury w celu identyfikacji i eliminacji błędów, które mogą wpływać na jej funkcjonalność oraz użyteczność. Walidacja to kluczowy etap w cyklu życia strony, ponieważ zapewnia, że strona działa zgodnie z wymaganiami technicznymi i standardami branżowymi, takimi jak W3C. Przykłady zastosowania walidacji obejmują sprawdzanie poprawności kodu HTML, CSS oraz dostępności, co jest istotne dla zapewnienia pozytywnego doświadczenia użytkowników. Strony internetowe, które są walidowane, mają większe szanse na lepsze pozycjonowanie w wyszukiwarkach, co przekłada się na wyższą oglądalność. Regularna walidacja jest również zgodna z najlepszymi praktykami w zakresie utrzymania jakości i bezpieczeństwa, co w dłuższej perspektywie wspiera reputację marki i zaufanie użytkowników.

Pytanie 14

Tablice superglobalne $_COOKIE oraz $_SESSION należą do języka:

A. C#

B. PHP

C. Perl

D. JavaScript

Tablice superglobalne $_COOKIE i $_SESSION to elementy języka PHP - dają dostęp odpowiednio do ciasteczek i danych sesji. Znak $ przed nazwą to charakterystyczny dla PHP zapis zmiennej. Dlatego należą do PHP.

Pytanie 15

W CSS określono styl dla pola do edycji, które będzie miało tło w kolorze jasnozielonym po aktywacji.

input:focus { background-color: LightGreen; }

A. po kliknięciu myszką w celu wprowadzenia tekstu

B. w każdej sytuacji

C. jeśli zostanie na nie najechane kursorem bez kliknięcia

D. gdy jest to pierwsze użycie tego elementu w dokumencie

Typowe błędy myślowe prowadzące do niepoprawnych odpowiedzi często obejmują mylenie różnych stanów interakcji z elementami formularzy. Na przykład, odpowiedź sugerująca, że stylizowane tło zostaje aktywowane "gdy zostanie wskazane kursorem myszy bez kliknięcia" myli pojmowanie stanu focus z prostym najechaniem kursorem. W rzeczywistości, stan focus aktywuje się tylko w wyniku interakcji, takiej jak kliknięcie lub nawigacja za pomocą klawiatury. Kolejną nieścisłością jest stwierdzenie, że formatowanie ma zastosowanie "w każdym przypadku". Takie podejście nie uwzględnia faktu, że styl focus jest specyficzny dla interakcji użytkownika, a więc jego zastosowanie jest ograniczone do sytuacji, w których element jest aktywny. Warto zauważyć, że dobrze zaprojektowane formularze online powinny wykorzystywać zdarzenia focus i blur, aby dostarczać użytkownikom pomocnych wskazówek oraz ułatwić wprowadzanie danych. Ignorowanie tych koncepcji prowadzi do projektowania interfejsów, które nie są w pełni responsywne wobec potrzeb użytkowników. Dlatego zrozumienie różnicy między focus a zwykłym wskazaniem kursorem jest kluczowe dla tworzenia efektywnych i przyjaznych dla użytkownika aplikacji internetowych.

Pytanie 16

Który typ danych najlepiej nadaje się do zapisania daty urodzenia ucznia?

DATE

TIME

ENUM

BLOB

Pozostałe typy nie pasują do daty. TIME przechowuje wyłącznie godzinę (czas w ciągu doby), a nie kalendarzową datę. BLOB to typ na dane binarne, np. obrazy lub pliki - dla daty zupełnie nieodpowiedni. ENUM pozwala wybrać jedną z wcześniej zdefiniowanych wartości tekstowych (np. listę kategorii), więc nie nadaje się do dowolnej daty. Datę urodzenia przechowuje typ DATE, dlatego ta odpowiedź jest poprawna.

Pytanie 17

W języku JavaScript przedstawiona definicja jest definicją

var imiona = ["Anna", "Jakub", "Iwona", "Krzysztof"];

A. tablicy.

B. klasy.

C. kolekcji.

D. obiektu.

Dobra robota! Wybrałeś poprawną odpowiedź, czyli tablicę. W języku JavaScript, tablice służą do przechowywania wielu wartości w pojedynczej zmiennej. W podanym przykładzie, zmienna 'imiona' jest tablicą, która zawiera ciągi znaków reprezentujące imiona. Tablica w JavaScript jest obiektem globalnym, który jest używany w kontekście obiektu. Tablice są jednym z podstawowych typów danych, które są niezbędne dla tworzenia i manipulowania danymi. Tworzenie tablicy jest bardzo proste, wystarczy użyć nawiasów kwadratowych [] i oddzielić elementy za pomocą przecinków. Oto przykład: var imiona = ['Jan', 'Anna', 'Piotr'];. W praktyce, tablice są używane w wielu różnych sytuacjach, takich jak przechowywanie danych do dalszej analizy, grupowanie powiązanych danych, tworzenie list lub tabel, a także do przechowywania danych na potrzeby pętli i innych struktur sterujących.

Pytanie 18

Jakie jest zadanie funkcji agregującej AVG w zapytaniu?

SELECT AVG(cena) FROM uslugi;

A. sprawdzić, ile usług znajduje się w tabeli

B. obliczyć średnią arytmetyczną wartości wszystkich usług

C. określić najwyższą wartość spośród cen usług

D. zliczyć całkowity koszt wszystkich usług

Funkcja AVG w SQL jest jednym z podstawowych narzędzi do analizy danych w bazach danych. Jej głównym celem jest obliczenie średniej arytmetycznej wartości w kolumnie, co jest kluczowe w raportowaniu i analizie danych. W zapytaniu SQL SELECT AVG(cena) FROM uslugi; funkcja AVG jest użyta, aby uzyskać średnią cenę wszystkich usług zapisanych w tabeli uslugi. Taka średnia jest przydatna w wielu kontekstach biznesowych na przykład przy tworzeniu raportów finansowych czy analizie kosztów w celu optymalizacji oferty. Średnia arytmetyczna pozwala zrozumieć przeciętną wartość danego zestawu danych co jest istotne w podejmowaniu decyzji. Standardy branżowe zalecają użycie funkcji AVG wszędzie tam gdzie potrzebna jest szybka i efektywna analiza danych liczbowych. Zrozumienie działania funkcji AVG jest kluczowe w pracy z bazami danych SQL gdyż pozwala na bardziej złożone analizy jak np. porównanie średnich z różnych okresów czasu lub segmentów rynku.

Pytanie 19

W tej definicji obiektu JavaScript która składowa jest METODĄ?

var obj1 = {
  czescUlamkowa: 10,
  czescCalkowita: 20,
  oblicz: function() {...}
}

oblicz

obj1

czescUlamkowa

czescCalkowita

W obiekcie JavaScript składowa będąca FUNKCJĄ to metoda. Tutaj oblicz: function() {...} przypisuje funkcję, więc oblicz jest metodą. Dlatego metodą jest oblicz.

Pytanie 20

Który kod HTML poprawnie tworzy akapit, w którym jedno słowo jest wyróżnione znacznikiem <mark>, a inne oznaczone jako ważne <em>, przy prawidłowym zamknięciu wszystkich znaczników?

<p>Tekst może być <mark>wyróżniony albo <i>istotny</i> dla autora</mark></p>

<p>Tekst może być <mark>zaznaczony</mark> albo <em>istotny</em> dla autora</p>

<p>Tekst może być <mark>wyróżniony</mark> albo <em>istotny dla autora</p>

<p>Tekst może być <mark>wyróżniony albo <em>istotny</em> dla autora</mark></p>

Poprawny kod to

<p>Tekst może być <mark>zaznaczony</mark> albo <em>istotny</em> dla autora</p>

Tu <mark> wyróżnia pojedyncze słowo, <em> oznacza inne jako ważne, a każdy znacznik ma swój znacznik zamykający we właściwym miejscu. Dlatego ta wersja jest prawidłowa.

Pytanie 21

W bazie danych dotyczącej sklepu znajduje się tabela artykuły, która posiada pole o nazwie nowy. Jak można zaktualizować to pole, aby dla każdego rekordu wprowadzić wartość TRUE, stosując odpowiednią kwerendę?

A. INSERT INTO artykuły VALUE nowy=TRUE

B. UPDATE nowy FROM artykuły VALUE TRUE

C. UPDATE artykuły SET nowy=TRUE

D. INSERT INTO nowy FROM artykuły SET TRUE

Odpowiedź UPDATE artykuły SET nowy=TRUE; jest poprawna, ponieważ wykorzystuje standardową składnię SQL do aktualizacji istniejących rekordów w tabeli. Kwerenda ta zmienia wartość pola 'nowy' na TRUE dla wszystkich rekordów w tabeli 'artykuły'. Metoda ta jest szeroko stosowana w praktyce, gdyż pozwala na masową aktualizację danych w bazie bez konieczności ich usuwania czy dodawania nowych rekordów. Z uwagi na fakt, że pole 'nowy' ma być uzupełnione dla wszystkich pozycji w tabeli, użycie kwerendy UPDATE jest najefektywniejszym i najbardziej intuicyjnym rozwiązaniem. Przykład zastosowania może obejmować sytuację, w której sklep wprowadza nową kategorię produktów, które są oznaczane jako 'nowe'. Stosowanie dobrze zdefiniowanych kwerend UPDATE jest zgodne z dobrymi praktykami w zarządzaniu bazami danych, ponieważ promuje integralność danych oraz umożliwia łatwą modyfikację i kontrolę nad bazą.

Pytanie 22

Aby wykonać kod napisany w języku PHP, w systemie musi być zainstalowany:

A. tylko przeglądarka internetowa

B. serwer WWW z interpreterem PHP

C. serwer WWW z bazą danych MySQL

D. wyłącznie edytor tekstu

Pozostałe odpowiedzi nie pozwolą uruchomić kodu PHP. Sama przeglądarka wykonuje jedynie technologie klienta - HTML, CSS i JavaScript - a kodu PHP nie zna, bo ten działa na serwerze. Serwer WWW z bazą MySQL zawiera co prawda element serwera, ale to baza, nie interpreter, więc bez PHP skrypt się nie wykona (baza bywa potrzebna dopiero przy pracy z danymi). Sam edytor tekstu pozwala jedynie zapisać kod. Do wykonania PHP konieczny jest serwer WWW z interpreterem PHP.

Pytanie 23

Aby utworzyć strukturę strony internetowej za pomocą znaczników semantycznych języka HTML 5, zgodnie z przedstawionym na ilustracji projektem, SEKCJA B powinna być zawarta w znaczniku

A. <article></article>

B. <section></section>

C. <header></header>

D. <nav></nav>

W tym zadaniu kluczowe jest rozpoznanie, że sekcja B na ilustracji nie jest zwykłym fragmentem treści, tylko blokiem służącym do poruszania się po stronie: linki „Główna”, „O nas”, „Kontakt”. W semantycznym HTML5 dla takiej właśnie grupy odsyłaczy przewidziano specjalny znacznik <nav>. Częsty błąd polega na tym, że projektanci wrzucają menu nawigacyjne do zwykłego <div> albo <section>, a semantykę zostawiają na później. Technicznie strona działa, ale traci się zalety wynikające z poprawnej struktury: czytniki ekranu nie mogą łatwo przeskoczyć do nawigacji, roboty wyszukiwarek gorzej interpretują układ, a cała strona staje się mniej dostępna. Innym typowym nieporozumieniem jest używanie <header> dla wszystkiego, co znajduje się „na górze” strony. Nagłówek faktycznie często zawiera menu, ale to menu i tak powinno być wydzielone znacznikiem <nav> wewnątrz <header>. Sam <header> opisuje obszar wprowadzający: logo, tytuł, czasem slogan. Z kolei <section> i <article> służą do logicznego dzielenia treści merytorycznej, a nie do nawigacji. Jeśli więc sekcja B zawiera tylko linki menu, zamykanie jej w <section> myli sens dokumentu – wygląda, jakby to była kolejna część artykułu, a nie narzędzie przechodzenia między podstronami. Podobnie znaczniki typu <aside> czy <footer> też nie pasują: <aside> jest na treści poboczne, a <footer> na stopkę. W nowoczesnych projektach, zgodnych z HTML Living Standard i dobrymi praktykami dostępności, wszystkie główne obszary nawigacji opisuje się konsekwentnie za pomocą <nav> i to właśnie odróżnia kod „zlepiony byle działał” od kodu, który jest przemyślany i profesjonalny.

Pytanie 24

Którego znacznika użyć, aby utworzyć pole hasła (tekst maskowany kropkami)?

<input name="password">

<form="password" type="password">

<form input type="password">

<input type="password">

<input name="password"> nadaje tylko NAZWĘ pola (domyślnie typ tekstowy), więc nie maskuje znaków. Zapisy z <form ...> mieszają znacznik formularza z polem - są błędne składniowo. Pole hasła daje <input type="password">.

Pytanie 25

Przedstawiona transformacja obrazu, w edytorze grafiki rastrowej, została wykonana przy pomocy filtru

A. rozmycia Gaussa.

B. redukcja szumu.

C. szum HSV.

D. błysk gradientowy.

Gratulacje, twoja odpowiedź jest prawidłowa. Wybrałeś 'rozmycie Gaussa', które jest odpowiednią odpowiedzią. Na przedstawionym obrazie widzimy, że obraz po prawej stronie jest rozmyty w sposób ciągły i jednolity - to jest charakterystyczne dla rozmycia Gaussa. Filtr rozmycia Gaussa jest powszechnie stosowany w edytorach grafiki rastrowej do uzyskania efektu miękkiego rozmycia, który symuluje efekt obserwacji obiektu przez nieostre medium lub z dużą głębią ostrości. Jest to praktyczne narzędzie, które ma szerokie zastosowanie zarówno w fotografii, jak i w grafice komputerowej. Filtr ten jest często używany do poprawy estetyki obrazów, redukcji szumu i artefaktów, a także w szeroko pojętym przetwarzaniu obrazów, takim jak detekcja krawędzi. Jego nazwa pochodzi od matematyka Karla Gaussa, który opracował koncepcję rozkładu normalnego, na którym opiera się ten filtr.

Pytanie 26

Które reguły CSS poprawnie ustawiają dla akapitu czcionkę Arial, rozmiar 16 pt i pochylenie (kursywę)?

p { font-style: Arial; size: 16px; font-weight: normal; }

p { font-style: Arial; font-size: 16pt; font-variant: normal; }

p { font-family: Arial; font-size: 16px; font-variant: normal; }

p { font-family: Arial; font-size: 16pt; font-style: italic; }

Pozostałe zapisy mylą właściwości lub jednostki. W kilku z nich krój czcionki próbuje się ustawić przez font-style, podczas gdy do kroju służy font-family - font-style włącza jedynie pochylenie. Pojawia się też nieistniejąca właściwość size zamiast font-size. Pochylenia nie da się uzyskać przez font-variant (ta odpowiada za np. kapitaliki). Błędem jest również podanie rozmiaru w px, gdy zadano 16pt. Poprawnie krój, rozmiar i kursywę ustawia font-family, font-size: 16pt i font-style: italic.

Pytanie 27

W języku JavaScript stworzono zmienną i, która będzie przechowywać wynik dzielenia równy 1, to

A. var i=parseInt(3/2)

B. var i=Number(3/2)

C. var i=3/2

D. var i=parseFloat(3/2)

Wybór 'var i=parseInt(3/2);' jest właściwy, ponieważ funkcja parseInt służy do konwersji wartości liczbowych na liczby całkowite. W tym przypadku, wyrażenie 3/2 zwraca wartość 1.5, a funkcja parseInt zamienia tę wartość na 1, co jest zgodne z oczekiwanym wynikiem. Warto zauważyć, że parseInt zawsze zwraca najbliższą liczbę całkowitą, zaokrąglając w dół, co czyni ją idealnym narzędziem do realizacji tego celu. W JavaScript istnieje wiele sposobów na konwersję wartości liczbowych, a parseInt jest jednym z najczęściej używanych, gdyż pozwala na przetwarzanie tekstów i liczb w zrozumiały sposób. Przykładowo, jeśli mamy stringa '10.5', użycie parseInt('10.5') da wynik 10. Odniesienie do standardów JavaScript w kontekście konwersji typów można znaleźć w dokumentacji ECMAScript, która definiuje zasady działania funkcji konwertujących. Dobrą praktyką jest również zwrócenie uwagi na radzenie sobie z typami danych w JavaScript, aby uniknąć nieporozumień w przyszłości.

Pytanie 28

body{
background-image: url"rysunek.gif");
background-repeat: repeat-y;
}
W przedstawionej definicji stylu CSS, powtarzanie dotyczy

A. rysunku osadzonego znacznikiem img

B. rysunku umieszczonego w tle strony w poziomie

C. tła każdego znacznika akapitu

D. rysunku znajdującego się w tle strony w pionie

W definicji stylu CSS, zastosowane tło z rysunkiem 'rysunek.gif' jest powtarzane w pionie dzięki właściwości 'background-repeat: repeat-y'. Oznacza to, że obrazek będzie powielany wzdłuż osi Y, co skutkuje tym, że obrazek jest umieszczany jeden nad drugim, tworząc wrażenie ciągłości. Aby lepiej zrozumieć działanie tej właściwości, warto przyjrzeć się innym ustawieniom tła. Na przykład, właściwość 'background-repeat: repeat' powtarza obraz zarówno w poziomie, jak i w pionie, natomiast 'background-repeat: no-repeat' zapobiega jakimkolwiek powtórzeniom. W standardach CSS, takich jak CSS3, definiowanie tła w ten sposób jest zgodne z zasadami, które pozwalają na elastyczne projektowanie stron internetowych. W praktyce, użycie powtarzającego się tła może być przydatne w przypadku prostych wzorów, które mają stworzyć efekt wizualny, nie obciążając jednocześnie zbytnio zasobów, co jest istotne dla wydajności ładowania strony.

Pytanie 29

Elementarna animacja może być zapisana w formacie

A. BMP

B. GIF

C. PSD

D. TIFF

Format GIF (Graphics Interchange Format) jest powszechnie stosowany do tworzenia prostych animacji ze względu na swoją zdolność do kompresji obrazów i obsługi przez większość przeglądarek internetowych. GIF pozwala na zapisanie sekwencji obrazów w jednej pliku, co umożliwia ich wyświetlanie jako animacji. Standard GIF obsługuje maksymalnie 256 kolorów z palety, co czyni go idealnym do prostych grafik, takich jak ikony czy animacje internetowe. Dzięki metodzie kompresji Lempel-Ziv-Welch (LZW) możliwe jest zmniejszenie rozmiaru pliku bez utraty jakości, co jest kluczowe w kontekście transferu danych przez sieć. Przykłady zastosowania formatu GIF obejmują animowane banery reklamowe, emotikony oraz krótkie klipy wideo w formie GIF, które stały się popularne na platformach społecznościowych. Ponadto GIF wspiera przezroczystość i animacje w cyklu, co podnosi jego użyteczność w wielu aplikacjach multimedialnych. Z tego powodu GIF jest formatem, który oferuje zarówno funkcjonalność, jak i kompatybilność, co czyni go najlepszym wyborem dla prostych animacji.

Pytanie 30

Jak przy użyciu języka PHP można zapisać w ciasteczku wartość z zmiennej dane na okres jednego dnia?

A. setcookie("dane",$dane,time()+(3600*24))

B. setcookie("dane","dane",0)

C. setcookie("dane",$dane,0)

D. setcookie("dane",$dane,time())

Odpowiedź setcookie("dane", $dane, time() + (3600 * 24)); jest prawidłowa, ponieważ wykorzystuje funkcję setcookie, która pozwala na ustawienie ciasteczka w PHP. W pierwszym argumencie podajemy nazwę ciasteczka, w drugim jego wartość, a w trzecim czasie wygaśnięcia, który jest określony jako aktualny czas (time()) plus 24 godziny w sekundach (3600 sekund w godzinie razy 24). Takie podejście zapewnia, że ciasteczko będzie dostępne przez jeden dzień, co jest zgodne z dobrymi praktykami w zakresie zarządzania stanem użytkownika. Ciasteczka są powszechnie stosowane w aplikacjach webowych do przechowywania danych użytkownika pomiędzy sesjami, co zwiększa komfort korzystania z serwisów. Przykładem może być zapisanie preferencji użytkownika lub informacji o sesji. Warto pamiętać, że przed użyciem setcookie nie może być wysłany żaden HTML, więc ta funkcja powinna być wywoływana przed jakimkolwiek innym kodem, który generuje wyjście.

Pytanie 31

Który element CMS odpowiada bezpośrednio za WYGLĄD strony?

A. kokpit (WordPress) / panel administracyjny (Joomla!)

B. wtyczka (WordPress) / dodatek (Joomla!)

C. motyw (WordPress) / szablon (Joomla!)

D. widżet (WordPress) / moduł (Joomla!)

Pozostałe elementy pełnią inne role. Kokpit i panel administracyjny to interfejs ZARZĄDZANIA. Widżety i moduły to bloki treści w wyznaczonych miejscach. Wtyczki i dodatki rozszerzają FUNKCJE. Za wygląd odpowiada motyw (WordPress) lub szablon (Joomla!).

Pytanie 32

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

A. <p class="akapit">akapit4</p>

B. <p href="/akapit">akapit3</p>

C. <p>akapit</p>

D. <p id="akapit">akapit2</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 33

W języku CSS zdefiniowano styl. Sformatowana stylem sekcja będzie zawierała obramowanie o szerokości

div { border: solid 2px blue;
     margin: 20px;             }

A. 2 px oraz marginesy wewnątrz tego obramowania.

B. 20 px oraz marginesy na zewnątrz tego obramowania.

C. 20 px oraz marginesy wewnątrz tego obramowania.

D. 2 px oraz marginesy na zewnątrz tego obramowania.

Wygląda na to, że niepoprawnie zrozumiałeś, jak działają obramowania i marginesy w CSS. W tym języku obramowanie (border) i margines (margin) to dwie różne typy przestrzeni, które możemy zdefiniować wokół elementu. Obramowanie jest linią otaczającą element, natomiast margines to przestrzeń między obramowaniem a następnym elementem. Marginesy są zawsze na zewnątrz obramowania, nie wewnątrz. Powiedzenie, że margines jest 'wewnątrz' obramowania, to fundamentalne nieporozumienie dotyczące tego, jak te dwie właściwości działają. Poza tym, szerokość obramowania została zdefiniowana jako 2 piksele, a nie 20. To może być łatwo pomylone, ale pamiętaj, że w CSS jednostki są ważne i mogą znacząco wpływać na wygląd strony. W praktyce, szczegółowe zrozumienie obramowania i marginesów jest kluczowe do precyzyjnego ułożenia elementów na stronie internetowej.

Pytanie 34

Efekt przedstawiony w filmie powinien być zdefiniowany w selektorze

A. td, th { background-color: Pink; }

B. tr:hover { background-color: Pink; }

C. tr { background-color: Pink; }

D. tr:active { background-color: Pink; }

Poprawny selektor to tr:hover { background-color: Pink; }, bo dokładnie opisuje sytuację pokazaną na filmie: efekt pojawia się dopiero po najechaniu kursorem na cały wiersz tabeli. Pseudo-klasa :hover w CSS służy właśnie do definiowania stylów w momencie, gdy użytkownik „najeżdża” myszką na dany element. Jeśli więc chcemy, żeby podświetlał się cały rząd tabeli, logiczne i zgodne z dobrymi praktykami jest przypięcie efektu do znacznika tr, a nie do pojedynczych komórek.

W praktyce taki zapis stosuje się bardzo często w interfejsach webowych: w panelach administracyjnych, listach zamówień, tabelach z uczniami, produktami, logami systemowymi itd. Dzięki temu użytkownik łatwiej śledzi, który wiersz właśnie ogląda. To niby detal, ale z punktu widzenia UX robi sporą różnicę. Z mojego doświadczenia to jeden z tych prostych trików CSS, które od razu poprawiają „odczuwalną” jakość strony.

Ważne jest też to, że :hover jest częścią standardu CSS (opisane m.in. w specyfikacji CSS Selectors Level 3/4) i działa w praktycznie wszystkich współczesnych przeglądarkach. Nie trzeba do tego żadnego JavaScriptu, żadnych skomplikowanych skryptów – czysty CSS. Dobrą praktyką jest również używanie bardziej stonowanych kolorów niż Pink w prawdziwych projektach, np. #f5f5f5 albo lekki odcień niebieskiego, tak żeby kontrast był czytelny i nie męczył wzroku. Warto też pamiętać, że podobny mechanizm możesz zastosować na innych elementach: np. a:hover dla linków, button:hover dla przycisków czy nawet div:hover dla całych kafelków w layoutach. Kluczowe jest to, żeby pseudo-klasa :hover była przypięta dokładnie do tego elementu, który ma reagować na interakcję użytkownika.

Pytanie 35

Aby zrealizować algorytm wyznaczający największą z trzech liczb a, b, c, wystarczy zastosować:

A. dwie tablice

B. jedną pętlę

C. dwa warunki

D. pięć zmiennych

Aby znaleźć największą z trzech liczb, wystarczą dwa warunki (porównania). Najpierw porównujemy a z b i większą z nich przyjmujemy jako tymczasowe maksimum, a potem porównujemy to maksimum z c - stąd dwa warunki. Schematycznie: if (a > b) max = a; else max = b; if (c > max) max = c;. Liczba potrzebnych porównań do znalezienia największej z n elementów to n-1, więc dla trzech liczb są to dokładnie dwa. Pętla czy tablice są tu zbędne, bo elementów jest niewiele i znamy je z góry. Dlatego wystarczą dwa warunki.

Pytanie 36

Które usługi są niezbędne do udostępnienia strony pod adresem https://zawodowe.edu.pl?

A. serwer WWW, SMTP, POP3

B. DNS, serwer WWW, certyfikat SSL

C. DNS, FTP

D. SMTP, FTP

Aby strona działała pod https://zawodowe.edu.pl, potrzebny jest serwer WWW (udostępnia pliki), DNS (tłumaczy nazwę domeny na adres IP) oraz certyfikat SSL (umożliwia szyfrowane połączenie HTTPS). Dlatego niezbędne są DNS, serwer WWW i certyfikat SSL.

Pytanie 37

Które imiona spełniają warunek

SELECT imie FROM mieszkancy WHERE imie LIKE '_r%';

A. Gerald, Jarosław, Marek, Tamara

B. Krzysztof, Krystyna, Romuald

C. Arieta, Krzysztof, Krystyna, Tristan

D. Rafał, Rebeka, Renata, Roksana

Wzorzec '_r%' oznacza: jeden dowolny znak (_), potem litera „r”, potem dowolny ciąg (%) - czyli DRUGĄ literą imienia musi być „r”. Pasują np. Arieta, Krzysztof, Krystyna, Tristan. Dlatego to ten zestaw.

Pytanie 38

Który z formatów plików dźwiękowych zapewnia największą redukcję rozmiaru pliku?

A. PCM

B. CD-Audio

C. MP3

D. WAV

MP3 to format z kompresją stratną - odrzuca dźwięki słabo słyszalne dla ucha, dzięki czemu plik jest wielokrotnie mniejszy od zapisu nieskompresowanego, przy akceptowalnej jakości. To dlatego zdominował przechowywanie i przesyłanie muzyki. Pozostałe wymienione formaty są zasadniczo nieskompresowane, więc zajmują dużo miejsca. Stopień kompresji MP3 reguluje przepływność (bitrate). Dlatego największą redukcję rozmiaru daje MP3.

Pytanie 39

W kaskadowych arkuszach stylów do oznaczenia selektora klasy wykorzystuje się symbol

A. #

B. *

C. . (kropka)

D. : (dwukropek)

Odpowiedzi #, *, oraz : nie są poprawne w kontekście definicji selektorów klas w CSS. Symbol # jest używany do definiowania selektorów identyfikatorów, co oznacza, że w przypadku elementu z identyfikatorem 'element1', selektor w CSS będzie wyglądał tak: #element1. Identyfikatory są unikalne dla danego elementu w dokumencie i mogą być używane tylko raz, co sprawia, że są mniej elastyczne w porównaniu do klas. Użycie identyfikatorów jest często niezalecane, gdyż prowadzi do mniejszej reużywalności stylów. Z kolei symbol * jest selektorem uniwersalnym, który odnosi się do wszystkich elementów na stronie. Chociaż może być użyteczny w pewnych sytuacjach, jego nadużywanie może prowadzić do spadku wydajności, zwłaszcza w większych projektach, ponieważ styluje każdy element w dokumencie. Ostatni symbol : jest używany w pseudo-klasach i pseudo-elementach, takich jak :hover czy ::before, które pozwalają na stylizację elementów w specyficznych stanach lub na dodawanie stylów do części elementu. Pojęcia te są często mylone z klasami, co prowadzi do błędnych wniosków i nieefektywnego zarządzania stylem. Używanie właściwych selektorów jest kluczowe dla utrzymania dobrze zorganizowanego i wydajnego kodu CSS.

Pytanie 40

Którego formatu użyć do zapisu ZDJĘCIA z kompresją STRATNĄ?

A. PNG

B. JPEG

C. PCX

D. GIF

Do zapisu ZDJĘĆ z kompresją stratną najlepszy jest JPEG - mocno zmniejsza plik kosztem niewidocznych dla oka detali, co przy fotografiach jest akceptowalne. Dlatego do zdjęcia ze stratną kompresją wybiera się JPEG.

Rozpocznij nowy egzamin

Powrót do strony głównej