Wyniki egzaminu

Nowy egzamin

Informacje o egzaminie:

Zawód: Technik programista
Kwalifikacja: INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych
Data rozpoczęcia: 11 maja 2026 10:47
Data zakończenia: 11 maja 2026 11:09

Egzamin niezdany

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

Wymagane minimum: 20 punktów (50%)

Nowe

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

Przebieg egzaminu

Udostępnij swój wynik

Facebook

X.com

Szczegółowe wyniki:

Pytanie 1

Zastosowanie bloku deklaracji background-attachment: scroll sprawia, że

A. tło strony pozostanie statyczne, a tekst będzie się przesuwał

B. grafika tła znajdzie się w prawym górnym rogu strony

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

D. tło strony będzie się przesuwać razem z tekstem

Inne odpowiedzi na to pytanie są niepoprawne z kilku powodów. Stwierdzenie, że grafika tła będzie wyświetlona w prawym górnym rogu strony, jest mylące, ponieważ właściwość 'background-attachment' nie wpływa na położenie tła, a jedynie na jego zachowanie podczas przewijania. Pozycjonowanie tła jest kontrolowane za pomocą właściwości 'background-position', która definiuje, gdzie tło ma być umieszczone, a nie jak się zachowuje w kontekście przewijania. Warto również zauważyć, że tło strony może być umieszczone w dowolnym miejscu, a nie tylko w jednym rogu. Inną nieprawidłową koncepcją jest stwierdzenie, że tło strony będzie stałe, a tekst będzie się przewijał. Taka konfiguracja odpowiada właściwości 'background-attachment: fixed', która rzeczywiście utrzymuje tło w stałej pozycji podczas przewijania zawartości. To prowadzi do błędnych wniosków, ponieważ mieszanie tych właściwości może skutkować niezamierzonymi efektami wizualnymi. Ostatnia odpowiedź, sugerująca, że grafika tła będzie powtarzana, odnosi się do 'background-repeat', która kontroluje, czy tło powinno być powtarzane, co jest niezwiązane z przewijaniem. Użytkownicy często mylą te właściwości, co prowadzi do niepoprawnych interpretacji efektów wizualnych. W praktyce ważne jest, aby zrozumieć, że każda z tych właściwości ma swoje unikalne zastosowanie i wpływ na wygląd oraz funkcjonalność strony internetowej.

Pytanie 2

W trakcie edycji grafiki rastrowej w oprogramowaniu obsługującym kanały, dodanie kanału alfa wskazuje na

A. dodanie warstwy z przezroczystością

B. wyostrzenie krawędzi obrazu

C. ustalenie prawidłowego balansu bieli

D. zwiększenie głębi ostrości obrazu

Dodanie kanału alfa w obróbce grafiki rastrowej oznacza wprowadzenie warstwy odpowiedzialnej za przezroczystość obrazu. Kanał alfa rozszerza możliwości tradycyjnych obrazów, które składają się tylko z trzech podstawowych kanałów kolorystycznych: czerwonego, zielonego i niebieskiego (RGB). Dzięki kanałowi alfa, każdy piksel w obrazie może mieć przypisaną wartość przezroczystości, co pozwala na tworzenie efektów takich jak cienie, rozmycia, a także na precyzyjne maskowanie elementów w projekcie. Przykładem zastosowania kanału alfa może być tworzenie grafik do użycia w reklamach czy wideo, gdzie elementy muszą być płynnie nałożone na różnorodne tła. W profesjonalnym oprogramowaniu graficznym, takim jak Adobe Photoshop czy GIMP, dodanie kanału alfa jest standardową praktyką w procesie tworzenia i edycji obrazów. Ponadto, tworząc animacje czy interaktywne projekty multimedialne, kanał alfa pozwala na bardziej elastyczne zarządzanie przezroczystością poszczególnych warstw, co jest kluczowe dla finalnego efektu wizualnego.

Pytanie 3

Element <meta charset="utf-8"> definiuje metadane odnoszące się do strony internetowej dotyczące

A. opisu witryny

B. kodowania znaków

C. słów kluczowych

D. języka używanego na stronie

W kontekście elementu <meta charset="utf-8">, inne odpowiedzi dotyczące opisu strony, języka strony oraz słów kluczowych są mylące i nieprecyzyjne. Opis strony, zazwyczaj reprezentowany przez element <meta name="description">, jest używany do dostarczenia zwięzłego streszczenia zawartości danej strony, co ma wpływ na SEO i sposób wyświetlania w wynikach wyszukiwania. Nie jest to jednak związane z kodowaniem, a raczej z informacjami o treści i celu witryny. Kolejnym aspektem jest język strony, który można określić za pomocą elementu <html lang="pl">, co informuje przeglądarki oraz wyszukiwarki o głównym języku treści. To również nie jest związane z kodowaniem znaków, a raczej z semantyką strony i dostępnością. Ostatni element, słowa kluczowe, tradycyjnie ujęte w <meta name="keywords">, miały na celu wskazanie istotnych fraz związanych z treścią, jednak obecnie ich znaczenie spadło w kontekście SEO. W żadnym z tych przypadków nie ma mowy o kodowaniu, które jest fundamentalnym procesem konwertującym znaki na reprezentacje binarne. Dlatego mylenie tych pojęć prowadzi do niepoprawnego zrozumienia ich roli w strukturze dokumentu HTML.

Pytanie 4

Który z podanych formatów pozwala na zapis zarówno dźwięku, jak i obrazu?

A. WAV

B. PNG

C. MP4

D. MP3

Format MP4, znany również jako MPEG-4 Part 14, jest jednym z najpopularniejszych formatów multimedialnych, który umożliwia jednoczesny zapis zarówno dźwięku, jak i obrazu. Dzięki zastosowaniu zaawansowanej kompresji, MP4 pozwala na przechowywanie wysokiej jakości materiałów w stosunkowo małych plikach, co czyni go idealnym do przesyłania i strumieniowania w Internecie. MP4 obsługuje wiele kodeków, takich jak H.264 dla wideo oraz AAC dla dźwięku, co pozwala na szeroką kompatybilność z różnymi urządzeniami, od smartfonów po odtwarzacze multimedialne. Format ten jest zgodny z wieloma standardami, co czyni go wszechstronnym wyborem dla twórców treści. Przykłady jego zastosowania obejmują filmy wideo na platformach streamingowych, klipy muzyczne i wideoklipy. Dzięki swoim zaletom, MP4 stał się de facto standardem w przemyśle multimedialnym, co w znacznym stopniu przyczyniło się do jego popularności oraz wszechstronności.

Pytanie 5

Efekt przedstawiony na obrazie, wykonany za pomocą edytora grafiki rastrowej, to

A. szum RGB.

B. pikselizacja.

C. grawerowanie.

D. rozmycie Gaussa.

Twoja odpowiedź jest prawidłowa! Wybrany efekt to pikselizacja. Pikselizacja polega na zmniejszeniu rozdzielczości obrazu do poziomu, gdy każdy piksel staje się widoczny dla oka. Efekt ten charakteryzuje się wyraźnymi, dużymi blokami pikseli tworzącymi obraz. Jest to efekt często stosowany w grafice komputerowej, szczególnie w celu nadania grafice stylu retro. Pikselizacja była też kluczowym elementem estetyki gier wideo z lat 80. i 90., kiedy to technologiczne ograniczenia sprzętowe wymuszały korzystanie z niskiej rozdzielczości obrazu. W dzisiejszych czasach efekt pikselizacji jest często stosowany celowo, dla uzyskania określonego efektu artystycznego lub dla celów nostalgicznych. Warto jednak pamiętać, że nadmierne pikselizowanie obrazu może prowadzić do utraty szczegółów, dlatego zawsze warto dobrze przemyśleć zastosowanie tego efektu.

Pytanie 6

Na przedstawionej grafice znajduje się struktura sekcji dla witryny internetowej. Przyjmując, że blok5 nie ma przypisanej szerokości, a bloki są określone w dokumencie HTML w kolejności ich numeracji, jak powinno wyglądać zdefiniowanie opływania?

A. bloki 1, 2, 3, 4 float: right; blok 5 clear: right;

B. bloki 1, 2, 4 float: left; blok 3 float: right; blok 5 clear: both;

C. blok 1 float: left; bloki 2, 4 float: center; blok 3 float: right; blok 5 clear: both;

D. bloki 1, 2, 4 float: left; blok 3, 5 float: right;

Odpowiedź 3 jest poprawna, ponieważ odpowiada układowi bloków na stronie i ich pozycjonowaniu. Użycie właściwości CSS float: left; dla bloków 1, 2 i 4 pozwala im ułożyć się w linii po lewej stronie. Blok 3 z float: right; zostanie umieszczony po prawej stronie, co jest zgodne z przedstawionym układem. Blok 5 natomiast, znajdujący się na dole i rozciągający się na całą szerokość, wymaga użycia clear: both;, aby nie opływały go inne bloki i mógł zająć całą dostępną przestrzeń poziomą. Takie zastosowanie float i clear jest zgodne z najlepszymi praktykami w projektowaniu układów stron internetowych. Stylowanie za pomocą float jest powszechnie używane w CSS do tworzenia dynamicznych układów, a właściwość clear zapewnia, że element nie będzie opływany przez poprzedzające elementy pływające, co jest szczególnie istotne dla elementów podsumowujących lub końcowych na stronie.

Pytanie 7

Który z poniższych znaczników jest używany do definiowania list w HTML?

A. <tr>

B. <th>

C. <td>

D. <ul>

<ul> jest znacznikami HTML, które definiuje nieuporządkowaną listę. Użycie tego znacznika pozwala na przedstawienie elementów listy w formie graficznej, gdzie każdy element jest oznaczony punktem. Jest to podstawowy element w HTML, który jest zgodny z wytycznymi W3C i szeroko stosowany w tworzeniu responsywnych i estetycznych interfejsów użytkownika. Przykładowe zastosowanie <ul> może obejmować listy składników, funkcji, czy też elementów menu na stronie internetowej. Stosując <ul>, można także użyć znacznika <li>, aby określić poszczególne elementy listy, co zwiększa czytelność i strukturalizację treści. Znajomość i umiejętność stosowania tych znaczników jest kluczowa dla każdego web developera, aby tworzyć dostępne i zrozumiałe dla użytkowników interfejsy, a także wspierać praktyki SEO poprzez odpowiednią organizację treści.

Pytanie 8

O czym informuje przeglądarkę internetową zapis <!DOCTYPE html>?

A. Dokument został zapisany w języku HTML 5.

B. W dokumencie wszystkie tagi są zapisane wielkimi literami.

C. Dokument jest zapisany w wersji HTML 4.

D. W dokumencie każda etykieta musi być zamknięta, nawet te samozamykające.

Wszystkie zaproponowane odpowiedzi poza tą właściwą opierają się na nieaktualnych lub błędnych założeniach dotyczących HTML. Kiedy mówimy o dokumentach HTML, istotnym elementem jest zrozumienie znaczenia deklaracji <!DOCTYPE html>. Odpowiedź sugerująca, że dokument powinien być zapisany w wielkich literach, jest nieuzasadniona, ponieważ HTML jest językiem, który nie rozróżnia wielkości liter, a stosowanie wielkich liter nie wpływa na interpretację kodu przez przeglądarki. Z kolei twierdzenie, że dokument został zapisany w HTML 4, jest przestarzałe, ponieważ HTML5 jest następcom HTML 4.1 i jego wprowadzenie oznacza znaczne zmiany w architekturze i możliwościach języka. Dodatkowo, koncepcja, że każdy znacznik musi być zamykany, również nie jest precyzyjna; HTML5 wprowadza elementy samozamykające się, takie jak <img> czy <br>, które nie wymagają zamykania, co różni się od wcześniejszych standardów. Zrozumienie tych podstawowych koncepcji jest kluczowe dla tworzenia nowoczesnych stron internetowych, a nieprawidłowe interpretacje mogą prowadzić do błędów w kodowaniu i niezgodności w wyświetlaniu treści.

Pytanie 9

Na ilustracji przedstawiono projekt struktury bloków strony internetowej. Przy założeniu, że bloki są realizowane przy użyciu znaczników sekcji, ich stylizacja w CSS, poza określonymi szerokościami dla bloków: 1, 2, 3, 4 (blok 5 nie ma przypisanej szerokości), powinna obejmować właściwość

A. clear: both dla bloku 5 oraz float: left dla pozostałych bloków

B. float: left dla wszystkich bloków

C. clear: both dla wszystkich bloków

D. clear: both dla bloku 5 oraz float: left tylko dla bloków 1 i 2

Czwarta odpowiedź jest na miejscu, bo dzięki float: left dla bloków 1, 2, 3 i 4, te elementy będą się ładnie ustawiać w linii, zgodnie z ich szerokością. Potem, z clear: both dla bloku 5, unikniesz sytuacji, gdy nachodzi on na inne pływające bloki i pojawi się poniżej nich. Wiesz, float często stosuje się do robienia układów, gdzie elementy muszą być obok siebie. Ale float ma to do siebie, że nie wpływa na rodziców, co czasami sprawia, że wszystko może się zdezorganizować, jeśli nie użyjesz clear. To też jest ważne, bo clear mówi, które elementy nie powinny nachodzić na te pływające - dzięki temu wszystko jest uporządkowane. Dobrze jest to wykorzystać, na przykład, gdy chcesz zrobić kolumny na stronie. Generalnie, stosowanie float jest jak najbardziej w porządku, ale musi iść w parze z clear, żeby strona była czytelna i dobrze zorganizowana, zgodnie ze standardami HTML i CSS.

Pytanie 10

Jaką właściwość CSS należy zastosować, aby uzyskać linie przerywaną w obramowaniu?

A. dotted

B. solid

C. dashed

D. double

Odpowiedź dashed jest poprawna ponieważ w CSS właściwość ta służy do definiowania stylu obramowania w postaci linii kreskowanej Jest to często używane do wizualnego oddzielenia zawartości na stronie internetowej bez zbytniego skupiania uwagi Użycie dashed sprawia że linia jest bardziej subtelna w porównaniu do solid co czyni ją dobrym wyborem w przypadku chęci zachowania minimalistycznego wyglądu Zgodnie ze standardami CSS właściwość border-style może przyjmować kilka wartości w tym solid dotted double i dashed Każda z tych wartości ma swoje unikalne zastosowania na przykład solid tworzy ciągłą linię natomiast dotted tworzy linię z kropkami Linia dashed składa się z krótkich kresek co różni ją od linii double która jest podwójną linią W praktyce dashed jest często stosowane w projektach gdzie ważne jest wskazanie na określone sekcje lub elementy bez przytłaczania użytkownika Zgodnie z dobrymi praktykami można dostosować szerokość i kolor obramowania co pozwala na lepszą integrację z ogólnym stylem strony CSS daje dużą elastyczność w projektowaniu co pozwala na tworzenie różnorodnych i responsywnych interfejsów użytkownika

Pytanie 11

W zaprezentowanym fragmencie algorytmu wykorzystano

A. jeden blok decyzyjny

B. dwie pętle

C. jedną pętlę

D. trzy bloki operacyjne (procesy)

Na tym diagramie widać jedną pętlę, co jest dość ważne w programowaniu. Pętla pozwala na powtarzanie pewnych działań, aż spełni się jakiś warunek. Tu mamy blok decyzyjny, który mówi, czy proces ma trwać, czy się zakończyć. To dość powszechnie używane podejście, zwłaszcza w algorytmach, jak na przykład sortowanie czy obróbka danych. Warto zwrócić uwagę, by dobrze zrozumieć, jak działają pętle, szczególnie te oparte na warunkach, jak while czy for. Pozwoli to uniknąć problemów z niekończącymi się pętlami, które mogą sprawić, że program przestanie działać. Z mojego doświadczenia, ogarnać te struktury to kluczowy skill dla każdego, kto chce działać w IT.

Pytanie 12

W języku HTML, aby dodać na stronę obrazek przechowywany w formacie JPG, należy użyć znacznika

A. <jpg>

B. <img>

C. <table>

D. <src>

Aby wstawić na stronę obraz zapisany w formacie JPG, w języku HTML stosuje się znacznik <img>. Jest to jeden z podstawowych znaczników używanych do osadzania grafiki na stronach internetowych. W skład tego znacznika wchodzą atrybuty, które pozwalają na określenie źródła obrazu, jego alternatywnego opisu oraz dodatkowych parametrów, takich jak rozmiary czy wyrównanie. Atrybut 'src' jest kluczowy, ponieważ wskazuje ścieżkę do pliku graficznego, na przykład <img src='obraz.jpg' alt='Opis obrazu'>. Atrybut 'alt' jest bardzo ważny z punktu widzenia dostępności, ponieważ umożliwia wyświetlenie tekstu alternatywnego w przypadku, gdy obraz nie może być załadowany. Ponadto, zgodnie z wytycznymi W3C, znacznik <img> jest samodzielny, co oznacza, że nie wymaga pary znaczników otwierającego i zamykającego. Warto również dodać, że stosowanie odpowiednich formatów obrazów, takich jak JPG czy PNG, ma znaczenie dla jakości i wydajności ładowania strony, co jest kluczowe z perspektywy SEO. Użycie poprawnych znaczników i atrybutów może znacząco wpłynąć na pozycję strony w wynikach wyszukiwania.

Pytanie 13

Aby ustawić wewnętrzne marginesy dla elementu: margines górny 50px, dolny 40px, prawy 20px oraz lewy 30px, powinno się zastosować składnię CSS

A. padding: 50px, 40px, 20px, 30px;

B. padding: 40px, 30px, 50px, 20px;

C. padding: 50px, 20px, 40px, 30px;

D. padding: 20px, 40px, 30px, 50px;

Podane odpowiedzi niepoprawne wynikają z pomylenia kolejności, w jakiej wartości paddingu są interpretowane w CSS. Wartości paddingu są rozpoznawane w określonej sekwencji: najpierw górny, następnie prawy, dolny, a na końcu lewy. Dlatego, jeśli margines górny wynosi 50px, prawy 20px, dolny 40px i lewy 30px, to niektóre z przedstawionych opcji nie oddają tej kolejności. Użycie nieodpowiednich wartości skutkuje nieprzewidywalnym wyglądem elementów na stronie, co może prowadzić do problemów z układem oraz zaburzenia estetyki. W szczególności, niepoprawne zestawienie wartości może powodować, że odstępy będą nie tylko niewłaściwe, ale także mogą przyczynić się do trudności w interakcji użytkowników z elementami na stronie. Dodatkowo, błędy w stosowaniu paddingu mogą prowadzić do konfliktów z innymi stylami CSS, co jeszcze bardziej komplikuje proces projektowania. W praktyce, niepoprawne stosowanie kolejności wartości paddingu jest częstym błędem, który może być wynikiem braku zrozumienia konwencji CSS lub pośpiechu w implementacji. Kluczowe jest zrozumienie, że CSS jest oparty na ściśle określonych zasadach, a niewłaściwe stosowanie tych zasad może prowadzić do nieefektywnych rozwiązań projektowych.

Pytanie 14

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

A. pt

B. em

C. in

D. px

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

Pytanie 15

Gdzie w dokumencie HTML mogą być umieszczane fragmenty kodu JavaScript?

A. jedynie w sekcji <head>, w znaczniku <script>

B. zarówno w sekcji <head>, jak i <body>, w znaczniku <script>

C. wyłącznie w sekcji <body>, w znaczniku <java>

D. tak w sekcji <head>, jak i <body>, w znaczniku <java>

Wiesz, wstawianie kodu JavaScript do dokumentu HTML powinno odbywać się w znaczniku <script>. Możesz go umieścić zarówno w <head>, jak i w <body>. Często wrzucamy skrypty do <head>, bo chcemy, żeby załadowały się przed wyświetleniem treści. To się przydaje, gdy skrypty zmieniają coś w DOM. Z drugiej strony, jak wrzucisz je do <body>, to skrypty będą ładowane po całej treści, co może przyspieszyć to, co widzi użytkownik. Na przykład, jeśli tworzysz coś interaktywnego, lepiej umieścić skrypty na dole, żeby nie blokować renderowania. Dobrze jest też pamiętać o atrybucie 'defer' w <script>, bo dzięki temu skrypt się ściąga równolegle z innymi rzeczami, ale działa dopiero jak cały dokument jest załadowany. To ważne, żeby strony działały sprawnie i były przyjemne w użytkowaniu.

Pytanie 16

CMYK to zestaw czterech podstawowych kolorów używanych w druku:

A. turkusowego, purpurowego, białego, czarnego

B. czerwonego, purpurowego, żółtego, szarego

C. turkusowego, błękitnego, białego, różowego

D. turkusowego, purpurowego, żółtego, czarnego

Wśród pozostałych odpowiedzi znajdują się kolory, które nie są częścią modelu CMYK. Przykładowo, wykorzystanie białego jako jednego z podstawowych kolorów jest błędne, ponieważ w druku subtraktywnym biały kolor uzyskuje się poprzez brak nałożenia farby, a nie przez jej obecność. Ponadto, odpowiedzi zawierające szary również są niepoprawne, ponieważ szary nie jest podstawowym kolorem w modelu CMYK, a jego uzyskanie wymaga mieszania pozostałych kolorów w odpowiednich proporcjach. W druku istotne jest, aby zrozumieć, że kolory muszą pochodzić z farb o wysokiej czystości, które efektywnie współpracują ze sobą podczas procesu drukowania. Również, obecność turkusowego w tych odpowiedziach jest myląca, ponieważ w kontekście CMYK chodzi o cyjan, który ma zupełnie inną charakterystykę kolorystyczną. Znajomość właściwych terminów i kolorów w druku jest niezbędna, aby unikać pomyłek w projektowaniu oraz druku materiałów, co może prowadzić do znacznych błędów w końcowym produkcie.

Pytanie 17

Wskaźnik HTML, który umożliwia oznaczenie tekstu jako błędnego lub nieodpowiedniego poprzez jego przekreślenie, to jaki?

A. <s> </s>

B. <b> </b>

C. <u> </u>

D. <em> </em>

W tym pytaniu łatwo pomylić różne znaczniki HTML, bo wiele z nich wpływa na wygląd tekstu, ale pełnią zupełnie inne role semantyczne. W standardzie HTML <b> odpowiada głównie za pogrubienie tekstu, bez nadawania mu specjalnego znaczenia. To po prostu wizualne wyróżnienie, coś jak podkręcenie czcionki w edytorze tekstu. Nie informuje jednak, że treść jest błędna, nieaktualna czy powinna być zignorowana. W nowoczesnym kodzie, jeśli chcemy podkreślić ważność treści, lepszym wyborem jest <strong>, a nie <b>. Podobnie <em> nie ma nic wspólnego z przekreśleniem – ten znacznik służy do emfazy, czyli zaakcentowania fragmentu zdania, zwykle renderowany jest kursywą. Semantycznie oznacza, że dany fragment ma inne brzmienie albo nacisk w wypowiedzi, co jest istotne np. dla czytników ekranu czy tłumaczeń. Z kolei <u> historycznie kojarzy się z podkreślaniem tekstu, ale w HTML5 jego znaczenie zostało doprecyzowane: używa się go raczej do oznaczania treści, które są w jakiś sposób wyróżnione konwencjonalnie (np. błąd ortograficzny, nazwa własna w tekście innym alfabetem), a nie do dekoracyjnego podkreślania wszystkiego jak leci. Typowym błędem jest myślenie kategoriami „jak to wygląda”, zamiast „co to oznacza”. Wiele osób wybiera <b> albo <u>, bo kojarzy im się to z edytorem Word i zmianą stylu, a w HTML powinniśmy bardziej zwracać uwagę na semantykę i zgodność ze specyfikacją. Do oznaczania tekstu jako błędnego lub nieaktualnego używa się <s> (lub w bardziej formalnych zmianach <del>), bo te znaczniki jednoznacznie wskazują, że dana treść nie jest już obowiązująca. Dzięki temu narzędzia do dostępności, wyszukiwarki i style CSS mogą poprawnie interpretować znaczenie tego fragmentu, a nie tylko jego wygląd.

Pytanie 18

Wskaż fragment CSS, który odpowiada rozkładowi bloków 2-5, zakładając, że zostały one zbudowane na podstawie podanego kodu HTML.

A. Kod 3

B. Kod 4

C. Kod 1

D. Kod 2

Kod 2 jest prawidłowy, ponieważ dla bloków 2 i 3 stosowane jest ustawienie float: left; co pozwala na ich ułożenie w jednym wierszu z lewej strony. Blok 4 z float: right; umiejscawia się po prawej stronie, co umożliwia uzyskanie układu bloków 2-4 w jednej linii, odpowiadając schematowi. Blok 5 z float: left; rozpoczyna nowy wiersz poniżej, zgodnie z założonym układem. Takie użycie właściwości float oraz width pozwala na zorganizowanie elementów na stronie bez użycia flexbox lub grid, co jest klasycznym podejściem do układu strony w CSS. Dobrym przykładem praktycznego zastosowania jest tworzenie responsywnych layoutów, gdzie float można używać do kontrolowania przepływu elementów na mniejszych ekranach. Mimo że obecnie technologia flexbox i grid jest bardziej popularna, znajomość stosowania float nadal jest istotna, zwłaszcza w kontekście starszych projektów, które mogą wymagać utrzymania zgodności z wcześniejszymi wersjami CSS. To rozwiązanie zapewnia zgodność z wieloma starszymi przeglądarkami, co jest kluczowe w przypadku długoterminowych projektów webowych.

Pytanie 19

Jaki jest efekt działania programu w JavaScript?

var osoba = prompt("Podaj imię", "Adam");

A. uzyskanie z formularza wyświetlonego na stronie HTML imienia "Adam"

B. przypisanie do zmiennej osoba wartości "Adam"

C. pojawi się okno z pustym polem do edycji

D. otwarcie okna z polem do edycji, w którym znajduje się domyślny tekst "Adam"

Funkcja prompt w JavaScript jest używana do wyświetlania okna dialogowego z polem edycyjnym pozwalającym użytkownikowi na wprowadzenie danych. W tym przypadku funkcja prompt przyjmuje dwa argumenty: pierwszy to komunikat wyświetlany użytkownikowi, a drugi to domyślna wartość w polu tekstowym. Kod var osoba = prompt('Podaj imię' 'Adam') otwiera okno dialogowe z tekstem Podaj imię i domyślnie wpisanym w polu tekstowym imieniem Adam. Domyślna wartość jest przydatna w sytuacjach gdzie chcemy zasugerować użytkownikowi pewne dane które mogą być dla niego odpowiednie lub często używane. Jest to wygodne rozwiązanie w aplikacjach internetowych pozwalające na szybkie i intuicyjne wprowadzanie danych przez użytkownika. Zastosowanie prompt jest przykładem interakcji między użytkownikiem a stroną internetową co jest kluczowym elementem dynamicznych aplikacji webowych. Ważne jest jednak by pamiętać że funkcja prompt może być blokowana w niektórych przeglądarkach dlatego jej użycie powinno być dobrze przemyślane i ewentualnie zastąpione bardziej nowoczesnymi rozwiązaniami takimi jak formularze HTML z odpowiednimi atrybutami i stylizacjami.

Pytanie 20

Jak nazywa się domyślny plik konfiguracyjny dla serwera Apache?

A. .configuration

B. configuration.php

C. .htaccess

D. htaccess.cnf

.htaccess to plik konfiguracyjny używany przez serwer Apache, który pozwala na lokalne zarządzanie ustawieniami serwera dla konkretnego katalogu. Jego nazwa zaczyna się od kropki, co czyni go ukrytym plikiem w systemach Unix/Linux. Plik .htaccess umożliwia m.in. definiowanie reguł przekierowań, ustawianie zabezpieczeń, zarządzanie dostępem do zasobów czy konfigurację behawioralną modułów serwera. Działa na zasadzie dziedziczenia, co oznacza, że ustawienia w pliku .htaccess mają pierwszeństwo przed globalnymi ustawieniami w pliku httpd.conf. Przykładem użycia .htaccess może być przekierowanie użytkowników z HTTP na HTTPS, co zwiększa bezpieczeństwo strony. Warto również wspomnieć, że odpowiednie wykorzystanie pliku .htaccess może wspierać SEO, na przykład poprzez zarządzanie 404 błędami lub ustalanie kanonikalnych adresów URL, co wpływa na indeksowanie przez wyszukiwarki. Istnieją również standardy, takie jak RFC 2616, które regulują zasady działania serwerów, w tym również Apache, co podkreśla znaczenie pliku .htaccess w kontekście administracji serwerem.

Pytanie 21

Głównym celem systemu CMS jest oddzielenie treści portalu informacyjnego od jego wyglądu. Taki efekt osiąga się przez generowanie zawartości

A. z bazy danych oraz wyglądu za pomocą atrybutów HTML

B. ze statycznych plików HTML oraz wyglądu ze zdefiniowanego szablonu

C. ze statycznych plików HTML oraz wyglądu za pomocą technologii FLASH

D. z bazy danych oraz wyglądu ze zdefiniowanego szablonu

Podstawowym zadaniem systemu CMS (Content Management System) jest efektywne oddzielenie treści od warstwy prezentacyjnej, co znacząco ułatwia zarządzanie stroną internetową. Systemy CMS wykorzystują bazy danych do przechowywania treści, co pozwala na dynamiczne generowanie stron internetowych na podstawie zdefiniowanych szablonów. Przy pomocy szablonów można łatwo zmieniać wygląd i układ strony, co jest kluczowe w dzisiejszym szybko zmieniającym się środowisku online. Przykładowo, w systemach takich jak WordPress, treści są przechowywane w bazie danych MySQL, a szablony w PHP. Dzięki temu możesz zmieniać motyw i dostosowywać wygląd strony bez konieczności modyfikacji poszczególnych elementów treści. Dobre praktyki branżowe wskazują na konieczność stosowania tego typu rozdzielenia, co nie tylko przyspiesza proces aktualizacji serwisu, ale także poprawia jego bezpieczeństwo i ułatwia utrzymanie. Takie podejście jest również korzystne w kontekście SEO, ponieważ pozwala na optymalizację treści bez ryzyka wprowadzenia błędów w kodzie.

Pytanie 22

Projektant stworzył logo dla witryny internetowej. Jest to czarny symbol na przezroczystym tle. Aby zachować wszystkie cechy obrazu i umieścić go na stronie, projektant powinien zapisać plik w formacie

A. JPG

B. CDR

C. PNG

D. BMP

Format PNG to super wybór do przechowywania obrazów z przezroczystością, zwłaszcza jeśli chodzi o logo na stronach www. Wiesz, co jest fajne? To, że PNG obsługuje kanał alfa – dzięki temu można zapisać obrazki z przezroczystym tłem. To jest mega ważne, bo logo często muszą się dobrze prezentować na różnych kolorach, prawda? A jeśli chodzi o jakość, to PNG kompresuje obrazy bezstratnie, co znaczy, że nie tracimy detali i jakość pozostaje na wysokim poziomie, a plik nie jest za duży. Graficy często sięgają po PNG, gdy robią ikony czy różne grafiki internetowe, które muszą wyglądać dobrze. W branży web designu to naprawdę standard, żeby korzystać z PNG, bo jest elastyczny na różnych platformach i urządzeniach, więc nie ma co się dziwić, że fachowcy go lubią.

Pytanie 23

W dokumencie XHTML znajduje się fragment kodu, w którym występuje błąd walidacyjny. Co jest przyczyną tego błędu?

A. Nie ma nagłówka szóstego poziomu

B. Znaczniki powinny być pisane dużymi literami

C. Znacznik <br> musi być zamknięty

D. Znacznik <b> nie może być umieszczany wewnątrz znacznika <p>

Wybór odpowiedzi, że nie istnieje nagłówek szóstego stopnia, jest błędny, ponieważ w specyfikacji XHTML nagłówek szóstego stopnia <h6> jest jak najbardziej dopuszczalny i służy do oznaczania najmniej ważnych nagłówków, w hierarchii od <h1> do <h6>. Pisanie znaczników wielkimi literami nie jest wymogiem XHTML. Chociaż XHTML jest wrażliwy na wielkość liter, co oznacza, że nazwy znaczników i atrybutów muszą być pisane małymi literami, odpowiedź sugerująca, że tylko wielkie litery są poprawne, jest błędna. Użycie <b> jako zagnieżdżonego w <p> jest standardową praktyką i jest zgodne z normami XHTML, ponieważ <b> służy do pogrubienia tekstu wewnątrz elementu blokowego, jakim jest <p>. Problem z tą odpowiedzią polega na błędnym zrozumieniu struktury HTML, gdzie zagnieżdżanie elementów inline w elementach blokowych jest dozwolone. Ważnym aspektem jest umiejętność rozpoznania, które elementy są inline, a które blokowe, i jak mogą być poprawnie zagnieżdżane w kontekście specyfikacji XHTML. Poprawne zrozumienie tych zasad pomaga w tworzeniu wydajniejszych i bardziej zgodnych dokumentów internetowych.

Pytanie 24

W kodzie HTML stworzono formularz, który wysyła informacje do pliku formularz.php. Po naciśnięciu przycisku typu submit, przeglądarka zostaje przekierowana na wskazany adres. Na podstawie podanego adresu /formularz.php?imie=Anna&nazwisko=Kowalska można stwierdzić, że dane do pliku formularz.php zostały wysłane za pomocą metody:

A. POST

B. SESSION

C. COOKIE

D. GET

Niepoprawne odpowiedzi sugerują użycie metod POST, SESSION i COOKIE do przesyłania danych do pliku formularz.php. Metoda POST, podobnie jak GET, jest podstawową metodą przesyłania danych w protokole HTTP, jednak różni się od GET tym, że dane są przesyłane w ciele żądania, a nie w adresie URL. Dlatego, jeżeli widzimy dane w adresie URL, to nie mogą one pochodzić z metody POST. Z kolei metody SESSION i COOKIE nie są w ogóle metodami przesyłania danych. SESSION to mechanizm, który pozwala na przechowywanie danych między różnymi żądaniami w sesji użytkownika, a COOKIE to małe pliki tekstowe przechowywane na komputerze użytkownika, które mogą być używane do przechowywania danych między żądaniami. Żadna z tych metod nie przesyła jednak danych poprzez adres URL, co jest kluczowe dla odpowiedzi na to pytanie. Błędne odpowiedzi mogą wynikać z niezrozumienia różnic między tymi metodami i jak są one używane do przesyłania danych w aplikacjach internetowych.

Pytanie 25

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

a[target="_blank"]
{
  color: yellow;
}

A. odnośników, które otwierają się w nowej karcie

B. odnośników, które otwierają się w tej samej karcie

C. każdego linku

D. tekstu akapitu

Rozważając inne odpowiedzi, należy zrozumieć, dlaczego są one niepoprawne w kontekście podanego selektora CSS. Gdy mówimy o odnośnikach otwierających się w tej samej karcie, nie stosuje się atrybutu target="_blank", więc taki selektor jak a[target="_blank"] nie będzie się do nich odnosił. Oznacza to, że koloryzacja na żółto nie dotyczy odnośników otwierających się w tej samej karcie, co jest często typowym zachowaniem, chyba że określono inaczej. W przypadku tekstu paragrafu, selektor użyty w kodzie CSS nie będzie miał żadnego wpływu, ponieważ jest on specyficznie dopasowany do elementów a (odnośników), a nie do tekstu zawieranego w tagach p (paragrafów). CSS operuje na elementach HTML zgodnie z selektorami, dlatego nie można zmieniać stylu niepasujących elementów. Ostatnia możliwość, czyli stylizacja każdego odnośnika bez wyjątku, wymagałaby użycia bardziej ogólnego selektora a, a nie tak szczególnego jak a[target="_blank"]. Błędnym przekonaniem może być założenie, że selektor obejmuje wszystkie odnośniki, jednak atrybut target precyzyjnie wskazuje, które elementy mają być stylizowane. Zrozumienie tych różnic jest kluczowe dla efektywnego stosowania CSS w projektach webowych oraz poprawnego rozumienia specyfiki selektorów, co jest fundamentem efektywnego kodowania wizualnego wyglądu stron.

Pytanie 26

W języku CSS zapis selektora

p > i { color: red; }

wskazuje, że kolorem czerwonym będzie sformatowany

A. tylko ten tekst w znaczniku <p>, który ma przypisaną klasę o nazwie i

B. wszystkie teksty w znaczniku <p> oprócz tych w znaczniku <i>

C. jedynie ten tekst w znaczniku <i>, który znajduje się bezpośrednio wewnątrz znacznika <p>

D. wszystki tekst w znaczniku <p> lub wszelkie treści w znaczniku <i>

Zapis selektora CSS p > i mówi, że styl ma być zastosowany tylko do elementów <i>, które są bezpośrednimi dziećmi znacznika <p>. W praktyce oznacza to tyle, że jeśli w <p> mamy <i>, to tylko ten <i> weźmie czerwony kolor. To jest w porządku, bo w CSS style mogą się dziedziczyć, ale można je też dokładnie określić z użyciem selektorów. Znak '>' wskazuje na relację rodzic-dziecko, co jest istotne, gdy patrzymy na strukturę dokumentu HTML. Na przykład, w kodzie: <p>To jest <i>przykład</i> tekstu.</p>, słowo „przykład” będzie czerwone. Dodatkowo, korzystanie z takich selektorów to dobra praktyka, bo ogranicza wpływ stylów tylko do konkretnego kontekstu, co bardzo ułatwia zrozumienie kodu. Tego typu selektory pomagają unikać niechcianych efektów, które mogą się zdarzyć przy bardziej ogólnych zasadach CSS, a także poprawiają wydajność przeglądarki przy stylizacji.

Pytanie 27

Jaką wartość w formacie szesnastkowym ma kolor określony kodem RGB o wartościach rgb(128,16,8)?

A. #801008

B. #FF0F80

C. #800F80

D. #FF1008

Jak spojrzymy na inne odpowiedzi, to można zauważyć, że mają one jakieś błędy w konwersji kolorów RGB na szesnastkowy. Pierwsza z błędnych odpowiedzi to #FF0F80, gdzie wartość czerwonego jest zbyt wysoka, bo mamy FF zamiast 80, które jest poprawne. Taki błąd zmienia kolor na całkiem inny, więc widać, jak ważne jest poprawne przetwarzanie tych wartości. Druga odpowiedź, #FF1008, też pokazuje za wysoką wartość czerwonego, a zielony jest nieprawidłowy, bo 10 to w rzeczywistości 16 w systemie dziesiętnym, co oczywiście wpływa na końcowy kolor. W ostatniej odpowiedzi, czyli #800F80, mamy złą wartość dla zielonego i niebieskiego. Powinno być 08 dla niebieskiego, a F80 to już coś innego. Takie pomyłki pokazują, że warto znać system RGB i jak go przerobić na szesnastkowy, żeby kolory były odpowiednio odwzorowane w projektach.

Pytanie 28

W przedstawionym filmie, aby połączyć tekst i wielokąt w jeden obiekt tak, aby operacja ta była odwracalna zastosowano funkcję

A. wykluczenia.

B. sumy.

C. grupowania.

D. części wspólnej.

W tym zadaniu łatwo się pomylić, bo w grafice wektorowej mamy kilka różnych funkcji, które na pierwszy rzut oka wyglądają podobnie: łączą obiekty w coś, co zachowuje się jak jeden element. Jednak ich działanie „pod maską” jest zupełnie inne. Funkcje typu suma, wykluczenie czy część wspólna to klasyczne operacje boolowskie na kształtach. One zmieniają geometrię obiektów, czyli tworzą nową ścieżkę wynikową na podstawie przecięcia lub połączenia istniejących. W praktyce oznacza to, że jeśli zastosujesz sumę na tekście i wielokącie, program najczęściej zamieni tekst na krzywe i połączy wszystko w jedną ścieżkę. Efekt wizualny może być fajny, ale edytowalność tekstu przepada. Nie możesz już po prostu zmienić czcionki czy liter, bo to nie jest tekst, tylko zestaw węzłów. Podobnie z wykluczeniem: ta operacja tworzy „dziurę” jednego obiektu w drugim. Używa się jej np. do wycinania napisu z tła lub tworzenia maski. To jest typowy trik przy projektach logotypów albo efektach dekoracyjnych. Ale z punktu widzenia pytania – to działanie jest destrukcyjne dla tekstu, bo znowu zamienia go na kształt i łączy z wielokątem w sposób nieodwracalny (poza cofnięciem operacji). Część wspólna działa jeszcze ostrzej: zostawia tylko obszar, w którym obiekty się nakładają. Reszta jest tracona. To też jest operacja geometryczna, a nie organizacyjna. Typowy błąd myślowy polega na założeniu, że „skoro po operacji mam jeden obiekt, to znaczy, że to jest to samo co grupowanie”. Niestety nie. Grupowanie nie modyfikuje kształtów, tylko tworzy kontener logiczny – tak jakbyś w folderze trzymał kilka plików. Możesz je potem rozgrupować i wszystko wraca do stanu sprzed grupowania. Operacje suma, wykluczenie, część wspólna są destrukcyjne względem oryginalnych obiektów, bo generują nową ścieżkę zamiast starych. W kontekście dobrych praktyk w grafice komputerowej i multimediach przyjmuje się, że dopóki chcesz zachować pełną edytowalność (szczególnie tekstów), używasz grupowania, warstw i wyrównywania, a dopiero na późnym etapie projektu stosujesz operacje boolowskie, i to świadomie, wiedząc, że cofasz się już tylko historią edycji. Dlatego w pytaniu, gdzie mowa jest wprost o połączeniu tekstu i wielokąta w jeden obiekt w sposób odwracalny, jedyną sensowną odpowiedzią jest funkcja grupowania, a nie suma, wykluczenie czy część wspólna.

Pytanie 29

Jakie ustawienia dotyczące czcionki będą miały zastosowanie w przypadku kodu CSS?

* {
    font-family: Tahoma;
    color: Teal;
}

A. znaczników z klasą przypisaną jako *.

B. znaczników o identyfikatorze równym *.

C. wszystkiego kodu HTML, niezależnie od kolejnych ustawień CSS.

D. wszystkiego kodu HTML, jako domyślne formatowanie dla wszystkich elementów strony.

Nieprawidłowe odpowiedzi wskazują na nieporozumienie dotyczące działania selektorów w CSS oraz hierarchii stylów. Przykłady wskazujące na znaczenie id lub klas w kontekście selektora * są mylące, gdyż id i klasy są w CSS bardziej specyficznymi selektorami, które służą do stylizowania konkretnej grupy elementów, podczas gdy selektor uniwersalny działa na wszystkie elementy. Argumentowanie, że formatowanie dotyczy elementów o id równym * jest błędne, ponieważ id nie może być równy znaku *, a jego zastosowanie ogranicza się do unikalnych identyfikatorów. Podobnie, przypisanie klasy równą * jest niemożliwe do zrealizowania w praktyce. Odpowiedź sugerująca, że styl dotyczy całego kodu HTML w kontekście specyficznych ustawień CSS jest również myląca, ponieważ nie uwzględnia faktu, że późniejsze reguły CSS mogą nadpisywać wcześniejsze style. W praktyce oznacza to, że jeśli na elementach zastosowane zostaną bardziej szczegółowe selektory, mogą one zmienić wygląd tych elementów, co obala tezę o domyślnym formatowaniu. Takie podejście nie uwzględnia także koncepcji kaskadowości stylów, która jest kluczowym elementem funkcjonowania CSS, gdzie kolejność i specyficzność selektorów odgrywają kluczową rolę w aplikowaniu stylów. W efekcie, zrozumienie działania selektorów i ich hierarchii jest niezbędne dla efektywnego wykorzystania CSS w projektowaniu stron internetowych.

Pytanie 30

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

A. muted

B. controls

C. poster

D. loop

Atrybut muted jest stosowany, gdy chcemy, aby wideo odtwarzało się bez dźwięku. Jest to istotne w przypadku, gdy niepożądane jest, aby dźwięk włączał się automatycznie, co może być irytujące dla użytkowników. Użycie atrybutu muted nie wpływa jednak na powtarzanie wideo, dlatego nie może pełnić roli zamiennika dla loop. Poster to atrybut, który określa obraz wyświetlany przed rozpoczęciem odtwarzania wideo. Jest to istotna funkcjonalność, która pozwala na lepsze prezentowanie treści, ale również nie ma związku z cyklicznym odtwarzaniem. Używanie poster pozwala na wizualne przygotowanie użytkownika na nadchodzące wideo, ale nie wpływa na jego zachowanie podczas odtwarzania. Kontrolki, które można dodać do znacznika video, pozwalają użytkownikom na interakcję z wideo, takie jak pauza, przewijanie czy regulacja głośności. Atrybut controls jest niezwykle przydatny w zapewnieniu lepszej interakcji z użytkownikiem, jednak nie ma związku z automatycznym powtarzaniem wideo. Każdy z tych atrybutów ma swoje unikalne zastosowanie, ale żaden z nich nie realizuje funkcji loop, która jest kluczowa dla odtwarzania wideo w pętli.

Pytanie 31

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

A. <b> oraz <u>

B. <i> oraz <mark>

C. <u> oraz <sup>

D. <b> oraz <i>

Odpowiedzi wskazujące na <u> oraz <sup> nie są właściwe w kontekście wyróżniania istotności tekstu. Znacznik <u> oznacza tekst podkreślony, co nie jest związane z jego semantycznym znaczeniem w HTML. W przeszłości używano go do podkreślania tekstu, ale nie ma on związku z wagi treści, co czyni go mniej odpowiednim do tworzenia treści dostępnych i zrozumiałych. Użytkownicy technologii wspomagających mogą mieć trudności w zrozumieniu, dlaczego tekst jest podkreślony, gdyż niekoniecznie oznacza to, że jest on ważny. Podobnie, <sup> jest znacznikiem używanym do oznaczania tekstu w indeksie górnym, co ma zastosowanie w kontekście matematycznym lub chemicznym, ale także nie ma związku z semantycznym wyróżnianiem treści. Z kolei odpowiedzi wskazujące na <i> oraz <mark> także są niepoprawne, ponieważ <mark> służy do oznaczania tekstu, który został wyróżniony, na przykład w kontekście wyszukiwania, ale niekoniecznie odzwierciedla istotność. Ostatecznie, znacznik <i> jest używany do stylizacji tekstu w kursywie, co także nie koresponduje z semantycznym znaczeniem wyróżnienia ważności. Przy opracowywaniu treści w HTML należy unikać stosowania znaczników jedynie do celów formatowania, a zamiast tego korzystać z semantycznych znaczników, aby poprawić dostępność oraz interpretację contentu.

Pytanie 32

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

A. <span>Dobre strony </span><span style="letter-spacing:3px">mojej strony</span>

B. style="margin-bottom: 0cm;"><h3>Dobre strony </h3><h3 style="letter-spacing:3px">mojej strony</h3>

C. style="margin-bottom: 0cm;"><div>Dobre strony </div><div style="letter-spacing:3px">mojej strony</div>

D. style="margin-bottom: 0cm;"><p>Dobre strony </p><p style="letter-spacing:3px">mojej strony</p>

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

Pytanie 33

Efekt AutoDuck w obróbce dźwięku jest stosowany do

A. wyrównania głośności całej ścieżki dźwiękowej.

B. ściszenia dźwięku w tle, gdy pojawia się dźwięk pierwszoplanowy.

C. ocieplenia głosu i dźwięków pochodzących z tła.

D. eliminacji szumów pochodzących z dźwięków w tle.

W obróbce dźwięku łatwo pomylić różne efekty, bo większość z nich w jakiś sposób wpływa na głośność lub charakter brzmienia. AutoDuck jednak ma bardzo konkretne zastosowanie: automatyczne ściszanie tła, gdy pojawia się dźwięk pierwszoplanowy, najczęściej głos. To nie jest efekt „upiększający” czy „naprawiający” brzmienie, tylko typowo użytkowy mechanizm sterowania poziomem głośności między dwoma ścieżkami. Częsty błąd myślowy polega na tym, że wszystko, co „robi coś z głośnością”, wrzuca się do jednego worka. Ocieplenie głosu kojarzy się raczej z korekcją barwy (equalizer – podbicie niskich i niższych średnich częstotliwości) albo z delikatną kompresją, ewentualnie z efektami typu saturacja czy emulacja lampowa. AutoDuck niczego nie „ociepla”, on tylko zmniejsza poziom innej ścieżki, reagując na sygnał pierwszoplanowy. Podobnie z wyrównywaniem głośności całej ścieżki – od tego są kompresory, limitery, normalizacja czy tzw. loudness matching zgodny z normami EBU R128 lub ITU-R BS.1770. Te narzędzia analizują lub przetwarzają pojedynczą ścieżkę, żeby jej poziom był bardziej równy w czasie. AutoDuck działa relacyjnie: jedna ścieżka kontroluje głośność drugiej. Jeśli chodzi o eliminację szumów, tym zajmują się zupełnie inne algorytmy: redukcja szumów, bramki szumów (noise gate), filtry dolno- lub górnoprzepustowe, narzędzia typu DeNoise. Szum się tam analizuje i usuwa lub tłumi, najczęściej w oparciu o profil szumu albo próg głośności. AutoDuck nie rozpoznaje szumu ani nie czyści nagrania, tylko mechanicznie ścisza tło, gdy pojawia się ważniejszy sygnał. W produkcji multimediów na strony WWW czy do e-learningu dobrą praktyką jest łączenie kilku technik: najpierw oczyszczenie głosu z szumów i ustawienie jego stałego poziomu kompresją, a dopiero potem zastosowanie duckingu na muzyce w tle. Dzięki temu materiał brzmi profesjonalnie, a słuchacz nie musi walczyć z niedosłyszalnym komentarzem przykrytym za głośną muzyką.

Pytanie 34

Jaką technologię zaleca się przy budowie witryn WWW, aby użytkownicy bez umiejętności programistycznych mogli samodzielnie wprowadzać zmiany w treści bez kodowania?

A. CMS

B. FTP

C. SSL

D. SEO

SEO, czyli optymalizacja dla wyszukiwarek, to temat, który dotyczy poprawy widoczności strony w wynikach wyszukiwania. Choć jest szalenie ważne w marketingu internetowym, to nie ma bezpośredniego związku z tym, jak zarządzać treścią na stronie. Użytkownicy nie mogą zmieniać treści za pomocą SEO; chodzi raczej o to, żeby to, co już jest, było bardziej przyjazne dla robotów wyszukiwarek. Trzeba pamiętać, że jeśli się skupiamy na SEO, ale nie mamy porządnego CMS-a, to aktualizacja treści może być trudna, co w dłuższym czasie źle wpłynie na pozycjonowanie. FTP, czyli protokół transferu plików, jest do przesyłania plików między komputerami a serwerami, ale żeby z niego korzystać, trzeba znać strukturę plików, więc dla kogoś bez technicznych umiejętności to nie jest rozwiązanie. SSL, czyli bezpieczne połączenia, to ważna rzecz, ale z zarządzaniem treścią nie ma za bardzo wspólnego. Użytkownicy mogą się pogubić, myśląc, że te technologie wystarczą do zarządzania treścią, co może wprowadzać w błąd i powodować, że zasoby internetu będą wykorzystywane nieefektywnie.

Pytanie 35

<form>
  <input type="email" id="addr" required>
  <input type="submit" value="Zapisz">
</form>

Na podstawie przedstawionego kodu formularza HTML można powiedzieć, że pole edycyjne:

A. nie może być puste i wymaga wpisania tekstu ze znakiem @.

B. wymaga wpisania jedynie znaków alfanumerycznych.

C. może być puste.

D. nie powinno zawierać znaków numerycznych.

Kod formularza, który został pokazany w pytaniu, wykorzystuje dwa mechanizmy walidacji wbudowane w HTML5: typ pola ustawiony na email oraz atrybut required. Jeśli się je dobrze rozumie, to łatwo odrzucić wszystkie błędne interpretacje. Spójrzmy na to bardziej od strony tego, co faktycznie robi przeglądarka. Pomysł, że pole może być puste, jest sprzeczny z działaniem atrybutu required. Ten atrybut wprost oznacza, że użytkownik musi coś wpisać. Jeżeli zostawi pole puste i kliknie przycisk „Zapisz”, przeglądarka zablokuje wysłanie formularza i wyświetli swój komunikat, np. „Wypełnij to pole”. To nie jest kwestia „dobrej praktyki”, tylko twardej reguły zapisanej w specyfikacji HTML. W praktyce to bardzo przydatne, bo od razu na froncie wymusza uzupełnienie danych. Stwierdzenie, że pole nie powinno zawierać znaków numerycznych, też jest błędne. Pole typu email dopuszcza cyfry, bo wiele poprawnych adresów e‑mail zawiera liczby, np. [email protected]. Przeglądarka nie ma żadnego zakazu cyfr w takim polu, patrzy tylko na ogólny format adresu. Nieprawidłowy jest też pogląd, że wymagane są „jedynie znaki alfanumeryczne”. Adres e‑mail zawiera zwykle kropki, znak @, czasem myślniki, podkreślenia i inne dopuszczalne znaki. Gdyby przeglądarka pozwalała tylko na litery i cyfry, większość realnych adresów zostałaby odrzucona. Walidacja typu email jest skoncentrowana na strukturze (część przed @, znak @, część po @), a nie na tak prymitywnym ograniczeniu jak „tylko litery i cyfry”. Typowy błąd myślowy przy takich pytaniach to mylenie różnych poziomów walidacji: jedni zakładają, że HTML w ogóle nie sprawdza formatu, inni z kolei wyobrażają sobie zbyt restrykcyjne reguły, które w praktyce by uniemożliwiły wpisanie normalnego adresu. Dobrym nawykiem jest patrzenie na to, co gwarantuje przeglądarka: w tym wypadku wymagane jest, żeby pole nie było puste (required) oraz żeby wpisany tekst przypominał adres e‑mail, czyli zawierał m.in. znak @ w odpowiednim miejscu. Wszystkie inne interpretacje wychodzą poza to, co naprawdę wynika z kodu formularza.

Pytanie 36

Który zapis CSS wprowadzi niebieskie tło dla bloku?

A. div {background-color: blue;}

B. div {border-color: blue;}

C. div {shadow: blue;}

D. div {color: blue;}

Odpowiedzi div {border-color: blue;}, div {color: blue;} oraz div {shadow: blue;} nie są poprawne z kilku powodów, które warto szczegółowo omówić. Pierwsza z tych odpowiedzi odnosi się do właściwości 'border-color', która zmienia kolor obramowania elementu. Chociaż może to wpłynąć na wygląd bloku, nie ma wpływu na tło, co jest celem pytania. Z kolei 'color' to właściwość, która definiuje kolor tekstu wewnątrz elementu, a nie tła. Oznacza to, że użycie tej właściwości zmieni tylko kolor tekstu, pozostawiając tło bez zmian. Wreszcie, zapis 'shadow' nie istnieje w standardzie CSS, co wskazuje na nieporozumienie dotyczące właściwości stylizacji. Możliwe, że użytkownik miał na myśli 'box-shadow', która stosuje cień do elementu, ale nie dotyczy to koloru tła. Kluczowym błędem jest brak zrozumienia podstawowych właściwości CSS oraz ich zastosowania. Warto pamiętać, że CSS ma określone zasady i właściwości, które należy stosować zgodnie z ich przeznaczeniem, aby osiągnąć zamierzony efekt wizualny. Zrozumienie tych różnic jest fundamentalne dla każdego, kto chce efektywnie posługiwać się CSS i projektować atrakcyjne oraz funkcjonalne strony internetowe.

Pytanie 37

W jakim formacie powinien być zapisany obraz, aby mógł być wyświetlany na stronie internetowej z zachowaniem przezroczystości?

A. PNG

B. CDR

C. JPG

D. BMP

Wybór formatu JPG, BMP i CDR do zapisu obrazów na stronach internetowych, zwłaszcza w kontekście przezroczystości, może prowadzić do poważnych ograniczeń i problemów. Format JPG (JPEG) to kompresowany format stratny, co oznacza, że podczas zapisywania zdjęć dochodzi do utraty jakości, a także nie obsługuje przezroczystości. To sprawia, że nie nadaje się do grafik wymagających transparentnych obszarów. W praktyce, obrazy JPG są najczęściej używane do zdjęć, gdzie pełna gama kolorów jest istotna, a przezroczystość nie jest potrzebna. BMP (Bitmap) to format zapisu obrazów, który również nie wspiera przezroczystości, a ponadto generuje duże pliki, co jest nieefektywne w kontekście ładowania stron internetowych. Grafiki w formacie BMP są zwykle zbyt ciężkie, by być praktycznymi w środowisku webowym, gdzie priorytetem są szybkość ładowania i optymalizacja zasobów. Z kolei CDR to format pliku używany głównie w oprogramowaniu do grafiki wektorowej CorelDRAW. Chociaż może on być użyteczny w projektowaniu, nie jest standardowym formatem do publikacji w Internecie i nie obsługuje przezroczystości w sposób, który jest wymagany przez nowoczesne standardy webowe. Użytkownicy często popełniają błąd, zakładając, że każdy format obrazu nadaje się do wykorzystania w sieci, mimo że różne formaty mają różne zastosowania i ograniczenia. Wybór niewłaściwego formatu może skutkować gorszą jakością wizualną, dłuższymi czasami ładowania oraz niezgodnością z wymaganiami użytkowników i przeglądarek internetowych.

Pytanie 38

Który z czterech głównych kolorów w modelu barw CMYK jest

A. pomarańczowy

B. brązowy

C. zielony

D. czarny

Zielony, brązowy i pomarańczowy nie są podstawowymi kolorami modelu CMYK, co można wyjaśnić na podstawie zasad działania tego modelu barw. Zielony, będący kolorem wtórnym, powstaje z połączenia cyjanu i żółtego, co oznacza, że nie jest niezależnym kolorem w tym systemie. Pomarańczowy również jest kolorem wtórnym, tworzonym przez mieszanie czerwieni i żółtego, co sprawia, że brakuje mu statusu podstawowego koloru w kontekście druku. Brązowy natomiast jest kolorem, który powstaje z kombinacji różnych kolorów podstawowych, takich jak czerwony, żółty i czarny, co również wyklucza go z grona kolorów podstawowych. W modelu CMYK kluczowe jest zrozumienie, że kolory są tworzone poprzez subtractive mixing, co oznacza, że każdy dodany kolor absorbuje pewne długości fal świetlnych, co w efekcie zmienia postrzegany kolor. Z tego powodu, kolory takie jak zielony, brązowy i pomarańczowy, które są wynikiem mieszania, nie mogą być uznawane za podstawowe elementy tego modelu. W kontekście druku, poprawne zastosowanie kolorów podstawowych jest niezbędne dla uzyskania oczekiwanych rezultatów wizualnych, dlatego ważne jest, aby znać ich właściwości i sposób, w jaki wpływają na finalny efekt druku.

Pytanie 39

Zapis tagu HTML w formie <a href="#hobby">przejdź</a>?

A. jest poprawny, po kliknięciu w odnośnik aktualna strona zostanie przewinięta do elementu o nazwie "hobby"

B. jest poprawny, po kliknięciu w odnośnik otworzy się strona internetowa o adresie "hobby"

C. jest błędny, w atrybucie href trzeba wpisać adres URL

D. jest błędny, niepoprawnie użyto znaku "#" w atrybucie href

Myślenie, że znacznik <a href="#hobby">przejdź</a> jest błędny, bo używasz znaku '#' w href, jest trochę mylące. Ten znak '#' to normalny sposób, żeby wskazać lokalne odnośniki na tej samej stronie, co jest zgodne z regułami HTML. Nie jest prawdą, że musi być cały adres URL, bo lokalne identyfikatory są jak najbardziej w porządku. Często spotykam się z przekonaniem, że href zawsze powinien prowadzić do zewnętrznego linku, a to nieprawda. Wiele stron korzysta z lokalnych linków, co naprawdę sprawdza się w długich treściach, pozwalając użytkownikom szybko przechodzić do tych sekcji, które ich interesują. Nie można też myśleć, że tylko absolutne identyfikatory w href są jedynym słusznym rozwiązaniem, bo to podejście z lokalnymi odnośnikami jest powszechnie akceptowane i sprawdza się w praktyce.

Pytanie 40

Jaką wartość w systemie RGB uzyskamy dla koloru zapisanego w kodzie heksadecymalnym: #1510FE?

A. rgb(15,10,FE)

B. rgb(21,16,FE)

C. rgb(21,16,254)

D. rgb(21,16,255)

Odpowiedzi rgb(15,10,FE), rgb(21,16,FE) oraz rgb(21,16,255) są błędne z różnych powodów, które wynikają z niepoprawnych konwersji wartości heksadecymalnych do systemu RGB. W pierwszym przypadku, rgb(15,10,FE), wartości czerwonej i zielonej zostały błędnie zinterpretowane. Wartości heksadecymalne 15 (0F) i 10 (0A) nie odpowiadają poprawnym konwersjom z systemu szesnastkowego. Wartość niebieska 'FE' w formacie RGB powinna być również przelicza na wartość dziesiętną, a nie pozostawiana w formie heksadecymalnej, co jest kolejnym źródłem błędu w tej odpowiedzi. Z kolei rgb(21,16,FE) zawiera poprawne wartości czerwonej i zielonej, ale niebieska komponenta jest znów nieprzekształcona i pozostaje w formacie szesnastkowym. Ostatnia odpowiedź, rgb(21,16,255), choć zawiera prawidłowe wartości czerwonej i zielonej, wskazuje na niepoprawną wartość niebieską, ponieważ 255 w systemie dziesiętnym nie odpowiada heksadecymalnemu 'FE', które wynosi 254. Typowe błędy myślowe związane z tymi odpowiedziami obejmują niewłaściwe przeliczanie wartości heksadecymalnych oraz brak zrozumienia, jak funkcjonuje konwersja systemów liczbowych. W praktyce, poprawna przekształcenie wartości kolorów jest kluczowe dla spójności wizualnej w projektach graficznych i cyfrowych, co pokazuje znaczenie znajomości sposobu konwersji kolorów we współczesnym designie.

Rozpocznij nowy egzamin

Powrót do strony głównej