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: 9 grudnia 2025 10:48
Data zakończenia: 9 grudnia 2025 11:14

Egzamin zdany!

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

Wymagane minimum: 20 punktów (50%)

Pochwal się swoim wynikiem!

Facebook

X.com

Szczegółowe wyniki:

Pytanie 1

Funkcję session_start() w PHP należy zastosować przy realizacji

A. jakiejkolwiek strony internetowej, która obsługuje cookies

B. wielostronicowej strony, która wymaga dostępu do danych podczas przechodzenia pomiędzy stronami

C. przetwarzania formularza

D. ładowania danych z zewnętrznych plików

Funkcja session_start() w języku PHP jest kluczowym elementem przy tworzeniu wielostronicowej witryny, która wymaga przechowywania i dostępu do danych pomiędzy różnymi stronami. Ta funkcja inicjalizuje sesję, co pozwala na przechowywanie danych użytkownika w zmiennych sesyjnych, które są dostępne na wszystkich stronach witryny. Przykładem zastosowania może być koszyk zakupowy w sklepie internetowym – użytkownik dodaje przedmioty do koszyka na jednej stronie, a na innej stronie (np. stronie podsumowania zamówienia) może z łatwością zobaczyć swoje wybory. Z perspektywy dobrych praktyk, użycie sesji zwiększa bezpieczeństwo danych, ponieważ nie są one przechowywane w cookies ani jako parametry URL, co zmniejsza ryzyko ich ujawnienia. Ponadto, sesje ułatwiają zarządzanie autoryzacją, ponieważ można łatwo sprawdzić, czy użytkownik jest zalogowany na dowolnej stronie witryny, co jest niezbędne w przypadku aplikacji wymagających logowania. Dlatego właściwe zastosowanie session_start() jest kluczowe dla interaktywności i użytkowalności rozbudowanych aplikacji webowych.

Pytanie 2

Który z języków skryptowych nie wykonuje operacji po stronie serwera?

A. Perl

B. ASP

C. PHP

D. CSS

CSS, czyli kaskadowe arkusze stylów, to język używany do stylizacji stron internetowych. Jego głównym celem jest określenie wyglądu elementów HTML, co obejmuje kolory, czcionki, rozmieszczenie oraz responsywność. CSS nie wykonuje zadań po stronie serwera, ponieważ działa po stronie klienta, co oznacza, że interpretacja i renderowanie stylów odbywa się w przeglądarkach internetowych użytkowników. Przykładem zastosowania CSS jest stylizacja przycisków, nagłówków czy układów stron, co pozwala na tworzenie atrakcyjnych wizualnie interfejsów użytkownika. Standardy CSS są regulowane przez W3C, a najnowsze wersje, takie jak CSS3, wprowadzają dodatkowe możliwości, takie jak animacje czy zaawansowane selektory. Dzięki CSS można również tworzyć responsywne strony internetowe, które dostosowują się do różnych rozmiarów ekranu, co jest istotne w dobie wzrostu użycia urządzeń mobilnych.

Pytanie 3

Aby zidentyfikować błędy w składni kodu HTML, trzeba użyć

A. debuggera

B. kompilatora

C. walidatora

D. interpretera

Debugger, interpreter i kompilator to narzędzia, które pełnią różne funkcje w procesie programowania, ale nie są bezpośrednio związane z walidacją kodu HTML. Debugger to narzędzie służące do wykrywania i naprawiania błędów w kodzie podczas jego wykonywania. Chociaż może być użyteczny w przypadku aplikacji webowych, nie zajmuje się on analizą poprawności składni HTML, a bardziej skupia się na logice i działaniu skryptów. Interpreter, z kolei, jest odpowiedzialny za bezpośrednie wykonanie kodu, tłumacząc go na instrukcje, które są rozumiane przez komputer. Działa głównie w kontekście języków skryptowych, takich jak JavaScript, ale nie analizuje kodu HTML w kontekście jego poprawności. Kompilator to narzędzie, które przekształca kod źródłowy napisany w jednym języku programowania na inny, często kod maszynowy. Pomimo że wszystkie te narzędzia są ważne w procesie tworzenia oprogramowania, nie spełniają one funkcji walidatora, który jest kluczowy w zapewnieniu poprawności kodu HTML w zgodności ze standardami.

Pytanie 4

Jaką barwę przedstawia kolor określony w modelu RGB (255, 0, 0)?

A. niebieska

B. czerwona

C. zielona

D. żółta

Barwa zapisana w modelu RGB (255, 0, 0) odnosi się do intensywnego koloru czerwonego. Model RGB (Red, Green, Blue) jest standardem używanym w cyfrowym przetwarzaniu obrazu, gdzie natężenie światła w trzech podstawowych kolorach: czerwonym, zielonym i niebieskim, definiuje ostateczny kolor. Wartości w zakresie od 0 do 255 wskazują na poziom intensywności każdego z tych kolorów, gdzie 0 oznacza brak intensywności, a 255 maksymalną intensywność. W przypadku (255, 0, 0) maksymalne natężenie czerwieni (255) i brak zieleni oraz niebieskiego skutkuje czystym kolorem czerwonym. Przykładem zastosowania koloru czerwonego w praktyce są znaki drogowe, sygnały alarmowe oraz elementy graficzne w interfejsach użytkownika, które mają na celu przyciągnięcie uwagi. Standardy związane z kolorem, takie jak sRGB, definiują sposób, w jaki kolory są reprezentowane na różnych urządzeniach, co zapewnia spójność wizualną. Czerwony jest także jednym z kolorów podstawowych w modelu adytywnym, co podkreśla jego fundamentalne znaczenie w szerokim zakresie zastosowań wizualnych.

Pytanie 5

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. 20 px oraz marginesy zewnętrzne tego obramowania

B. 2 px oraz marginesy zewnętrzne tego obramowania

C. 20 px oraz marginesy wewnętrzne tego obramowania

D. 2 px oraz marginesy wewnętrzne tego obramowania

Wszystkie niepoprawne odpowiedzi zawierają błędne informacje na temat właściwości marginesów oraz ich lokalizacji w stosunku do obramowania. Pierwsza z tych odpowiedzi sugeruje, że sekcja ma marginesy wewnętrzne, co jest nieprecyzyjne. W CSS marginesy wewnętrzne definiuje się za pomocą właściwości 'padding', a nie 'margin'. Przy użyciu 'margin' określamy przestrzeń zewnętrzną, co oznacza, że nie ma ona wpływu na wewnętrzne odstępy między elementami w danym obiekcie. Kolejna odpowiedź wskazuje, że marginesy mają wartość 20 pikseli wewnątrz obramowania. To również jest błędne, ponieważ marginesy nie mogą być wewnętrzne w kontekście stosowania 'margin'; mają one zastosowanie wyłącznie do przestrzeni zewnętrznej. Na koniec, ostatnia niepoprawna odpowiedź podaje, że marginesy są o wartości 20 pikseli na zewnątrz obramowania, co na pierwszy rzut oka może wydawać się prawidłowe, jednak nie uwzględnia faktu, że obramowanie ma 2 piksele szerokości, a marginesy w tym przypadku mają znaczenie tylko wobec zewnętrznej odległości do innych elementów, a nie wewnętrznej struktury. Warto uzmysłowić sobie znaczenie precyzyjnego rozróżnienia między 'margin' a 'padding', ponieważ ma to ogromny wpływ na ostateczny układ i prezentację strony internetowej.

Pytanie 6

W semantycznym HTML odpowiednikiem tagu <b>, który nie tylko pogrubia tekst, ale również oznacza go jako istotniejszy, jest

A. <mark>

B. <em>

C. <ins>

D. <strong>

Znacznik <strong> w języku HTML semantycznym służy do oznaczania tekstu, który ma szczególne znaczenie w kontekście treści. Oprócz stylistycznego pogrubienia czcionki, <strong> wskazuje, że dany fragment tekstu jest ważny dla zrozumienia treści dokumentu. Przykładowo, w artykule omawiającym bezpieczeństwo w Internecie, można użyć <strong> do wyróżnienia kluczowych terminów, takich jak 'szyfrowanie' czy 'firewall', co podkreśla ich znaczenie w ochronie danych. Użycie znaczników semantycznych, takich jak <strong>, jest zgodne z najlepszymi praktykami dostępności, co zapewnia lepszą interpretację treści przez technologie asystujące, takie jak czytniki ekranu. Takie podejście poprawia nie tylko nawigację po stronie, ale również SEO, ponieważ wyszukiwarki lepiej rozumieją kontekst i hierarchię treści. Warto również zauważyć, że w przeciwieństwie do <b>, który jedynie zmienia wygląd tekstu, <strong> wnosi dodatkowy sens do struktury dokumentu, co jest szczególnie istotne w kontekście tworzenia witryn internetowych, które są zarówno estetyczne, jak i funkcjonalne.

Pytanie 7

Zestawienie dwóch kolorów znajdujących się po przeciwnych stronach na kole barw stanowi zestawienie

A. dopełniającym

B. sąsiednim

C. monochromatycznym

D. trójkątnym

Połączenie dwóch barw leżących po przeciwnych stronach w kole barw określane jest mianem barw dopełniających. Barwy te, takie jak czerwony i zielony czy niebieski i pomarańczowy, wzajemnie się uzupełniają, co oznacza, że gdy są używane razem, podkreślają się nawzajem, tworząc intensywniejszy i bardziej dynamiczny efekt wizualny. W praktyce wykorzystuje się je w projektowaniu graficznym, malarstwie oraz fotografii, gdzie kontrastujące barwy przyciągają uwagę widza, co jest szczególnie ważne w reklamie czy przy tworzeniu wizualnych identyfikacji. Zastosowanie barw dopełniających jest również istotne w teorii kolorów, szczególnie w kontekście harmonii barwnej. Warto pamiętać, że użycie barw dopełniających może również wpływać na percepcję emocjonalną odbiorcy, co jest niezwykle istotne w kontekście marketingu czy sztuki.

Pytanie 8

Jaką szerokość przeznaczono dla treści strony według podanej definicji CSS?

body {
   border: 2px;
   height: 600px;
   width: 560px;
}

A. 600 px

B. 560 px

C. 640 px

D. 2 px

Twoja odpowiedź jest poprawna. Szerokość strony została zdefiniowana na 560 pikseli w kodzie CSS. W kontekście strony internetowej, to oznacza, że cała zawartość strony będzie wyświetlana w obszarze o szerokości nie większej niż 560 pikseli. To jest bardzo ważne podczas projektowania stron internetowych. Szerokość strony często jest ustalana na stałą wartość, aby zapewnić spójność wyglądu strony na różnych urządzeniach. W praktyce, jeśli chcesz, aby strona była 'responsywna', szerokość powinna być ustawiona na wartość procentową, co pozwoli na dynamiczne dostosowanie się strony do rozmiaru okna przeglądarki. Jednak w niektórych sytuacjach, jak na przykład w przypadku określonego układu strony, możliwe jest użycie stałej wartości szerokości. W każdym razie, zapamiętaj, że szerokość strony jest jednym z najważniejszych aspektów przy projektowaniu stron internetowych, który ma bezpośredni wpływ na doświadczenia użytkownika.

Pytanie 9

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

A. <em> </em>

B. <s> </s>

C. <b> </b>

<s> jest znacznikiem HTML używanym do oznaczania tekstu, który jest nieprawidłowy lub nieaktualny. Umożliwia to zachowanie kontekstu, w którym tekst był używany, ale informuje użytkowników, że nie jest już aktualny. Przykład zastosowania: jeśli w artykule naukowym cytujemy dane, które zostały później zaktualizowane, możemy je umieścić w znaczniku <s>, aby wskazać, że te informacje są już nieaktualne. Praktyczne zastosowanie znaczników HTML, takich jak <s>, jest istotne w kontekście dostępności i poprawności treści. Używanie odpowiednich znaczników pozwala przeglądarkom oraz czytnikom ekranu lepiej interpretować zawartość, co jest zgodne z wytycznymi WCAG (Web Content Accessibility Guidelines). Warto również zauważyć, że <s> jest preferowane w nowoczesnym HTML5 w porównaniu do starszych znaczników, takich jak <strike>, które są uznawane za przestarzałe. Stosowanie znaczników zgodnych z aktualnymi standardami zwiększa interoperacyjność oraz przyszłościowość kodu.

Pytanie 10

Edytor, który spełnia kryteria WYSIWYG, powinien umożliwiać

A. tworzenie podstawowych grafik wektorowych

B. osiągnięcie zbliżonego rezultatu tworzonej strony do jej wyglądu w przeglądarce internetowej

C. publikację strony na serwerze za pomocą wbudowanego klienta FTP

D. przygotowanie plików dźwiękowych przed ich umieszczeniem na stronie internetowej

Edytory WYSIWYG (What You See Is What You Get) mają na celu umożliwienie użytkownikom tworzenia i edytowania treści w sposób, który przypomina ostateczny wygląd strony internetowej. Odpowiedź dotycząca uzyskania zbliżonego wyniku tworzonej strony do jej obrazu w przeglądarce internetowej jest kluczowym aspektem działania takich edytorów. Umożliwiają one użytkownikom natychmiastowe podglądanie efektów wprowadzanych zmian, co jest nieocenione przy projektowaniu stron. Przykładem może być edytor tak jak Adobe Dreamweaver czy WordPress, które pozwalają na wizualne projektowanie układu, co redukuje potrzebę ręcznego kodowania. Przy tworzeniu stron internetowych zgodnie z dobrymi praktykami, edytory WYSIWYG powinny wspierać standardy HTML i CSS, co zapewnia, że efekty wizualne są zgodne z tym, co użytkownik zobaczy w przeglądarce. Takie podejście zwiększa efektywność pracy, a także ułatwia współpracę między programistami a designerami.

Pytanie 11

Podaj nazwę Systemu Zarządzania Treścią, którego logo jest widoczne na zamieszczonym rysunku?

A. MediaWiki

B. Drupal

C. Joomla!

D. WordPress

Podczas wyboru systemu zarządzania treścią istotne jest zrozumienie różnic między różnymi platformami. Drupal jest potężnym CMS-em często wybieranym do budowy złożonych stron gdzie wymagane są skomplikowane struktury danych i zaawansowana kontrola uprawnień użytkowników. Jednak jego zaawansowane funkcje mogą sprawić że krzywa uczenia się będzie bardziej stroma szczególnie dla początkujących użytkowników. Drupal jest jednak doskonałym wyborem dla dużych organizacji które potrzebują niezawodności i skalowalności. Z kolei WordPress jest najbardziej popularnym CMS-em na świecie znanym ze swojej prostoty i ogromnej liczby dostępnych wtyczek i motywów co czyni go idealnym wyborem dla blogów i prostych stron internetowych. Jego przystępność i łatwość użycia sprawiają że jest on preferowany przez początkujących ale może być niewystarczający dla bardziej rozbudowanych projektów. MediaWiki to platforma stworzona dla projektów typu wiki i jest najlepiej znana z napędzania Wikipedii. Jej funkcje są skoncentrowane na umożliwieniu wielu użytkownikom współpracy i edycji treści co czyni ją mniej odpowiednią dla tradycyjnych stron internetowych. Typowym błędem podczas wyboru CMS-a jest kierowanie się wyłącznie popularnością zamiast analizowania specyficznych potrzeb projektu i odpowiednich funkcji jakie oferuje dany CMS. Dlatego kluczowe jest zrozumienie że wybór CMS-a powinien być podyktowany konkretnymi wymaganiami dotyczącymi funkcjonalności i zarządzania treścią.

Pytanie 12

Wskaż styl CSS za pomocą, którego uzyskano przedstawiony efekt

Styl 1.
img {
  width: 100px;
  border-radius: 10%;
}

Styl 2.
img {
  width: 100px;
  border-radius: 50px;
}

Styl 3.
img {
  width: 100px;
  border: 50% green;
}

Styl 4.
img {
  width: 100px;
  shape: circle;
}

A. Styl 2.

B. Styl 4.

C. Styl 3.

D. Styl 1.

Niestety, wybrałeś niepoprawną odpowiedź. Poprawną odpowiedzią jest 'Styl 2.', który wykorzystuje właściwość CSS border-radius z wartością 50px do zaokrąglania rogów obrazka. Zobaczmy, dlaczego pozostałe style są niepoprawne. 'Styl 1.' ma za małą wartość zaokrąglenia, co nie daje oczekiwanego efektu. Właściwość border-radius musi mieć odpowiednią wartość, aby uzyskać pożądane zaokrąglenie. 'Styl 3.' zawiera niepoprawną wartość, a mianowicie kolor. Kolor nie jest właściwą wartością dla border-radius, co pokazuje, jak ważne jest zrozumienie, jakie wartości są akceptowane dla różnych właściwości CSS. 'Styl 4.' używa właściwości shape, która nie istnieje w CSS. To jest błąd typowy dla osób, które nie są jeszcze pewne, które właściwości są dostępne w CSS. Jest to jasnym przykładem, dlaczego nauka i praktyka CSS są tak ważne do tworzenia atrakcyjnych i funkcjonalnych stron internetowych.

Pytanie 13

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

A. favicon.

B. emoticon.

C. iConji.

D. webicon.

iConji, webicon i emoticon to terminy, które nie odnoszą się do właściwego pojęcia favicon, a ich użycie w kontekście ikon w przeglądarkach jest mylące. iConji to termin, który nie ma uznania w standardach webowych ani w dokumentacji dotyczącej projektowania stron internetowych. Może być mylony z pojęciem ikony, ale nie odnosi się bezpośrednio do ikon w kontekście przeglądarek. Webicon to również nieformalne odniesienie, które nie jest szeroko stosowane w branży. W rzeczywistości nie ma ustalonej definicji tego terminu w dokumentacji dotyczącej projektowania stron. Emoticon to zaś symbol wyrażający emocje, często stosowany w komunikacji internetowej (np. :) lub :( ), a nie w kontekście ikon reprezentujących strony internetowe. Emoticony są używane głównie w tekstach, czatach i na forach internetowych, aby wyrazić uczucia, podczas gdy favicony są elementem interfejsu użytkownika, mającym na celu identyfikację wizualną strony. Z tego względu ani iConji, ani webicon, ani emoticon nie mogą być poprawnymi odpowiedziami na pytanie dotyczące ikony przed adresem URL w przeglądarkach.

Pytanie 14

W HTML formularzu użyto elementu <input>. Pole, które się pojawi, ma pozwalać na wprowadzenie maksymalnie

<input type="password" size="30" maxlength="20">

A. 20 znaków, które będą widoczne w trakcie wprowadzania

B. 30 znaków, które nie będą widoczne w polu tekstowym

C. 20 znaków, które nie będą widoczne w polu tekstowym

D. 30 znaków, które będą widoczne podczas wpisywania

Znacznik <input type="password"> w HTML jest rzeczywiście super ważny. Umożliwia on użytkownikom wpisywanie haseł, a to, co najfajniejsze, to że znaki są ukryte, więc nikt nie zobaczy, co piszesz. Atrybut maxlength="20" jest tutaj pomocny, bo ogranicza liczbę znaków do 20, co jest praktyczne - zbyt długie hasła ciężko zapamiętać, a krótkie mogą być niebezpieczne. Natomiast size="30" to tylko kwestia szerokości pola, więc nie wpływa na ilość znaków, które można wpisać. Generalnie, dobrze jest trzymać się tych ograniczeń, bo to pomaga w projektowaniu formularzy i utrzymywaniu porządku w interfejsie. Z mojej perspektywy, znajomość tych atrybutów jest naprawdę przydatna przy tworzeniu stron, bo można lepiej zrozumieć, jak to wszystko działa.

Pytanie 15

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ź B

B. Odpowiedź A

C. Odpowiedź D

D. Odpowiedź C

Pozostałe opcje zawierają błędy w użyciu atrybutów colspan i rowspan co prowadzi do nieprawidłowego odwzorowania struktury tabeli. W opcji A dane są przedstawione bez użycia rowspan co powoduje że każda informacja znajdowałaby się w osobnym wierszu nie łącząc kolumny Telefony co jest sprzeczne z przedstawionym stylem w pytaniu. To może prowadzić do dezorganizacji danych i braku przejrzystości. W przypadku opcji C zastosowanie colspan na ostatniej komórce jest błędne ponieważ rozszerza komórkę na dwie kolumny co nie jest zgodne z prezentowaną strukturą gdzie dane są ułożone w dwóch wierszach pod jednym nagłówkiem. Opcja D również błędnie używa colspan przy nagłówku Telefony co powoduje że dane nie są przedstawiane w logicznym układzie ukazującym że jedna kolumna powinna obejmować dwie komórki z telefonami. Takie błędy w strukturze tabeli mogą prowadzić do problemów z użytecznością i dostępnością strony internetowej ponieważ użytkownicy mogą mieć trudności z odnalezieniem i zrozumieniem prezentowanych informacji. Problemem jest również brak semantyczności co jest kluczowe dla SEO i dostępności dla osób korzystających z czytników ekranu. Dlatego ważne jest prawidłowe użycie atrybutów strukturalnych w HTML aby zapewnić dostępność i poprawne wyświetlanie treści na różnych urządzeniach i przeglądarkach co jest kluczowe w nowoczesnym projektowaniu stron internetowych. Dobre praktyki projektowania stron internetowych zalecają również używanie HTML w sposób semantyczny co pomaga w tworzeniu bardziej czytelnych i dostępnych dokumentów. Poprawne użycie atrybutów takich jak rowspan i colspan jest kluczowe w osiągnięciu tych celów i uniknięciu nieporozumień i błędów w prezentacji danych na stronach internetowych. Ułatwia to również utrzymanie i aktualizację kodu w przyszłości oraz zwiększa ogólną jakość i dostępność strony internetowej.

Pytanie 16

Który format graficzny najlepiej nadaje się do zapisu obrazu z przezroczystością do zastosowania w serwisie internetowym?

A. SVG

B. PNG

C. JPG

D. BMP

Format PNG (Portable Network Graphics) jest najlepszym wyborem do zapisu obrazów z przezroczystością przeznaczonych na strony internetowe. PNG obsługuje przezroczystość alpha, co oznacza, że można uzyskać dowolny stopień przezroczystości na pikselach, co jest szczególnie przydatne w przypadku grafik wymagających gładkich przejść lub cieni. Dzięki temu grafiki mogą być umieszczane na różnych tłach bez widocznych krawędzi, co jest kluczowe w designie stron internetowych. Warto również zauważyć, że PNG wykorzystuje kompresję bezstratną, co oznacza, że jakość obrazu nie ulega pogorszeniu podczas zapisu. W praktyce, format PNG jest idealny do logo, ikon, obrazów z tekstem oraz ilustracji, gdzie ważna jest jakość i przezroczystość. Standardy webowe, takie jak WCAG, również zalecają używanie formatów, które zapewniają dostępność, a PNG doskonale wpisuje się w te wymagania, umożliwiając tworzenie estetycznych i funkcjonalnych stron. Ponadto, wsparcie dla formatu PNG jest szerokie, co zapewnia jego uniwersalność w różnych przeglądarkach i na różnych urządzeniach.

Pytanie 17

Aby stworzyć stronę internetową, która będzie odpowiadać załączonej ilustracji, konieczne jest użycie semantycznych znaczników sekcji w języku HTML5. Jakim znacznikiem należy określić sekcję menu?

A. aside

B. nav

C. header

D. div

Znacznik <nav> w HTML5 jest przeznaczony do definiowania sekcji nawigacyjnych na stronie internetowej, takich jak menu. Użycie semantycznego znacznika <nav> jest zgodne z dobrą praktyką projektowania stron, ponieważ pomaga przeglądarkom i technologiom wspomagającym, takim jak czytniki ekranowe, lepiej zrozumieć strukturę dokumentu. Dzięki zastosowaniu <nav>, silniki wyszukiwarek mogą również bardziej efektywnie indeksować zawartość strony. Przykład użycia <nav> w praktyce: html <nav> <ul> <li><a href='#'>Strona główna</a></li> <li><a href='#'>O nas</a></li> <li><a href='#'>Kontakt</a></li> </ul> </nav>. Ten znacznik powinien być używany wszędzie tam, gdzie mamy do czynienia z głównymi elementami nawigacyjnymi strony. Semantyczne tagi w HTML5, takie jak <nav>, ułatwiają utrzymanie i obsługę kodu oraz wspierają dostępność stron internetowych zgodnie ze standardami WCAG.

Pytanie 18

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. cały tekst w paragrafie zostanie powiększony o 150%

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

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

Rozważając pozostałe możliwości zauważamy że zapis p::first-line { font-size: 150%; } odnosi się tylko do pierwszej linii każdego paragrafu a nie do całego tekstu paragrafu. Błędne myślenie że całość tekstu paragrafu będzie powiększona o 150% wynika z mylnego zrozumienia zasięgu pseudo-elementu. Pseudo-elementy takie jak ::first-line mają zastosowanie tylko do specyficznych części elementów blokowych w tym przypadku pierwszej linii co oznacza że ich działanie nie rozciąga się na cały paragraf. Podobnie sugerowanie że cała czcionka paragrafu zostanie zmieniona na mniejszą jest niepoprawne ponieważ ::first-line nie zmienia domyślnej wielkości czcionki pozostałych linii. W kontekście CSS rozmiar czcionki dla całego elementu można zmodyfikować bezpośrednio przez selektor elementu a nie przez pseudo-element. Przypisywanie zmiany czcionki tylko do pierwszej linii jest częstym sposobem na wyróżnienie tekstu w sposób który nie ingeruje w ogólny styl i strukturę dokumentu co jest zgodne z najlepszymi praktykami projektowania stron. Takie podejście umożliwia bardziej elegancką i czytelną prezentację informacji co jest kluczowe w tworzeniu intuicyjnych interfejsów użytkownika. Ważne jest aby rozumieć różnice między pseudo-elementami a innymi metodami stylizacji aby dokładnie przewidywać efekty określonych stylów w CSS i skutecznie stosować je do osiągania zamierzonych efektów projektowych. W przypadku chęci zmiany stylu całego paragrafu należałoby bezpośrednio użyć odpowiedniego selektora CSS dla całego elementu bez ograniczania się do pseudo-elementu first-line co pozwala na pełną kontrolę nad wszystkimi aspektami wizualnymi tekstu w danym kontekście.

Pytanie 19

Na ilustracji przedstawiono parametry pliku graficznego. Aby usprawnić czas ładowania obrazu na stronie internetowej, należy

A. zmniejszyć rozmiary obrazu

B. dostosować proporcje szerokości do wysokości

C. zmienić format grafiki na CDR

D. zwiększyć rozdzielczość

Zmniejszenie wymiarów rysunku to kluczowy krok w optymalizacji czasu ładowania grafiki na stronę internetową. Wymiary rysunku 4272x2848px są znaczące, co oznacza, że obraz ma dużą ilość pikseli, co przekłada się na większy rozmiar pliku. Przy standardowej rozdzielczości 72 dpi, która jest odpowiednia do wyświetlania na ekranach, mniejsze wymiary skutkują zmniejszeniem liczby pikseli, co automatycznie obniża wagę pliku. Przykładem może być przeskalowanie obrazu do wymiarów 800x600px, co może znacznie przyspieszyć czas ładowania strony. W praktyce, witryny internetowe powinny dążyć do używania obrazów o wymiarach dostosowanych do wyświetlacza, a optymalne wymiary to te, które są zgodne z responsywnym designem. Ponadto, standardy dotyczące wydajności stron, takie jak Web Page Test czy Google PageSpeed Insights, zalecają minimalizację rozmiaru plików graficznych jako kluczowy element poprawy szybkości ładowania. Zmniejszenie wymiarów rysunku jest zatem jednym z najprostszych i najbardziej efektywnych rozwiązań, które mogą przynieść znaczące korzyści w zakresie wydajności stron internetowych.

Pytanie 20

Do jakich działań można wykorzystać program FileZilla?

A. walidacji strony internetowej.

B. kompilacji skryptu na stronie.

C. debugowania skryptu na stronie.

D. publikacji strony internetowej.

FileZilla jest popularnym klientem FTP (File Transfer Protocol), który służy do przesyłania plików między lokalnym komputerem a serwerem. Publikacja strony internetowej polega na przesyłaniu plików HTML, CSS, JavaScript i innych zasobów związanych z witryną na serwer, aby były one dostępne w Internecie. Używając FileZilla, użytkownik może łatwo połączyć się z serwerem poprzez protokół FTP, co pozwala na wygodne zarządzanie plikami, ich przesyłanie oraz organizowanie folderów na serwerze. Przykładowo, po edytowaniu strony lokalnie na komputerze, można za pomocą FileZilla przesłać zmodyfikowane pliki na serwer w kilka kliknięć, co przyspiesza proces aktualizacji witryny. Zgodnie z dobrymi praktykami branżowymi, ważne jest także ustawienie odpowiednich uprawnień do plików oraz regularne tworzenie kopii zapasowych, co zwiększa bezpieczeństwo publikowanych treści. FileZilla obsługuje również protokoły SFTP i FTPS, które zapewniają dodatkowe warstwy bezpieczeństwa podczas transferu danych, co jest istotne w kontekście ochrony danych użytkowników i integracji z różnymi usługami hostingowymi.

Pytanie 21

Podstawowym celem korzystania z edytora WYSIWYG jest

A. automatyzacja odtwarzania plików multimedialnych

B. szybka wizualizacja tworzonej strony

C. ściąganie z Internetu pełnych portali WWW

D. wykrywanie błędów w bazie danych

Edytory WYSIWYG (What You See Is What You Get) są narzędziami, które umożliwiają tworzenie i edytowanie treści internetowych w sposób wizualny, co oznacza, że użytkownik widzi na ekranie dokładnie to, co otrzyma po zapisaniu dokumentu. Głównym celem ich stosowania jest przyspieszenie procesu projektowania stron internetowych poprzez natychmiastowe wizualizowanie zmian. Dzięki temu, osoby nieposiadające zaawansowanej wiedzy programistycznej mogą łatwo tworzyć atrakcyjne wizualnie strony, co ma ogromne znaczenie w kontekście szybkiego rozwoju branży webowej. Przykłady zastosowania edytorów WYSIWYG to platformy takie jak WordPress, Wix czy Squarespace, które umożliwiają użytkownikom dodawanie treści, obrazów i multimediów bez potrzeby pisania kodu. Warto również zauważyć, że edytory te wspierają standardy webowe, takie jak HTML5 i CSS3, co pozwala na optymalizację stron pod kątem SEO oraz responsywności. W związku z rosnącą popularnością edytorów WYSIWYG, znajomość ich działania staje się kluczowa dla każdego, kto pragnie efektywnie zarządzać treściami w sieci.

Pytanie 22

Jaką rozdzielczość określa jednostka ppi (ang. pixels per inch)?

A. Obrazów generowanych przez drukarki i plotery

B. Skanujących urządzeń.

C. Obrazów bitmapowych.

D. Cyfrowych przyrządów dokonujących pomiarów.

Skanery są urządzeniami, które przetwarzają obrazy z analogowych źródeł na format cyfrowy, ale nie są bezpośrednio związane z rozdzielczością wyrażaną w ppi. Często mylnie zakłada się, że skanery działają na podobnych zasadach jak drukarki, jednak ich rozdzielczość jest mierzone w dpi (dots per inch), co odnosi się do punktów na cal, a nie pikseli. Obrazy rastrowe, chociaż mają swoje zastosowanie w kontekście ppi, nie są jedynym kontekstem dla tej jednostki. Rozdzielczość obrazów rastrowych odnosi się do ich jakości i szczegółowości, jednak ppi jest najczęściej używane w kontekście druku, a nie w samym tworzeniu obrazów rastrowych. Cyfrowe urządzenia wykonujące pomiary mogą mieć różne zastosowania, ale również nie odnoszą się do ppi w kontekście ich działania czy wydajności. Rozumienie, jak różne urządzenia i techniki pomiarowe używają różnych jednostek miary do określania rozdzielczości, jest kluczowe dla prawidłowego zrozumienia tematu. W branży graficznej oraz drukarskiej ważne jest, aby właściwie interpretować te jednostki oraz ich zastosowania w praktyce.

Pytanie 23

Jaka linia w języku HTML wskazuje kodowanie znaków używane w dokumencie?

A. <meta charset="UTF-8">

B. <charset="UTF-8">

C. <encoding="UTF-8">

D. <meta encoding="UTF-8">

Zapis <meta charset="UTF-8"> jest poprawną deklaracją kodowania znaków w dokumencie HTML, ponieważ jest zgodny z aktualnymi standardami W3C. Element <meta> powinien znajdować się w sekcji <head> dokumentu HTML i pozwala przeglądarkom na właściwe interpretowanie znaków w treści strony. Kodowanie UTF-8 jest szeroko stosowane, ponieważ obsługuje wszystkie znaki w standardzie Unicode, co czyni go idealnym dla aplikacji wielojęzycznych. Użycie poprawnego kodowania jest kluczowe, aby uniknąć problemów z wyświetlaniem tekstu, takich jak błędne znaki lub krzaki, które pojawiają się, gdy przeglądarka nie wie, jak zinterpretować dane. Przykładowo, jeżeli mamy stronę internetową w kilku językach, użycie UTF-8 zapewnia, że znaki diakrytyczne w języku polskim, czeskim czy niemieckim będą poprawnie wyświetlane. Warto również pamiętać, aby zawsze umieszczać tę deklarację jako pierwszą w sekcji <head>, aby zapewnić, że przeglądarka prawidłowo zinterpretuje wszystkie inne elementy. W kontekście SEO oraz dostępności, poprawne kodowanie jest istotne, ponieważ wpływa na indeksowanie treści przez wyszukiwarki oraz ich prezentację dla użytkowników.

Pytanie 24

W przedstawionym kodzie HTML, zaprezentowany styl CSS jest stylem:

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

A. nagłówkowym

B. dynamicznym

C. lokalnym

D. zewnętrznym

Styl zewnętrzny odnosi się do stylów zapisanych w osobnym pliku CSS który jest załączany do dokumentu HTML za pomocą znacznika link w sekcji head. Taki sposób organizacji stylów umożliwia centralne zarządzanie wyglądem wielu stron jednocześnie co jest efektywne przy większych projektach. Styl nagłówkowy to styl umieszczony w sekcji head dokumentu HTML w znacznika style. Pozwala on na zdefiniowanie stylów dla całego dokumentu lecz wciąż ogranicza się do pojedynczej strony. Pomaga to w zachowaniu spójności wizualnej na stronie ale nie zapewnia tego na poziomie całego serwisu jak style zewnętrzne. Styl dynamiczny zazwyczaj odnosi się do stylów zmieniających się w odpowiedzi na akcje użytkownika często za pośrednictwem JavaScript lub CSS3. Przykładem może być zmiana koloru przycisku po najechaniu kursorem co zwykle osiągamy za pomocą pseudo-klas CSS jak :hover. W analizowanym kodzie styl CSS jest przypisany bezpośrednio do elementu HTML co jest typowym przykładem stylu lokalnego ponieważ nie jest zdefiniowany ani w zewnętrznym pliku ani w sekcji head dokumentu ani nie reaguje dynamicznie na akcje użytkownika. Zrozumienie różnic między tymi podejściami jest kluczowe dla efektywnego kodowania i stylizacji stron internetowych ze względu na różne potrzeby w projektach webowych. Właściwy wybór metody stylizacji wpływa na łatwość utrzymania i skalowalność projektu w miarę rozwoju strony internetowej. W praktyce stosowanie stylów lokalnych powinno być ograniczone do minimum ze względu na trudności w zarządzaniu i potencjalne konflikty z innymi stylami w większych projektach.

Pytanie 25

Przy założeniu, że nie istnieją inne definicje, jakie skutki będzie miało poniższe formatowanie CSS?

<style> td {padding: 30px; } </style>
 …
 <td style="padding: 10px;">Anna</td>
 <td>Ewa</td>

A. marginesy wewnętrzne wszystkich komórek wyniosą 10 px

B. margines wewnętrzny komórki z napisem Anna wyniesie 10 px, a z napisem Ewa – 30 px

C. marginesy wewnętrzne wszystkich komórek wyniosą 30 px

D. margines wewnętrzny komórki z napisem Anna wyniesie 30 px, a z napisem Ewa – 10 px

Analizując podane odpowiedzi, konieczne jest zrozumienie, jak działa specyficzność w CSS. Częstym błędem jest zakładanie, że reguły zdefiniowane w sekcji style zawsze przeważają nad innymi. Jednak style inline, czyli te bezpośrednio przypisane do elementu HTML, mają wyższy priorytet. Dlatego komórka z napisem Anna, mimo że wszystkie komórki td mają globalnie zdefiniowany padding 30px, będzie mieć padding 10px, ponieważ zapis style="padding: 10px;" bezpośrednio przypisany do niej nadpisuje regułę globalną. Myślenie, że marginesy wszystkich komórek będą równe 30px, jest błędem wynikającym z niezrozumienia priorytetów CSS. Podobnie, założenie, że wszystkie komórki mają padding 10px, ignoruje fakt, że tylko dla jednej komórki użyto stylu inline. Zrozumienie tych mechanizmów jest kluczowe dla efektywnego stylowania stron internetowych. Zasadą dobrych praktyk jest stosowanie zewnętrznych arkuszy stylów, co nie tylko poprawia czytelność kodu, ale także pozwala na lepsze zarządzanie stylem całej witryny. Użycie stylów inline powinno być ograniczone do wyjątkowych przypadków, gdzie konieczne jest szybkie nadpisanie stylu, co jednak może prowadzić do mniej optymalnego kodu w dłuższej perspektywie.

Pytanie 26

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

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

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

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

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

Znacznik <span> jest idealnym rozwiązaniem do wyświetlania tekstu w jednym wierszu, ponieważ jest to znacznik inline, co oznacza, że nie wprowadza nowych linii przed ani po swoim zawartości. W tym przypadku <span>Dobre strony </span><span style="letter-spacing:3px">mojej strony</span> pozwala na utrzymanie tekstu w jednej linii, niezależnie od zastosowanego stylu. Styl CSS, taki jak letter-spacing, może być wykorzystany do modyfikacji wyglądu tekstu, nie wpływając na jego układ w dokumentach HTML. Dodatkowo, stosowanie znacznika <span> jest zgodne z W3C, co zapewnia, że struktura dokumentu jest zrozumiała dla przeglądarek oraz urządzeń wspomagających. Przykłady zastosowania <span> obejmują wyróżnianie fragmentów tekstu, dodawanie stylizacji bez wprowadzania nowych bloków, co jest istotne w responsywnym designie. Dzięki temu, <span> staje się kluczowym elementem w budowaniu interaktywnych i estetycznych interfejsów użytkownika.

Pytanie 27

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

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

B. balance="-10"

C. loop="10"

D. volume="-100"

Atrybuty volume, loop i balance są używane w kontekście odtwarzania dźwięku, co może prowadzić do nieporozumień dotyczących ich zastosowania. Atrybut volume, choć nie jest standardowo stosowany w HTML5, odnosi się do głośności dźwięku i powinien być regulowany w sposób programowy za pomocą JavaScript, a nie jako część atrybutów tagu audio. Implementacja głośności powinna być realizowana poprzez metody JavaScript, takie jak audioElement.volume, co daje większą kontrolę nad odtwarzanym dźwiękiem. Z kolei atrybut loop jest używany do wskazania, że dźwięk powinien być odtwarzany w pętli, co jest zgodne z oczekiwaniami użytkowników, którzy chcą, aby muzyka grała w tle bez przerwy. Balance, podobnie jak volume, nie jest standardowym atrybutem HTML i w praktyce nie jest obsługiwany przez przeglądarki. Użytkownicy mogą mylnie zakładać, że te atrybuty są bezpośrednio dostępne w HTML, podczas gdy w rzeczywistości wymagają one wsparcia z poziomu skryptów. Dlatego kluczowe jest zrozumienie, że konstruując interaktywne aplikacje webowe, należy opierać się na aktualnych specyfikacjach, aby uniknąć typowych pułapek związanych z niepoprawnym użyciem atrybutów.

Pytanie 28

W HTML 5 atrybut action jest wykorzystywany w znaczniku

A. <head>

B. <body>

C. <form>

D. <code>

Zarówno <code>, <body>, jak i <head> to znaczniki HTML, które mają swoiste zastosowanie, ale nie są związane z funkcją przesyłania danych formularzy. Znacznik <code> służy do prezentacji kodu źródłowego w formacie tekstowym, co nie ma żadnego związku z obsługą formularzy. Stosowanie go w kontekście atrybutu action jest błędne, ponieważ jego rola ogranicza się do formatowania tekstu, a nie do interakcji z danymi użytkownika. Znacznik <body> odpowiada za zawartość widoczną na stronie, ale nie definiuje, jak te dane powinny być przetwarzane po ich przesłaniu. Atrybut action nie ma zastosowania w tym kontekście, ponieważ nie obsługuje przesyłania danych, a jego brak spowoduje, że formularz nie będzie miał określonego celu, co może prowadzić do nieefektywnego lub nieprawidłowego działania strony. Natomiast znacznik <head> jest używany do definiowania metadanych dokumentu HTML, takich jak tytuł strony czy odwołania do arkuszy stylów oraz skryptów. Nie zawiera elementów interaktywnych i nie ma związku z przesyłaniem formularzy, co czyni jego wybór całkowicie nietrafionym w tej sytuacji. Kluczowym błędem w rozumieniu tego zagadnienia jest mylenie ról poszczególnych znaczników i ich funkcji w architekturze dokumentu HTML.

Pytanie 29

Co można powiedzieć o przedstawionym zapisie języka HTML5?

<title>Strona o psach</title>

A. Jest opcjonalny w języku HTML5 i nie musi występować w dokumencie.

B. Zostanie wyświetlony w treści strony, na samej górze.

C. Jest jedynie informacją dla robotów wyszukiwarek i nie jest wyświetlany przez przeglądarkę.

D. Pojawi się na karcie dokumentu w przeglądarce.

Brawo, Twoja odpowiedź jest prawidłowa! Znacznikiw języku HTML 5 służy do określenia tytułu strony internetowej, który jest wyświetlany na karcie przeglądarki. Nie jest to opcjonalna informacja - każda strona powinna mieć tytuł dla lepszej identyfikacji i optymalizacji SEO (Search Engine Optimization). Tytuł strony jest jednym z kluczowych elementów dla SEO, ponieważ wyszukiwarki internetowe, takie jak Google, często wykorzystują tytuł strony jako główny link w wynikach wyszukiwania. Tytuł strony jest również ważny z punktu widzenia użytkownika - dobrze sformułowany tytuł może przyciągnąć uwagę potencjalnego odbiorcy i zachęcić go do odwiedzenia strony. Warto zauważyć, że tytuł nie jest wyświetlany bezpośrednio na stronie, ale na pasku tytułu przeglądarki lub na karcie strony. To ważne rozróżnienie pomaga zrozumieć, dlaczego niektóre elementy są widoczne dla użytkownika, a inne nie.

Pytanie 30

Na ilustracji przedstawiono strukturę bloków na stronie internetowej. Który z poniższych fragmentów CSS odpowiada takim ustawieniom? (Dla uproszczenia pominięto właściwości dotyczące koloru tła, wysokości oraz czcionki)

A. #pierwszy {float:left; width:30%; } #drugi {clear:both; width:70%; } #trzeci {float:left; width:70%; } #czwarty {clear:both; }

B. #pierwszy {float:left; width:30%;} #drugi {float:left; width:70%;} #trzeci {float:left; width:70%;} #czwarty {clear:both; }

C. #pierwszy { width: 30%; } #drugi { width: 70%; } #trzeci { width: 70%; } #czwarty { width: 100%; }

D. #pierwszy{float:left; width:30%;} #drugi {clear:both; width:70%;} #trzeci {clear:both; width:70%;} #czwarty {float:left; width:100%;}

Odpowiedź pierwsza jest prawidłowa, gdyż prawidłowo wykorzystuje właściwość float w stylach CSS, aby uzyskać pożądany układ bloków na stronie internetowej. Float pozwala elementom przemieszczać się na lewą lub prawą stronę kontenera, co jest kluczowe w tworzeniu layoutów. W tym przypadku #pierwszy, #drugi i #trzeci mają ustawione float:left, co umożliwia ich równoległe ustawienie w poziomie aż do momentu, gdy szerokości kontenera są zapełnione. Następnie blok #czwarty wymaga clear:both, aby przemieszczać się poniżej wszystkich poprzednich elementów z ustawionym float. To powszechna technika stosowana w projektowaniu responsywnych układów stron, gdzie równoległe pozycjonowanie elementów pozwala na efektywne wykorzystanie przestrzeni. Float w połączeniu z odpowiednimi szerokościami procentowymi pomaga tworzyć elastyczne projekty, które dobrze skalują się na różnych urządzeniach, co jest zgodne z nowoczesnymi standardami web developmentu. Ponadto zrozumienie działania float i clear jest fundamentem przy tworzeniu klasycznych layoutów typu grid przed wprowadzeniem nowoczesnych rozwiązań takich jak Flexbox czy CSS Grid, co pokazuje zrozumienie podstawowych zasad CSS.

Pytanie 31

Deklaracja typu dokumentu HTML: wskazuje, że kod został stworzony w wersji

A. 4

B. 7

C. 6

D. 5

Deklaracja typu dokumentu HTML, znana jako <!DOCTYPE HTML>, jest kluczowym elementem każdej strony internetowej, który informuje przeglądarkę, w jakiej wersji HTML została napisana strona. W przypadku <!DOCTYPE HTML> mówimy o wersji HTML5, która jest najnowszym standardem języka znaczników. HTML5 wprowadza wiele usprawnień i nowych funkcji w porównaniu do wcześniejszych wersji, takich jak semantyczne znaczniki, wsparcie dla multimediów (audio i wideo) oraz API do złożonych aplikacji internetowych. Przykładem zastosowania HTML5 mogą być formularze z nowymi typami inputów, które ułatwiają interakcję z użytkownikiem, takie jak 'date', 'email' czy 'url'. Również HTML5 wprowadza nowy model renderowania, który jest bardziej efektywny i dostosowany do nowoczesnych urządzeń mobilnych. Standardy HTML są ustalane przez W3C (World Wide Web Consortium), które regularnie aktualizuje specyfikacje, aby nadążać za rozwijającymi się technologiami internetowymi. W skrócie, poprawna deklaracja <!DOCTYPE HTML> jest niezbędna dla właściwego wyświetlania i działania strony w różnych przeglądarkach.

Pytanie 32

Znacznik <ins> w HTML jest używany do wskazywania

A. tekstu, który został przeformatowany

B. cytowanego fragmentu tekstu

C. tekstu, który został dodany

D. tekstu, który został usunięty

Wiesz, znacznik <ins> w HTML to coś, co używamy, żeby pokazać tekst dodany w stosunku do poprzedniej wersji dokumentu. To mega przydatne, zwłaszcza kiedy edytujemy różne treści, bo od razu widać, co się zmieniło. Zastosowanie tego znacznika można znaleźć w różnych dokumentach, jak blogi czy umowy, gdzie ważne jest, żeby pokazać, co się zmieniło w treści. Zgodnie z tym, co mówią wytyczne W3C, używanie znaczników semantycznych, jak <ins>, sprzyja lepszej dostępności tekstów i ułatwia ich zrozumienie przez wyszukiwarki oraz technologie wspierające. Przykładowo, gdy robisz poprawki w dokumencie, właśnie dzięki <ins> możesz wyróżnić nowe informacje, co sprawi, że użytkownicy łatwiej ogarną, co się zmieniło. Dobrze jest też dodać odpowiedni styl CSS, żeby nadać tym elementom wyraźniejszy wygląd.

Pytanie 33

Aby dostosować dźwięk do określonego poziomu głośności, należy zastosować efekt

A. normalizacji

B. usuwania szumów

C. wyciszenia

D. podbicia basów

Wyciszenie, jako efekt audio, ma na celu redukcję głośności sygnału do zera lub do wartości znacznie niższej niż oryginalna. Użycie wyciszenia do dopasowania dźwięku do poziomu głośności jest błędne, ponieważ nie zachowuje ono dynamiki nagrania i może prowadzić do utraty ważnych szczegółów w dźwięku. Z kolei podbicie basów jest techniką, która zwiększa poziom niskich częstotliwości, co może powodować, że dźwięk w całości staje się zbyt głośny, a niekoniecznie dopasowany do pożądanego poziomu głośności. Usuwanie szumów koncentruje się na redukcji niepożądanych dźwięków tła, co nie wpływa bezpośrednio na ogólny poziom głośności nagrania. Często myśląc o dźwięku, użytkownicy mylą działania mające na celu poprawę jakości audio z tymi, które służą do dostosowania głośności. Ważne jest zrozumienie, że dopasowanie poziomu głośności wymaga złożonego przetwarzania sygnału, które uwzględnia nie tylko maksymalne poziomy, ale także percepcję głośności przez ludzki słuch, co jest kluczowe w profesjonalnej obróbce audio.

Pytanie 34

W języku HTML zdefiniowano znacznik a oraz atrybut rel nofollow.

A. jest wskazówką dla robota wyszukiwarki Google, aby nie śledził tego linku

B. oznacza, że kliknięcie w link otworzy go w nowej karcie przeglądarki

C. oznacza, że kliknięcie w link nie przekieruje na stronę website.com

D. jest poleceniem dla przeglądarki internetowej, aby nie traktowała słowa "link" jako hiperłącza

Atrybut rel z wartością nofollow w znaczniku a w języku HTML jest kluczowym narzędziem w obszarze SEO i zarządzania linkami na stronach internetowych. Jego głównym celem jest wskazanie robotom wyszukiwarek, że nie powinny one śledzić danego linku ani przekazywać mu wartości PageRank, co jest ważnym czynnikiem w rankingach wyszukiwarek. Zastosowanie nofollow jest powszechne w kontekście linków zewnętrznych, aby zapobiec ewentualnym nadużyciom, takim jak spam czy niechciane linki. Przykładowo, jeśli strona internetowa prowadzi do innej witryny, której treść nie jest w pełni zaufana, dodanie atrybutu nofollow zabezpiecza nas przed negatywnym wpływem na naszą własną reputację w oczach wyszukiwarek. Warto także zauważyć, że nofollow nie uniemożliwia użytkownikom kliknięcia w link, a jedynie informuje roboty wyszukiwarek o braku konieczności śledzenia tego linku. Taki mechanizm wpływa na algorytmy indeksowania, co może przyczynić się do lepszej kontroli nad tym, jakie źródła są promowane przez daną stronę.

Pytanie 35

Kod umieszczony w ramce tworzy tabelę, która zawiera

A. jeden wiersz i dwa słupki

B. dwa wiersze i jeden słupek

C. dwa wiersze i dwa słupki

D. jeden wiersz i jeden słupek

Podany kod HTML tworzy tabelę z jednym wierszem i dwoma kolumnami ponieważ w strukturze tabeli element <tr> definiuje wiersz a element <td> definiuje komórkę w tym wierszu. W tym przypadku kod zawiera jeden element <tr> co wskazuje na pojedynczy wiersz oraz dwa elementy <td> co oznacza że w tym wierszu znajdują się dwie kolumny. Tego typu struktura jest powszechnie wykorzystywana do przedstawiania danych w formie tabelarycznej co jest standardową praktyką w web developmencie. Tabele HTML są kluczowym elementem w projektowaniu stron internetowych gdyż pozwalają na uporządkowane prezentowanie informacji często używane do tworzenia harmonogramów porównań czy formularzy. Ważne jest aby pamiętać o poprawnym zamykaniu znaczników oraz przestrzeganiu hierarchii struktury tabeli co zapewnia jej poprawne wyświetlanie w przeglądarkach. Dobrą praktyką jest również stosowanie zewnętrznych arkuszy CSS do stylizacji tabel co pozwala na oddzielenie struktury od prezentacji i ułatwia zarządzanie wyglądem strony. Znajomość i umiejętność tworzenia tabel jest niezbędna dla każdego web dewelopera ponieważ tabele stanowią fundamentalny element organizacji danych w HTML.

Pytanie 36

Metainformacja "Description" umieszczona w pliku HTML powinna zawierać

<head>
    <meta name="Description" content="...">
</head>

A. opis treści znajdującej się na stronie

B. informację na temat autora strony

C. spis słów kluczowych, które są wykorzystywane przez wyszukiwarki internetowe

D. nazwę aplikacji, za pomocą której stworzono stronę

Meta tag Description w HTML służy do dostarczenia krótkiego streszczenia zawartości strony internetowej Jest to jeden z kluczowych elementów optymalizacji pod kątem wyszukiwarek internetowych SEO który pomaga wyszukiwarkom i użytkownikom zrozumieć tematykę strony choć nie jest bezpośrednim czynnikiem rankingowym wyszukiwarek może wpływać na wskaźnik klikalności CTR w wynikach wyszukiwania Dzięki dobrze skonstruowanemu opisowi użytkownicy mogą szybko ocenić czy strona spełnia ich potrzeby co z kolei może zwiększyć ruch na stronie Praktyką branżową jest aby opis był zwięzły i zawierał najważniejsze informacje dotyczące zawartości strony zazwyczaj nie przekraczając 160 znaków Ponadto opis ten może być wyświetlany jako fragment w wynikach wyszukiwania co czyni go istotnym elementem strategii marketingowej strony Dobre praktyki obejmują stosowanie unikalnych i precyzyjnych opisów dla każdej podstrony co przyczynia się do lepszego zrozumienia i klasyfikacji strony przez wyszukiwarki

Pytanie 37

W stylu CSS utworzono klasę uzytkownik. Na stronie będą wyświetlane czcionką w kolorze niebieskim: p.uzytkownik { color: blue; }

A. wszystkie elementy w sekcji <body> z przypisaną klasą uzytkownik.

B. wszystkie akapity.

C. jedynie elementy tekstowe takie jak <p>, <h1>.

D. akapitów, którym przypisano klasę uzytkownik.

Odpowiedź, że paragrafy przypisane do klasy 'uzytkownik' będą miały niebieską czcionkę, jest jak najbardziej trafna. W CSS używamy kropki, żeby zdefiniować klasę, co oznacza, że styl dotyczy tylko tych elementów HTML, które mają tę klasę. Więc jeśli masz coś takiego w HTML jak <p class='uzytkownik'>, to na pewno będzie to wyświetlane z niebieską czcionką, zgodnie z Twoją regułą CSS. Takie podejście super wspiera modularność i możliwość ponownego użycia kodu, co jest naprawdę ważne w tworzeniu stron. Dzięki klasom CSS łatwo da się ogarnąć styl w różnych miejscach w kodzie, a zmieniając kolor czcionki w pliku CSS, zmiana ta natychmiast zaktualizuje wszystkie elementy z tą klasą. Przykładowo, akapit <p class='uzytkownik'> będzie miał niebieski kolor i to fajnie wpływa na spójność wizualną strony. Pamiętaj też, że klasy CSS można stosować nie tylko do akapitów, ale też do innych znaczników, co daje większą swobodę w stylizacji treści.

Pytanie 38

Który z wymienionych formatów wideo nie jest wspierany przez standard HTML5?

A. D. WebM

B. A. AVI

C. C. MP4

D. B. Ogg

Wybór Ogg, MP4 czy WebM jako odpowiedzi niewłaściwych jest nie do końca trafny, bo wszystkie te formaty są jednak obsługiwane przez HTML5. Ogg, mimo że mniej popularny, jest całkowicie ok w specyfikacji HTML5 i zyskuje na znaczeniu w kontekście otwartych standardów. MP4 to jeden z najpopularniejszych formatów, wspierany przez prawie wszystkie przeglądarki i urządzenia mobilne, więc to świetny wybór do strumieniowania. WebM, stworzony przez Google, również ma swoje miejsce i jest często używany do wideo w sieci. Wiele osób myli się myśląc, że mniej znane formaty są niekompatybilne z HTML5. Często ludzie uważają, że starsze formaty jak AVI są bardziej uniwersalne, ale to nieprawda, bo współczesne przeglądarki mają inne wymagania. Dlatego tak ważne jest, by programiści i twórcy treści znali różnorodność formatów i ich zastosowanie w multimediach w sieci.

Pytanie 39

W nagłówku dokumentu HTML umieszczono ```Strona miłośników psów``` Tekst ten pojawi się

A. w zawartości strony, na banerze

B. w zawartości strony, w pierwszym widocznym nagłówku

C. w polu adresowym, przy podanym adresie URL

D. na pasku tytułowym przeglądarki

Niektóre odpowiedzi, które nie dotyczą paska tytułu w przeglądarce, są błędne z kilku powodów. Na przykład, treść na banerze strony nie ma nic wspólnego z tagiem <title>, bo baner to tylko wizualna część strony. Tytuł strony nie znajdzie się na banerze, bo to całkiem inne miejsce. A i pole adresu, gdzie wpisujemy URL, służy tylko do nawigacji i nie pokazuje tytułu. Jak ktoś wpisuje adres, widzi tylko URL, a nie tag <title>. Oprócz tego, tytuł nie pojawia się w treści strony ani w głównym nagłówku (np. <h1>), bo jego głównym celem jest wyróżnienie strony i pomoc w SEO. Nagłówki odnoszą się do treści, a tytuł ma swoją funkcję. Dlatego ważne jest, żeby rozumieć rolę tagu <title>, bo to klucz do tworzenia estetycznych i funkcjonalnych stron.

Pytanie 40

Zapis w CSS `h2 {background-color: green;}` spowoduje, że kolor zielony będzie dotyczył

A. tła tekstu nagłówka drugiego poziomu

B. tła całej witryny

C. czcionki wszystkich nagłówków na stronie

D. czcionki nagłówków drugiego poziomu

No dobra, wszystkie inne odpowiedzi są błędne z paru powodów. Mówiąc, że ten zapis CSS dotyczy tła całej strony, jest to trochę nieprecyzyjne, bo ta reguła odnosi się tylko do nagłówków h2. Zmiana tła strony to inna sprawa i robi się to w sekcji <body>, a nie przez nagłówek. Jeszcze ta kwestia z kolorem zielonym – to nie jest kolor czcionki nagłówka, bo 'background-color' zmienia tylko tło, a nie kolor tekstu. Żeby zmienić kolor czcionki, musimy użyć 'color', bo to jest zupełnie inna funkcjonalność w CSS. I ostatni błąd to stwierdzenie, że styl dotyczy czcionki każdego nagłówka na stronie. Jeśli nie ustawimy ogólnych stylów dla wszystkich nagłówków, to ta reguła działa tylko na h2. Warto zrozumieć, jak CSS działa, żeby wiedzieć, jakie właściwości kiedy używać i co dokładnie one robią w kontekście HTML.

Rozpocznij nowy egzamin

Powrót do strony głównej