Wyniki egzaminu

Informacje o egzaminie:
  • Zawód: Technik informatyk
  • Kwalifikacja: INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych
  • Data rozpoczęcia: 17 grudnia 2025 13:50
  • Data zakończenia: 17 grudnia 2025 14:02

Egzamin zdany!

Wynik: 31/40 punktów (77,5%)

Wymagane minimum: 20 punktów (50%)

Pochwal się swoim wynikiem!
Szczegółowe wyniki:
Pytanie 1

Który z akapitów został sformatowany zgodnie z przedstawionym stylem, zakładając, że pozostałe właściwości akapitu mają wartości domyślne?

Ilustracja do pytania
A. Odpowiedź A
B. Odpowiedź C
C. Odpowiedź B
D. Odpowiedź D
Paragraf oznaczony jako C został poprawnie sformatowany według przedstawionego stylu CSS. Styl ten określa kilka kluczowych właściwości: padding na poziomie 20 pikseli, kolor tekstu jako niebieski, pogrubienie tekstu ustawione na 900 oraz obramowanie o grubości 1 piksela z pełną linią. Padding określa wewnętrzne wcięcie, które wpływa na zwiększenie odległości między tekstem a krawędzią kontenera, co widać w odpowiedzi C jako przestrzeń wokół tekstu. Kolor tekstu zmienia się na niebieski, co również jest zgodne z wyglądem tej odpowiedzi. Font-weight ustawiony na 900 oznacza, że tekst powinien być wyraźnie pogrubiony, co jest zauważalne w porównaniu do innych opcji. Obramowanie wokół tekstu jest delikatne, ale widoczne, co odpowiada deklaracji border: 1px solid. Te właściwości są zgodne z powszechnymi praktykami projektowania stron internetowych, gdzie czytelność i estetyka odgrywają kluczową rolę. Praktyczne zastosowanie takich reguł CSS można znaleźć w projektowaniu intuicyjnych interfejsów użytkownika, gdzie spójność stylów ułatwia nawigację.

Pytanie 2

Jakie będzie efektem zastosowanego formatowania CSS dla nagłówka trzeciego stopnia

<style> h3 { background-color: grey; } </style>

<h3 style="background-color: orange;">Rozdział 1.2.2.</h3>

A. kolor tekstu będzie pomarańczowy
B. tło nagłówka będzie pomarańczowe
C. tło nagłówka będzie w odcieniu szarości
D. kolor tekstu będzie szary
Odpowiedź, że tło będzie pomarańczowe, jest jak najbardziej trafna. W kodzie HTML użyto atrybutu "style" w tagu <h3>, który ma wyższy priorytet niż to, co jest zapisane w sekcji <style>. Wartość background-color to "orange", więc tło nagłówka trzeciego stopnia naprawdę będzie pomarańczowe. Znamy zasady kaskadowych arkuszy stylów, które mówią, że style bezpośrednio przypisane do elementów HTML mają pierwszeństwo. Kiedy chcemy, aby nagłówki miały różne kolory w zależności od tego, gdzie są użyte, inline styles są bardzo przydatne – zwłaszcza w prototypach. Ale z drugiej strony, z mojego doświadczenia, nadmiar inline styles może skomplikować późniejsze zarządzanie kodem, dlatego lepiej trzymać się klas CSS, żeby wszystko było bardziej uporządkowane.

Pytanie 3

W języku HTML kolor biały można przedstawić przy użyciu wartości

A. #000000
B. rgb(255,255,255)
C. rgb(FFFF,FF)
D. #255255
Biały kolor w HTML zapisujemy jako rgb(255,255,255). W systemie RGB kolory tworzą się z trzech podstawowych barw: czerwonej, zielonej i niebieskiej. Każda z nich ma wartość od 0 do 255, więc maksymalna intensywność danego koloru to 255, a najniższa to 0. W przypadku białego koloru wszystkie trzy barwy są na maksa, stąd właśnie rgb(255,255,255) oznacza pełną moc czerwonego, zielonego i niebieskiego, co razem daje kolor biały. Wartości RGB są super ważne w CSS i w różnych programach do grafiki. Moim zdaniem, warto je znać, bo to podstawy przy robieniu stron internetowych. Warto też zwrócić uwagę na standardy W3C dotyczące kolorów w HTML, bo pomagają zadbać o estetykę i dostępność stron.

Pytanie 4

Podczas przygotowywania grafiki do umieszczenia na stronie internetowej konieczne jest wycięcie tylko pewnego fragmentu. Jak nazywa się ta czynność?

A. zmiana rozmiaru.
B. łączanie warstw.
C. kadrowanie.
D. odwracanie obrazu.
Kadrowanie to taka technika, która pomaga nam lepiej uchwycić to, co najważniejsze w obrazie. Wycinając niektóre fragmenty grafiki, skupiamy uwagę na tym, co naprawdę się liczy. Dobrze jest to mieć na uwadze, zwłaszcza przy zdjęciach portretowych, gdzie chcemy, żeby wzrok przyciągała twarz modela, a nie jakieś niepotrzebne tło. Kiedy kadrujemy, warto pamiętać o takich zasadach jak zasada trzecich, bo to pomaga zrobić fajną kompozycję. Można to robić w wielu programach graficznych, jak na przykład Adobe Photoshop czy GIMP. Tak w ogóle, dobrze jest dbać o proporcje i rozdzielczość, żeby obraz nie stracił na jakości. Gadżetem kadrowania można się też posługiwać w projektowaniu stron www, bo odpowiednie wybory graficzne poprawiają estetykę i funkcjonalność strony.

Pytanie 5

W języku CSS zdefiniowano następujące formatowanie:

 h1 i {color: red;}
Kolorem czerwonym zostanie zapisany
A. tylko tekst pochylony we wszystkich poziomach nagłówków.
B. tylko tekst pochylony nagłówka pierwszego stopnia.
C. cały tekst nagłówka pierwszego stopnia oraz pochylony tekst akapitu.
D. cały tekst nagłówka pierwszego stopnia oraz cały tekst pochylony, niezależnie od tego, w którym miejscu strony się znajduje.
Prawidłową odpowiedzią jest, że kolorem czerwonym zostanie zapisany tylko tekst pochylony nagłówka pierwszego stopnia. W CSS, gdy mówimy o selektorach potomków, odnosimy się do elementów, które są bezpośrednio lub niebezpośrednio umieszczone wewnątrz innego elementu. W przedstawionym kodzie CSS: h1 i {color: red;}, selektor pochylonego tekstu (<i>) wewnątrz nagłówka pierwszego stopnia (<h1>) jest selektorem potomka. Oznacza to, że reguła dotyczy tylko tych elementów <i> , które są umieszczone wewnątrz elementu <h1>. Właściwość 'color: red;' zmienia kolor tych elementów na czerwony. Istotne jest zrozumienie, że ta reguła nie wpływa na inne elementy strony, takie jak zwykły tekst w nagłówku h1 czy tekst pochylony w innych miejscach dokumentu. W praktyce, nauka zrozumienia i stosowania selektorów potomków w CSS jest kluczowa dla skutecznego i precyzyjnego formatowania elementów na stronie.

Pytanie 6

W języku HTML, aby uzyskać następujący efekt formatowania, należy zapisać kod:

pogrubiony pochylony lub w górnym indeksie

A. <i>pogrubiony </i><b>pochylony</b> lub w <sub>górnym indeksie</sub>
B. <i>pogrubiony <b>pochylony lub w </i><sup>górnym indeksie</sup>
C. <b>pogrubiony <i>pochylony</i></b> lub w <sub>górnym indeksie</sub>
D. <b>pogrubiony </b><i>pochylony</i> lub w <sup>górnym indeksie</sup>
Pozostałe odpowiedzi zawierają nieprawidłowe użycie tagów HTML. Tagi HTML są kluczowe podczas formatowania tekstu i każdy z nich ma specyficzne zastosowanie. Użycie tagu <b> w połączeniu z <i> w obrębie tego samego tagu do pochylonego tekstu, jak w odpowiedzi nr 3, jest niepoprawne. Tekst będzie pogrubiony, ale nie będzie pochylony. Podobnie, użycie tagu <i> przed tagiem <b> do pogrubienia tekstu, jak w odpowiedzi nr 2, jest błędem. Tekst będzie pochylony, ale nie będzie pogrubiony. Odpowiedź nr 4 zawiera tag <sup> użyty w niewłaściwym miejscu - jest on użyty do pochylenia tekstu, a nie do wyświetlenia go jako tekst górnego indeksu. W przypadku tagu <sub> używanego w odpowiedzi nr 2 i 3, służy on do wyświetlania tekstu jako dolnego indeksu, a nie górnego. Błędy te pokazują, jak ważne jest zrozumienie i prawidłowe użycie tagów HTML podczas tworzenia stron internetowych.

Pytanie 7

Wskaż fragment kodu HTML5, który zostanie uznany przez walidator za niepoprawny?

A. <p class="stl" style="color: #F00">tekst</p>
B. <p class="stl"><style>.a{color:#F00}</style>tekst</p>
C. <p class="stl">tekst</p>
D. <p class="stl" id="a">tekst</p>
Odpowiedzi <p class="stl" id="a">tekst</p>, <p class="stl" style="color: #F00">tekst</p> oraz <p class="stl">tekst</p> są poprawne i zgodne z standardami HTML5. Element <p> jest ogólnym znacznikiem używanym do definiowania paragrafów, a jego właściwe użycie obejmuje dodanie klas i identyfikatorów, co może być przydatne do stylizacji i skryptów. Użycie klasy 'stl' w pierwszym przykładzie pozwala na łatwe stylizowanie tego elementu w arkuszach stylów, co jest zgodne z zasadami modularności i ponownego użycia kodu. W przypadku drugiego przykładu, zastosowanie atrybutu style pozwala na bezpośrednie zastosowanie stylu, co jest właściwym podejściem w kontekście prostych aplikacji, chociaż w praktyce lepiej jest unikać inline styles ze względu na trudności w utrzymaniu kodu. Ostatni przykład, czyli <p class="stl">tekst</p>, nie zawiera żadnych dodatkowych atrybutów, ale także jest poprawny i może być używany w wielu kontekstach, gdzie stylizacja nie jest wymagana. Błędne jest myślenie, że elementy HTML5 są jedynie kontenerami treści - ich semantyka i zastosowanie klasy, identyfikatorów oraz stylów mają kluczowe znaczenie dla efektywności i organizacji kodu, co powinno być brane pod uwagę przy projektowaniu stron internetowych.

Pytanie 8

Jakie znaczniki <header>, <article>, <section>, <footer> są typowe dla języka

A. style="margin-bottom: 0cm;">XHTML 1.1
B. HTML 4.01 Transitional
C. style="margin-bottom: 0cm;">HTML 4.01 Strict
D. style="margin-bottom: 0cm;">HTML 5
Znaczniki <header>, <article>, <section> oraz <footer> są częścią standardu HTML5, który wprowadza nowe semantyczne elementy, mające na celu poprawę struktury dokumentów HTML. Element <header> używany jest do definiowania nagłówków sekcji lub całej strony, co ułatwia nawigację i zrozumienie układu treści. <article> natomiast służy do oznaczania samodzielnych jednostek treści, które mogą być niezależnie dystrybuowane lub zrozumiane. <section> dzieli dokument na tematyczne sekcje, a <footer> zazwyczaj zawiera informacje o autorze, prawach autorskich czy linki do powiązanych materiałów. Stosowanie tych elementów zgodnie z ich przeznaczeniem sprzyja lepszej dostępności oraz optymalizacji SEO, ponieważ wyszukiwarki mogą lepiej interpretować strukturę strony. Przykładem zastosowania może być blog, w którym każdy post jest oznaczony jako <article>, co pozwala systemom wyszukiwania na łatwiejsze indeksowanie poszczególnych wpisów. Warto pamiętać, że HTML5 wspiera także inne aspekty nowoczesnego web designu, takie jak media, formularze i API, co czyni go standardem przyszłości.

Pytanie 9

W kodzie CSS stworzono cztery klasy stylizacji, które zostały wykorzystane do formatowania akapitów. Efekt widoczny na ilustracji uzyskano dzięki zastosowaniu klasy o nazwie

Ilustracja do pytania
A. format4
B. format1
C. format2
D. format3
Odpowiedź format2 jest poprawna, ponieważ stylizacja zastosowana do tekstu na obrazie to line-through, co oznacza przekreślenie. W CSS właściwość text-decoration pozwala na dodawanie różnych dekoracji do tekstu, takich jak underline (podkreślenie), overline (nadkreślenie) czy line-through (przekreślenie). Przekreślenie jest często używane do zaznaczania usuniętego tekstu lub do pokazywania zmian w dokumentach, co jest zgodne z dobrą praktyką w edytorach tekstu i aplikacjach do śledzenia zmian. W kodzie HTML klasy CSS są zazwyczaj stosowane poprzez dodanie atrybutu class do odpowiedniego elementu. Użycie klasy format2 w kodzie HTML wyglądałoby jak <p class='format2'>. Wielu projektantów korzysta z takich dekoracji, aby poprawić czytelność i funkcjonalność stron internetowych, zapewniając użytkownikom intuicyjne oznaczenia wizualne. Ważne jest także użycie semantycznego HTML, co w połączeniu z odpowiednimi stylami CSS pozwala tworzyć dostępne dla użytkowników strony internetowe zgodne ze standardami W3C.

Pytanie 10

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

To jest przykładowy akapit.

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

Pytanie 11

Kolor zielony w skróconej notacji szesnastkowej można zapisać w CSS jako sekwencję

A. #0F0
B. #00F
C. #FFF
D. #F00
Pierwsza z niepoprawnych odpowiedzi to #F00, która reprezentuje kolor czerwony w notacji szesnastkowej. W tej notacji, kanał czerwony ma maksymalną wartość (FF), podczas gdy kanały zielony i niebieski są ustawione na 0. To sprawia, że każdy element stylizowany tym kolorem będzie miał intensywny odcień czerwonego, co jest całkowicie sprzeczne z definicją koloru zielonego. Kolejna niepoprawna odpowiedź to #00F, która przedstawia kolor niebieski. W tym przypadku kanał niebieski ma maksymalną wartość, a kanały czerwony i zielony są ustawione na 0. Ta kombinacja skutkuje ciemnym niebieskim odcieniem, czym także nie można nazwać koloru zielonego. Ostatnia niepoprawna odpowiedź to #FFF, która reprezentuje kolor biały, a nie zielony. W tym przypadku wszystkie trzy kanały (czerwony, zielony, niebieski) mają maksymalne wartości, co skutkuje brakiem koloru dominującego i efektem białym. Każda z tych wartości w notacji szesnastkowej jest istotna dla zrozumienia, jak kolory są definiowane w CSS i jak można nimi manipulować, jednak żadna z tych odpowiedzi nie odpowiada na pytanie o kolor zielony.

Pytanie 12

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

A. HTML4
B. XHTML 2.0
C. XHTML1.0
D. HTML5
Tak, znaczników <footer>, <header> i <nav> zaczęto używać w HTML5, który zadebiutował w październiku 2014 roku. To jest ciekawe, bo HTML5 wprowadził sporo nowych semantycznych elementów, które pomagają w lepszej organizacji dokumentów HTML. Dzięki nim, przeglądarki i roboty wyszukiwarek mogą lepiej zrozumieć strukturę stron. Na przykład, <header> to nagłówek strony lub sekcji, <nav> tworzy menu nawigacyjne, a <footer> to stopka. Myślę, że to super sprawa, bo poprawia dostępność strony i jej SEO, bo tak naprawdę pomaga wyszukiwarkom w lepszym indeksowaniu treści, co może prowadzić do lepszych wyników w wyszukiwarkach. Dodatkowo, HTML5 ma też inne ciekawe nowinki, jak wsparcie dla multimediów, lokalne przechowywanie danych, a także lepszą kompatybilność z aplikacjami mobilnymi, więc zdecydowanie warto go wykorzystywać do budowy stron internetowych.

Pytanie 13

W języku HTML, aby stworzyć pole do wprowadzania hasła, w którym tekst jest maskowany (zastąpiony kropeczkami), należy zastosować znacznik

A. <input name="password" />
B. <form input type="password" />
C. <form="password" type="password" />
D. <input type="password" />
Aby utworzyć pole edycyjne do wpisywania hasła w HTML, należy użyć znacznika <input> z atrybutem type ustawionym na 'password'. Taki typ pola edycyjnego zapewnia, że wprowadzany tekst jest maskowany, co w praktyce oznacza, że jest on wyświetlany jako kropki lub gwiazdki, co znacząco podnosi poziom bezpieczeństwa. Stosując <input type='password' />, zalecane jest również dodanie atrybutu name, co ułatwi przesyłanie danych na serwer. Warto zwrócić uwagę, że zgodnie z tym, co definiuje specyfikacja HTML5, pole to jest standardowo obsługiwane przez wszystkie nowoczesne przeglądarki. Przykład użycia: <input type='password' name='user_password' placeholder='Wpisz swoje hasło' />. Ponadto, dobrym praktyką jest stosowanie odpowiednich mechanizmów walidacji po stronie serwera, aby upewnić się, że dane przesyłane z formularzy są bezpieczne i chronione przed nieautoryzowanym dostępem. Maskowanie hasła w polach edycyjnych jest kluczowym elementem ochrony danych użytkowników w aplikacjach internetowych oraz stronach, które wymagają logowania.

Pytanie 14

Wskaż, jaki błąd walidacyjny zawiera przedstawiony fragment kodu w języku HTML 5.

<h6>CSS</h6>
<p>Kaskadowe arkusze stylów (<b>ang. <i>Cascading Style Sheets</b></i>)<br>to język służący ...</p>
A. Znacznik br nie powinien znajdować się wewnątrz znacznika p
B. Znacznik h6 nie jest używany w HTML5
C. Znacznik zamykający /b jest niezgodny z zasadą zagnieżdżania
D. Znacznik br nie został prawidłowo zamknięty
W analizowanym fragmencie kodu HTML, znacznik zamykający /b jest niezgodny z zasadą zagnieżdżania. W prawidłowej konstrukcji HTML, znaczniki powinny być zamykane w odwrotnej kolejności do ich otwierania — nazywa się to zasadą LIFO (Last In, First Out). W przedstawionym kodzie, znacznik <b> jest otwierany przed znacznikiem <i>, ale zamykany po nim, co jest błędem strukturalnym. Poprawny zapis powinien wyglądać tak: <b><i>Cascading Style Sheets</i></b>. Ważne jest, aby zawsze pamiętać o poprawnej strukturze dokumentu HTML, ponieważ nieprzestrzeganie tej zasady może prowadzić do nieprzewidywalnych wyników renderowania na różnych przeglądarkach. Zasada ta jest kluczowa w zapewnieniu, że znaczniki są zagnieżdżone poprawnie i że style oraz skrypty działają zgodnie z oczekiwaniami. Tego rodzaju błędy mogą również negatywnie wpływać na dostępność strony dla użytkowników korzystających z czytników ekranowych.

Pytanie 15

Rozmiary ekranu w formacie 16:9 (zakładając, że piksel jest kwadratem) można osiągnąć przy rozdzielczości

A. 1366 na 768 pikseli
B. 800 na 480 pikseli
C. 2560 na 2048 pikseli
D. 320 na 240 pikseli
Inne podane rozdzielczości, takie jak 320 na 240 pikseli, 800 na 480 pikseli oraz 2560 na 2048 pikseli, nie spełniają wymogu proporcji 16:9, co skutkuje niewłaściwym wyświetleniem obrazu. Proporcje 320 na 240 pikseli to 4:3, co oznacza, że ​​jest to starszy format, stosowany głównie w telewizorach CRT i niektórych wideo w internecie. Przy takim formacie, film emitowany w trybie panoramicznym może być wyświetlany z czarnymi pasami u góry i dołu ekranu, co jest niepożądane w przypadku współczesnych produkcji. Z kolei rozdzielczość 800 na 480 pikseli również nie odpowiada proporcji 16:9, a jej stosunek wynosi około 1,67, co czyni ją bardziej zbliżoną do 15:9. Na koniec, 2560 na 2048 pikseli, mimo że ma dużą rozdzielczość, tworzy stosunek 5:4, co w przypadku wyświetlania nowoczesnych treści wideo również prowadzi do problemów z proporcjami. W przypadku projektów multimedialnych, nieprzestrzeganie standardów proporcji może prowadzić do negatywnych wrażeń wizualnych oraz obniżenia jakości prezentacji, dlatego ważne jest, aby dobrze zrozumieć, jakie proporcje są odpowiednie dla konkretnego zastosowania.

Pytanie 16

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

A. nazwa czcionki
B. koloru czcionki
C. rozmiaru czcionki
D. efektów czcionki
Pierwsza z niepoprawnych odpowiedzi sugeruje, że parametr face służy do określenia barwy czcionki. Jest to błędne, ponieważ kolor tekstu w HTML ustala się za pomocą innego parametru – 'color'. Możemy na przykład użyć znacznika <font color='red'>tekst</font>, aby ustawić kolor tekstu na czerwony. Parametr face nie ma związku z kolorystyką, a jego jedynym celem jest określenie konkretnej czcionki, co jest kluczowe dla typografii na stronach internetowych. Kolejna niepoprawna odpowiedź wskazuje na efekty czcionki, co również jest mylące. Efekty takie jak pogrubienie, kursywa czy podkreślenie są osiągane dzięki zastosowaniu odpowiednich stylów CSS lub atrybutów w tagach HTML, takich jak <b>, <i>, czy <u>. Parametr face nie wprowadza żadnych efektów, a jedynie wskazuje, jaką czcionkę należy zastosować. Ostatnia niepoprawna odpowiedź odnosi się do wielkości czcionki, co również jest nieprawidłowe. W HTML rozmiar czcionki ustala się za pomocą atrybutu 'size' w tagu <font>, co jest znacznie bardziej ograniczone i mniej elastyczne niż nowoczesne podejścia z CSS. W CSS możemy zdefiniować rozmiar czcionki za pomocą właściwości 'font-size', co umożliwia precyzyjne dostosowanie wielkości tekstu, a także łatwą zmianę przez wykorzystanie jednostek względnych. Podsumowując, niepoprawne odpowiedzi mylą się co do funkcji parametru face, który nie ma związku z kolorem, efektami czy wielkością czcionki.

Pytanie 17

W języku HTML, aby osiągnąć efekt pogrubienia, kursywy lub zapisu w górnym indeksie, należy wpisać kod:

A. <b>pogrubiony <i>pochylony</i></b> lub w <sub>górnym indeksie</sub>
B. <b>pogrubiony </b><i>pochylony</i> lub w <sup>górnym indeksie</sup>
C. <i>pogrubiony <b>pochylony lub w </i><sup>górnym indeksie</sup>
D. <i>pogrubiony </i><b>pochylony</b> lub w <sub>górnym indeksie</sub>
Wybrane odpowiedzi zdają się sugerować nieprawidłowe zastosowanie tagów HTML, co może prowadzić do nieodpowiedniego formatowania tekstu. W pierwszym przypadku tag <i> został użyty do pogrubienia tekstu, co jest błędne, ponieważ <i> powinien być używany do wyświetlania tekstu w kursywie. Pogrubienie powinno być realizowane wyłącznie za pomocą tagu <b>. Z kolei w trzecim przykładzie, połączenie tagów <b> i <i> w jednym elemencie może prowadzić do nieczytelności i zamieszania, ponieważ nie jest jasne, jaki efekt został zamierzony. Takie praktyki są sprzeczne z zasadami semantyki HTML, która kładzie nacisk na logiczne i poprawne użycie tagów w celu zachowania czytelności oraz SEO. Tag <sub> w odpowiedziach jest poprawnie użyty, jednak zastosowanie go w kontekście górnego indeksu jest błędne; tu powinien być użyty <sup>. Warto zwrócić uwagę, że stosowanie niewłaściwych tagów HTML prowadzi do złego renderowania strony przez przeglądarki i może ograniczać dostępność treści dla użytkowników z ograniczeniami, co jest niezgodne z najlepszymi praktykami projektowania stron internetowych. W związku z tym, ważne jest, aby zrozumieć funkcje każdego tagu i stosować je odpowiednio, by poprawić zarówno estetykę, jak i funkcjonalność strony.

Pytanie 18

Który z elementów HTML stanowi blokowy znacznik?

A. img
B. strong
C. span
D. p
Wybór znaczników takich jak <img>, <span> oraz <strong> jako elementów blokowych jest nieprawidłowy z kilku powodów. Znacznik <img> jest elementem, który ma na celu wstawienie obrazków do dokumentu HTML; jest to element liniowy, który nie tworzy nowej linii w układzie, co sprawia, że nie wypełnia całej dostępnej szerokości kontenera. Stosowanie <img> w kontekście blokowym byłoby błędne, ponieważ nie pełni roli strukturalnego elementu tekstowego. Element <span> to również znacznik liniowy, który używany jest do stylizacji fragmentów tekstu w obrębie innego bloku, ale sam w sobie nie ma znaczenia blokowego i nie wpływa na układ w sposób, w jaki to robi <p>. Użycie <span> jako blokowego elementu może prowadzić do niepoprawnych praktyk w kodowaniu, co negatywnie wpływa na czytelność oraz semantykę dokumentu. Z kolei znacznik <strong> jest wykorzystywany do podkreślenia ważności tekstu, jednak również zalicza się do elementów liniowych. Wybór tych znaczników zamiast <p> może prowadzić do nieczytelnych lub nieczytelnych układów stron, co jest sprzeczne z najlepszymi praktykami w projektowaniu responsywnych interfejsów użytkownika. Zrozumienie różnicy pomiędzy elementami blokowymi a liniowymi jest kluczowe dla tworzenia dobrze zorganizowanych i semantycznych stron internetowych.

Pytanie 19

Jaki znacznik w HTML jest używany do oznaczania fragmentów tekstu jako kodu programistycznego?

A. <code> </code>
B. <blockquote> </blockquote>
C. <em> </em>
D. <span> </span>
<code> to znacznik w HTML, który służy do oznaczania fragmentów tekstu jako kodu komputerowego. Użycie tego znacznika jest zgodne z wytycznymi W3C i stanowi istotny element semantycznej struktury dokumentów HTML. Zastosowanie <code> pozwala na wyróżnienie fragmentów tekstu, takich jak kawałki kodu źródłowego czy polecenia, co jest niezwykle ważne w kontekście programowania oraz dokumentacji technicznej. Przykłady użycia obejmują: <code>console.log('Hello, World!');</code> w JavaScript, co przekłada się na lepszą czytelność i zrozumienie dla programistów. Stosując <code>, przeglądarki często renderują ten tekst w sposób wyróżniający, na przykład z użyciem czcionki monospace, co dodatkowo podkreśla jego znaczenie w kontekście kodowania. Oprócz tego, znacznik <code> ma korzystny wpływ na SEO, ponieważ poprawia semantykę treści, co jest doceniane przez wyszukiwarki. W kontekście standardów W3C, <code> należy do rodziny znaczników, które mają na celu ułatwienie prezentacji i interpretacji treści webowych.

Pytanie 20

W języku CSS wprowadzono poniższe formatowanie:

p > i { color: blue; }
Oznacza to, że tekst w kolorze niebieskim będzie zapisany:
A. pochylony tekst akapitu
B. pogrubiony tekst akapitu
C. cały tekst nagłówków, bez względu na ich formatowanie
D. cały tekst akapitu, bez względu na jego formatowanie
W języku CSS selektor > jest używany do stylizowania bezpośrednich potomków danego elementu. W podanym przykładzie p > i oznacza, że reguła CSS będzie zastosowana do elementu i będącego bezpośrednim dzieckiem elementu p. To oznacza, że tylko tekst zapisany w tagu i wewnątrz paragrafu p będzie miał kolor niebieski. Jest to powszechnie stosowane podejście do precyzyjnego stylizowania elementów na stronach internetowych, z zachowaniem struktury dokumentu HTML. Takie rozwiązanie pozwala na lepszą kontrolę nad wyglądem i prezentacją dokumentu, co jest istotne przy tworzeniu responsywnych i estetycznych stron. Praktyczne zastosowanie tego stylu można zobaczyć w przypadku, gdy chcemy wyróżnić pewne frazy w paragrafie, na przykład cytaty lub terminy. Warto pamiętać, że używanie selektorów potomstwa poprawia czytelność i efektywność kodu CSS, co jest dobrą praktyką w profesjonalnym kodowaniu frontendowym. Zachowanie spójności i przejrzystości stylów jest kluczowe w większych projektach, gdzie wiele osób pracuje nad kodem.

Pytanie 21

Jak powinien być zapisany kolor 255 12 12 w modelu RGB na stronie www?

A. #AB1A1D
B. #EE0C0C
C. #FF0C0C
D. #2551212
Kolor 255, 12, 12 w modelu RGB oznacza maksymalne nasycenie koloru czerwonego oraz bardzo niskie wartości zielonego i niebieskiego. Zapis w postaci heksadecymalnej, który jest stosowany w projektowaniu stron internetowych, polega na konwersji wartości RGB do formatu szesnastkowego. W tym przypadku, wartość 255 w systemie dziesiętnym odpowiada FF w systemie szesnastkowym, co oznacza maksymalne nasycenie koloru czerwonego. Wartość 12 w systemie dziesiętnym odpowiada 0C, co jest zbyt niską wartością zarówno dla zielonego, jak i niebieskiego. Dlatego pełny zapis koloru RGB 255, 12, 12 w formacie heksadecymalnym to #FF0C0C. Użycie standardu heksadecymalnego (hex) jest powszechne w CSS, gdzie kolory są definiowane za pomocą szesnastkowych wartości. Przykładowo, aby ustawić tło elementu w CSS na ten kolor, można użyć zapisu: 'background-color: #FF0C0C;'. Warto zrozumieć, że poprawne użycie systemów kolorów RGB i hex jest kluczowe w projektowaniu graficznym i webowym, ponieważ wpływa na estetykę i użyteczność interfejsów użytkownika.

Pytanie 22

W sekcji nagłówkowej kodu HTML znajduje się tekst przedstawiony na ilustracji. Tekst ten zostanie wyświetlony

<title>Strona miłośników psów</title>
A. na pasku tytułowym przeglądarki
B. w zawartości strony, w pierwszym widocznym nagłówku
C. w zawartości strony, na banerze
D. w polu adresu, obok wpisanego adresu URL
Tag <title> w HTML jest częścią sekcji nagłówkowej dokumentu i służy do określenia tytułu strony wyświetlanego na pasku tytułu przeglądarki. Jest to kluczowy element z punktu widzenia SEO, ponieważ wyszukiwarki internetowe używają informacji z tagu <title> do indeksowania stron i określania ich treści. Tytuł strony powinien być krótki, ale jednocześnie bogaty w słowa kluczowe, dzięki czemu zwiększa szanse na wysoką pozycję w wynikach wyszukiwania. W praktyce dobrze zaprojektowany tytuł wpływa na widoczność strony w sieci i przyciąga uwagę użytkowników. Ważne jest, aby tytuł był unikalny dla każdej strony w witrynie, co pomaga w lepszym zrozumieniu struktury strony przez odwiedzających oraz roboty indeksujące. Zgodnie z dobrymi praktykami, tytuł powinien zawierać od 50 do 60 znaków, aby był w pełni widoczny w wynikach wyszukiwania i nie został przycięty. Tytuł to pierwsze, co użytkownik widzi w zakładkach przeglądarki oraz w wynikach wyszukiwania, dlatego jego odpowiednia konstrukcja jest niezmiernie ważna.

Pytanie 23

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. SEO
B. FTP
C. CMS
D. SSL
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 24

Ustalenie w języku CSS wartości background-attachment: scroll oznacza, że

A. tło witryny będzie przesuwane wraz z przewijaniem strony
B. obraz tła pojawi się w prawym górnym rogu witryny
C. tło witryny pozostanie nieruchome i nie będzie się przesuwać podczas przewijania strony
D. obrazek tła będzie się powtarzać (kafelki)
Odpowiedź 2 jest poprawna, ponieważ zdefiniowana przez właściwość CSS 'background-attachment: scroll' oznacza, że tło strony przewija się razem z zawartością strony. W praktyce oznacza to, że gdy użytkownik przewija stronę w dół lub w górę, tło porusza się w tym samym kierunku, co inne elementy na stronie. Ta właściwość jest szczególnie przydatna w sytuacjach, kiedy chcemy, aby tło było bardziej zintegrowane z treścią, dając bardziej dynamiczny efekt wizualny. Zastosowanie 'scroll' jest zgodne z zachowaniem większości stron internetowych, gdzie tło i zawartość poruszają się synchronizacyjnie. Dobrym przykładem może być użycie tła w postaci gradientu lub subtelnego obrazu, który nie odwraca uwagi od treści, a jednocześnie wprowadza estetyczny element do projektu. Warto pamiętać, że w przypadku większych projektów, właściwość ta powinna być używana z rozwagą, aby uniknąć nieczytelności tekstu na tle lub nadmiernego rozpraszania uwagi użytkowników. Dobrą praktyką jest również testowanie różnych ustawień tła na różnych urządzeniach, aby zapewnić spójne doświadczenie użytkownika.

Pytanie 25

input[type=number] { background-color: Brown; }
Zapis tego selektora oznacza, że tło będzie miało brązowy kolor dla:
A. wszystkich typów pól edycyjnych
B. pól edycyjnych, w które użytkownik wprowadzi dowolną cyfrę
C. wszystkich tekstów na stronie internetowej
D. pól edycyjnych, które są typu numerycznego
Selekcja `input[type=number]` w CSS jest używana do stylizacji pól formularzy, które oczekują wartości numerycznych. Tło tych pól zostanie ustawione na kolor brązowy, co wpływa na ich wygląd i może poprawić doświadczenie użytkownika. Takie podejście jest zgodne z zasadami dostępności, ponieważ pozwala użytkownikom na natychmiastowe rozpoznanie, które pola są przeznaczone do wprowadzania cyfr. Przykładem zastosowania może być formularz zamówienia, w którym część pól ma określony typ, jak `number`, co ogranicza wprowadzanie do wartości liczbowych. Używając odpowiednich typów input, projektanci mogą tworzyć bardziej intuicyjne interfejsy, które redukują błędy użytkowników oraz poprawiają proces wypełniania formularzy. W tym kontekście warto również zwrócić uwagę na standardy W3C, które zalecają stosowanie typów input, aby zapewnić lepszą kompatybilność i funkcjonalność w różnych przeglądarkach i urządzeniach.

Pytanie 26

W CSS, aby ustalić różne formatowanie dla pierwszej litery w akapicie, trzeba użyć selektora

A. dziecka p + first-letter
B. klasy p.first-letter
C. pseudoelementu p::first-letter
D. atrybutu p [first-letter]
Aby zdefiniować odmienne formatowanie dla pierwszej litery akapitu w CSS, używamy pseudoelementu p::first-letter. Ten pseudoelement pozwala na stosowanie unikalnych stylów tylko do pierwszej litery pierwszego bloku tekstu w danym elemencie akapitu. Dzięki temu, możemy na przykład zwiększyć rozmiar czcionki, zmienić kolor, dodać marginesy lub inne efekty wizualne, które wyróżnią tę literę. Użycie p::first-letter jest zgodne z aktualnymi standardami CSS, co zapewnia szeroką kompatybilność z różnymi przeglądarkami. Przykładowe zastosowanie to: p::first-letter { font-size: 200%; color: red; } co spowoduje, że pierwsza litera każdego akapitu będzie większa i czerwona. Pseudoelementy, takie jak ::first-letter, są niezwykle użyteczne w projektowaniu typograficznym, umożliwiając artystyczne podejście do prezentacji tekstu, co może przyciągnąć uwagę czytelników i nadać stronie unikalny charakter.

Pytanie 27

Która z reguł dotyczących sekcji w HTML jest właściwa?

A. W sekcji <head> mogą znajdować się znaczniki <meta>, <title>, <link>
B. W sekcji <head> można definiować szablon strony przy użyciu znaczników <div>
C. W sekcji <head> nie znajduje się sekcja <body>
D. W sekcji <head> nie można umieszczać kodu CSS, tylko odwołanie do pliku CSS
W sekcji <head> dokumentu HTML można umieścić kilka ważnych znaczników, takich jak <meta>, <title> i <link>. Tytuł strony, który znajdziesz w znaczniku <title>, będzie widoczny na karcie przeglądarki, a także pomoże wyszukiwarkom lepiej zrozumieć, o czym jest Twoja strona. Znaczniki <meta> to fajny sposób, żeby dodać różne metadane – jak opis strony czy słowa kluczowe, które mogą przydać się w SEO. A znacznik <link>? Ten odwołuje się do zewnętrznych plików, na przykład do arkuszy stylów CSS, co jest spoko, bo separuje strukturę dokumentu od jego wyglądu. Z mojego doświadczenia, dobre umiejscowienie tych znaczników w <head> nie tylko poprawia SEO, ale też ułatwia zarządzanie stylami. To naprawdę ważne, jeśli chcesz tworzyć nowoczesne i responsywne strony internetowe.

Pytanie 28

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;}
Odpowiedź div {background-color: blue;} jest poprawna, ponieważ wykorzystuje właściwość CSS 'background-color', która służy do definiowania koloru tła elementu. Wartość 'blue' jest jedną z predefiniowanych nazw kolorów w CSS, co sprawia, że zapis jest czytelny i łatwy do zrozumienia dla każdego, kto pracuje z tą technologią. Przykładowo, jeżeli chcemy zmienić tło sekcji na naszej stronie internetowej na niebieskie, możemy użyć tego zapisu w pliku CSS lub w sekcji stylów na stronie. Dobrym podejściem w projektowaniu stron jest korzystanie z jednoznacznych nazw kolorów, co poprawia czytelność kodu. Warto również zaznaczyć, że CSS pozwala na użycie różnych formatów kolorów, takich jak RGB, HEX czy HSL, co zwiększa elastyczność w doborze odcieni. Ważne jest, aby przestrzegać standardów dostępności, co oznacza, że kolor tła powinien kontrastować z kolorem tekstu, aby zapewnić dobrą widoczność i dostępność dla wszystkich użytkowników.

Pytanie 29

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

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

Pytanie 30

Jakie właściwości stylu CSS poprawnie definiują dla akapitu czcionkę: Arial; jej wielkość: 16 pt; oraz styl czcionki: kursywa?

A. p {font-style: Arial; size: 16px; font-weight: normal;}
B. p {font-family: Arial; font-size: 16pt; font-style: italic;}
C. p {font-style: Arial; font-size: 16pt; font-variant: normal;}
D. p {font-family: Arial; font-size: 16px; font-variant: normal;}
Odpowiedź p {font-family: Arial; font-size: 16pt; font-style: italic;} jest poprawna, ponieważ zawiera wszystkie istotne właściwości, które definiują krój, rozmiar oraz styl czcionki dla akapitu. Właściwość font-family definiuje krój czcionki, w tym przypadku Arial, co jest zgodne z wymaganiami. Właściwość font-size ustawia rozmiar czcionki na 16 punktów (pt), co jest standardowym sposobem definiowania wielkości czcionki w kontekście typografii. Ponadto właściwość font-style została poprawnie użyta do określenia stylu pochylenia czcionki, co w CSS jest reprezentowane przez wartość italic. Te właściwości są zgodne z dobrymi praktykami w CSS, które zalecają precyzyjne definiowanie czcionek, aby zapewnić spójność w prezentacji tekstu. Przykładowo, stosując ten styl w dokumencie HTML, uzyskasz wyraźnie wyodrębniony akapit, który będzie atrakcyjny wizualnie i czytelny. Zastosowanie odpowiednich jednostek, takich jak pt dla rozmiaru czcionki, jest również istotne dla zapewnienia odpowiedniej skalowalności na różnych urządzeniach.

Pytanie 31

Który z poniższych znaczników HTML jest używany do tworzenia struktury strony internetowej?

A. <input>
B. <aside>
C. <mark>
D. <em>
Znacznik <aside> jest poprawnym rozwiązaniem, ponieważ jest używany do definiowania treści, która jest powiązana z otaczającym kontekstem, ale nie jest kluczowa dla głównego przebiegu informacji. Z perspektywy budowy struktury strony internetowej, <aside> doskonale wpisuje się w koncepcję bocznych paneli, przypisów, lub dodatkowych informacji, które wzbogacają główną treść. Przykładem zastosowania może być umieszczenie sekcji z cytatami, powiązanymi artykułami lub innymi treściami uzupełniającymi. Zgodnie z zasadami semantyki HTML5, <aside> pozwala na lepszą interpretację treści przez przeglądarki oraz narzędzia do analizy SEO, co przyczynia się do poprawy dostępności i użyteczności strony. W praktyce, korzystanie z semantycznych znaczników, takich jak <aside>, wspiera także tworzenie bardziej czytelnych i strukturalnych dokumentów, co jest zgodne z najlepszymi praktykami w tworzeniu stron internetowych.

Pytanie 32

W HTML atrybut alt w tagu img służy do określenia

A. napisu, który będzie widoczny pod obrazem
B. właściwości grafiki, takie jak rozmiar, ramka, wyrównanie
C. tekstu, który pojawi się, gdy obrazek nie może być załadowany
D. lokalizacji i nazwy pliku źródłowego obrazu
Odpowiedź, która wskazuje, że atrybut alt znacznika img w języku HTML definiuje tekst, który będzie wyświetlony, jeśli grafika nie może być poprawnie załadowana, jest całkowicie poprawna. Atrybut alt jest kluczowym elementem dostępności w sieci, ponieważ dostarcza użytkownikom alternatywne informacje o zawartości obrazu, co jest szczególnie ważne dla osób korzystających z czytników ekranu. Na przykład, jeśli zdjęcie w artykule nie jest dostępne z powodu problemów z łączem internetowym, atrybut alt zapewnia kontekst, dzięki czemu użytkownik jest informowany o tym, co miało być przedstawione. Dobre praktyki zalecają, aby tekst w atrybucie alt był zwięzły, ale jednocześnie dostarczał wystarczających informacji o obrazie. Warto również zauważyć, że stosowanie atrybutu alt wspiera SEO (optymalizację pod kątem wyszukiwarek), ponieważ wyszukiwarki mogą używać tych informacji do indeksowania treści. Przykład: <img src='example.jpg' alt='Zdjęcie pięknego krajobrazu górskiego'>.

Pytanie 33

W załączonym kodzie CSS, kolor został zapisany w formacie

color: #008000;
A. CMYK
B. szesnastkowej
C. dziesiętnej
D. HSL
W CSS kolory często zapisywane są w postaci szesnastkowej ponieważ jest to krótki i precyzyjny sposób definiowania koloru. Kod szesnastkowy składa się zazwyczaj z sześciu znaków poprzedzonych znakiem hash (#) gdzie pierwsze dwa znaki odpowiadają czerwonej składowej następne dwa zielonej a ostatnie dwa niebieskiej. Na przykład #008000 oznacza kolor zielony gdzie czerwona składowa wynosi 0 zielona 128 a niebieska 0. Wartości te są zapisane w systemie szesnastkowym co oznacza że mogą przyjmować wartości od 00 do FF odpowiadające wartościom dziesiętnym od 0 do 255. Korzystanie z formatu szesnastkowego jest powszechnie uznawane za dobrą praktykę w web designie ponieważ jest szeroko wspierane przez przeglądarki internetowe i umożliwia łatwe definiowanie szerokiej gamy kolorów. Dzięki swojej zwięzłości i jednoznaczności jest preferowane w projektach gdzie każda linijka kodu ma znaczenie. Przy wyborze koloru warto korzystać z narzędzi które mogą pomóc w konwersji wartości RGB na szesnastkowe co ułatwia dokładne odwzorowanie wybranych kolorów

Pytanie 34

Który atrybut pozwala na wskazanie lokalizacji pliku graficznego w znaczniku <img>?

A. src
B. link
C. alt
D. href
Atrybut 'src' w znaczniku <img> jest kluczowy, ponieważ określa lokalizację pliku graficznego, który ma być wyświetlany na stronie. Oznacza to, że wartość tego atrybutu to URL (Uniform Resource Locator), który wskazuje na lokalizację obrazu w internecie lub na lokalnym serwerze. Przykładowo, jeśli chcemy wyświetlić obrazek o nazwie 'zdjecie.jpg' znajdujący się w folderze 'obrazy', użyjemy: <img src='obrazy/zdjecie.jpg' alt='Opis obrazka'>. Zastosowanie odpowiedniego atrybutu 'src' jest zgodne z najlepszymi praktykami HTML, co zapewnia, że przeglądarki internetowe prawidłowo interpretują nasze zamierzenia co do wyświetlania treści wizualnych. Nieprawidłowe określenie lokalizacji obrazu może prowadzić do błędów '404 Not Found', co negatywnie wpływa na doświadczenie użytkownika. Dobrze zaprojektowane strony internetowe powinny również uwzględniać atrybut 'alt', który zapewnia dostępność oraz opisuje zawartość obrazu osobom korzystającym z czytników ekranu, ale to 'src' jest odpowiedzialny za wyświetlanie samego obrazu.

Pytanie 35

Zapis koloru w formacie #ff00e0 odpowiada zapisowi

A. rgb(ff,0,e0)
B. rgb(255,0,224)
C. rgb(255,0,128)
D. rgb(f,0,e0)
Oznaczenie barwy w postaci #ff00e0 jest zapisem w systemie szesnastkowym (hexadecimal), który jest powszechnie stosowany w programowaniu i projektowaniu stron internetowych. Kod ten składa się z trzech par znaków, gdzie pierwsza para (ff) reprezentuje wartość czerwonego koloru, druga para (00) wartość zielonego koloru, a trzecia para (e0) wartość niebieskiego koloru. W formacie RGB, którym jest zapis rgb(red, green, blue), wartości są podawane w skali od 0 do 255. Aby przeliczyć szesnastkowy zapis na wartości dziesiętne, należy każdą parę szesnastkową zinterpretować jako liczbę dziesiętną. Dla 'ff' otrzymujemy 255, dla '00' - 0, a dla 'e0' - 224, co prowadzi nas do zapisu rgb(255, 0, 224). Ten kolor jest intensywnym różowym odcieniem, który można wykorzystać w różnych aplikacjach graficznych oraz na stronach internetowych, w tym w CSS. Dobrą praktyką jest znajomość konwersji między tymi formatami, ponieważ pozwala to na efektywną pracę z grafiką i designem.

Pytanie 36

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. style
C. title
D. meta
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 37

Jak nazywa się organizacja odpowiedzialna za wyznaczanie standardów dla języka HTML?

A. W3C
B. NASK
C. WYSIWYG
D. ISO
Organizacja zajmująca się ustalaniem standardu dla języka HTML nosi nazwę W3C, co oznacza World Wide Web Consortium. Jest to międzynarodowa społeczność, która opracowuje standardy internetowe i zapewnia ich udostępnienie. W3C zostało założone w 1994 roku przez Tima Berners-Lee, twórcę WWW, z celem wspierania rozwijania wspólnych standardów, które mają na celu zapewnienie długoterminowego wzrostu i interoperacyjności w sieci. Standard HTML, a także jego kolejne wersje, są kluczowymi elementami tej inicjatywy. W3C odpowiada również za inne standardy, takie jak CSS, XML czy SVG. Dbanie o zgodność oraz poprawność kodu HTML jest niezbędne dla zapewnienia właściwego działania stron internetowych w różnych przeglądarkach. Przykłady standardów, które W3C wprowadziło, to HTML5, który wprowadził nowe elementy, takie jak <article>, <section> czy <canvas>. Te standardy pozwalają na tworzenie bardziej zaawansowanych interfejsów użytkownika, lepszą dostępność oraz efektywność. Dlatego W3C odgrywa kluczową rolę w ekosystemie internetu, wpływając na sposób, w jaki tworzymy i konsumujemy treści online.

Pytanie 38

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

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

Pytanie 39

Metainformacja "Description" zawarta w pliku HTML powinna zawierać ``` ```

A. listę kluczowych fraz używanych przez wyszukiwarki internetowe
B. opis zawartości strony
C. nazwę aplikacji, w której stworzono stronę
D. informację o autorze strony
Metainformacja 'Description' zawarta w pliku HTML pełni kluczową rolę w optymalizacji stron internetowych pod kątem wyszukiwarek. Jest to krótki opis treści strony, który pomaga wyszukiwarkom zrozumieć, o czym jest dana strona. Wartościowy opis powinien być zwięzły, informacyjny i zachęcający do kliknięcia, ponieważ często pojawia się w wynikach wyszukiwania jako fragment tekstu, obok tytułu strony. Przykładem dobrze skonstruowanego opisu może być 'Dowiedz się, jak skutecznie zarządzać swoimi finansami osobistymi dzięki naszym praktycznym poradnikom i wskazówkom'. Taki opis nie tylko informuje użytkownika o zawartości strony, ale również zawiera słowa kluczowe, które mogą przyciągnąć uwagę. Zgodnie z wytycznymi Google, długość opisu powinna wynosić od 150 do 160 znaków, aby uniknąć obcięcia tekstu w wynikach wyszukiwania. Posiadanie dobrze napisanej metainformacji 'Description' jest więc niezbędne dla skutecznej strategii SEO i zwiększenia widoczności strony w internecie.

Pytanie 40

Aby grupować sekcje na poziomie bloków, które będą stilizowane za pomocą znaczników, jakiego należy użyć?

A. <div>
B. <param>
C. <p>
D. <span>
Znak <p> jest przeznaczony wyłącznie do definiowania akapitów tekstowych, co czyni go niewłaściwym narzędziem do ogólnego grupowania obszarów. Nie jest to element blokowy, który mógłby pomieścić inne znaczniki w sposób, który umożliwiałby ich efektywne stylizowanie jako całości. Zastosowanie <p> do grupowania elementów np. obrazków i przycisków mogłoby prowadzić do nieoczekiwanych rezultatów w prezentacji treści oraz problemów z dostępnością. Z kolei znacznik <span> jest elementem inline, co oznacza, że nie łamie linii i może być używany do stylizacji mniejszych fragmentów tekstu. Jego zastosowanie do grupowania bloków treści byłoby nieodpowiednie, ponieważ nie potrafi on zarządzać rozkładem elementów na stronie. Ostatnim błędem w wyborze niepoprawnych odpowiedzi jest <param>, który jest znakiem używanym do definiowania parametrów dla obiektów w znaczeniu <object>. Jest on całkowicie nieadekwatny w kontekście grupowania treści, ponieważ nie służy do stylizacji ani strukturalizacji dokumentu HTML. Użycie <param> w tym kontekście jest mylące i nie odzwierciedla rzeczywistych potrzeb związanych z organizacją treści w dokumentach webowych.