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: 7 maja 2026 17:51
Data zakończenia: 7 maja 2026 18:02

Egzamin zdany!

Wynik: 34/40 punktów (85,0%)

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

<img src="/rysunek.png" alt="pejzaż"> Zapisany został kod HTML, który wstawia obrazek na stronę. Jeśli rysunek.png nie zostanie znaleziony, przeglądarka

A. wyświetli w miejscu grafiki tekst "pejzaż"

B. w miejscu grafiki zasygnalizuje błąd wyświetlania strony

C. nie załaduje strony internetowej

D. w miejscu grafiki pokaże tekst "rysunek.png"

Kiedy przeglądarka internetowa napotyka na kod HTML, który zawiera element graficzny, w takim przypadku, jeśli wskazany plik nie jest dostępny, następuje zachowanie określone przez atrybut 'alt'. W omawianym przykładzie, gdy przeglądarka nie może znaleźć pliku 'rysunek.png', wyświetli tekst alternatywny 'pejzaż'. Atrybut 'alt' jest niezwykle ważny z perspektywy dostępności oraz SEO, ponieważ pozwala na dostarczenie informacji o obrazie osobom, które nie mogą go zobaczyć, takim jak osoby niewidome korzystające z czytników ekranu. Z punktu widzenia standardów W3C, atrybut 'alt' jest zalecany dla każdego elementu <img>, aby poprawić użyteczność strony. W praktyce, dobrze skonstruowane opisy w atrybucie 'alt' mogą również wpłynąć pozytywnie na pozycjonowanie witryny w wyszukiwarkach, co czyni go kluczowym elementem podczas tworzenia treści na stronie internetowej. Z tego powodu umieszczanie informacyjnych i zrozumiałych opisów w tym atrybucie jest niezbędne nie tylko dla poprawy dostępności, ale także dla efektywnej optymalizacji SEO.

Pytanie 2

Rozmiar grafiki JPEG zamieszczonej na stronie www może wpływać na

A. błędy w składni HTML.

B. szybsze sprawdzanie linków.

C. czas ładowania strony.

D. zgodność z systemem Windows.

Wielkość grafiki JPEG umieszczonej na stronie internetowej ma istotny wpływ na długość czasu ładowania strony. Gdy obraz jest zbyt duży, wymaga większej ilości danych do pobrania, co wydłuża czas, który użytkownik musi czekać na wyświetlenie zawartości. Optymalizacja grafik jest więc kluczowym aspektem projektowania stron internetowych. W praktyce, kompresja zdjęć przed ich załadowaniem na stronę, na przykład przy użyciu narzędzi takich jak ImageOptim lub TinyPNG, może znacząco zmniejszyć rozmiar pliku bez widocznej utraty jakości. Zgodnie z wytycznymi Google PageSpeed Insights, obrazy powinny być odpowiednio dostosowane do wymagań dotyczących jakości i rozmiaru. Sprawne zarządzanie grafiką może poprawić współczynnik konwersji oraz zredukować współczynnik odrzuceń, co jest kluczowe dla sukcesu witryny. Prędkość ładowania strony ma również znaczenie dla SEO, ponieważ wyszukiwarki preferują strony, które ładują się szybko, co wpływa na pozycjonowanie. Dlatego odpowiednia optymalizacja obrazów JPEG jest niezbędna dla każdej witryny internetowej, aby zapewnić pozytywne doświadczenia użytkowników oraz dobre wyniki w rankingach wyszukiwarek.

Pytanie 3

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

<input type="password" name="pole">

A. pokazuje znaki, które zostały do niego wprowadzone

B. zawiera domyślny tekst „pole”

C. dopuszcza jedynie wprowadzanie wartości liczbowych

D. ukrywa znaki, które zostały do niego wprowadzone

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 4

Które z poniższych stwierdzeń o antyaliasingu jest poprawne?

A. Wykorzystanie antyaliasingu dotyczy krzywych Beziera w grafice wektorowej

B. Antyaliasing jest jednym z filtrów stosowanych do wyostrzania obrazu

C. Antyaliasing pozwala na eliminację tzw. schodkowania obrazu

D. Antyaliasing jest stosowany w obrazach, aby wprowadzić przezroczystość

Antyaliasing to technika graficzna, która ma na celu eliminację efektu schodkowania, który pojawia się, gdy wyświetlane są linie diagonalne lub krzywe. Schodkowanie, zwane również efektem ząbkowania, powstaje z powodu ograniczonej rozdzielczości ekranu, co powoduje, że krawędzie obiektów wyglądają na poszarpane. Antyaliasing działa poprzez wygładzanie tych krawędzi, dodając do pikseli na obrzeżach obiektów kolory pośrednie, co tworzy iluzję gładkości. W praktyce, zastosowanie antyaliasingu jest szczególnie istotne w grafice komputerowej, animacji oraz w grach, gdzie płynne przejścia i detale mają kluczowe znaczenie dla jakości wizualnej. Standardy i dobre praktyki w branży zalecają stosowanie różnych metod antyaliasingu, takich jak MSAA (Multisample Anti-Aliasing) czy FXAA (Fast Approximate Anti-Aliasing), co pozwala na uzyskanie lepszych efektów w różnych kontekstach renderowania. Warto również pamiętać, że odpowiedni dobór metody antyaliasingu zależy od specyfiki projektu oraz sprzętu, na którym będzie on uruchamiany.

Pytanie 5

Który z poniższych kodów HTML najlepiej ilustruje opisaną tabelę? (Obramowanie tabeli oraz komórek zostało pominięte dla uproszczenia)

A. Odpowiedź A

B. Odpowiedź C

C. Odpowiedź D

D. Odpowiedź B

Odpowiedź B jest prawidłowa, ponieważ używa atrybutu rowspan do złączenia dwóch komórek w kolumnie. W przedstawionej tabeli nagłówek Telefony obejmuje dwie wartości w jednej kolumnie co jest dokładnie odwzorowane w kodzie HTML poprzez zastosowanie rowspan2 w komórce zawierającej Telefony. To podejście pozwala na logiczne i czytelne przedstawienie danych w tabeli co jest zgodne z dobrymi praktykami projektowania stron internetowych. Użycie rowspan w tabelach HTML jest powszechne gdy chcemy aby jedna komórka zajmowała miejsce większej liczby wierszy niż standardowa. Jest to przydatne w sytuacjach gdy dane muszą być grupowane pionowo co poprawia czytelność i strukturę prezentowanych informacji. Ponadto takie podejście pozwala na bardziej efektywne zarządzanie kodem HTML redukując potrzebę dodatkowego formatowania i zmniejsza złożoność dokumentu co jest zgodne z zasadami semantycznego HTML. Warto również pamiętać że użycie rowspan powinno być przemyślane aby zapewnić dostępność i poprawne wyświetlanie w różnych przeglądarkach i urządzeniach co jest kluczowe w nowoczesnym projektowaniu stron internetowych.

Pytanie 6

Określ właściwą sekwencję stylów CSS, biorąc pod uwagę ich priorytet w formatowaniu elementów strony WWW?

A. Styl wewnętrzny, Styl zewnętrzny, Rozciąganie stylu

B. Styl lokalny, Styl wewnętrzny, Styl zewnętrzny

C. Styl zewnętrzny, Wydzielone bloki, Styl lokalny

D. Rozciąganie stylu, Styl zewnętrzny, Styl lokalny

Wskazana odpowiedź, czyli Lokalny, Wewnętrzny, Zewnętrzny, jest zgodna z zasadami kaskadowego stylu arkuszy CSS. Istotą kaskadowości jest to, że style są stosowane według określonej hierarchii. Style lokalne (wbudowane) mają najwyższy priorytet, co oznacza, że jeśli na danym elemencie zastosowano styl lokalny, to zdominuje on wszelkie inne style. Przykład użycia stylu lokalnego to nadanie koloru tła dla konkretnego przycisku poprzez atrybut 'style': <button style='background-color: red;'>Przycisk</button>. W przypadku, gdy nie ma stylu lokalnego, przetwarzany jest styl wewnętrzny, który można zdefiniować w sekcji <style> w nagłówku dokumentu HTML. Na przykład: <style>p { color: blue; }</style> sprawi, że wszystkie akapity będą miały niebieski kolor. Dopiero na końcu brane są pod uwagę style zewnętrzne, które są definiowane w osobnych plikach CSS, na przykład: <link rel='stylesheet' href='style.css'>. Dlatego znajomość tej hierarchii jest kluczowa dla skutecznego tworzenia stylów, co przekłada się na lepsze zarządzanie wyglądem strony oraz unikanie konfliktów stylów. Warto również pamiętać o zasadzie „specyficzności”, która dodatkowo komplikuje temat, ponieważ style mogą mieć różny priorytet w zależności od ich specyfikacji.

Pytanie 7

W jakim standardzie języka hipertekstowego wprowadzono do składni znaczniki sekcji <footer>, <header>, <nav>?

A. HTML4

B. XHTML 2.0

C. HTML5

D. XHTML1.0

HTML5 wprowadził nowe znaczniki semantyczne, takie jak <header>, <footer> oraz <nav>, które mają na celu poprawę struktury i czytelności kodu HTML. Te znaczniki pozwalają na lepsze określenie ról poszczególnych części dokumentu, co jest istotne zarówno dla programistów, jak i dla wyszukiwarek internetowych oraz oprogramowania asystującego. Przykładowo, znacznik <header> zazwyczaj zawiera nagłówki i metadane, podczas gdy <footer> jest przeznaczony na informacje końcowe, takie jak prawa autorskie czy linki do polityki prywatności. Z kolei <nav> wskazuje sekcję nawigacyjną, co ułatwia użytkownikom poruszanie się po stronie. Użycie tych znaczników zgodnie z ich zamierzonymi funkcjami poprawia semantykę dokumentu HTML5, co jest zgodne z najlepszymi praktykami w zakresie SEO i dostępności. Warto również zauważyć, że HTML5 wprowadza inne elementy, takie jak <article> czy <section>, które dodatkowo wspierają tworzenie dobrze zorganizowanej i zrozumiałej struktury dokumentu. W związku z tym, stosowanie nowych znaczników w HTML5 jest niezwykle korzystne zarówno dla twórców, jak i dla użytkowników stron internetowych.

Pytanie 8

System baz danych gromadzi multimedia, co wiąże się z przechowywaniem znacznych ilości danych binarnych. Jakiego typu danych należy użyć w tym przypadku?

A. DOUBLE

B. BLOB

C. LONGTEXT

D. ENUM

Typ BLOB (Binary Large Object) służy do przechowywania dużych ilości danych binarnych, takich jak obrazy, dźwięki, filmy czy inne multimedia. BLOBy są niezwykle przydatne w aplikacjach, które wymagają zarządzania danymi o dużych rozmiarach, ponieważ pozwalają na efektywne przechowywanie i manipulowanie tymi danymi w bazie danych. Przykładem zastosowania BLOBów może być system zarządzania treścią (CMS), w którym użytkownicy mogą przesyłać zdjęcia i filmy. BLOBy umożliwiają przechowywanie tych plików w bazie, co ułatwia ich późniejsze pobieranie i wyświetlanie. W praktyce, stosując BLOBy, należy pamiętać o odpowiednich indeksach oraz optymalizacji zapytań, aby zminimalizować czas dostępu do danych. Warto również rozważyć zastosowanie systemów zarządzania bazami danych, które są dostosowane do pracy z danymi multimedialnymi, takich jak PostgreSQL czy MySQL, które obsługują typy BLOB i inne odpowiednie struktury danych. Standardy SQL definiują BLOB jako typ danych, co sprawia, że jego użycie jest zgodne z najlepszymi praktykami programowania baz danych.

Pytanie 9

Deklaracja z właściwością background-attachment: scroll sprawia, że

A. tło strony zostanie zamocowane, a tekst będzie się poruszał

B. tło strony będzie przesuwane razem z zawartością tekstową

C. grafika tła będzie widoczna w prawym górnym rogu strony

D. grafika tła będzie się powtarzać (kafelki)

Właściwość CSS 'background-attachment: scroll' oznacza, że tło elementu będzie przewijane w równym tempie z treścią na stronie. Kiedy użytkownik przegląda stronę i przewija ją w dół lub w górę, tło przesuwa się razem z zawartością, co tworzy wrażenie głębokości i dynamiki. Przykładem zastosowania tej właściwości może być strona internetowa z długim tekstem, gdzie tło, takie jak kolor lub obraz, jest częścią estetyki projektu, ale nie powinno być statyczne. Warto zauważyć, że można to osiągnąć, ustawiając 'background-attachment' na 'scroll', co jest najczęściej stosowanym ustawieniem. W standardach CSS3 'background-attachment' ma cztery możliwe wartości: 'scroll', 'fixed', 'local', oraz 'inherit'. Stosowanie 'scroll' jest najbardziej intuicyjne i wspiera responsywność, ponieważ zmienia się w zależności od interakcji użytkownika z zawartością. To podejście jest zgodne z praktykami projektowania stron internetowych, które kładą nacisk na użytkownika i interaktywność.

Pytanie 10

Który z przedstawionych obrazów został przetworzony przy użyciu podanego stylu CSS?

A. Rys. A

B. Rys. D

C. Rys. C

D. Rys. B

Wybór Rys. A jako poprawnej odpowiedzi jest uzasadniony zastosowaniem właściwości CSS, które są użyte w stylu. Styl CSS określa padding na 5 pikseli, co oznacza, że wokół obrazu powinna być przestrzeń wynosząca dokładnie 5 pikseli. Właściwość border ustawia obramowanie na 1 piksel, w kolorze szarym i o stylu solid, co oznacza ciągłą linię otaczającą obraz. Z kolei border-radius o wartości 10 pikseli zaokrągla rogi obramowania, co nadaje całości bardziej zaokrąglony kształt. Wszystkie te cechy są widoczne na obrazie Rys. A. W praktyce stosowanie właściwości takich jak border-radius jest często używane w projektach webowych, aby uzyskać bardziej estetyczne i nowoczesne efekty wizualne. Zaokrąglone krawędzie są estetycznie przyjemniejsze dla użytkownika i mogą poprawić czytelność oraz odbiór wizualny strony. Znajomość tych właściwości CSS jest niezbędna dla każdego front-end developera, który dąży do tworzenia nowoczesnych i funkcjonalnych interfejsów użytkownika. Praktyczne zastosowanie tego stylu może być widoczne w projektach stron internetowych, aplikacjach sieciowych oraz w tworzeniu elementów UI, które zachowują spójność wizualną z resztą projektu.

Pytanie 11

Dla przedstawionego fragmentu dokumentu HTML:

<div class="menu"></div>

zdefiniowano formatowanie CSS selektora klasy "menu" tak, aby kolor tła bloku był zielony. Która definicja stylu CSS odpowiada temu formatowaniu?

A. #menu { background-color: rgb(0,255,0); }

B. div.menu { background-color: green; }

C. menu { background-color: rgb(0,255,0); }

D. div:menu { color: green; }

Wybrany selektor `div.menu { background-color: green; }` dokładnie pasuje do podanego fragmentu HTML: `<div class="menu"></div>`. W CSS zapis `div.menu` oznacza element typu `<div>`, który ma atrybut `class` ustawiony na `menu`. Kropka w selektorze zawsze oznacza klasę, więc `menu` po kropce to nazwa klasy, a nie nazwa znacznika. Dzięki temu styl zostanie zastosowany tylko do tych elementów `div`, które mają klasę `menu`, a nie do wszystkich divów na stronie. Właśnie tak zgodnie ze standardami CSS definiuje się wygląd elementów z konkretną klasą. Własność `background-color: green;` ustawia kolor tła danego bloku na zielony. Można tu używać różnych zapisów kolorów: nazw (green), wartości heksadecymalnych (`#00ff00`), funkcji `rgb()` czy `hsl()`. W tym pytaniu istotne jest jednak nie tyle to, jak dokładnie zapisano kolor, tylko czy selektor trafia w odpowiedni element HTML. W praktyce bardzo często używa się klas do stylowania wielu podobnych elementów, np. `.menu`, `.btn-primary`, `.card`. Z mojego doświadczenia lepiej unikać nadmiernego używania identyfikatorów (`id`) do stylowania, a zamiast tego bazować właśnie na klasach, bo klasy można wielokrotnie powtarzać w dokumencie i są bardziej elastyczne. Dodatkowo selektor z typem elementu (`div.menu`) jest trochę bardziej precyzyjny niż samo `.menu`, co bywa przydatne, gdy ta sama klasa pojawia się na różnych znacznikach, a chcemy kontrolować konkretne przypadki. W nowoczesnym front-endzie takie podejście jest zgodne z dobrymi praktykami: czytelne, przewidywalne i zgodne ze specyfikacją CSS.

Pytanie 12

Jakiego rodzaju oprogramowanie narzędziowe jest wymagane, aby użytkownik mógł przeprowadzać operacje na zebranych danych?

A. Klucz obcy

B. System Zarządzania Bazą Danych (SZBD)

C. Obiektowy System Zarządzania Bazą Danych

D. Otwarty mechanizm komunikacji bazy danych

System Zarządzania Bazą Danych (SZBD) to kluczowy element w architekturze aplikacji, który umożliwia użytkownikom przechowywanie, modyfikowanie i zarządzanie danymi. Dzięki SZBD użytkownicy mogą wykonywać operacje takie jak dodawanie, usuwanie, modyfikacja danych oraz wykonywanie zapytań, co jest niezbędne w każdym systemie informacyjnym. Przykłady powszechnie stosowanych SZBD to MySQL, PostgreSQL oraz Oracle Database. W praktyce, SZBD obsługuje relacje między danymi, co pozwala na zapewnienie integralności i spójności danych. Dodatkowo, SZBD implementują standardy takie jak ACID (Atomicity, Consistency, Isolation, Durability), co jest gwarancją niezawodności transakcji. Aby efektywnie korzystać z SZBD, warto zapoznać się z językiem SQL, który jest standardem do komunikacji z bazą danych. W kontekście dobrych praktyk, umiejętność projektowania prawidłowej struktury bazy danych oraz znajomość zasad normalizacji danych są kluczowe dla optymalizacji wydajności aplikacji oraz minimalizacji ryzyka błędów danych.

Pytanie 13

Który z poniższych typów plików NIE JEST używany do publikacji grafiki lub animacji na stronach www?

A. SWF

B. SVG

C. PNG

D. AIFF

Wybór formatu plików, które są używane do publikacji grafiki lub animacji na stronach internetowych, jest istotnym elementem projektowania interfejsów. SVG, jako format wektorowy, oferuje wyjątkową elastyczność i skalowalność, co czyni go idealnym dla responsywnych projektów. Jego możliwość dostosowywania w kodzie HTML i CSS sprawia, że jest on często wybierany przez projektantów, którzy dążą do zachowania wysokiej jakości wizualnej bez utraty wydajności. SWF, z kolei, był popularnym formatem dla animacji Flash, który pozwalał na interaktywne elementy w stronach internetowych, jednak obecnie jest mniej używany z powodu rosnącej niekompatybilności z nowoczesnymi przeglądarkami. PNG, jako format rastrowy, zapewnia wsparcie dla przezroczystości oraz wysoką jakość obrazu, co czyni go uniwersalnym narzędziem w publikacji grafiki w internecie. Tak więc, wybór AIFF jako formatu do publikacji byłby błędny, ponieważ nie jest on przeznaczony do przechowywania grafiki ani animacji, a zastosowanie go w tym kontekście może prowadzić do nieporozumień i niewłaściwej prezentacji treści. Ważne jest, aby zrozumieć, że różne formaty plików mają swoje specyficzne przeznaczenie i zalety, co powinno być brane pod uwagę przy tworzeniu zawartości internetowej.

Pytanie 14

Który kod HTML zapewni identyczny efekt formatowania jak na przedstawionym obrazku?

W tym paragrafie zobaczysz sposoby formatowania tekstu w HTML

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

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

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

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

Odpowiedź numer 2 jest poprawna, ponieważ używa odpowiednich znaczników HTML do formatowania tekstu. Znacznik <i> stosowany jest do oznaczania tekstu kursywą, a znacznik <b> do pogrubienia. W tym przypadku tekst 'paragrafie' i 'sposoby formatowania' są otoczone znacznikiem <i>, co zgodnie z HTML oznacza kursywę. Natomiast słowo 'zobaczysz' jest otoczone zarówno <b> jak i <i>, co skutkuje pogrubieniem i kursywą jednocześnie. Taka struktura jest zgodna z konwencją hierarchii znaczników, która mówi, że znaczniki mogą być zagnieżdżane, aby uzyskać różne efekty formatowania. HTML pozwala na takie zagnieżdżanie, co jest częścią elastyczności tego języka w prezentowaniu treści. Dobrą praktyką jest także zapewnienie dostępności, gdzie znaczniki semantyczne mają szczególne znaczenie. Wykorzystanie <b> i <i> zamiast odpowiednio <strong> i <em> jest bardziej stylistyczne niż semantyczne, co ma swoje uzasadnienie w kontekście projektowym, ale w nowoczesnych praktykach powinno się również rozważyć znaczenie semantyczne i używać <strong> i <em> dla lepszego zrozumienia przez czytniki ekranowe.

Pytanie 15

Gdzie należy umieścić znacznik metajęzyka HTML?

A. w sekcji nagłówkowej witryny internetowej

B. pomiędzy znacznikami <body> ... </body>

C. w dolnej części witryny internetowej

D. pomiędzy znacznikami paragrafu

Znacznik metajęzyka HTML, czyli tag <meta>, jest kluczowym elementem w sekcji nagłówkowej (head) dokumentu HTML. To tutaj umieszczamy informacje dotyczące dokumentu, takie jak jego tytuł, opis, słowa kluczowe oraz dane dotyczące kodowania i viewportu. Na przykład, aby ustawić kodowanie znaków na UTF-8, używamy znacznika <meta charset="UTF-8">. Jest to zgodne z wytycznymi W3C i najlepszymi praktykami SEO, ponieważ odpowiednie metadane pomagają wyszukiwarkom w zrozumieniu treści witryny. Inny przykład to <meta name="viewport" content="width=device-width, initial-scale=1.0">, który zapewnia, że strona jest responsywna na urządzeniach mobilnych. Umieszczając te znaczniki w nagłówku, można poprawić zarówno użyteczność, jak i widoczność witryny w internecie.

Pytanie 16

W HTML atrybut znacznika video, który umożliwia ciągłe odtwarzanie, to

A. poster

B. controls

C. muted

D. loop

Atrybut loop w znaczniku video jest kluczowy dla zapewnienia, że wideo będzie odtwarzane w nieskończoność, co jest szczególnie przydatne w przypadku prezentacji multimedialnych czy tła w aplikacjach webowych. Umożliwia to automatyczne powtarzanie treści bez interwencji użytkownika, co może poprawić doświadczenia użytkownika oraz skuteczność przekazu. Zgodnie z dokumentacją HTML5, aby użyć atrybutu loop, wystarczy dodać go do znacznika video, co pozwala na osiągnięcie zamierzonego efektu. Przykładem może być: <video src='video.mp4' loop autoplay></video>, gdzie wideo będzie się odtwarzać automatycznie i w kółko. Użycie tego atrybutu jest szczególnie istotne w kontekście interaktywnych aplikacji i gier, gdzie ciągłość odtwarzania może być kluczowa dla zaangażowania odbiorcy. Atrybut loop jest częścią specyfikacji W3C dotyczącej HTML5, która promuje dostępność i elastyczność w tworzeniu nowoczesnych aplikacji internetowych.

Pytanie 17

Jakiego elementu musisz użyć, aby rozpocząć nową linię tekstu bez tworzenia akapitu na stronie internetowej?

A. </br>

B. <p>

C. </b>

D. <br>

Znak <br> jest standardowym elementem HTML używanym do wprowadzenia przerwy w tekście, która nie tworzy nowego akapitu. W przeciwieństwie do znacznika <p>, który definiuje akapit i dodaje dodatkową przestrzeń przed i po nim, <br> po prostu przenosi tekst do nowej linii, co jest szczególnie przydatne w takich sytuacjach jak adresy, wiersze piosenek czy fragmenty tekstu, gdzie formatowanie linii jest kluczowe. Przykład użycia: <p>Adam Mickiewicz,<br>Pan Tadeusz.</p> W powyższym przykładzie tekst "Pan Tadeusz" zostanie wyświetlony w nowej linii, ale nie jako nowy akapit. Warto pamiętać, że stosowanie zbyt wielu <br> w kodzie HTML może prowadzić do chaotycznego formatowania, dlatego zaleca się ich użycie z umiarem, zgodnie z zasadami dobrego projektowania stron i przystosowywania ich do różnych urządzeń, co jest zgodne z zasadami responsywnego designu. Zastosowanie <br> jest zgodne z HTML5 i uznawane za najlepszą praktykę przy tworzeniu prostych układów tekstowych.

Pytanie 18

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 alternatywny, zewnętrzny

B. Styl zewnętrzny

C. Styl wewnętrzny

D. Styl wpisany, lokalny

Styl wpisany lokalny jest metodą bezpośredniego przypisywania reguł CSS do konkretnych elementów HTML za pomocą atrybutu style W przedstawionym przykładzie kodu stylizacja jest dodawana bezpośrednio do elementu p co sprawia że ten element będzie miał tekst w kolorze czerwonym Styl wpisany jest szczególnie przydatny gdy chcemy wprowadzić szybkie zmiany dla pojedynczych elementów bez ingerowania w zewnętrzne lub wewnętrzne arkusze stylów Takie podejście jest używane w sytuacjach gdy stylizacja dotyczy jedynie pojedynczego elementu lub gdy chcemy nadpisać reguły z innych arkuszy stylów Jednak w kontekście skalowalności i utrzymania kodu nie jest to rekomendowane w większych projektach W takich przypadkach lepiej stosować style zewnętrzne które pozwalają na bardziej zorganizowane i zarządzalne podejście do stylizacji witryny Warto pamiętać że styl wpisany ma wyższy priorytet niż style zewnętrzne co oznacza że w przypadku konfliktu reguł to właśnie styl wpisany zostanie zastosowany Podstawową zaletą stylu wpisanego jest jego prostota i bezpośredniość co czyni go doskonałym narzędziem do szybkiego prototypowania

Pytanie 19

Graficzny interfejs użytkownika, który umożliwia wprowadzanie danych do bazy, to

A. kwerenda

B. formularz

C. raport

D. encja

Raport, kwerenda i encja to pojęcia, które na pierwszy rzut oka mogą wydawać się związane z wprowadzaniem danych, jednak nie pełnią one roli graficznego interfejsu użytkownika umożliwiającego taką interakcję. Raport to narzędzie do prezentacji danych, najczęściej w formie zestawień i wykresów, które czerpie informacje z bazy danych, ale nie pozwala na ich edycję czy wprowadzanie nowych danych. To narzędzie, które skupia się na analizie i wizualizacji informacji, a nie na ich zbieraniu. Kwerenda to zapytanie do bazy danych, które umożliwia wydobycie określonych informacji, ale nie jest formą interakcji z użytkownikiem w sensie wprowadzania danych. Użytkownik, korzystając z kwerendy, nie wprowadza danych bezpośrednio, lecz prosi system o zwrócenie konkretnej porcji informacji zgodnie z ustalonymi kryteriami. Encja natomiast odnosi się do obiektów w modelu danych, które przechowują informacje w bazie danych, ale nie jest to obiekt interfejsu użytkownika. Encje są bardziej abstrakcyjnym pojęciem, związanym z przechowywaniem danych w bazach danych, a nie z ich wprowadzaniem. Powodzenie w korzystaniu z baz danych wymaga zrozumienia tych różnic oraz znajomości odpowiednich narzędzi, które rzeczywiście umożliwiają wprowadzanie danych, a formularze są kluczowym elementem takich interakcji.

Pytanie 20

Formatowanie CSS dla akapitu określa styl szarej ramki z następującymi właściwościami:

p {
    padding: 15px;
    border: 2px dotted gray;
}

A. Linia kropkowa; grubość 2 px; odległości pomiędzy tekstem a ramką 15 px

B. Linia kreskowa; grubość 2 px; odległości poza ramką 15 px

C. Linia ciągła; grubość 2 px; odległości poza ramką 15 px

D. Linia ciągła; grubość 2 px; odległości pomiędzy tekstem a ramką 15 px

Odpowiedź ta jest prawidłowa, ponieważ w CSS stylizowanie elementu akapitu za pomocą podanego kodu definiuje ramkę o linii kropkowej, grubości 2 pikseli oraz paddingu wynoszącym 15 pikseli. Padding to przestrzeń wewnętrzna pomiędzy zawartością elementu a jego ramką, co oznacza, że tekst w akapicie będzie oddalony od krawędzi ramki o 15 pikseli. Styl ramki 'dotted' jest często używany w projektach webowych, aby stworzyć efekt wizualny, który jest mniej formalny, a zarazem estetyczny. Można go wykorzystać w kontekście wyróżniania ważnych informacji lub sekcji strony, co zwiększa czytelność i przyciąga uwagę użytkowników. Przykładem zastosowania może być sekcja z informacjami o promocjach, gdzie forma wizualna ma na celu przyciągnięcie wzroku. Używając standardów CSS, dobrego podejścia do UX (User Experience) oraz wytycznych W3C, projektanci stron internetowych mogą efektywnie komunikować intencje i priorytety poprzez stylowanie wizualne.

Pytanie 21

Aby wykonać przycisk na stronę internetową zgodnie z wzorem, potrzebne jest skorzystanie z opcji w programie do grafiki rastrowej

A. selekcja eliptyczna

B. zaokrąglenie lub wybór opcji prostokąt z zaokrąglonymi rogami

C. propagacja wartości

D. zniekształcenia i deformacja

Opcja zaokrąglenie lub wybranie opcji prostokąt z zaokrąglonymi rogami jest prawidłowa, ponieważ pozwala na stworzenie przycisku o nowoczesnym i estetycznym wyglądzie. W programach graficznych takich jak Adobe Photoshop lub GIMP opcja ta umożliwia użytkownikowi szybkie utworzenie prostokąta, którego rogi są zaokrąglone według określonego promienia. Jest to szczególnie przydatne w projektowaniu elementów interfejsu użytkownika, gdzie zaokrąglone rogi nadają wrażenie łagodności i nowoczesności. Stosowanie zaokrąglonych rogów jest zgodne z aktualnymi trendami UX/UI, które kładą nacisk na przyjazność i intuicyjność interfejsu. Praktyczne zastosowanie to nie tylko przyciski, ale również inne elementy graficzne takie jak pola tekstowe, karty czy okna dialogowe. Zaokrąglone rogi są również bardziej przyjazne dla oka, co jest istotne w kontekście użyteczności. Technicznie osiąga się to przez modyfikację kształtu obiektu wektorowego lub przez zastosowanie odpowiednich filtrów w grafice rastrowej. Warto też pamiętać o dostosowaniu promienia zaokrągleń do ogólnej estetyki projektu, co jest dobrą praktyką w projektowaniu graficznym.

Pytanie 22

Definicja stylu w CSS, którą zaprezentowano, dotyczy odsyłacza, który

a:visited {color: orange;}

A. posiada niepoprawny adres URL

B. ma wskaźnik myszy umieszczony nad sobą

C. jeszcze nigdy nie został odwiedzony

D. był wcześniej odwiedzany

Pseudoklasa :visited w CSS jest używana do stylizowania odsyłaczy, które zostały już odwiedzone przez użytkownika. Oznacza to, że przeglądarka zapisuje informacje o odwiedzonych stronach w historii przeglądania i na tej podstawie zmienia styl odsyłacza. W przykładzie a:visited {color: orange;} zmienia kolor tekstu odwiedzonych linków na pomarańczowy. Jest to powszechna praktyka stosowana w projektowaniu stron internetowych, która pomaga użytkownikom wizualnie odróżniać odwiedzone odsyłacze od nieodwiedzonych, co poprawia ich orientację na stronie. Dobre praktyki projektowania zakładają tworzenie intuicyjnych interfejsów użytkownika i użycie mechanizmu :visited do poprawy użyteczności. Ważne jest, aby unikać stosowania bardziej zaawansowanych stylów w :visited, takich jak zmiana rozmiaru czcionki czy dodawanie obrazów tła, ze względu na ograniczenia bezpieczeństwa przeglądarek, które chronią prywatność użytkowników. Korzystanie z :visited w sposób świadomy i zgodny ze standardami W3C zwiększa efektywność nawigacji i jest istotnym elementem przyjaznego projektowania stron WWW

Pytanie 23

Czy przedstawione w języku CSS ustawienia czcionki będą dotyczyć dla ```* { font-family: Tahoma; color: Teal; }```?

A. całego dokumentu HTML, niezależnie od późniejszych reguł CSS

B. znaczników z klasą przypisaną równą *

C. znaczników o id równym *

D. całego dokumentu HTML, jako domyślne formatowanie dla wszystkich elementów strony

Właściwość CSS zastosowana w podanym kodzie dotyczy wszystkich elementów HTML na stronie, ponieważ użycie selektora * oznacza, że formatowanie będzie miało zastosowanie do każdego elementu, niezależnie od jego typu. Oznacza to, że czcionka Tahoma oraz kolor Teal będą domyślnie stosowane do tekstu we wszystkich znacznikach HTML. Tego rodzaju podejście jest zgodne z dobrymi praktykami w projektowaniu stron, ponieważ pozwala na jednolite formatowanie bez konieczności stylizowania każdego elementu z osobna. Przykładem zastosowania może być stworzenie spójnego wyglądu strony, gdzie wszystkie nagłówki, akapity i inne teksty mają ten sam styl, co poprawia czytelność i estetykę. Dodatkowo, takie zastosowanie stylów jest efektywne, gdyż zmiana stylu w kontekście całej strony odbywa się poprzez edytowanie jednego miejsca w kodzie CSS, co oszczędza czas i zmniejsza ryzyko błędów.

Pytanie 24

Którą funkcję z menu Kolory programu GIMP użyto, w celu uzyskania efektu przedstawionego w filmie?

A. Barwienie.

B. Inwersja.

C. Krzywe.

D. Progowanie.

Wiele osób myli w GIMP-ie różne narzędzia z menu Kolory, bo na pierwszy rzut oka kilka z nich „mocno zmienia” obraz. Jednak efekt pokazany na filmie, gdzie obraz staje się dwuwartościowy (czarno-biały, bez półtonów), jest typowym działaniem funkcji Progowanie. Kluczowe jest tu zrozumienie, czym różnią się od siebie dostępne operacje. Krzywe służą do zaawansowanej korekcji tonalnej i kontrastu. Można nimi mocno przyciemnić lub rozjaśnić wybrane zakresy jasności, robić tzw. efekt kontrastu „S”, korygować prześwietlenia itd. Ale nawet przy bardzo agresywnych ustawieniach krzywych obraz nadal zawiera półtony – pojawiają się stopniowe przejścia między odcieniami, a nie ostre odcięcie na zasadzie czarne/białe. To świetne narzędzie do retuszu zdjęć, ale nie do uzyskania efektu progowania. Inwersja (Kolory → Inwersja) po prostu odwraca wartości kolorów lub jasności: jasne staje się ciemne, czerwony zmienia się na cyjan, zielony na magentę itd. To jak negatyw fotograficzny. Struktura szczegółów pozostaje identyczna, zmienia się tylko ich „biegun”. Nie pojawia się żadne odcięcie progowe, więc obraz wciąż ma pełne spektrum odcieni. W praktyce inwersja przydaje się np. przy przygotowaniu masek lub pracy z materiałami skanowanymi, ale nie generuje typowego, „plakatowego” efektu czerni i bieli jak progowanie. Barwienie z kolei (Kolory → Barwienie) służy do nadania całemu obrazowi jednolitego odcienia, zwykle po wcześniejszym sprowadzeniu go do skali szarości. Można w ten sposób uzyskać np. sepię, niebieski ton nocny albo dowolny kolorystyczny „filtr”. Jasność i kontrast lokalny pozostają bardzo podobne, zmienia się dominująca barwa. To zupełnie inna kategoria operacji niż progowanie, które pracuje na poziomie progów jasności, a nie na poziomie koloru. Typowym błędem jest patrzenie tylko na to, że „obraz bardzo się zmienił” i przypisywanie tego narzędziom takim jak krzywe czy inwersja. W pracy z grafiką warto zawsze zadać sobie pytanie: czy efekt polega na zmianie rozkładu jasności, na odwróceniu kolorów, czy na twardym podziale na dwa poziomy? Jeśli widzisz brak półtonów i ostre granice, praktycznie zawsze chodzi o progowanie, które zostało wskazane jako poprawna funkcja.

Pytanie 25

Którą technologię poleca się przy tworzeniu serwisów WWW, tak aby zmiany w treści można było wykonywać bez potrzeby ich kodowania, przez użytkowników bez kompetencji programistycznych?

A. SSL

B. SEO

C. FTP

D. CMS

Prawidłowa odpowiedź to CMS, czyli Content Management System – system zarządzania treścią. W praktyce chodzi o takie oprogramowanie (np. WordPress, Joomla, Drupal), które pozwala edytować stronę WWW przez przeglądarkę, bez dotykania kodu HTML, CSS czy PHP. Użytkownik loguje się do panelu administracyjnego, dostaje prosty edytor przypominający Worda i może dodawać newsy, podstrony, zdjęcia, pliki do pobrania. To dokładnie rozwiązuje problem opisany w pytaniu: zmiany w treści wykonują osoby nietechniczne, a programista przygotowuje tylko szablon i funkcjonalność. Moim zdaniem to jeden z kluczowych standardów w branży – praktycznie każdy profesjonalny serwis firmowy, portal informacyjny, blog czy sklep internetowy stoi na jakimś CMS-ie lub systemie pokrewnym (np. headless CMS). Dzięki temu rozdziela się warstwę prezentacji (frontend) od warstwy treści i logiki biznesowej. Dobra praktyka jest taka, żeby nie „twardo” wpisywać treści w pliki HTML/PHP, tylko trzymać je w bazie danych i udostępniać przez panel CMS. Upraszcza to utrzymanie, pozwala na wersjonowanie treści, pracę kilku redaktorów naraz, zarządzanie uprawnieniami, a nawet planowanie publikacji w czasie. Z mojego doświadczenia, dobrze wdrożony CMS to ogromna oszczędność czasu dla programistów – nie muszą oni za każdym razem poprawiać tekstu czy wymieniać obrazka, tylko skupiają się na rozwoju funkcji. Redaktorzy mogą bez stresu pracować na stagingu, sprawdzać podgląd, korzystać z szablonów bloków, a potem jednym kliknięciem opublikować treść. To też sprzyja zgodności z dobrymi praktykami SEO, bo wiele CMS-ów ma wbudowane moduły do ustawiania meta tagów, przyjaznych adresów URL czy mapy strony.

Pytanie 26

Zgodnie z wytycznymi WCAG 2.x na poziomie AA minimalny kontrast tekstu (o standardowym rozmiarze) do tła, spełniający wymogi dostępności serwisu WWW dla osób z ograniczoną percepcją wzrokową wynosi

A. 4,5 : 1

B. 2,5 : 1

C. 1,5 : 1

D. 2,0 : 1

W tym pytaniu łatwo wpaść w pułapkę myślenia, że „jakikolwiek” kontrast wystarczy, by tekst był czytelny. Warto jednak oprzeć się na twardych definicjach z WCAG 2.x, a nie na subiektywnym wrażeniu, że coś „da się przeczytać”. Propozycje niższych wartości kontrastu, takich jak 1,5 : 1, 2,0 : 1 czy 2,5 : 1, odzwierciedlają typowy błąd: ocenianie czytelności tylko własnymi oczami, najczęściej osoby młodej, bez problemów ze wzrokiem, siedzącej przy dobrym monitorze i w dobrych warunkach oświetleniowych. Współczynniki zbyt niskie, rzędu 1,5 : 1 czy 2,0 : 1, oznaczają bardzo małą różnicę jasności między tekstem a tłem. Na ekranie będzie to wyglądało jak delikatne „rozmycie” tekstu w tle. Osoby z obniżonym kontrastem widzenia, z wadami refrakcji, a nawet użytkownicy korzystający ze słabszych ekranów lub w mocnym słońcu, zwyczajnie nie odczytają takiego tekstu bez dużego wysiłku. To nie jest tylko kwestia komfortu – przy dłuższej pracy może to powodować zmęczenie oczu, bóle głowy i zniechęcenie do korzystania z serwisu. Warto też zauważyć, że wartości 2,5 : 1 czasem „intuicyjnie” wydają się już całkiem niezłe, szczególnie gdy projektant przyzwyczajony jest do bardzo delikatnych, pastelowych palet. Ale WCAG 2.0 i 2.1 w kryterium 1.4.3 wyraźnie mówią: dla zwykłego tekstu poziom AA wymaga minimum 4,5 : 1. Niższe liczby mogą być stosowane tylko w określonych sytuacjach, np. dla dużego tekstu (wtedy próg 3 : 1) albo na poziomie AAA, gdzie są jeszcze ostrzejsze wymagania dla niektórych elementów. Wszelkie niższe wartości dla małego tekstu są po prostu niezgodne ze standardem. Kolejny typowy błąd myślowy to mieszanie wymagań estetycznych z wymogami dostępności. Projektanci często boją się „zbyt mocnych” kontrastów, bo wydaje im się, że interfejs będzie wyglądał zbyt ciężko, zbyt ostro. Przez to sięgają po bardzo jasne szarości albo blade kolory tekstu. Tymczasem branżowe dobre praktyki projektowania dostępnych interfejsów mówią jasno: kontrast minimum 4,5 : 1 dla podstawowego tekstu to absolutne minimum, a w wielu serwisach (np. administracja publiczna, systemy B2B używane godzinami) warto iść jeszcze wyżej. Trzymanie się zbyt niskich wartości nie tylko łamie standard WCAG, ale też realnie wyklucza część użytkowników z komfortowego korzystania z serwisu.

Pytanie 27

Bitmapa stanowi typ obrazu

A. rastrowym

B. analogowym

C. wektorowym

D. interakcyjnym

Bitmapa, znana również jako obraz rastrowy, jest jednym z najpopularniejszych formatów graficznych używanych w różnych aplikacjach komputerowych, takich jak edytory zdjęć czy programy graficzne. Obrazy rastrowe składają się z siatki pikseli, gdzie każdy piksel ma przypisaną określoną wartość koloru. Przykłady popularnych formatów bitmapowych to JPEG, PNG, oraz BMP. W kontekście praktycznym, bitmapy są idealne do przedstawiania zdjęć i szczegółowych ilustracji, ponieważ mogą zachować bogactwo detali i kolorów. Główne zastosowanie bitmap obejmuje grafikę internetową, projektowanie stron, a także obróbkę zdjęć. W branży graficznej stosuje się standardy, takie jak RGB i CMYK, które definiują, jakie kolory mogą być użyte w obrazach rastrowych. Aby uzyskać najlepszą jakość wizualną, ważne jest, aby dostosować rozdzielczość obrazów do przeznaczenia, co jest kluczowe w profesjonalnych projektach graficznych. Właściwe zrozumienie bitmap jest fundamentem dla każdego, kto zajmuje się grafiką komputerową czy projektowaniem wizualnym.

Pytanie 28

Kod CSS można włączyć do dokumentu HTML, używając znacznika

A. <meta>

B. <body>

C. <head>

D. <style>

Odpowiedź <style> jest prawidłowa, ponieważ ten znacznik HTML jest dedykowany do osadzania kodu CSS wewnątrz dokumentu HTML. Znacznik <style> powinien być umieszczony w sekcji <head> dokumentu, co umożliwia przeglądarkom interpretację stylów przed renderowaniem treści strony. Dzięki temu można definiować różne reguły CSS, które modyfikują wygląd elementów HTML, co jest kluczowe w tworzeniu estetycznych i funkcjonalnych stron internetowych. Przykładowo, można użyć <style> do określenia koloru tła, rozmiaru czcionki czy marginesów. Ważne jest, aby stosować zasady dotyczące kaskadowości, ponieważ style zdefiniowane w <style> mają priorytet nad stylem zewnętrznym, jeśli są tak samo specyficzne. Dodatkowo, korzystanie z <style> jest zgodne z zasadami dobrych praktyk, takich jak unikanie nadmiarowego ładowania zewnętrznych plików CSS w przypadku prostych projekty, co przyspiesza czas ładowania strony.

Pytanie 29

Jakie zapytanie umożliwi Administratorowi odebranie uprawnień do przeglądania oraz edytowania danych w bazie gazeta, dla użytkownika redaktor?

A. REVOKE SELECT, UPDATE ON gazeta.* FROM 'redaktor'@'localhost';

B. REVOKE SELECT, ALTER ON gazeta.* FROM 'redaktor'@'localhost';

C. GRANT SELECT, UPDATE ON gazeta.* TO 'redaktor'@'localhost';

D. GRANT SELECT, ALTER ON gazeta.* TO 'redaktor'@'localhost';

Odpowiedź jest poprawna, ponieważ zapytanie REVOKE SELECT, UPDATE ON gazeta.* FROM 'redaktor'@'localhost'; skutecznie odbiera użytkownikowi redaktor prawa do przeglądania (SELECT) oraz aktualizacji (UPDATE) danych w tabeli gazeta. W kontekście zarządzania uprawnieniami w systemach baz danych, kluczowym elementem jest kontrola dostępu. Standard SQL definiuje polecenie REVOKE jako sposób na cofnięcie przyznanych wcześniej uprawnień. W praktyce, administratorzy baz danych muszą ścisle zarządzać uprawnieniami użytkowników, aby zapewnić bezpieczeństwo danych i zgodność z politykami ochrony informacji. Przykładem zastosowania mogłoby być ograniczenie dostępu do poufnych danych w przypadku, gdy użytkownik przestaje pełnić określoną rolę w organizacji. Rezygnacja z uprawnień powinna być zawsze udokumentowana i przeprowadzona zgodnie z procedurami, by zapobiec nieautoryzowanemu dostępowi do danych. Zarządzanie uprawnieniami to kluczowy aspekt administrowania bazami danych, który wpływa na bezpieczeństwo i integralność informacji.

Pytanie 30

Który z przedstawionych kodów HTML sformatuje tekst według wzoru?
(uwaga: słowo "stacji" jest zapisane większą czcionką niż reszta słów w tej linii)

Lokomotywa

Stoi na stacji lokomotywa ...

A.
<h1>Lokomotywa</h1>
<p>Stoi na <big>stacji lokomotywa ...</p>

B.
<h1>Lokomotywa</h1>
<p>Stoi na <big>stacji</big> lokomotywa ...</p>

C.
<h1>Lokomotywa</p>
<p>Stoi na <big>stacji</big> lokomotywa ...</p>

D.
<p><small>Lokomotywa</small></p>
<p>Stoi na <big>stacji<big> lokomotywa ...</p>

A. A.

B. C.

C. B.

D. D.

Brawo! Wybrałeś prawidłową odpowiedź, która jest kodem HTML formatującym słowo 'stacji' większą czcionką niż reszta tekstu. Wykorzystuje ona znacznik <big>, który jest wyjątkowo przydatny w sytuacjach, gdy chcemy podkreślić pewną część tekstu i sprawić, że będzie ona wyglądać na większą niż reszta. Jest to praktyka często stosowana na stronach internetowych, by przyciągnąć uwagę użytkownika do konkretnych informacji. Pamiętaj jednak, że znacznik <big> jest przestarzały i nie jest zalecany do stosowania w nowoczesnym kodowaniu HTML. Zamiast tego, w dzisiejszych czasach lepiej jest używać CSS do zmiany rozmiaru czcionki. Niemniej jednak, znajomość różnych znaczników HTML, w tym <big>, jest nadal ważna, zwłaszcza do zrozumienia i utrzymania starszych stron internetowych.

Pytanie 31

Definicja stylu zaprezentowana w CSS odnosi się do odsyłacza, który

a:visited {color: orange;}

A. jeszcze nie był odwiedzony

B. został wcześniej odwiedzony

C. posiada błędny adres URL

D. wskaźnik myszy znajduje się nad nim

Odpowiedź "został wcześniej odwiedzony" jest prawidłowa, ponieważ definicja stylu CSS `a:visited {color: orange;}` dotyczy odsyłaczy, które zostały już odwiedzone przez użytkownika. W CSS pseudo-klasa `:visited` jest stosowana do stylizacji odsyłaczy, które prowadzą do stron, które użytkownik już otworzył. Dzięki tej możliwości, twórcy stron internetowych mogą wprowadzać różne kolory dla odwiedzonych i nieodwiedzonych linków, co pozwala na szybszą orientację użytkowników w treści strony. Na przykład, jeżeli na stronie znajduje się wiele linków, użytkownik może łatwiej zrozumieć, które z nich już kliknął, a które są nowe. Dobrą praktyką jest stosowanie kontrastowych kolorów dla odsyłaczy, aby zwiększyć ich dostępność i użyteczność. Warto również zauważyć, że przeglądarki mogą mieć różne ograniczenia dotyczące stylizacji odwiedzonych linków, co jest podyktowane względami prywatności użytkowników. Z tego powodu zaleca się, aby nie opierać funkcjonalności strony jedynie na wyglądzie odwiedzonych linków.

Pytanie 32

W dołączonym fragmencie kodu CSS kolor został przedstawiony w formie

A. szesnastkowej

B. HSL

C. dziesiętnej

D. CMYK

Kolor zapisany w postaci szesnastkowej w CSS to popularny sposób definiowania barw na stronach internetowych. Szesnastkowy format koloru wykorzystuje sześć znaków, które są kombinacją cyfr oraz liter od A do F, poprzedzone znakiem hash (#). Każda para znaków reprezentuje wartość jednego z trzech podstawowych kolorów RGB: czerwonego, zielonego i niebieskiego. Na przykład kolor #008000 składa się z czerwonego o wartości 00, zielonego o wartości 80 i niebieskiego o wartości 00. Szesnastkowy zapis jest preferowany ze względu na swoją kompaktowość i zgodność ze standardami sieciowymi. W praktyce, projektanci często używają narzędzi do konwersji kolorów, aby uzyskać pożądane odcienie, co ułatwia zastosowanie odpowiednich wartości szesnastkowych w kodzie. Format ten pozwala także na tworzenie skróconych wersji, jak #FFF dla bieli. Jego użycie jest powszechne i dobrze zrozumiałe w branży, co czyni go uniwersalnym wyborem w projektach webowych.

Pytanie 33

W przedstawionym kodzie HTML ukazany styl CSS to styl:

<p style="color: red;">To jest przykładowy akapit.</p>

A. nagłówkowy.

B. lokalny.

C. dynamiczny.

D. zewnętrzny.

Odpowiedź "lokalnym" jest prawidłowa, ponieważ styl CSS zastosowany w podanym kodzie HTML definiuje właściwości stylu bezpośrednio w elemencie HTML, co określamy jako styl lokalny (inline style). W tym przypadku, styl "color: red;" został zastosowany bezpośrednio w tagu <p>, co wpływa wyłącznie na ten konkretny akapit. Praktyczne zastosowanie lokalnych stylów polega na tym, że można je szybko dodać do pojedynczych elementów, ale należy pamiętać, że nadmiar lokalnych stylów może prowadzić do problemów z utrzymywaniem i zarządzaniem kodem. Zamiast tego zaleca się stosowanie zewnętrznych arkuszy stylów CSS, co pozwala na centralne zarządzanie stylami dla całej strony. Warto zauważyć, że lokalne style mają wyższy priorytet niż style zewnętrzne, co może prowadzić do konfliktów, jeśli nie zostaną odpowiednio użyte. Aby zapewnić zgodność z najlepszymi praktykami, zaleca się ograniczanie stosowania lokalnych stylów tam, gdzie to możliwe, na rzecz bardziej zorganizowanego podejścia z użyciem klas i identyfikatorów w zewnętrznych arkuszach stylów.

Pytanie 34

Poniżej zaprezentowano fragment kodu w języku HTML:
<ol>
<li>punkt 1</li>
<li>punkt 2</li>
<ul>
<li>podpunkt1</li>
<li>podpunkt2</li>
<li>podpunkt3</li>
</ul>
<li>punkt3</li>
</ol>

A. punkt 1 punkt 2 podpunkt1 podpunkt2 podpunkt3 punkt3

B. 1. punkt 1 2. punkt 2 podpunkt1 podpunkt2 podpunkt1 3. punkt3

C. 1. punkt 1 2. punkt 2 podpunkt1 podpunkt2 podpunkt3 punkt3

D. 1. punkt 1 2. punkt 2 3. punkt3 podpunkt1 podpunkt2 podpunkt1

Fajnie, że wybrałeś poprawną odpowiedź! To pokazuje, że rozumiesz, jak działa struktura list w HTML. W Twoim kodzie mamy uporządkowaną listę z trzema głównymi punktami, co jest świetne. Te pierwsze dwa są dobrze zdefiniowane jako elementy <li>, tak jak powinny być. A w punkcie 2 masz zagnieżdżoną listę nieuporządkowaną, co dodaje trochę ekstra informacji – super sprawa! Pamiętaj, że to zagnieżdżenie ma znaczenie, bo pomaga to w organizacji treści. Każdy podpunkt też jest elementem <li>, więc wszystko się zgadza. Tego typu struktury są mega przydatne, zwłaszcza w spisach treści czy menu nawigacyjnych. Pamiętaj, że dobrze zbudowany HTML jest ważny dla czytelności, a także dla osób, które korzystają z różnych technologii do przeglądania stron. Trzymaj tak dalej!

Pytanie 35

Na stronie WWW umieszczono obrazek, a następnie akapit. Aby obrazek był wyświetlany przez przeglądarkę w tej samej linii co akapit, po lewej stronie tekstu akapitu, w stylu CSS dla obrazka należy ustawić formatowanie

A. align: left;

B. alt: left;

C. style: left;

D. float: left;

Odpowiedź "float: left;" jest poprawna, ponieważ właściwość CSS "float" służy do określenia, w jaki sposób elementy są rozmieszczane na stronie. Ustawienie "float: left;" dla rysunku sprawia, że zostaje on umieszczony po lewej stronie swojego kontenera, a pozostałe elementy, takie jak akapit, mogą układać się obok niego. Jest to powszechnie stosowana technika w układach stron internetowych, pozwalająca na osiągnięcie płynnych i responsywnych rozkładów treści. Na przykład, w przypadku gdy mamy obrazek i akapit, stosując float, obrazek zostanie wypchnięty w lewo, a tekst akapitu automatycznie dostosuje się, zajmując dostępną przestrzeń obok rysunku. Warto również dodać, że po zastosowaniu float, należy zadbać o usunięcie efektu 'zatrzymywania się' rysunków, co można osiągnąć poprzez stosowanie właściwości "clear" w odpowiednich miejscach, aby nie zakłócać układu sąsiednich elementów. Tego typu techniki są fundamentem projektowania stron, zgodnie z zasadami dobrych praktyk UX/UI oraz standardami W3C. W przypadku bardziej złożonych układów warto również rozważyć zastosowanie Flexbox lub Grid Layout, które oferują większą elastyczność i kontrolę nad położeniem elementów w nowoczesnych projektach.

Pytanie 36

Zgodnie z aktualnie obowiązującym w Polsce prawem, osoby z wykształceniem inżynieryjno-technicznym są zobowiązane do odbywania szkoleń BHP w regularnych odstępach czasu, które nie powinny być dłuższe niż co

A. 1 rok

B. 8 lat

C. 6 lat

D. 5 lat

Wszystkie pozostałe odpowiedzi są błędne, ponieważ nie odpowiadają wymogom prawnym dotyczącym okresowych szkoleń BHP dla inżynieryjno-technicznych pracowników w Polsce. Odpowiedzi sugerujące, że szkolenia powinny odbywać się co 5, 6 lub 8 lat, opierają się na nieprawidłowym rozumieniu przepisów. Ustawa Kodeks pracy jasno określa, że okresowe szkolenia BHP mają na celu nie tylko dostarczenie pracownikom wiedzy na temat bezpieczeństwa, ale także dostosowanie ich umiejętności do zmieniających się warunków w miejscu pracy. Zbyt długi okres pomiędzy szkoleniami mógłby prowadzić do utraty aktualności wiedzy pracowników, co zwiększa ryzyko wypadków oraz zagrożeń zdrowotnych. W praktyce, regularne, coroczne szkolenia są niezbędne do nadążania za nowymi przepisami, technologiami oraz aktualizacjami w procedurach bezpieczeństwa. Ponadto, firmy, które zaniedbują wymóg przeprowadzania takich szkoleń, mogą być narażone na konsekwencje prawne oraz finansowe, w tym na kary administracyjne. Odpowiednie przestrzeganie przepisów dotyczących szkoleń BHP jest kluczowe dla zapewnienia bezpieczeństwa pracowników oraz ochrony firmy przed potencjalnymi stratami.

Pytanie 37

Domyślny użytkownik, który posiada pełne uprawnienia do zarządzania bazą danych w systemie MySQL, to

A. sysadmin

B. mysqld

C. admin

D. root

W systemie MySQL domyślnym kontem z pełnymi uprawnieniami administracyjnymi jest użytkownik „root”, a nie różne nazwy kojarzone ogólnie z administracją systemu. Mylenie tych nazw wynika często z doświadczeń z innymi środowiskami, jak panele hostingowe czy systemy operacyjne, gdzie pojawiają się takie loginy jak „admin” czy „sysadmin”. W MySQL nazwa użytkownika jest jednak zdefiniowana bardzo konkretnie i historycznie utrwalił się właśnie „root” jako konto głównego administratora serwera bazodanowego. Login „admin” bywa używany w panelach typu phpMyAdmin, w panelach hostingowych albo w aplikacjach webowych, ale to są konta utworzone przez dostawcę hostingu lub programistę, a nie domyślne konto MySQL. Moim zdaniem to jedno z częstszych nieporozumień: ktoś loguje się do phpMyAdmin jako „admin” i zakłada, że taki użytkownik istnieje w samym MySQL jako konto systemowe, a tymczasem jest to po prostu użytkownik zdefiniowany w bazie o określonych uprawnieniach, nadanych ręcznie. Podobnie nazwa „sysadmin” kojarzy się z rolą administratora systemu albo domeny w różnych narzędziach, ale w MySQL taka nazwa nie jest żadnym standardem ani domyślną konfiguracją. Jeśli taki użytkownik istnieje, to tylko dlatego, że ktoś go sam stworzył. Natomiast „mysqld” to w ogóle nie jest użytkownik bazy w sensie konta SQL. Tak nazywa się proces serwera MySQL uruchamiany w systemie operacyjnym, często jako osobny użytkownik systemowy (np. user „mysql” w Linuksie). Ten użytkownik systemowy służy do uruchamiania usługi, dostępu do plików danych na dysku, ale nie loguje się do bazy jako klient SQL. Typowym błędem myślowym jest mieszanie użytkowników systemu operacyjnego, użytkowników paneli administracyjnych i użytkowników samego MySQL. Każda z tych warstw ma własny model uprawnień i własne nazwy kont. W pracy z bazami danych warto zawsze rozróżniać: kto jest użytkownikiem systemu (np. Linux), kto jest użytkownikiem serwera MySQL (root, app_user itd.), a kto użytkownikiem aplikacji webowej. Dopiero wtedy zarządzanie uprawnieniami i bezpieczeństwem staje się sensowne i przewidywalne.

Pytanie 38

Kolorem, który ma odcień niebieski, jest kolor

A. #EE0000

B. #EE00EE

C. #0000EE

D. #00EE00

Poprawna odpowiedź to kolor #0000EE, który reprezentuje odcień niebieskiego w systemie RGB. Kolory w tym systemie definiowane są poprzez trzy składowe: czerwoną, zieloną i niebieską (RGB), gdzie wartości są podawane w formacie szesnastkowym. W przypadku #0000EE, pierwsze dwie pary zer oznaczają brak składowych czerwonej i zielonej, natomiast ostatnia para 'EE' wskazuje na wysoką intensywność składowej niebieskiej. Takie podejście jest powszechnie stosowane w programowaniu i projektowaniu stron internetowych, gdzie precyzyjnie określone kolory mają kluczowe znaczenie dla estetyki i użyteczności interfejsu. Przykładem zastosowania koloru niebieskiego może być jego użycie w projektach związanych z tematyką technologiczną lub finansową, gdzie niebieski symbolizuje zaufanie i profesjonalizm. Warto również zwrócić uwagę, że w kontekście dostępności barw, stosowanie odpowiednich kontrastów z tłem jest niezbędne, aby zapewnić czytelność tekstu i elementów graficznych. Odpowiednie wykorzystanie kodów koloru może znacząco wpłynąć na postrzeganie marki oraz interakcję użytkowników z treściami wizualnymi na stronach internetowych.

Pytanie 39

Znaczniki HTML <strong> oraz <em> używane do wyróżniania istotności tekstu, pod względem formatowania odpowiadają znacznikom

A. ```<u>``` oraz ```<sup>```

B. ```<i>``` oraz ```<mark>```

C. ```<b>``` oraz ```<i>```

D. ```<b>``` oraz ```<u>```

Znaczniki HTML <strong> oraz <em> są używane do podkreślenia ważności tekstu, przy czym <strong> wskazuje na silniejsze akcentowanie, a <em> na akcentowanie mniej intensywne, pełniące rolę stylizacji typograficznej. W kontekście formatowania, ich odpowiednikami są znaczniki <b> oraz <i>. Oznacznik <b> wprowadza tekst w pogrubieniu, co sygnalizuje jego ważność, ale nie ma semantycznego znaczenia, podczas gdy <i> oznacza kursywę, która jest często używana do podkreślenia tytułów, obcojęzycznych wyrazów czy terminów technicznych. W praktyce, użycie <strong> i <em> jest zgodne z zasadami semantycznego HTML, które mają na celu zrozumienie treści przez maszyny oraz poprawę dostępności, co ma fundamentalne znaczenie w projektowaniu stron internetowych. Warto także pamiętać, że stosowanie semantycznych znaczników wpływa na SEO, umożliwiając lepsze indeksowanie treści przez wyszukiwarki, a także poprawia doświadczenia osób korzystających z technologii asystujących. Przykładowo, użycie <strong> w nagłówkach lub kluczowych informacjach na stronie pozwala na lepsze zrozumienie struktury treści przez użytkowników oraz boty wyszukiwarek.

Pytanie 40

Który z poniższych kodów HTML spowoduje taki sam efekt formatowania jak na zaprezentowanym rysunku?

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

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

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

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

Twoja odpowiedź jest w porządku, bo tag <i> w HTML rzeczywiście służy do pisania tekstu kursywą, a <b> do pogrubiania. Jak użyjesz tych znaczników razem, to zyskujesz fajny efekt, który widać na obrazku. Kawałek tekstu <i>paragrafie <b>zobaczysz</b> sposoby formatowania </i> sprawi, że cały fragment będzie w kursywie, ale tylko wyraz w <b> będzie pogrubiony. To jest spoko, bo pokazuje jak poprawnie używać znaczniki w HTML. Warto jednak pamiętać, żeby nie przesadzać z tymi znacznikami i używać ich tylko wtedy, gdy naprawdę chcesz wyróżnić coś w tekście. Dzisiaj większość stylizacji robi się przez CSS, co pozwala lepiej oddzielić strukturę od wyglądu dokumentu. Ale jak chcesz coś szybko wyróżnić w HTML, to użycie <i> i <b> jak najbardziej ma sens. To wszystko jest mega ważne, bo zrozumienie tych podstaw będzie przydatne, gdy będziesz budować strony.

Rozpocznij nowy egzamin

Powrót do strony głównej