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: 8 grudnia 2025 08:36
Data zakończenia: 8 grudnia 2025 08:36

Egzamin niezdany

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

Wymagane minimum: 20 punktów (50%)

Udostępnij swój wynik

Facebook

X.com

Szczegółowe wyniki:

Pytanie 1

W przypadku przedstawionego fragmentu kodu walidator HTML zgłosi błąd, ponieważ

<img src="kwiat.jpg alt="kwiat">

A. wprowadzono nieznany atrybut alt

B. nie odnaleziono pliku kwiat.jpg

C. użyto niewłaściwego znacznika do wyświetlenia obrazu

D. nie zamknięto cudzysłowu

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Poprawna odpowiedź to nie domknięto cudzysłowu ponieważ w kodzie HTML atrybuty muszą być poprawnie zamknięte aby poprawnie interpretować ich wartości. W przedstawionym fragmencie kodu dla znacznika img brakuje końcowego cudzysłowu po wartości src co stanowi błąd składniowy. Tego typu błędy mogą prowadzić do nieprawidłowego działania strony ponieważ przeglądarka nie jest w stanie jednoznacznie określić końca wartości atrybutu co może skutkować nieprawidłowym renderowaniem danych. Zgodnie z najlepszymi praktykami każde otwarte cudzysłowie powinno być zamknięte aby zapewnić poprawną interpretację kodu. Ponadto stosowanie poprawnego zamykania cudzysłowów zwiększa czytelność kodu co jest istotne przy współpracy zespołowej i ułatwia jego utrzymanie. Warto także korzystać z walidatorów HTML które automatycznie wykrywają takie błędy pomagając w ich szybkim usunięciu. Tego rodzaju narzędzia są kluczowe w procesie tworzenia stron internetowych ponieważ umożliwiają weryfikację zgodności kodu z obowiązującymi standardami co ma bezpośredni wpływ na jego wydajność i kompatybilność z różnymi przeglądarkami.

Pytanie 2

Jaką metodę zastosowano do dodania arkusza stylów do dokumentu HTML w pokazanym kodzie?

A. Styl wpisany, lokalny

B. Styl alternatywny, zewnętrzny

C. Styl wewnętrzny

D. Styl zewnętrzny

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Styl wpisany lokalny w HTML to metoda definiowania stylów CSS bezpośrednio wewnątrz elementów HTML za pomocą atrybutu style. Jest to często stosowane, gdy chcemy szybko zdefiniować unikalne style dla pojedynczego elementu bez tworzenia lub edytowania zewnętrznego pliku CSS. Przykładowo poniższy kod HTML pokazuje jak możemy zmienić kolor tekstu w paragrafie na czerwony używając właśnie stylu pisanego zwanego również inline. Choć jest to proste i szybkie rozwiązanie nie jest zalecane dla większych projektów ze względu na brak możliwości ponownego użycia kodu i problematyczną jego konserwację. W praktyce najlepszym podejściem jest stosowanie stylów zewnętrznych które umożliwiają centralne zarządzanie wyglądem całego dokumentu. Standardy HTML i CSS promują modularność i oddzielenie warstwy prezentacyjnej od struktury co jest bardziej efektywne i zgodne z zasadami projektowania responsywnych aplikacji internetowych. Styl wpisany może być jednak przydatny w testach szybkich prototypach lub sytuacjach gdy zmiany muszą być wprowadzone lokalnie i mają one charakter jednorazowy. Dla bardziej złożonych aplikacji zaleca się jednak stosowanie bardziej zorganizowanych metod stylizacji takich jak style zewnętrzne.

Pytanie 3

Najprostszy sposób zamiany obiektu oznaczonego cyfrą 1 na obiekt oznaczony cyfrą 2 polega na

A. narysowaniu docelowego obiektu.

B. zmianie warstwy obiektu.

C. animowaniu obiektu.

D. geometrycznym transformowaniu obiektu.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Wybrałeś poprawną odpowiedź, która jest 'geometrycznym transformowaniem obiektu'. Kiedy mówimy o transformacji geometrycznej, mamy na myśli różne operacje, które można wykonać na obiektach, takie jak skalowanie, obracanie i przesuwanie. W przypadku obiektu oznaczonego numerem 1 i numerem 2 na obrazku, najprostszym sposobem na przekształcenie jednego w drugi jest używanie transformacji geometrycznej. Obiekt numer 2 jest większy i obrócony w stosunku do obiektu numer 1. Dzięki transformacjom geometrycznym mogliśmy osiągnąć ten efekt, skalując i obracając obiekt numer 1. Transformacje geometryczne są podstawą wielu operacji w dziedzinach takich jak grafika komputerowa, projektowanie CAD, animacja, a także w wielu innych dziedzinach technologii i nauki.

Pytanie 4

Jakiego znacznika używamy do definiowania list w HTML?

A. <td>

B. <ul>

C. <tr>

D. <th>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
<ul> to znacznik w języku HTML, który definiuje nienumerowaną listę, co czyni go kluczowym elementem do strukturyzacji zawartości w dokumentach. Użycie <ul> pozwala na grupowanie powiązanych elementów, co zwiększa czytelność i dostępność treści. Zgodnie z zasadami semantycznego HTML, stosowanie list poprawia organizację informacji i ułatwia ich przetwarzanie przez maszyny, w tym wyszukiwarki internetowe. Przykład zastosowania: w sekcji strony internetowej przedstawiającej cechy produktu możemy użyć <ul> do wypisania jego zalet. Dobrym zwyczajem jest także dodawanie odpowiednich znaczników <li> dla poszczególnych elementów listy. Przykład: <ul><li>Zaleta 1</li><li>Zaleta 2</li></ul>. Dzięki temu tworzony jest bardziej przejrzysty i strukturalny układ treści, co przekłada się na lepsze doświadczenia użytkownika oraz spełnia standardy W3C dotyczące semantyki HTML.

Pytanie 5

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

input:focus { background-color: LightGreen; }

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

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

C. w każdej sytuacji

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

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź "po kliknięciu myszą w celu zapisania w nim tekstu" jest poprawna, ponieważ reguła CSS `input:focus { background-color: LightGreen; }` definiuje styl, który ma zastosowanie, gdy pole edycyjne (input) jest w stanie "focus". Stan ten jest aktywowany, gdy użytkownik klika na pole, co pozwala na wpisywanie tekstu. To podejście jest zgodne z zasadami dostępności i użyteczności interfejsów, ułatwiając użytkownikom interakcję z formularzami. Przykładowo, w formularzach online, takie wizualne wskazanie na aktywne pole poprawia doświadczenie użytkownika, zwiększa czytelność oraz umożliwia łatwiejsze wprowadzanie danych. Warto również pamiętać, że dobrym standardem jest stosowanie kolorów tła, które są kontrastowe w stosunku do kolorów tekstu, aby zapewnić ich czytelność. Ponadto, w praktyce developerskiej, często wykorzystuje się dodatkowe efekty, takie jak animacje, które mogą poprawić interaktywność i wyrazistość reakcji na działania użytkownika. Właściwe stosowanie stylów CSS w kontekście stanu focus jest więc kluczowe dla tworzenia przyjaznych dla użytkownika interfejsów.

Pytanie 6

Jakiego znacznika w HTML użyjemy, aby uzyskać tekst wyświetlany czcionką o stałej szerokości znaku, który również uwzględnia dodatkowe spacje, tabulacje oraz znaki końca linii?

A. <pre>…</pre>

B. <blockquote>…</blockquote>

C. <ins>…</ins>

D. <code>…</code>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Znacznik <pre> w HTML jest używany do formatowania tekstu w taki sposób, aby zachować oryginalne odstępy, tabulacje oraz znaki końca linii. W przeciwieństwie do standardowego tekstu, w którym przeglądarka ignoruje dodatkowe białe znaki, <pre> traktuje je dosłownie, co jest szczególnie przydatne w przypadku wyświetlania kodu źródłowego lub tekstu, w którym ważne są układy. Przykładem użycia może być wyświetlanie kodu programistycznego w dokumentacji technicznej, gdzie precyzyjny format jest kluczowy dla zrozumienia struktury kodu. Standard HTML5 potwierdza, że <pre> jest odpowiednim znacznikiem do tego celu, a jego użycie jest zgodne z zasadami semantyki HTML, co zwiększa czytelność i dostępność treści. Praktyka ta sprzyja również urządzeniom wspomagającym, umożliwiając poprawne interpretowanie tekstu przez czytniki ekranu.

Pytanie 7

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

A. w sekcji nagłówkowej witryny internetowej

B. w dolnej części witryny internetowej

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

D. pomiędzy znacznikami paragrafu

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
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 8

Która z zasad walidacji strony internetowej jest nieprawidłowa?

A. Jeżeli w poleceniu występuje kilka atrybutów, ich kolejność powinna być uporządkowana alfabetycznie np. ```<img alt="..." src="/.."/>```

B. W tagach nie jest brana pod uwagę różnica między dużymi a małymi literami, np. `````` i `````` to ten sam tag.

C. Wyłączanie tagów musi następować w odwrotnej sekwencji do ich włączenia, np. ``` ... <big>...</big>```

D. Tagi, poza samozamykającymi się, funkcjonują do momentu ich wyłączenia znakiem "/", np. ``` ..```

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź dotycząca kolejności atrybutów w znacznikach HTML jest poprawna, ponieważ nie ma wymogu, aby atrybuty w znacznikach były uporządkowane alfabetycznie. W rzeczywistości, HTML pozwala na dowolną kolejność atrybutów, co czyni tę regułę błędną. Przykładowo, znacznik <img src="/path/to/image.jpg" alt="Opis obrazu" /> jest poprawny niezależnie od kolejności atrybutów. Ważne jest, aby atrybuty były odpowiednio używane w kontekście ich przeznaczenia, a nie w kontekście kolejności alfabetycznej. Dobrą praktyką jest również stosowanie atrybutów w sposób, który zwiększa czytelność kodu, jednak nie jest to wymóg techniczny. Zgodnie z zaleceniami W3C, kluczowym aspektem jest poprawność semantyczna i zgodność ze standardami, a nie kolejność atrybutów.

Pytanie 9

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

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

A. 2 px oraz marginesy zewnętrzne tego obramowania

B. 20 px oraz marginesy zewnętrzne tego obramowania

C. 2 px oraz marginesy wewnętrzne tego obramowania

D. 20 px oraz marginesy wewnętrzne tego obramowania

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
W definicji stylu CSS podano, że sekcja div będzie miała obramowanie o szerokości 2 pikseli oraz marginesy zewnętrzne o wartości 20 pikseli. Obramowanie jest definiowane przez właściwość 'border', gdzie 'solid' oznacza typ obramowania i '2px' to jego szerokość, a 'blue' to kolor. Marginesy zewnętrzne są definiowane za pomocą właściwości 'margin', która w tym przypadku ma wartość 20 pikseli. Jest to odległość między brzegiem obiektu a innymi elementami na stronie. Zrozumienie tych właściwości jest kluczowe w projektowaniu responsywnych i dobrze zorganizowanych układów stron internetowych. Stosując te właściwości, twórcy stron mogą łatwo kontrolować wygląd i odległości między elementami, co jest szczególnie ważne w kontekście użyteczności i estetyki witryny. Przykładowo, jeśli chciałbyś dodać więcej przestrzeni pomiędzy sekcjami, wystarczy zwiększyć wartość 'margin'. Warto również zaznaczyć, że te właściwości są zgodne z aktualnymi standardami CSS, co pozwala na ich wszechstronne wykorzystanie w praktyce.

Pytanie 10

W formularzu umieszczono kontrolki do podania imienia oraz nazwiska. Który z atrybutów odpowiada za wyświetlanie sugestii w polu kontrolki, która znika, gdy użytkownik zaczyna wpisywanie wartości?

<label for="imie">Imię: </label> 
<input id="imie" value="Wpisz dane" title="Wpisz imię"><br>
<label for="nazw">Nazwisko: </label> 
<input id="nazw" placeholder="Wpisz dane" title="Wpisz nazwisko">

A. title

B. value

C. placeholder

D. for

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Atrybut "placeholder" jest kluczowym elementem w formularzach HTML, który definiuje tekst podpowiedzi umieszczony w polu kontrolki. Tekst ten zniknie, gdy użytkownik zacznie wpisywać dane, co pozwala na zapewnienie bardziej intuicyjnego interfejsu. W przypadku przykładowego formularza, atrybut "placeholder" jest użyty w polu nazwiska, co stanowi doskonały przykład jego praktycznego zastosowania. Dobrą praktyką jest stosowanie atrybutu "placeholder" w formularzach, ponieważ wprowadza on klarowność i ułatwia użytkownikom wypełnianie formularzy, jednocześnie zmniejszając ryzyko błędów. Atrybut ten nie tylko poprawia doświadczenia użytkownika, ale także zwiększa dostępność formularzy, ponieważ pozwala osobom korzystającym z czytników ekranu lepiej zrozumieć, jakie dane są wymagane. Warto również zauważyć, że "placeholder" nie powinien być używany jako substytut etykiety, która jest niezbędna do poprawnej dostępności i użyteczności. Etykiety powinny być zawsze stosowane, a "placeholder" powinien pełnić jedynie funkcję pomocniczą.

Pytanie 11

Który z elementów w sekcji head dokumentu HTML 5 jest obowiązkowy według walidatora HTML, a jego niedobór skutkuje błędem (error)?

A. link

B. title

C. style

D. meta

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Znak „title” jest fundamentalnym elementem sekcji head dokumentu HTML, który ma kluczowe znaczenie dla jego poprawnego działania oraz dla doświadczeń użytkowników. Jego obecność jest niezbędna, ponieważ zapewnia tytuł strony, który jest wyświetlany na pasku tytułowym przeglądarki oraz w wynikach wyszukiwania. Tytuł powinien być krótki, ale jednocześnie informacyjny, co pozwala na łatwe zidentyfikowanie zawartości strony. Przykładowo, w przypadku bloga dotyczącego zdrowia, tytuł mógłby brzmieć „Porady zdrowotne – Jak dbać o zdrowie”. Ponadto, zgodnie z wytycznymi W3C, brak tego znacznika jest traktowany jako błąd, co oznacza, że strona nie będzie spełniać standardów HTML5. W praktyce, obecność tytułu wpływa również na SEO (optymalizację pod kątem wyszukiwarek), ponieważ wyszukiwarki często wykorzystują ten element do zrozumienia tematyki strony oraz jej rankingu. Dlatego dobór odpowiednich słów do tytułu jest równie ważny.

Pytanie 12

Aby na witrynie internetowej pokazać logo z przezroczystym tłem, należy użyć formatu

A. BMP

B. JPG

C. CDR

D. PNG

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Format PNG (Portable Network Graphics) jest najbardziej odpowiednim wyborem do wyświetlania logo z przezroczystym tłem na stronie internetowej. Główną zaletą formatu PNG jest jego zdolność do obsługi przezroczystości, co oznacza, że tło logo może być całkowicie przezroczyste, pozwalając na bezproblemowe wkomponowanie go w różnorodne tła. W praktyce oznacza to, że logo w formacie PNG nie będzie miało niepożądanych białych lub kolorowych ramek, co ma kluczowe znaczenie dla estetyki i profesjonalnego wyglądu strony. Dodatkowo, PNG obsługuje wysoką jakość obrazu oraz kompresję bezstratną, co pozwala na zachowanie detali w grafice. Format ten jest powszechnie stosowany w projektowaniu stron internetowych oraz aplikacji mobilnych, zwłaszcza w przypadku ikon i grafik, które wymagają zachowania wyrazistości i przezroczystości. Warto również wspomnieć, że PNG stał się standardem w branży, szczególnie w kontekście użycia w sieci, co czyni go najlepszym wyborem dla projektantów i deweloperów.

Pytanie 13

W CSS określono styl dla paragrafu, który nada mu poniższe cechy:

background-color: red;
color: blue;
margin: 40px;

A. tło w kolorze czerwonym, tekst w kolorze niebieskim, marginesy wewnętrzne o wartości 40px

B. tło w kolorze niebieskim, tekst w kolorze czerwonym, marginesy zewnętrzne o wartości 40px

C. tło w kolorze czerwonym, tekst w kolorze niebieskim, marginesy zewnętrzne o wartości 40px

D. tło w kolorze niebieskim, tekst w kolorze czerwonym, marginesy wewnętrzne o wartości 40px

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
W podanym przykładzie z CSS zastosowano trzy kluczowe właściwości stylizujące element HTML: background-color color oraz margin. Właściwość background-color określa kolor tła danego elementu tutaj przyjęto wartość red co oznacza czerwone tło. Właściwość color definiuje kolor tekstu w elemencie który w tym przypadku jest ustawiony na blue czyli niebieski. Ostatnią właściwością jest margin która odpowiada za marginesy zewnętrzne elementu. Marginesy zewnętrzne to przestrzeń wokół elementu od jego krawędzi do sąsiadujących elementów i w tym przykładzie mają wartość 40px. Takie ustawienia są często używane w praktyce aby zapewnić czytelność i estetykę projektu. Używanie marginesów zewnętrznych to dobra praktyka w celu zachowania odpowiednich odstępów w układzie strony. Warto podkreślić że użycie tych właściwości jest zgodne ze standardami CSS zapewniając kompatybilność z większością przeglądarek. Właściwe stosowanie kolorów i marginesów jest kluczowe w projektowaniu przyjaznym dla użytkownika UX oraz estetycznie spójnych interfejsów graficznych.

Pytanie 14

Jak wygląda poprawny zapis znaczników, który jest zgodny z normami języka XHTML i odpowiada za łamanie linii?

A.

B.

C.

D.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Zapis samozamykającego się znacznika jest poprawny zgodnie z standardem XHTML, który wymaga, aby znaczniki, które nie mają zawartości, były zapisane w sposób, który jednoznacznie wskazuje na ich samozamykającą się naturę. W XHTML każdy znacznik powinien być zamknięty, co oznacza, że nawet tagi samo zamykające się, takie jak , muszą zawierać ukośnik przed zamknięciem znacznika. Daje to pewność, że parsery XHTML poprawnie interpretują kod, co jest szczególnie ważne w kontekście obsługi różnorodnych przeglądarek, które mogą różnie reagować na błędnie sformatowany kod. Przykładem zastosowania jest łamanie linii w tekstach, gdzie chcemy uzyskać efekt nowego wiersza bez tworzenia nowego bloku, co jest typowe w celu zachowania struktury dokumentu HTML. Dobrą praktyką jest zawsze stosowanie poprawnych form zapisów zgodnych z obowiązującymi standardami, co nie tylko wpływa na poprawność działania kodu, ale również na jego czytelność i długoterminową utrzymywaność.

Pytanie 15

Aby stworzyć układ strony z trzema kolumnami obok siebie, można wykorzystać styl CSS

A. C

B. B

C. A

D. D

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Poprawna odpowiedź A wykorzystuje właściwość float CSS ustawioną na left oraz szerokość width na 33 procent co pozwala na umieszczenie trzech kolumn obok siebie na stronie internetowej Float jest często używany do tworzenia układów wielokolumnowych gdyż pozwala na pływające rozmieszczenie elementów blokowych wewnątrz kontenera Dzięki ustawieniu szerokości na 33 procent zapewniamy że trzy kolumny będą mogły się zmieścić obok siebie w jednym rzędzie w ramach dostępnej szerokości kontenera Jest to efektywne podejście w przypadku responsywnych projektów gdzie nie zawsze znamy dokładną szerokość dostępnej przestrzeni Floating jest klasycznym podejściem w CSS i chociaż nowe technologie jak flexbox czy grid oferują więcej możliwości jest wciąż powszechnie stosowany w wielu projektach szczególnie gdy chodzi o proste układy Dodatkowo float left jest zgodny z wielu przeglądarkami co zapewnia większą uniwersalność kodu Przy projektowaniu stron zawsze warto pamiętać o dodaniu clearfix lub overflow hidden do rodzica elementów pływających aby uniknąć problemów z zawijaniem się kontenera wokół elementów pływających

Pytanie 16

Ikona, która pojawia się przed adresem w oknie adresowym przeglądarki internetowej lub przy tytule aktywnej karty, nazywana jest

A. favicon.

B. webicon.

C. iConji.

D. emoticon.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Favicon to mała ikona, która reprezentuje stronę internetową i jest wyświetlana w przeglądarkach internetowych w polu adresowym oraz na kartach z otwartymi stronami. Jest to kluczowy element identyfikacji wizualnej witryny, który może wpływać na wrażenia użytkowników i postrzeganie marki. Favicony są zazwyczaj zapisane w formacie .ico, ale mogą również być w formatach .png, .gif, czy .jpg. Standardowo mają wymiary 16x16 pikseli lub 32x32 pikseli, co czyni je odpowiednimi do wyświetlania na różnych urządzeniach, w tym komputerach i smartfonach. Favicony są dodawane do kodu HTML strony za pomocą tagu <link rel="icon" href="url_do_faviconu" type="image/x-icon">, co pozwala przeglądarkom prawidłowo zidentyfikować i wyświetlić tę ikonę. Przykładem użycia faviconu mogą być popularne strony internetowe, takie jak Google czy Facebook, które wykorzystują swoje unikalne ikony w celu zwiększenia rozpoznawalności marki. Dobrze zaprojektowany favicon może wpłynąć na zwiększenie kliknięć w zakładki oraz poprawić nawigację użytkowników.

Pytanie 17

W CSS, stosowanie poniższego kodu na stronie z kilkoma akapitami, gdzie każdy składa się z kilku linijek, spowoduje, że

p::first-line
 {
     font-size: 150%;
 }

A. pierwszy paragraf na stronie będzie miał powiększoną czcionkę w całości

B. pierwsza linia każdego z paragrafów będzie miała mniejszą wielkość czcionki od pozostałych linii

C. cały tekst w paragrafie zostanie powiększony o 150%

D. pierwsza linia każdego paragrafu będzie miała większą czcionkę niż pozostałe linie

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Zapis CSS p::first-line { font-size: 150%; } używa selektora pseudo-elementu ::first-line który stosuje stylizację do pierwszej linii każdego paragrafu. W tym przypadku zmieniamy rozmiar czcionki pierwszej linii na 150% jej domyślnej wartości co oznacza że będzie ona o 50% większa niż reszta tekstu. Pseudo-element ::first-line jest często stosowany w projektowaniu stron internetowych aby wyróżnić pierwsze zdanie lub akapit co może pomóc w lepszej organizacji treści i zwiększeniu czytelności. Ten sposób formatowania jest zgodny ze standardami CSS i jest wspierany przez większość nowoczesnych przeglądarek internetowych. Takie podejście może być użyteczne w projektach gdzie istotne jest nadanie unikalnego wyglądu nagłówkom sekcji lub wprowadzeniom bez zmieniania struktury HTML. Ważne jest aby pamiętać że ::first-line stosuje się tylko do elementów blokowych takich jak paragrafy co ogranicza jego użycie do tych specyficznych scenariuszy ale jednocześnie pozwala na precyzyjne dostosowanie stylu tekstu w dokumencie.

Pytanie 18

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

A. ACE

B. SVG

C. GIF

D. SWF

Brak odpowiedzi na to pytanie.

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

Pytanie 19

Użycie standardu ISO-8859-2 ma na celu zapewnienie prawidłowego wyświetlania

A. polskich znaków, takich jak: ś, ć, ń, ó, ą

B. symboli matematycznych

C. specjalnych znaków dla języka kodowania strony

D. znaków zarezerwowanych dla języka opisu strony

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Kodowanie w standardzie ISO-8859-2, zwane również Latin-2, zostało zaprojektowane, aby wspierać wyświetlanie znaków z alfabetów używanych w Europie Środkowo-Wschodniej. Jest to szczególnie istotne w kontekście języka polskiego, który wymaga specyficznych znaków diakrytycznych, takich jak ś, ć, ń, ó oraz ą. Standard ten obejmuje 256 znaków, z czego pierwsze 128 jest zgodne z ASCII, natomiast pozostałe 128 to znaki specyficzne dla danego języka. Dzięki temu, w aplikacjach internetowych oraz w systemach operacyjnych, możliwe jest poprawne wyświetlanie tekstów w języku polskim, co wpływa na jakość komunikacji i użyteczność treści. Przykładowo, w dokumentach HTML, użycie deklaracji charset='ISO-8859-2' zapewnia, że przeglądarki internetowe prawidłowo interpretują znaki, co jest kluczowe dla zachowania czytelności i poprawności tekstu. Zgodność z tym standardem jest także istotna w kontekście wymiany danych między różnymi systemami, aby uniknąć problemów związanych z kodowaniem i dekodowaniem tekstu.

Pytanie 20

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

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

B. rysunku osadzonego znacznikiem img

C. tła każdego znacznika akapitu

D. rysunku umieszczonego w tle strony w poziomie

Brak odpowiedzi na to pytanie.

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

Pytanie 21

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

psy
koty
chomiki
świnki morskie
rybki

A. ul li:nth-child(odd) { background-color: DodgerBlue; }

B. ul li:hover { background-color: DodgerBlue; }

C. ul li:nth-child(even) { background-color: DodgerBlue; }

D. ul li:active { background-color: DodgerBlue; }

Brak odpowiedzi na to pytanie.

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

Pytanie 22

Walidator W3C zgłosił błąd walidacji: Zakończony tag p został znaleziony, jednak były otwarte elementy. Który element kodu to dotyczy?

A. Ala ma kota

B. Ala ma kota

C. Ala ma kota

D. Ala ma kota

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Wybrana odpowiedź odnosi się do sytuacji, w której niepoprawnie zamknięto elementy HTML. W niniejszym przykładzie, tag otwarty przed tagiem jest niepoprawnie zamknięty w złą stronę. Poprawny kod HTML powinien najpierw zamknąć element , zanim zamknie element . Oznacza to, że powinien on wyglądać tak: Ala ma kota. Standardy W3C, które dotyczą walidacji HTML, podkreślają znaczenie poprawnego zagnieżdżania elementów. Gdy nieprzestrzegamy tej zasady, pojawią się błędy walidacji, co może prowadzić do problemów z wyświetlaniem strony lub interpretacją przez przeglądarki. Zrozumienie zasad poprawnego zagnieżdżania elementów HTML jest kluczowe, aby tworzyć strony internetowe, które są zarówno semantyczne, jak i dostępne. Dlatego ważne jest, by zawsze zwracać uwagę na poprawną strukturę kodu HTML, co zwiększa jego wydajność i użyteczność.

Pytanie 23

Arkusze stylów w formacie kaskadowym są tworzone w celu

A. nadpisywania wartości znaczników, które już zostały ustawione na stronie

B. ułatwienia formatowania strony

C. połączenia struktury dokumentu strony z odpowiednią formą jej wizualizacji

D. blokowania wszelkich zmian w wartościach znaczników już przypisanych w pliku CSS

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Kaskadowe arkusze stylów (CSS) stanowią kluczowy element w tworzeniu nowoczesnych stron internetowych, umożliwiając deweloperom separację zawartości od stylizacji. Poprawna odpowiedź, dotycząca ułatwienia formatowania strony, odnosi się do głównej funkcji CSS, która polega na umożliwieniu precyzyjnego stylizowania elementów HTML przy użyciu różnych właściwości, takich jak kolor, czcionka, marginesy czy tło. Dzięki CSS, można łatwo zmieniać wygląd całej strony lub jej części, co znacznie upraszcza proces utrzymania i aktualizacji. Na przykład, jeśli chcemy zmienić kolor tła całej witryny, wystarczy zaktualizować jedną regułę w arkuszu stylów, zamiast edytować każdy element osobno. Dodatkowo, CSS wspiera responsywność, co oznacza, że możemy dostosować wygląd strony do różnych rozmiarów ekranów, co jest istotne w dobie urządzeń mobilnych. Takie podejście do rozwijania stron internetowych jest zgodne z najlepszymi praktykami branżowymi, co pozwala na bardziej efektywne zarządzanie projektem oraz zapewnienie spójnego wyglądu witryny.

Pytanie 24

W dokumencie HTML umieszczono tekst sformatowany określonym stylem. Aby wprowadzić w treści kilka słów o zróżnicowanym stylu, należy użyć znacznika

A. <table>

B. <hr>

C. <section>

D.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Znacznik jest używany w HTML do definiowania niewielkich fragmentów tekstu, które można stylizować niezależnie od reszty treści. Przy jego pomocy możemy wprowadzać różne style CSS, co pozwala na skomponowanie bardziej zróżnicowanego wizualnie tekstu. Na przykład, możemy użyć znacznika do podkreślenia ważnych słów w zdaniu, zmieniając ich kolor lub czcionkę. Ważne jest, aby znacznik nie wprowadzał żadnych zmian semantycznych w treści; jest to znacznik czysto stylistyczny. W praktyce, korzystając z CSS, możemy zastosować różne klasy do elementów , co zwiększa elastyczność w zakresie stylizacji. Przykład: ważne słowo może zostać zapisane w arkuszu stylów jako .highlight { background-color: yellow; }. To podejście jest zgodne z zasadami semantycznego HTML oraz wykorzystania CSS, co jest rekomendowaną praktyką w tworzeniu stron internetowych.

Pytanie 25

W instrukcjach mających na celu odtwarzanie dźwięku jako muzyki tła na stronie internetowej NIE stosuje się atrybutu

A. balance="-10"

B. loop="10"

C. volume="-100"

D. href="C:/100.wav"

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź href="C:/100.wav" jest prawidłowa, ponieważ atrybut href jest używany w kontekście linków hipertekstowych, a nie do odtwarzania dźwięku na stronie. W przypadku odtwarzania dźwięku w HTML, odpowiednie tagi to <audio> oraz związane z nimi atrybuty, takie jak src, controls, autoplay, loop, itp. Aby zrealizować odtwarzanie dźwięku jako podkładu muzycznego, używamy tagu <audio src="C:/100.wav" autoplay loop></audio>, co zapewnia, że dźwięk z pliku .wav będzie odtwarzany automatycznie i w pętli. Zgodnie z dobrymi praktykami, pliki audio powinny być dostępne na serwerze i wskazywane względem ich lokalizacji w sieci, co wspiera lepszą wydajność oraz dostępność. Użycie atrybutu href w tym kontekście jest niewłaściwe i może prowadzić do niepoprawnego działania strony, ponieważ przeglądarki nie interpretują tego w kontekście dźwięku. Przykładowo, zamiast href, należy zastosować odpowiednie atrybuty w tagu <audio> zgodnie z aktualnymi standardami HTML5.

Pytanie 26

.format1 {
    …
}

W CSS określono wspólne style dla pewnej grupy elementów. Użycie takich stylów w kodzie HTML odbywa się za pomocą atrybutu:

A. id = "format1"

B. class = "format1"

C. div = "format1"

D. style = "format1"

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Użycie atrybutu class w języku HTML do formatowania grupy znaczników jest zgodne z najlepszymi praktykami web developmentu. Atrybut class pozwala na zastosowanie tej samej definicji stylu CSS do wielu elementów, co jest efektywne i utrzymuje porządek w kodzie. Umożliwia to również łatwą zmianę wyglądu strony poprzez modyfikację tylko jednej definicji CSS zamiast ręcznego edytowania stylów każdego z elementów z osobna. Dzięki takiemu podejściu, programista może szybko aktualizować wygląd całej strony lub jej części bez ryzyka, że pominięte zostaną pojedyncze elementy. Ponadto użycie klas jest zgodne ze standardami W3C, co zapewnia kompatybilność i poprawne renderowanie w różnych przeglądarkach. Praktycznym przykładem zastosowania jest stronie, gdzie wszystkie elementy z klasą .format1 będą miały jednolity wygląd, na przykład wszystkie przyciski na stronie mogą mieć jednakowy kolor i styl. Pozwala to na tworzenie spójnych interakcji użytkownika i ułatwia przyszłą rozbudowę strony o dodatkowe funkcje.

Pytanie 27

Cechy przedstawione w tabeli dotyczą?

Strony ustalają dążenie do konkretnego wyniku
Ważny jest efekt pracy, a nie sposób jej realizacji
Zleceniodawca przekazuje za wykonawcę zaliczkę na podatek dochodowy

A. umowy zlecenia

B. umowy agencyjnej

C. umowy o pracę

D. umowy o dzieło

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Umowa o dzieło to rodzaj umowy cywilnoprawnej, która koncentruje się na osiągnięciu określonego rezultatu pracy, a nie na samym procesie jej wykonywania. Jest to typowy kontrakt, w którym strony uzgadniają konkretny efekt, jaki ma być osiągnięty, na przykład stworzenie projektu architektonicznego, wykonanie rzeźby czy napisanie programu komputerowego. W ramach tego typu umowy, wykonawca, czyli osoba realizująca zamówienie, nie podlega typowym regulacjom dotyczącym czasu pracy, które są charakterystyczne dla umów o pracę. Zleceniodawca zobowiązany jest natomiast do odprowadzenia zaliczki na podatek dochodowy, co odróżnia tę umowę od innych typów umów cywilnoprawnych, takich jak na przykład umowa zlecenia, gdzie obowiązek podatkowy może być regulowany odmiennie. Umowa o dzieło jest często wybierana w sytuacjach, gdzie kluczowe jest dostarczenie konkretnego produktu lub usługi, a czas i sposób realizacji mają mniejsze znaczenie.

Pytanie 28

Aby właściwie przystosować stronę internetową dla osób niewidomych, należy przypisać wyświetlanym za pomocą znacznika img obrazom atrybut

A. style

B. src

C. alt

D. text

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Atrybut 'alt' w znaczniku <img> to naprawdę ważny element, jeśli chodzi o dostępność stron internetowych dla osób niewidomych. Głównie chodzi o to, żeby zapewnić opis obrazka, który mogą zrozumieć technologie asystujące, tak jak czytniki ekranu. Dzięki temu, osoby niewidome mają możliwość dowiedzieć się, co znajduje się na zdjęciu. Na przykład, jeśli mamy zdjęcie czerwonego swetra w sklepie internetowym, to warto wpisać coś takiego jak 'Czerwony sweter z wełny' w tym atrybucie. To też pomaga w SEO, bo wyszukiwarki lubią takie opisy. W skrócie, dobrze jest stosować atrybut 'alt' przy każdym obrazie, by każdy użytkownik mógł zrozumieć treść strony.

Pytanie 29

Podaj nazwę Systemu Zarządzania Treścią, którego logo jest pokazane na dołączonym rysunku?

A. Drupal

B. WordPress

C. Joomla!

D. MediaWiki

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź Joomla! jest poprawna ponieważ logo przedstawione na rysunku jest oficjalnym znakiem identyfikacyjnym tego systemu zarządzania treścią CMS. Joomla! to jeden z najpopularniejszych systemów CMS używany do tworzenia stron internetowych oraz aplikacji. Dzięki swojej elastyczności i dużej liczbie dostępnych rozszerzeń Joomla! pozwala na tworzenie zarówno prostych stron wizytówkowych jak i zaawansowanych serwisów e-commerce. Główne zalety Joomla! to intuicyjny interfejs użytkownika który ułatwia zarządzanie treściami oraz silna społeczność użytkowników zapewniająca wsparcie techniczne i rozwój oprogramowania. Joomla! jest zgodna z wieloma standardami webowymi co czyni ją wszechstronnym narzędziem do wdrażania profesjonalnych projektów internetowych. Korzystanie z Joomla! umożliwia szybkie i efektywne tworzenie responsywnych stron które dobrze współdziałają na różnych urządzeniach mobilnych. Praktyczne zastosowanie Joomla! obejmuje tworzenie stron korporacyjnych portali społecznościowych oraz serwisów informacyjnych. Dzięki modulowej architekturze użytkownicy mogą łatwo dostosowywać funkcjonalność swoich stron do specyficznych potrzeb branżowych co jest zgodne z dobrymi praktykami projektowania zorientowanego na użytkownika. Platforma Joomla! obsługuje także wielojęzyczność i różne metody uwierzytelniania co czyni ją idealnym rozwiązaniem dla międzynarodowych projektów.

Pytanie 30

Jakim znacznikiem można wprowadzić listę numerowaną (uporządkowaną) w dokumencie HTML?

A. <li>

B. <dl>

C. <ul>

D. <ol>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Znacznik <ol> służy do wstawiania list numerowanych (uporządkowanych) w dokumentach HTML. Jego zastosowanie pozwala na tworzenie list, gdzie każdy element jest automatycznie numerowany, co jest szczególnie przydatne w sytuacjach, gdy kolejność elementów ma znaczenie, na przykład w przepisach kulinarnych, instrukcjach czy krokach do wykonania. Warto pamiętać, że elementy listy umieszczane są w znaczniku <li>, który określa każdy pojedynczy wpis na liście. Stosowanie znaczników zgodnych z zaleceniami W3C zapewnia, że strona jest zgodna z zasadami dostępności oraz ułatwia interpretację treści przez wyszukiwarki. Przykład użycia: <ol><li>Krok pierwszy</li><li>Krok drugi</li></ol>, co wygeneruje numerowaną listę z dwoma krokami. Przestrzeganie standardów oraz dobrych praktyk w tworzeniu struktury HTML jest kluczowe dla zapewnienia przejrzystości i efektywności strony internetowej.

Pytanie 31

Który z elementów HTML ma charakter bloku?

A. p

B. img

C. span

D. strong

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Znacznik HTML to absolutna podstawa, jeśli chodzi o tworzenie akapitów w dokumentach. Elementy blokowe, do których się zalicza, zajmują całą szerokość, więc zawsze tworzą nową linię przed i po sobie. Używanie znacznika jest mega ważne, bo to nie tylko poprawia czytelność tekstu, ale i semantykę strony. Na przykład, jak myślisz o SEO, to dobrze zorganizowana struktura dokumentu naprawdę pomaga wyszukiwarkom zrozumieć, o co chodzi na stronie. Zresztą, świetnie współpracuje z CSS, dzięki czemu możesz łatwo ustawić marginesy czy odstępy. W praktyce każdy akapit powinien być zawarty w tym znaczniku, bo dzięki temu oddzielasz go od innych elementów, jak nagłówki czy listy. Pamiętaj jednak, żeby nie zagnieżdżać znacznika w innych blokowych znacznikach, bo to sprzeczne z zasadami HTML5. Jak zrozumiesz i wykorzystasz elementy blokowe, to stworzysz naprawdę dobrze zorganizowaną i semantyczną stronę.

Pytanie 32

Który z poniższych obrazów został sformatowany przy użyciu zaprezentowanego stylu CSS?

A. A

B. C

C. B

D. D

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Odpowiedź A jest prawidłowa, ponieważ zastosowane style CSS dokładnie odzwierciedlają podany kod. Styl img { padding: 5px; border: 1px solid grey; border-radius: 10px; } oznacza, że obrazek otrzymuje wewnętrzny margines o wartości 5 pikseli, szary, jednopikselowy, ciągły obramowanie oraz zaokrąglenie narożników o promieniu 10 pikseli. Efektem tego jest estetyczny wygląd, który umożliwia lepszą prezentację treści graficznych w projektach webowych. Padding pozwala na uzyskanie równowagi wizualnej, natomiast border-radius zapewnia miękkość krawędzi, co jest często stosowane w nowoczesnym web designie. Praktycznym zastosowaniem takich stylów jest m.in. tworzenie kart wizualnych na stronach internetowych, gdzie estetyka i czytelność są kluczowe. Dobrym przykładem jest stosowanie tych technik w responsywnych projektach, gdzie obrazy muszą dobrze współgrać z różnymi elementami interfejsu użytkownika. CSS umożliwia tworzenie atrakcyjnych wizualnie stron, które przyciągają uwagę i poprawiają interakcję użytkownika z treścią.

Pytanie 33

Jak nazywa się element systemu zarządzania treścią, który jest bezpośrednio odpowiedzialny za wygląd strony internetowej?

A. Widżet w systemie WordPress lub moduł w systemie Joomla!

B. Kokpit w systemie WordPress lub panel administracyjny w systemie Joomla!

C. Motyw w systemie WordPress lub szablon w systemie Joomla!

D. Wtyczka w systemie WordPress lub dodatek w systemie Joomla!

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Motyw w systemie WordPress oraz szablon w systemie Joomla! odgrywają kluczową rolę w kreowaniu wizualnej tożsamości witryny internetowej. To właśnie one determinują, jak treści są prezentowane użytkownikom - od układu graficznego, przez kolory, czcionki, aż po elementy interaktywne. Dzięki motywom użytkownicy mogą wykorzystywać gotowe rozwiązania, co znacząco przyspiesza proces tworzenia strony. W przypadku WordPressa, motyw można łatwo zmieniać, co pozwala na dynamiczne dostosowywanie wyglądu witryny do zmieniających się trendów i potrzeb. Z kolei w Joomla!, szablony zapewniają elastyczność i możliwość personalizacji, co jest kluczowe dla dostosowania się do różnych grup docelowych. Dobrze zaprojektowane motywy i szablony powinny być zgodne z zasadami responsywnego web designu, co oznacza, że strona powinna wyglądać dobrze na różnych urządzeniach i rozdzielczościach ekranu. Warto również zwrócić uwagę na optymalizację SEO, która może być wpływana przez wybór motywu. Właściwy wybór oraz umiejętne wykorzystanie motywów i szablonów jest fundamentem skutecznego zarządzania treścią w sieci.

Pytanie 34

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

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
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 35

Narzędzie zaprezentowane na ilustracji służy do

A. walidacji kodu HTML i XHTML

B. debugowania strony internetowej

C. sprawdzania zgodności witryny ze standardem HTML5

D. walidacji stylów CSS

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Narzędzie przedstawione na ilustracji to usługa walidacji CSS stworzona przez World Wide Web Consortium (W3C). Jego głównym celem jest sprawdzanie poprawności arkuszy stylów CSS pod kątem zgodności z obowiązującymi standardami. Walidacja CSS pozwala na identyfikację błędów składniowych oraz niepoprawnych wartości, co jest kluczowe dla zapewnienia spójności wyglądu strony w różnych przeglądarkach. Korzystanie z walidatora CSS jest częścią dobrych praktyk w procesie tworzenia stron internetowych, ponieważ poprawny kod CSS zwiększa dostępność i użyteczność serwisów. Praktycznym przykładem użycia tego narzędzia jest proces optymalizacji strony internetowej, gdzie walidator pomaga w eliminacji błędów, które mogą prowadzić do nieprzewidywalnego zachowania witryny. Dzięki walidacji możemy również upewnić się, że nasze arkusze stylów są zgodne z najnowszymi standardami, co jest istotne dla przyszłej kompatybilności serwisu.

Pytanie 36

Jakie zasady dotyczące tworzenia sekcji w języku HTML są właściwe?

A. W sekcji <head> nie wolno umieszczać kodu CSS, tylko odniesienie do pliku CSS

B. W sekcji <head> można ustalać szablon strony za pomocą znaczników <div>

C. W sekcji <head> znajduje się sekcja <body>

D. W sekcji <head> mogą się pojawić znaczniki <meta>, <title>, <link>

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Wybór odpowiedzi, że w części <head> mogą wystąpić znaczniki <meta>, <title>, <link> jest jak najbardziej poprawny. Część <head> dokumentu HTML jest kluczowa dla określenia właściwości oraz meta-informacji o stronie. Znacznik <meta> służy do przechowywania danych o stronie, takich jak opis, słowa kluczowe czy konfiguracja kodowania. Znacznik <title> definiuje tytuł strony, który jest wyświetlany na karcie przeglądarki oraz w wynikach wyszukiwania, co jest istotne dla SEO. Z kolei znacznik <link> pozwala na połączenie dokumentu HTML z zewnętrznymi arkuszami stylów CSS lub innymi zasobami. Stosowanie tych znaczników jest zgodne z obowiązującymi standardami W3C oraz najlepszymi praktykami w zakresie tworzenia stron internetowych. Dobrze zorganizowana sekcja <head> wpływa na efektywność i widoczność strony w wyszukiwarkach, a także na jej ogólną jakość. Przykładem użycia może być dodanie metadanych do strony internetowej, co pozwala na lepsze pozycjonowanie w wyszukiwarkach oraz ułatwia zarządzanie stylem poprzez odwołanie do pliku CSS.

Pytanie 37

Wskaż blok, który jest sformatowany zgodnie z podanym stylem CSS.

background: linear-gradient(to right, LightBlue, DarkBlue);

A. Blok 4

B. Blok 3

C. Blok 1

D. Blok 2

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Blok 2 jest poprawną odpowiedzią ponieważ wykorzystuje styl CSS background linear-gradient(to right LightBlue DarkBlue) co oznacza że gradient kolorów rozciąga się od lewej do prawej strony elementu CSS linear-gradient pozwala na tworzenie gładkich przejść między kolorami co jest popularną techniką w projektowaniu stron internetowych Styl ten dodaje wizualnej atrakcyjności i może być użyty w różnych częściach witryny takich jak przyciski nagłówki czy tła sekcji Właściwość gradientu pozwala na zastosowanie wielu kolorów i kontrolowanie ich punktów początkowych i końcowych co zwiększa elastyczność projektowania Ponadto gradienty są wspierane przez wszystkie nowoczesne przeglądarki co czyni je doskonałym wyborem dla responsywnych stron internetowych Wykorzystanie gradientów zamiast obrazów tła pomaga także w optymalizacji strony zmniejszając czas ładowania co jest zgodne z najlepszymi praktykami branżowymi i wpływa pozytywnie na doświadczenie użytkownika CSS oferuje również inne typy gradientów takie jak radial-gradient i conic-gradient które mogą być używane w zależności od potrzeb projektowych

Pytanie 38

Czy automatyczna weryfikacja właściciela witryny korzystającej z protokołu HTTPS jest możliwa dzięki

A. prywatnym kluczom

B. danym kontaktowym zamieszczonym na stronie

C. informacjom whois

D. certyfikatowi SSL

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Certyfikat SSL (Secure Sockets Layer) jest kluczowym elementem w automatycznej weryfikacji właściciela strony internetowej, który jest udostępniany przez protokół HTTPS. Głównym zadaniem certyfikatu SSL jest zapewnienie, że komunikacja między przeglądarką a serwerem jest zaszyfrowana oraz że tożsamość serwera została potwierdzona przez zaufaną stronę trzecią, czyli urząd certyfikacji (CA - Certificate Authority). Certyfikaty SSL są wydawane po przeprowadzeniu odpowiednich weryfikacji tożsamości wnioskodawcy, co może obejmować sprawdzenie danych WHOIS, ale również inne procesy weryfikacyjne, takie jak potwierdzenie adresu e-mail lub dokumentów właściciela firmy. Przykładowo, witryny e-commerce korzystają z certyfikatów SSL, aby zapewnić bezpieczeństwo transakcji finansowych, co zwiększa zaufanie użytkowników do sklepu. Na poziomie technicznym, certyfikat SSL implementuje protokoły kryptograficzne, takie jak TLS (Transport Layer Security), co nie tylko zabezpiecza transmisję danych, ale także umożliwia autoryzację strony. W praktyce, posiadanie certyfikatu SSL wpływa również na pozycjonowanie w wyszukiwarkach, ponieważ Google promuje strony z bezpiecznym połączeniem HTTPS.

Pytanie 39

Na obrazie przedstawiono projekt układu bloków witryny internetowej. Zakładając, że bloki są realizowane za pomocą znaczników sekcji, ich formatowanie w CSS, oprócz ustawionych szerokości, powinno zawierać właściwość

BLOK 1		BLOK 2
BLOK 3	BLOK 4
BLOK 5

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

B. clear: both dla bloku 5 oraz float: left jedynie dla 1 i 2 bloku.

C. clear: both dla wszystkich bloków.

D. float: left dla wszystkich bloków.

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Dobra robota, odpowiedź jest na pewno poprawna! Żeby uzyskać taki układ bloków jak na obrazku, musisz użyć w CSS `float: left` dla wszystkich bloków. To świetny sposób na ułożenie elementów w poziomie. Jak bloki mają stałą szerokość, to wtedy ułożą się obok siebie od lewej do prawej, tak jak na rysunku. To narzędzie jest naprawdę przydatne dla web developerów, zwłaszcza kiedy pracują nad responsywnymi layoutami. Warto pamiętać, że `float: left` zadziała tylko wtedy, gdy bloki mają określoną szerokość. Jeśli jej nie ustawisz, to mogą się nieustawić tak jakbyś chciał. Wtedy trzeba pomyśleć o innych opcjach, jak Flexbox czy CSS Grid.

Pytanie 40

Do którego akapitu przypisano podaną właściwość stylu CSS?
border-radius: 20%;

A. Rys. D

B. Rys. C

C. Rys. B

D. Rys. A

Brak odpowiedzi na to pytanie.

Wyjaśnienie poprawnej odpowiedzi:
Właściwość CSS border-radius służy do zaokrąglania rogów elementu na stronie internetowej. W przypadku wartości procentowej jak 20% zaokrąglenie jest obliczane w stosunku do wymiarów elementu co pozwala na uzyskanie proporcjonalnego wyglądu niezależnie od rozmiaru ramki. Wybranie odpowiedzi Rys. B jest poprawne ponieważ widoczny jest tam efekt zaokrąglonych rogów co jednoznacznie wskazuje na zastosowanie border-radius. Takie stylizacje są powszechnie używane w projektowaniu nowoczesnych interfejsów użytkownika aby nadać im bardziej miękki i przyjazny wygląd. Dobre praktyki projektowe zalecają umiarkowane stosowanie zaokrągleń aby nie przesadzić z efektami wizualnymi co mogłoby pogorszyć czytelność i funkcjonalność. Warto również pamiętać o aspekcie responsywności – używanie wartości procentowych pozwala na lepsze dostosowanie się do różnych rozdzielczości ekranów co jest kluczowe w nowoczesnym web designie. Dzięki border-radius można także tworzyć zaawansowane efekty graficzne łącząc go z innymi właściwościami CSS jak cienie czy gradienty co pozwala na osiągnięcie atrakcyjnych wizualnie elementów bez potrzeby użycia obrazów.

Rozpocznij nowy egzamin

Powrót do strony głównej