Wyniki egzaminu

Informacje o egzaminie:
  • Zawód: Technik fotografii i multimediów
  • Kwalifikacja: AUD.05 - Realizacja projektów graficznych i multimedialnych
  • Data rozpoczęcia: 8 grudnia 2025 10:34
  • Data zakończenia: 8 grudnia 2025 10:53

Egzamin zdany!

Wynik: 25/40 punktów (62,5%)

Wymagane minimum: 20 punktów (50%)

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

Która cecha pozwala na użycie czcionki, na przykład, w przypadku tekstu nachylonego?

A. font-size
B. text-indent
C. font-family
D. font-style
Wybór innych właściwości CSS w celu stylizacji tekstu może prowadzić do nieporozumień i błędów w projektowaniu. Właściwość 'text-indent', na przykład, służy do wstawiania wcięcia na początku bloku tekstowego, co może być użyteczne w kontekście akapitów, ale nie ma wpływu na styl czcionki, w tym jej pochylenie. Użytkownicy często mylą tę właściwość z formatowaniem stylu, co prowadzi do niewłaściwych założeń. 'font-size' odnosi się wyłącznie do rozmiaru czcionki, podczas gdy 'font-family' pozwala na wybór rodzaju czcionki, co jest istotne przy zapewnieniu spójności wizualnej, ale nie zmienia stylu tekstu. Często błędnie zakłada się, że zmiana rozmiaru lub rodzaju czcionki automatycznie wprowadzi wymagany styl, co jest mylne. Właściwość 'font-family' definiuje, jakie konkretne czcionki mają być używane, ale nie ma wpływu na ich styl. W projektowaniu webowym kluczowe jest zrozumienie, że każda z tych właściwości pełni inną funkcję i ich stosowanie powinno być zgodne z przeznaczeniem. Nieodpowiednie użycie tych właściwości może prowadzić do nieczytelnych i nieestetycznych interfejsów. Aby skutecznie stylizować tekst, niezbędna jest znajomość i umiejętność aplikacji odpowiednich właściwości CSS, co jest fundamentalne w dobrych praktykach web designu.

Pytanie 2

W jakich formatach powinien być zorganizowany materiał filmowy przeznaczony do umieszczenia w internetowym projekcie multimedialnym?

A. FLA, SVG
B. FLV, TIFF
C. WEBM, DOCX
D. MPEG-4, MOV
Wybór innych odpowiedzi, takich jak "FLV, TIFF", "FLA, SVG" czy "WEBM, DOCX", nie jest odpowiedni do skatalogowania materiału filmowego przeznaczonego do projektów multimedialnych. Format FLV, choć kiedyś popularny w kontekście odtwarzania wideo w internecie, obecnie jest coraz rzadziej stosowany ze względu na problemy z kompatybilnością z nowoczesnymi przeglądarkami i urządzeniami mobilnymi. TIFF to format przeznaczony głównie do przechowywania obrazów rastrowych, a nie wideo. Z kolei FLA to format plików źródłowych dla Adobe Flash, który nie jest już szeroko wspierany, a SVG jest formatem grafiki wektorowej, co również nie ma zastosowania w przypadku materiałów wideo. Odpowiedź "WEBM, DOCX" zawiera format WEBM, który jest używany do wideo w internecie, ale format DOCX jest dokumentem tekstowym, co czyni tę odpowiedź nieodpowiednią. Typowe błędne podejścia to mylenie formatów wideo z formatami obrazów lub dokumentów, co prowadzi do nieprawidłowego katalogowania mediów. Zrozumienie specyfikacji i zastosowania odpowiednich formatów jest kluczowe w pracy z multimediami, szczególnie w kontekście optymalizacji zarówno dla wydajności, jak i jakości treści.

Pytanie 3

Zanim zamieścisz w Internecie materiał multimedialny zawierający wizerunek osoby niepełnoletniej, należy

A. umieścić zdjęcie osoby niepełnoletniej po prawej stronie slajdu
B. podpisać zdjęcie osoby niepełnoletniej, podając jej imię oraz nazwisko
C. uzyskać zgodę osoby niepełnoletniej oraz jej prawnych opiekunów
D. uzyskać zgodę osoby niepełnoletniej na zamieszczenie wizerunku
Uzyskanie zgody osoby nieletniej oraz jej prawnych opiekunów przed publikacją wizerunku jest kluczowym elementem ochrony prywatności i praw dziecka, zgodnie z obowiązującymi przepisami prawa, w tym RODO. Osoby nieletnie nie są w pełni zdolne do podejmowania decyzji dotyczących wykorzystania ich wizerunku, dlatego zgoda ich opiekunów prawnych jest niezbędna. Przykładem zastosowania tej zasady jest sytuacja, w której szkoła planuje opublikować zdjęcia dzieci z wydarzenia szkolnego na swojej stronie internetowej. W takim przypadku szkoła musi uzyskać pisemną zgodę zarówno od dzieci, jak i ich rodziców lub opiekunów. Dobre praktyki w zakresie ochrony danych osobowych przewidują stosowanie formularzy zgody, które jasno określają, w jaki sposób i w jakim celu dane będą wykorzystywane, co zwiększa transparentność i zaufanie do instytucji. Należy również pamiętać, że zgoda może być cofnięta w każdym momencie, co powinno być jasno komunikowane w formularzu.

Pytanie 4

Logo, menu, baner, widgety oraz intro to składniki

A. prezentacji multimedialnej
B. animacji poklatkowej
C. profesjonalnego materiału wideo z wydarzenia
D. układu strony internetowej
Odpowiedzi dotyczące prezentacji multimedialnej, profesjonalnego materiału wideo z eventu oraz animacji poklatkowej nie są trafne w kontekście wymienionych elementów. Prezentacja multimedialna, jako forma przekazu, skupia się na dynamicznym przedstawieniu informacji, często poprzez slajdy, co nie odnosi się do stałych elementów layoutu strony internetowej. Materiał wideo z eventu ma na celu dokumentację wydarzenia i interakcję z publicznością, a nie kreowanie struktury witryny, podczas gdy animacja poklatkowa to technika filmowa, która nie ma zastosowania w kontekście układu strony. Tego rodzaju pomyłki mogą wynikać z nieporozumienia dotyczącego zakresu funkcji każdego z tych elementów. Wiele osób myli pojęcia, ponieważ wszystkie te formy treści mogą być używane w ramach strony internetowej, ale nie są to elementy, które definiują layout. Layout strony internetowej jest narzędziem do organizowania treści w sposób, który ułatwia użytkownikom nawigację i interakcję, co jest zupełnie innym podejściem niż tworzenie złożonych prezentacji lub filmów. Dobrze zrozumiane podstawy web designu powinny koncentrować się na hierarchii wizualnej, dostępności i użyteczności, co nie znajduje odzwierciedlenia w wymienionych niepoprawnych odpowiedziach.

Pytanie 5

Według zasad typografii w sieci, maksymalna liczba znaków w jednej linii tekstu wynosi

A. 50 znaków
B. 37 znaków
C. 25 znaków
D. 95 znaków
Wybór 95, 37 czy 25 znaków jako odpowiedzi błędnych jest nietrafiony z kilku powodów. Wytypowanie długości 95 znaków może wydawać się kuszące, zwłaszcza w kontekście większej ilości informacji w jednej linii, jednak prowadzi do obniżonej czytelności. Zbyt długa linia tekstu może powodować zmęczenie oczu i trudności w śledzeniu toku myślenia czytelnika, co jest sprzeczne z zasadami ergonomii w projektowaniu treści internetowych. Z kolei wybór 37 znaków jako optymalnej długości ignoruje zalecenia dotyczące efektywnego wykorzystania przestrzeni. Przesadnie krótkie linie mogą fragmentować tekst, co zniechęca do jego kontynuowania. Odpowiedź z 25 znakami jest jeszcze bardziej problematyczna, ponieważ jest to zbyt krótka długość, która nie pozwala na efektywne przedstawienie informacji, co prowadzi do skondensowania myśli i zniechęcania do dalszego czytania. Właściwe podejście do typografii wymaga zastosowania zbalansowanej długości linii, co ma kluczowe znaczenie dla zachowania płynności oraz wygody czytania tekstu. W kontekście designu internetowego, stosowanie odpowiednich długości linii tekstu w połączeniu z innymi aspektami typografii, takimi jak wielkość czcionki, interlinia, kontrast czy kolor, stanowi fundament dobrego UX i UI, które wpływa na zaangażowanie użytkowników.

Pytanie 6

Jakie są następne kroki w tworzeniu galerii internetowych?

A. masowa obróbka zdjęć, testy prędkości ładowania galerii, publikacja, działania programistyczne, optymalizacja
B. nabycie wybranych zdjęć, testowanie funkcji strony, optymalizacja i walidacja, publikacja, weryfikacja poprawności witryny, prace programistyczne
C. tworzenie fotografii, hosting, dobór szablonu, pozycjonowanie, publikacja
D. edycja i katalogowanie zdjęć, działania webmasterskie, prace programistyczne, testy, publikacja, aktualizacja
Słuchaj, w twoich odpowiedziach jest kilka rzeczy, które mogą wprowadzać w błąd, jeśli chodzi o projektowanie galerii internetowych. Zakup zdjęć i testowanie funkcjonalności mogą być częścią procesu, ale nie są kluczowe. Zazwyczaj kupujesz zdjęcia po ustaleniu, jak ma wyglądać galeria. Testowanie powinno być robione po programowaniu, a nie przed publikacją. Inaczej możesz wpuścić na stronę coś, co nie działa, co jest totalną katastrofą. A co do obróbki zdjęć – to się zgadza, ale najpierw musisz zaplanować, jak będzie wyglądała struktura treści. Obróbka to ważna sprawa, ale nie zastąpi wcześniejszego edytowania i organizowania zdjęć. No i ostatnia rzecz – mówienie o hostingu jako kluczowym etapie pomija rolę prac webmasterskich i programistycznych, które są mega ważne, żeby galeria działała jak należy. Żeby uniknąć błędów, musisz uwzględnić wszystkie etapy i poukładać je sensownie według najlepszych praktyk w web developmencie.

Pytanie 7

W języku HTML znacznik zawiera

A. blok informacji widocznych dopiero w momencie rozwinięcia go przez użytkownika.
B. opisy i słowa kluczowe, które są wykorzystywane przez serwisy wyszukujące.
C. nazwę dokumentu.
D. treść dokumentu.
Często można spotkać się z przekonaniem, że znacznik <meta> służy do przechowywania treści czy tytułu dokumentu, albo nawet do prezentowania jakichś ukrytych bloków informacji, które użytkownik może rozwinąć. To są jednak błędne założenia wynikające przeważnie z mylenia ról poszczególnych znaczników HTML. Treść dokumentu zawsze umieszcza się wewnątrz znacznika <body>, a nie <meta>. <meta> nigdy nie służy do wyświetlania treści czy jakiejkolwiek zawartości, którą zobaczy użytkownik na stronie. Jeśli chodzi o nazwę dokumentu – za to odpowiada znacznik <title>, który umieszczamy w sekcji <head>; to właśnie on pojawia się na karcie przeglądarki czy w zakładkach. Pomysł z blokiem informacji, który się rozwija dopiero po jakiejś interakcji, raczej przypomina użycie <details>, <summary> lub nawet jakichś rozwiązań opartych na JavaScripcie czy CSS, ale nigdy <meta>. <meta> jest przeznaczony wyłącznie do przekazywania dodatkowych, niewidocznych informacji o stronie – takich jak opisy, słowa kluczowe, informacje o autorze, kodowaniu znaków czy nawet różne specjalne instrukcje dla robotów indeksujących. Bardzo łatwo pomylić <meta> z innymi znacznikami z sekcji <head>, bo wszystkie one w naturalny sposób są niewidoczne dla zwykłego użytkownika, ale ich zastosowanie jest ściśle określone w standardach W3C. Moim zdaniem najczęstszym powodem takich pomyłek jest pobieżne zapoznanie się z dokumentacją lub skupianie się wyłącznie na widocznej części strony. Dobre opanowanie roli <meta> to podstawa przy projektowaniu każdej profesjonalnej strony www, bo bez tego łatwo można stworzyć stronę, której nie znajdą wyszukiwarki, albo która będzie źle wyświetlana przez różne przeglądarki.

Pytanie 8

W dokumencie hipertekstowym, przy pomocy znacznika , określa się

A. rozpoczęcie dokumentu HTML
B. zakończenie nagłówka dokumentu HTML
C. rozpoczęcie nagłówka dokumentu HTML
D. zakończenie dokumentu HTML
Znacznik <HEAD> w dokumentach HTML jest kluczowym elementem, który definiuje początek sekcji nagłówkowej dokumentu. Sekcja ta zawiera meta informacje, które są istotne dla przeglądarek internetowych oraz wyszukiwarek, ale nie są bezpośrednio wyświetlane na stronie. W nagłówku można umieścić takie elementy jak tytuł strony (<TITLE>), odwołania do arkuszy stylów CSS, skrypty JavaScript, a także meta tagi, które informują o autorze, opisie czy słowach kluczowych. Zgodnie z standardami W3C, poprawne zdefiniowanie nagłówka jest niezbędne dla prawidłowego działania dokumentu HTML, co ma wpływ na SEO oraz na sposób, w jaki strona jest renderowana. Przykładowo, title jest kluczowym elementem, ponieważ pojawia się na pasku tytułowym przeglądarki oraz w wynikach wyszukiwania, co podkreśla znaczenie sekcji <HEAD> w kontekście organizacji i prezentacji treści. Dlatego znajomość struktury dokumentów HTML oraz poprawnego użycia znaczników jest niezbędna w codziennej pracy web dewelopera.

Pytanie 9

Grafika cyfrowa stworzona w rozdzielczości 72 ppi powinna znaleźć zastosowanie w

A. wydruku plakatów w formacie A2
B. publikacji książkowej
C. wydruku przestrzennego 3D
D. publikacji internetowej
Odpowiedź 'publikacja internetowa' jest poprawna, ponieważ projekty graficzne zdigitalizowane w rozdzielczości 72 ppi (pikseli na cal) są odpowiednie do wykorzystania głównie w mediach elektronicznych. Rozdzielczość ta jest wystarczająca dla wyświetlania na ekranach komputerów, tabletów i smartfonów, gdzie obraz jest renderowany w pikselach. W przypadku publikacji internetowych, takich jak strony internetowe, blogi czy media społecznościowe, nie ma potrzeby stosowania wyższej rozdzielczości, ponieważ ekran nie potrafi wyświetlić większej liczby szczegółów. Standardowe praktyki branżowe wskazują, że dla druku, zwłaszcza w formacie książek lub plakatów, zaleca się wyższą rozdzielczość, zazwyczaj 300 ppi, aby zapewnić odpowiednią jakość i ostrość obrazu. Przykładem zastosowania 72 ppi mogą być grafiki na stronach internetowych czy banerach reklamowych, gdzie szybkość ładowania strony i estetyka są kluczowe. Ważne jest, aby projektanci rozumieli różnice w wymaganiach dotyczących rozdzielczości, aby dostarczyć odpowiednie pliki graficzne w zależności od medium, w którym będą one prezentowane.

Pytanie 10

W celu wykonania reklamy internetowej o maksymalnej szerokości do 800 pikseli należy zdefiniować właściwość

A. max-height
B. max-width
C. background size
D. background-position
Właściwość CSS max-width to jeden z najprostszych i najbardziej przydatnych sposobów, żeby ograniczyć szerokość elementu – na przykład reklamy internetowej – do maksymalnej wartości, jakiej sobie życzymy. Dzięki temu nawet jeśli ktoś otworzy naszą stronę na ogromnym monitorze albo reklama „wpadnie” do większego kontenera, nie rozciągnie się ona poza wskazany limit, czyli w tym przypadku 800 pikseli. Moim zdaniem to absolutna podstawa przy projektowaniu responsywnych interfejsów. max-width nie zmusza elementu do konkretnej szerokości, tylko pozwala mu się kurczyć i rosnąć do określonej granicy. To ma duże znaczenie, szczególnie gdy reklama ma wyglądać dobrze zarówno na desktopie, jak i na smartfonie. Takie podejście jest też zgodne z najnowszymi standardami CSS oraz rekomendacjami Google dotyczących reklam displayowych. Warto dodać, że max-width działa lepiej niż width w sytuacji, gdy zależy nam na elastyczności – width ustawia sztywną wartość, a max-width daje nam trochę więcej swobody, bo pozwala elementowi się automatycznie dopasowywać. Przykładowy kod: .banner { max-width: 800px; width: 100%; } – dzięki temu nawet jeśli użytkownik zmieni rozmiar okna, baner nigdy nie przekroczy 800 pikseli, ale nadal może się zmniejszyć na mniejszych ekranach. Szczerze mówiąc, ciężko mi sobie wyobrazić robienie serwisu bez tej właściwości.

Pytanie 11

Aby wyróżnić tekst, wyświetlając go na żółtym tle, jaki znacznik należy zastosować?

A. <small>
B. <mark>
C. <del>
D. C.
Znacznik <mark> to fajne narzędzie w HTML, bo pozwala wyróżnić istotne fragmenty tekstu. Można dzięki niemu podświetlić ważne informacje, na przykład na żółtym tle, co na pewno przyciąga wzrok. Kiedy używasz <mark>, to czytelnicy łatwiej zauważają kluczowe punkty, co jest super przydatne w różnych dokumentach, artykułach czy nawet podczas prezentacji. Używanie semantycznych znaczników to dobry pomysł, bo dzięki temu strona jest bardziej zrozumiała, a także bardziej przyjazna dla osób z różnymi potrzebami. Czytniki ekranowe bardzo cenią sobie takie podejście. Warto pamiętać, że standardy W3C promują używanie znaczników, które mają znaczenie w kontekście treści, więc <mark> na pewno jest praktycznym narzędziem do tworzenia dostępnych stron.

Pytanie 12

Który atrybut znacznika powinien być użyty, aby włączyć grafikę do strony WWW w sposób spełniający wytyczne WCAG dotyczące użyteczności oraz dostępności serwisów internetowych?

A. id
B. alt
C. name
D. target
Podczas rozważania innych atrybutów znacznika <img> w kontekście dostępności, warto zauważyć, że atrybuty takie jak 'target', 'id' i 'name' nie mają zastosowania w kontekście zapewnienia informacji wizualnych dla użytkowników z niepełnosprawnościami. Atrybut 'target' jest używany w kontekście linków, aby określić, w jaki sposób strona powinna się otworzyć (np. w nowej karcie), co nie ma związku z obrazami czy ich opisami. Z kolei 'id' to unikalny identyfikator elementu w dokumencie HTML, który nie dostarcza żadnych informacji o zawartości wizualnej ani nie wpływa na dostępność. Atrybut 'name' jest rzadziej używany w nowoczesnych standardach HTML i w kontekście obrazów nie wnosi wartości informacyjnej. Stosowanie tych atrybutów w miejsce 'alt' może prowadzić do sytuacji, w której osoby z ograniczeniami wzrokowymi nie będą miały możliwości zrozumienia kontekstu wizualnego, co jest sprzeczne z zasadami dostępności. Ignorując istotę atrybutu 'alt', twórcy stron internetowych mogą nieświadomie wykluczać znaczną część użytkowników, co jest nie tylko problemem etycznym, ale i prawnym w świetle regulacji dotyczących dostępności.

Pytanie 13

Określ jednostkę rozdzielczości oraz tryb kolorystyczny, które powinny zostać ustalone przy przygotowywaniu zdjęć cyfrowych do projektu witryny internetowej.

A. dpi i CMYK
B. spi i CMYK
C. lpi i RGB
D. ppi i RGB
Poprawna odpowiedź to ppi i RGB, ponieważ 'ppi' (pixels per inch) jest jednostką rozdzielczości wskazującą, ile pikseli znajduje się na jednym calu obrazu. Jest to istotne w kontekście przygotowywania fotografii cyfrowych do wyświetlania w Internecie, gdzie wyższa rozdzielczość ppi przekłada się na lepszą jakość wizualną na ekranach. Z kolei 'RGB' (Red, Green, Blue) to tryb koloru, który jest standardem w elektronice oraz w grafice komputerowej, idealnym do wyświetlania obrazów na monitorach. Przygotowując zdjęcia do galerii internetowej, zaleca się używanie RGB, ponieważ większość urządzeń wyświetlających, takich jak monitory komputerowe czy smartfony, wykorzystuje ten model kolorów. Zastosowanie ppi i RGB pozwala na uzyskanie optymalnej jakości wizualnej oraz efektywności wyświetlania, co wpływa na pozytywne doświadczenie użytkowników przeglądających galerię. Przykładowo, zdjęcia przygotowane w rozdzielczości 72 ppi są wystarczające do wyświetlania w Internecie, a w przypadku druku warto zadbać o wyższą rozdzielczość, na poziomie 300 ppi.

Pytanie 14

Przygotowując graficzny projekt reklamy do publikacji w sieci,

A. zmienia się obiekty wektorowe na grafikę rastrową
B. dodaje się spady
C. wprowadza się linie bigowania
D. konwertuje się obrazy cyfrowe na obiekty inteligentne
Zamiana obiektów wektorowych na grafikę rastrową jest istotną praktyką w procesie dostosowywania projektów graficznych do publikacji w internecie. Wektorowe elementy graficzne, takie jak ilustracje i logotypy stworzone w programach takich jak Adobe Illustrator, są oparte na matematycznych definicjach kształtów, co pozwala im na bezstratne skalowanie w różnych rozmiarach. Jednak w przypadku publikacji internetowych, gdzie elementy często są renderowane w zdefiniowanej rozdzielczości, konwersja tych obiektów na grafikę rastrową (np. PNG, JPEG) pozwala na lepsze dopasowanie do wymogów przeglądarek i oszczędność zasobów. Przykładem może być strona internetowa, która wykorzystuje obrazy rastrowe w celu osiągnięcia szybszego ładowania oraz optymalizacji dla urządzeń mobilnych. Ważne jest, aby podczas konwersji zachować odpowiednią rozdzielczość, co jest kluczowe dla jakości wizualnej. W kontekście standardów branżowych, praktyka ta odnosi się do zasad optymalizacji zasobów graficznych, co jest fundamentalne w nowoczesnym web designie.

Pytanie 15

Która z właściwości nie definiuje formatu GIF?

A. Ograniczona paleta kolorów
B. Często używany w projektowaniu stron WWW
C. Wykorzystywany do grafiki wektorowej
D. Pozwala na zapis oraz odtwarzanie animacji
Często spotyka się błędne myślenie, że GIF nadaje się do grafiki wektorowej, ale to nieprawda. Wektorowa grafika działa na zupełnie innych zasadach, bo jest tworzona za pomocą matematycznych obiektów. Dzięki temu można ją skalować bez straty jakości, a GIF to format rastrowy, gdzie mamy do czynienia z siatkami pikseli. Używanie GIF-ów do wektorowej grafiki to trochę jak robienie spaghetti w pralce – nie wyjdzie. No i trzeba pamiętać, że GIF ma ograniczoną paletę kolorów, więc nie odda pełnej palety barw w bardziej złożonych obrazach. Kiedy ktoś myli GIF z formatami do grafiki wektorowej, takimi jak SVG, to mogą pojawić się niezłe nieporozumienia. Praktyka w grafice wymaga, żeby znali różnice między tymi formatami, jeśli chcą wykorzystać ich najlepsze cechy w swoich projektach.

Pytanie 16

W języku HTML znacznik zawiera

A. treść dokumentu.
B. nazwę dokumentu.
C. opisy i słowa kluczowe, które są wykorzystywane przez serwisy wyszukujące.
D. blok informacji widocznych dopiero w momencie rozwinięcia go przez użytkownika.
Wiele osób zaczynających naukę HTML myli się w kwestii roli znacznika <meta>, czasem zakładając, że odpowiada on za główną treść dokumentu, jego nazwę czy nawet jakieś ukryte, rozwijane fragmenty. W rzeczywistości <meta> nie służy do przechowywania widocznych elementów strony ani do nadawania jej nazw. Treść dokumentu, czyli to, co użytkownik widzi na stronie, umieszcza się w sekcji <body> za pomocą takich znaczników jak <p>, <div>, <h1> itd. <meta> znajduje się natomiast w sekcji <head> i nigdy nie pokazuje niczego bezpośrednio użytkownikowi. Nazwę dokumentu ustala się przez <title>, a nie <meta>, co jest częstym problemem – tytuł pojawia się np. na karcie przeglądarki i jako nagłówek wyników wyszukiwania. Wersje HTML nie przewidują też żadnego mechanizmu, w którym <meta> przechowuje bloki danych rozwijane przez użytkownika – do tego służą zupełnie inne narzędzia, jak <details> czy skrypty w JavaScript. Typowy błąd to także założenie, że <meta> działa automatycznie na pozycjonowanie, podczas gdy obecnie niektóre wyszukiwarki ignorują wybrane tagi meta (np. keywords), a większą wagę przykładają do realnej treści i struktury strony. W praktyce dobre wykorzystanie <meta> polega na świadomym umieszczaniu opisów (meta description), słów kluczowych, informacji o kodowaniu czy instrukcji dla robotów, co wynika bezpośrednio ze specyfikacji HTML5. Rozumienie, gdzie umieścić <meta> i jakie dane może zawierać, jest kluczowe dla każdego, kto chce tworzyć profesjonalne i nowoczesne strony internetowe. Warto też pamiętać, że meta tagi są narzędziem dla maszyn, a nie dla końcowego użytkownika – to subtelna, ale istotna różnica, której pominięcie prowadzi do wielu nieporozumień.

Pytanie 17

Wskaż poprawny kod HTML5 dołączający do istniejącej strony plik film.ogg tak, aby przeglądarka mogła załadować plik do pamięci, nawet jeżeli nie zostanie on odtworzony, oraz aby zostały wyświetlone domyślne kontrolki odtwarzania filmu?

A.<video src="film.ogg" width="400" height="300" preload></video>
B.<object src="film.ogg" width="400" height="300" load controls> </object>
C.<object src="film.ogg" width="400" height="300" preload="none"
controls="yes"></object>
D.<video src="film.ogg" width="400" height="300"
preload="auto"controls="controls"></video>
A. C.
B. D.
C. B.
D. A.
Błędne odpowiedzi często wynikają z niepełnego zrozumienia, jak działa znacznik <video> i jego atrybuty w HTML5. Wiele osób może błędnie sądzić, że pominięcie atrybutu 'controls' jest akceptowalne, co prowadzi do sytuacji, w której użytkownicy nie mają możliwości interakcji z odtwarzanym materiałem. Bez tego atrybutu, plik wideo staje się jedynie statycznym elementem, bez możliwości zatrzymania, przewijania czy regulacji głośności, co znacznie obniża jego użyteczność. Kolejnym powszechnym błędem jest nieprawidłowe ustawienie atrybutu 'preload'. Użytkownicy mogą myśleć, że nie jest on potrzebny, co w praktyce może prowadzić do opóźnień w odtwarzaniu wideo, szczególnie na wolniejszych połączeniach. Zrozumienie, że 'preload' informuje przeglądarkę o tym, aby załadowała wideo w tle, jest kluczowe dla zapewnienia płynnego doświadczenia użytkownika. Ponadto, niezgodność z typami plików i nieodpowiednie użycie atrybutu 'type' w znaczniku <source> może prowadzić do tego, że wideo nie będzie odtwarzane w niektórych przeglądarkach, co jest istotnym problemem, gdyż wymagania dotyczące kompatybilności wideo są różne w różnych środowiskach. Wiedza na temat prawidłowego korzystania z HTML5 i jego elementów multimedialnych jest nie tylko wymagana, ale również kluczowa w tworzeniu nowoczesnych i dostępnych aplikacji internetowych.

Pytanie 18

Aby wzbogacić funkcjonalność witryny internetowej opartej na systemie zarządzania treścią, należy zainstalować

A. czcionki
B. archiwizery
C. kodeki
D. wtyczki
Fonty to elementy typograficzne, które wpływają na wygląd tekstu na stronie, ale nie mają one bezpośredniego wpływu na funkcjonalności systemu zarządzania treścią. Choć są istotne dla estetyki i czytelności, nie rozszerzają one możliwości interakcji czy działania aplikacji. Kodeki są z kolei stosowane do kompresji i dekompresji multimediów, co jest kluczowe dla odtwarzania dźwięku i wideo, ale nie wprowadzają nowych funkcji do CMS-a. Wreszcie, archiwizery to narzędzia służące do kompresji plików, co ma zastosowanie głównie w kontekście przechowywania i przesyłania danych, a nie w rozwoju i funkcjonalności stron internetowych. Typowym błędem myślowym jest mylenie poprawy wyglądu lub zarządzania danymi z rozszerzaniem funkcjonalności, co prowadzi do wyboru niewłaściwych narzędzi do konkretnego zadania. Właściwe podejście do rozwoju stron internetowych powinno uwzględniać specyfikę i zadania, jakie mają być zrealizowane, co wskazuje na istotność wtyczek jako kluczowego elementu w ekosystemie CMS.

Pytanie 19

Wskaż obowiązek spoczywający na właścicielu strony internetowej, który zamierza wykorzystać na stronie zdjęcia oznaczone zamieszczonymi symbolami licencji creative commons.

Ilustracja do pytania
A. Użycia w celach niekomercyjnych.
B. Uznania autorstwa, na tych samych warunkach.
C. Wyłącznie uznania autorstwa.
D. Użycia komercyjnego, na tych samych warunkach.
Prawidłowa odpowiedź wynika z zasad licencji Creative Commons oznaczonych symbolami BY (uznanie autorstwa) oraz SA (na tych samych warunkach). Kiedy właściciel strony internetowej zamierza wykorzystać zdjęcia z taką licencją, musi nie tylko podać autora (np. w opisie zdjęcia, stopce strony, albo metadanych), ale też – i to jest istotne – jeśli modyfikuje, edytuje albo tworzy na podstawie tego zdjęcia coś nowego (np. kolaż, przeróbkę), efekt tej pracy również udostępnia na identycznej licencji, czyli „na tych samych warunkach”. Oznacza to, że inni użytkownicy mają potem takie same prawa do dalszego wykorzystywania tego utworu. To bardzo chroni otwarty obieg twórczości, bo uniemożliwia „zamknięcie” przerobionych wersji – zawsze muszą być dostępne na takich samych zasadach, jak oryginał. Spotykałem się z sytuacjami, gdzie to przeoczenie prowadziło do konfliktów, bo ktoś zmienił zdjęcie, ale nie udostępnił swojej wersji dalej w duchu CC-SA i był problem. Moim zdaniem warto dodać, że ta zasada promuje otwarty dostęp i wspólne budowanie zasobów. W praktyce trzeba przy każdym wykorzystaniu wskazać twórcę (np. „fot. Jan Kowalski, CC BY-SA 4.0”) i, jeśli zdjęcie zostało zmodyfikowane, dopisać: „na podstawie: ...”. Dla osób prowadzących strony firmowe czy blogi to standardowa, bardzo dobra praktyka – w sieci liczy się transparentność. Bez takiego oznaczenia można narazić się na roszczenia prawne, a tego raczej nikt nie chce.

Pytanie 20

W zewnętrznym arkuszu stylów, który jest powiązany z określoną stroną www, znajduje się zapis:
img {border : 3px solid black ; margin: 20px},
natomiast w wewnętrznym arkuszu stylów tej strony:
img {border-color : red}.
Jeśli w sekcji body zostanie umieszczony tekst:
<img src = "obrazki/fotol9.jpg" style = "margin: 15px" />
to obrazek foto19.jpg zostanie wyświetlony z

A. czerwoną ramką oraz marginesem 20 pikseli
B. czarną ramką oraz marginesem 15 pikseli
C. czarną ramką oraz marginesem 20 pikseli
D. czerwoną ramką oraz marginesem 15 pikseli
Twoja odpowiedź jest trafna! Wiem, że korzystając z wewnętrznego arkusza stylów (CSS), zmieniasz kolor ramki na czerwony. A jak zewnętrzny arkusz ustawiał właściwości dla obrazków, takie jak szerokość ramki czy marginesy, to lokalne style mają wyższy priorytet. Więc gdy w <img> dodasz style='margin: 15px', to margines będzie wynosił 15 pikseli, a ramka na pewno pozostanie czerwona. To wszystko mówi nam o tym, jak ważne jest zrozumienie kaskadowego działania stylów i jak to wpływa na wygląd elementów. Z mojego doświadczenia, dobrze mieć porządek w arkuszach i unikać konfliktów między stylami. Zastosowanie systematycznego nazewnictwa naprawdę pomaga.

Pytanie 21

Który zapis w arkuszu stylów CSS umożliwia ustawienie wartości górnego marginesu?

A. margin-top
B. margin-left
C. margin-bottom
D. margin-right
margin-top to właściwa właściwość CSS, żeby ustawić wartość marginesu tylko od góry elementu. W praktyce, jeśli chcesz np. przesunąć nagłówek w dół od krawędzi przeglądarki, wystarczy dodać: h1 { margin-top: 40px; } i już, bez ruszania marginesów po bokach czy na dole. Takie podejście jest bardzo wygodne, bo pozwala precyzyjnie sterować odstępami wokół elementów, zamiast zmieniać wszystkie marginesy naraz. Zresztą, większość projektantów stron internetowych właśnie tak robi – oddzielnie ustawia marginesy dla każdej strony, zależnie od potrzeb układu. margin-top jest zgodny z oficjalną specyfikacją CSS W3C, więc nie musisz się martwić o kompatybilność czy dziwne zachowania w przeglądarkach. Moim zdaniem warto pamiętać, że istnieją też margin-bottom, margin-right i margin-left, które działają analogicznie dla pozostałych krawędzi. Przy złożonych layoutach, manipulowanie tylko jednym marginesem często ratuje skórę przed niechcianymi przesunięciami. Fajne jest też to, że można stosować jednostki px, em, %, co daje dużo swobody. Ogólnie, umiejętne korzystanie z margin-top pomaga w zapanowaniu nad przestrzenią w projekcie i sprawia, że strona jest czytelniejsza i bardziej estetyczna. Dobrze znać ten trik, bo przy responsywnych stronach jeszcze częściej trzeba kombinować z odstępami.

Pytanie 22

Na prędkość ładowania strony internetowej najmniejszy wpływ ma

A. ilość elementów multimedialnych zawartych na stronie
B. kolorystyka strony
C. szybkość serwera, na którym umieszczono stronę
D. wybór przeglądarki internetowej
Wybór przeglądarki internetowej, szybkość serwera oraz ilość elementów multimedialnych mają znaczący wpływ na szybkość wczytywania strony. Przeglądarki różnią się między sobą w zakresie wydajności i obsługi różnych standardów webowych. Na przykład, nowsze wersje przeglądarek są zoptymalizowane pod kątem wydajności i oferują lepszą obsługę skryptów JavaScript oraz renderowanie stron. Wybór przestarzałej przeglądarki może prowadzić do dłuższego czasu ładowania strony ze względu na braki w obsłudze nowoczesnych technologii. Szybkość serwera to kolejny kluczowy czynnik. Serwery o wyższej wydajności, które korzystają z nowoczesnych technologii i odpowiedniej konfiguracji, znacznie przyspieszają czas odpowiedzi na żądania HTTP. Wreszcie, ilość elementów multimedialnych na stronie, takich jak obrazy, filmy czy dźwięki, ma bezpośredni wpływ na czas ładowania. Większa liczba i większe rozmiary plików multimedialnych wymagają większych zasobów, co prowadzi do wydłużenia czasu wczytywania. Często spotykanym błędem jest niedocenianie znaczenia tych aspektów, co może prowadzić do frustracji użytkowników i obniżenia współczynnika konwersji. Dlatego tak ważne jest, aby projektanci stron internetowych koncentrowali się na optymalizacji tych elementów zgodnie z najlepszymi praktykami branżowymi, takimi jak kompresja obrazów, minimalizacja skryptów oraz korzystanie z systemów cache'owania.

Pytanie 23

Projekt graficzny zdigitalizowany w rozdzielczości 72 ppi powinien być wykorzystany do

A. wydruku przestrzennego 3D.
B. wydruku plakatów w formacie A2.
C. publikacji internetowej.
D. publikacji książkowej.
Obraz w rozdzielczości 72 ppi (pikseli na cal) to standard, który od dawna funkcjonuje przy projektowaniu na potrzeby internetu. Takie pliki świetnie sprawdzają się na ekranach monitorów, laptopów czy smartfonów, gdzie ważniejsza jest lekka waga pliku i szybkość ładowania niż szczegółowość obrazu. Praktyka pokazuje, że większość stron internetowych czy mediów społecznościowych spokojnie radzi sobie z grafikami w tej rozdzielczości. Moim zdaniem, jeśli chodzi o zastosowania cyfrowe, to 72 ppi jest wystarczające – nawet jeśli obecne wyświetlacze typu Retina potrafią więcej, to i tak sieciowo dostarczane obrazy często są kompresowane. Co ciekawe, już od czasów początków projektowania stron WWW przyjęło się, że 72 ppi to taki branżowy „must-have” minimum dla online. Natomiast do druku ta rozdzielczość absolutnie się nie nadaje – tam wymaga się minimum 300 ppi, żeby uzyskać ostry i profesjonalny efekt. Tak więc w praktyce, jeśli masz plik w tej jakości, możesz go spokojnie wrzucać na stronę internetową czy tworzyć grafiki na Facebooka lub Instagram. To też dobry wybór, gdy zależy ci na szybkim ładowaniu strony i wygodzie użytkownika. Takie grafiki nie obciążą serwera i nie będą zamulać strony, co jest ważne zwłaszcza przy słabszym internecie użytkownika.

Pytanie 24

Podział obrazu z myślą o publikacji na stronach www blokuje

A. możliwość zastosowania nawigacji witryny
B. optymalizację tylko jednej części grafiki
C. przy użyciu ustawień optymalizacji
D. przypisanie różnych łączy URL
Podział obrazu na różne segmenty w kontekście publikacji na stronach internetowych rzeczywiście uniemożliwia przypisanie różnych łączy URL do poszczególnych części obrazu. W praktyce oznacza to, że gdy obraz jest rozdzielany na mniejsze fragmenty, nie można bezpośrednio linkować każdego z tych fragmentów do odrębnych stron lub zasobów. W branży webowej standardem jest, aby obrazy były osadzone w sposób, który pozwala na efektywną nawigację i przypisanie unikalnych adresów URL. Na przykład, jeśli mamy obraz przedstawiający różne produkty, lepiej jest użyć jednego, spójnego obrazu z linkiem do strony produktu niż dzielić go na segmenty, które mogą być trudniejsze do zarządzania. W ten sposób zachowujemy również lepszą optymalizację SEO, ponieważ pozwalamy wyszukiwarkom na jednoznaczne zrozumienie, do jakiego zasobu odnosi się dany link. Dlatego pamiętajmy, że przy projektowaniu stron internetowych kluczowe jest zachowanie integralności linków i ich przypisanie do odpowiednich zasobów.

Pytanie 25

Który z poniższych systemów nie jest systemem zarządzania treścią?

A. Wordpress
B. Drupal
C. Joomla
D. Teams
Teams jest platformą do współpracy, która koncentruje się na komunikacji i pracy zespołowej, oferując funkcje takie jak czaty, wideokonferencje oraz integrację z innymi aplikacjami. Nie jest to system zarządzania treścią (CMS), który służy do tworzenia, edytowania i publikowania treści na stronach internetowych. W przeciwieństwie do platform CMS, takich jak Drupal, Joomla i WordPress, które umożliwiają zarządzanie treściami w sposób zorganizowany i strukturalny, Teams nie oferuje dedykowanych narzędzi do tworzenia treści w kontekście stron internetowych. Przykładowo, Drupal pozwala na budowanie złożonych stron internetowych z różnymi typami treści, podczas gdy Teams skupia się na udostępnianiu informacji w ramach zamkniętej grupy użytkowników.

Pytanie 26

Aby zwiększyć spójność układu strony internetowej za pomocą kompozycji rytmicznej, należy wykorzystać

A. kontrast.
B. powtórzenia.
C. akcent.
D. dysharmonię.
Powtórzenia są kluczowym elementem kompozycji rytmicznej, który przyczynia się do wzmocnienia spójności strony internetowej. W projektowaniu graficznym powtórzenia mogą przyjmować różne formy, takie jak powtarzające się kolory, czcionki, ikony czy układy elementów. Dzięki tym elementom użytkownicy łatwiej zapamiętują oraz orientują się w strukturze strony. Przykładem efektywnego zastosowania powtórzeń może być strona internetowa, która konsekwentnie używa tego samego zestawu kolorów i typografii w nagłówkach, przyciskach i elementach interaktywnych. Takie podejście nie tylko poprawia estetykę strony, ale także zwiększa jej funkcjonalność poprzez ułatwienie nawigacji. W praktyce, stosując powtórzenia, projektanci mogą stworzyć bardziej harmonijną i przyjazną dla użytkownika przestrzeń, co jest zgodne z zasadami UX (User Experience) oraz z wytycznymi WCAG (Web Content Accessibility Guidelines), które podkreślają znaczenie spójności w projektowaniu. Dobrze przemyślana kompozycja rytmiczna przyczynia się do lepszego odbioru treści przez użytkowników.

Pytanie 27

Podczas tworzenia grafiki wektorowej do serwisu internetowego warto zwrócić uwagę na

A. przeprowadzenie korekty kolorystycznej
B. dobór palety kolorów
C. zmianę obiektu na krzywe
D. wykonanie korekty ekspozycji
Wybór palety barw jest kluczowym elementem podczas tworzenia grafiki wektorowej na potrzeby serwisu internetowego. Odpowiednio dobrana paleta barw nie tylko wpływa na estetykę projektu, ale ma również ważne znaczenie dla doświadczenia użytkownika. Przy wyborze kolorów warto kierować się zasadami teorii kolorów, które pomagają w tworzeniu harmonijnych zestawień. Przykładem może być zastosowanie kolorów komplementarnych, które wzajemnie się uzupełniają i przyciągają uwagę. Dobrą praktyką jest również zachowanie ograniczonej liczby kolorów, co sprzyja spójności wizualnej i ułatwia rozpoznawalność marki. W kontekście web designu ważne jest, aby kolory były również dostosowane do różnych urządzeń i rozdzielczości, co można osiągnąć dzięki zastosowaniu systemów kolorów takich jak RGB dla ekranów. Warto pamiętać o dostępności, dobierając kolory, które są czytelne dla wszystkich użytkowników, w tym osób z zaburzeniami widzenia. Używanie narzędzi takich jak Adobe Color lub Coolors może ułatwić ten proces, umożliwiając tworzenie własnych palet zgodnych z aktualnymi trendami.

Pytanie 28

Jaką regułę stylów należy dopisać do pliku style_list.css w celu zdefiniowania klasy znaczek dla list nienumerowanych z obrazkiem znaczek_logo.gif jako znakiem wypunktowania, jeśli obrazek umieszczony jest w podkatalogu GRAFIKI katalogu z plikami stylów?

A..znaczek {list-style-image: url(grafiki/znaczek_logo.gif)}
B.ul.znaczek {list-style-type: url(grafiki\znaczek_logo.gif)}
C..znaczek {list-style-image: url(\GRAFIKI\znaczek_logo.gif)}
D.ul.znaczek {list-style-image: url(GRAFIKI/znaczek_logo.gif)}
A. C.
B. B.
C. A.
D. D.
Niepoprawne odpowiedzi opierają się na niepełnym zrozumieniu zasad działania CSS i jego właściwości. Wiele osób myli koncepcję stylów dla list nienumerowanych, zakładając, że można używać ogólnych selektorów bez uwzględnienia klas. Kluczowym błędem jest brak uwzględnienia właściwej ścieżki do pliku graficznego. Ścieżka do obrazka powinna być określona w kontekście lokalizacji pliku CSS, a nie w innym kontekście, co może prowadzić do nieprawidłowego wyświetlania. Ponadto, niektóre odpowiedzi mogą zapominać o konieczności użycia odpowiedniego selektora, co skutkuje zastosowaniem stylów do wszystkich list, a nie do tych z określoną klasą. Ważne jest, aby stosować dobre praktyki, takie jak unikanie zagnieżdżania selektorów, które nie są logiczne, oraz zapewnienie, że klasy są używane w celu dokładnego targetowania elementów. Poprawne zrozumienie struktury CSS oraz zasad przypisywania stylów do poszczególnych elementów HTML jest kluczowe dla tworzenia funkcjonalnych i estetycznych stron internetowych. Chociaż dostępne odpowiedzi mogą wydawać się na pierwszy rzut oka sensowne, nie spełniają one podstawowych wymagań dotyczących struktury i prawidłowego stosowania CSS.

Pytanie 29

Aby móc używać plików typu NEF, CRW, CR2, ARW w projekcie strony internetowej, należy

A. zwiększyć ich rozmiar oraz zastosować tryb koloru RGB
B. zmienić rozszerzenie pliku i zastosować tryb koloru CMYK
C. zapisać pliki w odpowiednim formacie, zmniejszyć ich rozmiar oraz zastosować tryb koloru CMYK
D. zapisać pliki w odpowiednim formacie, zmniejszyć ich rozmiar oraz zastosować tryb koloru RGB
Odpowiedź "zapisać pliki w odpowiednim formacie, zmniejszyć ich rozmiar i zastosować tryb koloru RGB" jest poprawna, ponieważ formaty NEF, CRW, CR2 i ARW to surowe formaty obrazów używane w aparatach fotograficznych. Aby wykorzystać te pliki na stronie internetowej, konieczne jest ich przetworzenie. Pierwszym krokiem jest konwersja do bardziej powszechnego formatu, takiego jak JPEG lub PNG, które są idealne do użytku w sieci. Zmniejszenie rozmiaru plików jest kluczowe, aby przyspieszyć ładowanie strony i zoptymalizować doświadczenia użytkowników. Warto pamiętać, że zbyt duże pliki graficzne mogą znacznie spowolnić czas ładowania strony. Zastosowanie trybu koloru RGB jest również istotne, gdyż jest to standardowy model kolorów wykorzystywany w wyświetlaczach komputerowych i w Internecie. Przykładem może być przygotowanie zdjęć do galerii internetowej, gdzie po konwersji i optymalizacji zdjęcia zyskują na jakości wyświetlania oraz na szybkości ładowania.

Pytanie 30

Jaki znak w języku JavaScript pełni rolę operatora negacji?

A. /
B. !=
C. !
D. =
Symbol "!" w języku JavaScript jest operatorem negacji logicznej. Służy do odwracania wartości logicznych, co oznacza, że jeśli operand (wartość, na której działa operator) jest prawdziwy (true), to wynik działania operatora "!" będzie fałszywy (false), i odwrotnie. Przykładowo, jeśli mamy zmienną let isActive = true;, to wykonanie !isActive da wynik false. Operator negacji jest niezwykle przydatny w warunkach logicznych, na przykład w instrukcjach if, gdzie możemy chcieć wykonać kod tylko wtedy, gdy dany warunek nie jest spełniony. Przykład: if (!isActive) { console.log('Nieaktywny'); } spowoduje, że komunikat zostanie wyświetlony tylko wtedy, gdy isActive jest false. Dobre praktyki w programowaniu sugerują, aby używać operatora negacji z rozwagą, aby kod był czytelny i zrozumiały. Ponadto, warto pamiętać, że operator "!" można stosować wielokrotnie, co prowadzi do podwójnej negacji (np. !!isActive), co jest techniką często używaną do konwertowania wartości na typ boolean.

Pytanie 31

Który z poniższych zapisów znaczników w języku XHTML jest poprawny?

A. <XHTML>
B. <xHtMl>
C. <xhtml>
D. <XHtml>
Odpowiedź <xhtml> jest poprawna, ponieważ XHTML (Extensible Hypertext Markup Language) jest językiem znaczników, który jest surową wersją HTML 5. XHTML jest wrażliwy na wielkość liter, co oznacza, że wszystkie znaczniki muszą być pisane małymi literami. To podejście wynika z faktu, że XHTML opiera się na XML, który ma ścisłe zasady dotyczące składni, w tym konieczność używania małych liter dla nazw znaczników. Użycie odpowiedniej składni pozwala na lepszą interoperacyjność między różnymi przeglądarkami internetowymi oraz zapewnia zgodność z standardami W3C. Przykładowe zastosowanie poprawnego znacznika to: <xhtml><title>Przykład</title></xhtml>, co jest podstawą budowy dokumentu XHTML. Używanie poprawnych znaczników jest kluczowe dla uzyskania odpowiednich wyników w interpretacji przez przeglądarki oraz dla poprawnego działania technologii wspierających, takich jak CSS i JavaScript.

Pytanie 32

Jakie produkty można stworzyć korzystając z programu Adobe Dreamweaver?

A. Zrastrowane ilustracje
B. Arkusze kalkulacyjne
C. Druki reklamowe
D. Aplikacje internetowe
Adobe Dreamweaver to naprawdę fajne narzędzie, które pomaga w tworzeniu stron internetowych i aplikacji. Można w nim programować w HTML, CSS, a nawet JavaScript, co daje dużą swobodę w projektowaniu. Osobiście uważam, że duży plus to jego opcje wizualne, bo można wprowadzać zmiany bez konieczności grzebania w kodzie non-stop. Przykładem, gdzie Dreamweaver się sprawdza, są interaktywne formularze, które są niezbędne w wielu stronach. A do tego integracja z bazami danych, co znacznie ułatwia życię, szczególnie przy dynamicznej treści. Nie zapominajmy też o standardach, jak W3C, które są wspierane przez program. Dzięki temu, mamy pewność, że nasze projekty są zgodne i wyglądają jak należy. To narzędzie jest znane w naszej branży, więc warto je znać i się nim posługiwać.

Pytanie 33

Jaki kolor będą miały teksty akapitów utworzone na podstawie przedstawionego arkusza stylów?

 <style>
p{color: yellow;}
p{color: black;}
p{color: red;}
</style>
A. Czerwony.
B. Żółty.
C. Zielony.
D. Czarny.
Odpowiedź "Czerwony" jest poprawna, ponieważ w arkuszu stylów CSS zdefiniowano trzy reguły dotyczące koloru tekstu dla elementów <p>. W CSS, kiedy wiele reguł odnosi się do tego samego elementu, ostatnia reguła, która ma tę samą specyficzność, ma decydujące znaczenie. W naszym przypadku ostatnia reguła to 'p{color: red;}', co wskazuje, że tekst akapitów będzie wyświetlany w kolorze czerwonym. W praktyce oznacza to, że, niezależnie od wcześniejszych przypisanych kolorów, w tym przypadku żółtego i czarnego, ostateczny kolor tekstu to czerwony. To podejście jest zgodne z zasadą kaskadowości w CSS, gdzie przetwarzanie reguł następuje od góry do dołu, a ostatnia reguła ma pierwszeństwo. Warto znać tę zasadę, aby skutecznie zarządzać stylami na stronach internetowych, co jest kluczowe w kontekście responsywnego projektowania oraz optymalizacji wydajności witryn.

Pytanie 34

Jakie fonty mogą być wyświetlane przez przeglądarki internetowe?

A. do których mają dostęp
B. w każdym formacie
C. które zostały zamienione na krzywe
D. które zostały zrasteryzowane
Wybór fontów, które zostały zamienione na krzywe, jest podejściem stosowanym głównie w kontekście druku, a nie w wyświetlaniu treści w przeglądarkach internetowych. Krzywe to wektorowe reprezentacje fontów, które eliminują potrzebę posiadania zainstalowanego fontu na urządzeniu, jednakże w kontekście internetu nie mają one zastosowania, gdyż przeglądarki nie interpretują krzywych w sposób, w jaki robią to programy graficzne. W przypadku fontów rasteryzowanych, ich użycie również jest ograniczone. Rasteryzacja fontu oznacza przekształcenie go w obraz rastrowy, co prowadzi do utraty jakości przy powiększaniu oraz braku możliwości zmiany stylu czy rozmiaru fontu. Ostatnia koncepcja, czyli wyświetlanie fontów w dowolnym formacie, jest mylna, ponieważ przeglądarki mają określone wspierane formaty fontów, takie jak WOFF, WOFF2, TTF i OTF. Wybór niewłaściwego formatu może prowadzić do problemów z renderowaniem fontów na stronie. W praktyce więc, aby zapewnić prawidłowe wyświetlanie tekstu, należy kierować się dostępnością fontów oraz ich zgodnością z używanymi standardami internetowymi.

Pytanie 35

Przedstawiony na ilustracji szablon kompozycji graficznej układu strony internetowej to

Ilustracja do pytania
A. layout.
B. glif.
C. wakat.
D. plugin.
Odpowiedź "layout" jest prawidłowa, ponieważ termin ten odnosi się do kompozycji graficznej strony internetowej, która wyznacza układ elementów takich jak nagłówki, menu, treści i stopki. Layout jest kluczowym aspektem projektowania interfejsu użytkownika i ma znaczący wpływ na doświadczenia użytkowników. Odpowiednie rozmieszczenie elementów sprzyja czytelności i użyteczności strony, co jest zgodne z zasadami projektowania UX. Dobrze zaplanowany layout ułatwia nawigację i pozwala użytkownikom szybko znaleźć poszukiwane informacje. Na przykład, w przypadku stron e-commerce, odpowiedni układ produktów, informacji o cenach oraz przycisków „dodaj do koszyka” może znacząco wpłynąć na konwersję i zadowolenie użytkowników. W standardach web designu, takich jak Responsive Web Design, layout jest również dostosowywany do różnych urządzeń, zapewniając użytkownikom spójne doświadczenie, niezależnie od tego, czy korzystają z komputera, tabletu czy smartfona.

Pytanie 36

Wskaż parametry, które należy zdefiniować, przygotowując fotografie cyfrowe do projektu galerii internetowej.

A. Rozdzielczość 72 lpi tryb barwny RGB.
B. Rozdzielczość 72 dpi, tryb barwny CMYK.
C. Rozdzielczość 72 spi, tryb barwny CMYK.
D. Rozdzielczość 72 ppi, tryb barwny RGB.
To jest dokładnie ten zestaw parametrów, który powinien być stosowany przy przygotowaniu zdjęć do publikacji w galerii internetowej. Rozdzielczość 72 ppi (pikseli na cal) jest uznawana za standardową dla grafiki wyświetlanej na ekranach komputerów czy urządzeń mobilnych – to w zupełności wystarcza, żeby zdjęcia wyglądały ostro i nie zajmowały zbyt wiele miejsca, co przekłada się na szybsze ładowanie strony. Z mojego doświadczenia, jeśli użyjemy wyższej rozdzielczości, zdjęcia będą większe i obciążą serwer, a przecież użytkownik nawet nie zauważy różnicy. Tryb barwny RGB to absolutna podstawa w kontekście internetu – większość ekranów obsługuje właśnie ten przestrzeń barwną, więc kolory pozostaną takie, jak zamierzono. W praktyce, wszystkie popularne programy graficzne domyślnie ustawiają tryb RGB dla plików przeznaczonych do sieci. Z kolei CMYK to tryb dedykowany do druku i tu zupełnie się nie sprawdzi. Co ciekawe, czasem spotykam się z opinią, że trzeba wyżej ustawić rozdzielczość, ale to tylko marnuje miejsce na dysku. No i warto pamiętać, by zapisywać zdjęcia w formatach takich jak JPEG czy PNG, bo te najczęściej są obsługiwane przez przeglądarki. Tak więc – 72 ppi i RGB to taki internetowy złoty standard.

Pytanie 37

Wskaź program, w którym można przeprowadzić retusz fotografii, która ma być umieszczona na stronie internetowej?

A. Painter
B. Photoshop
C. Studio Artist
D. Illustrator
Photoshop to wiodący program w dziedzinie edycji grafiki rastrowej, który jest szeroko stosowany w branży kreatywnej do retuszu zdjęć. Oferuje zaawansowane narzędzia, takie jak maski, warstwy oraz filtry, które pozwalają na precyzyjne dostosowanie kolorów, kontrastu i detali zdjęć. Użytkownicy mogą wykorzystać funkcję retuszu, aby usunąć niedoskonałości, zredukować szumy oraz poprawić ogólną jakość obrazu, co jest kluczowe przy publikacji na stronach internetowych. Przykładem zastosowania Photoshopa może być retusz portretów, gdzie program umożliwia wygładzenie skóry, usunięcie cieni oraz podkreślenie oczu. Standardy branżowe sugerują, że zdjęcia publikowane online powinny mieć odpowiednią rozdzielczość oraz być zoptymalizowane pod kątem szybkości ładowania, co Photoshop również wspiera dzięki funkcjom eksportu. Dzięki rozbudowanej dokumentacji oraz aktywnej społeczności, użytkownicy mogą łatwo znaleźć porady i techniki, które pomogą im w efektywnej pracy z tym oprogramowaniem.

Pytanie 38

W którym trybie barwnym należy skatalogować pliki zdjęciowe przeznaczone do zamieszczenia w multimedialnym projekcie internetowym?

A. Pantone
B. CMY
C. RGB
D. Bichromia
Tryb RGB to absolutna podstawa, jeżeli chodzi o przygotowanie zdjęć na potrzeby internetu i wszelkich projektów multimedialnych. Ten model barwny został stworzony z myślą o urządzeniach emitujących światło, takich jak monitory, smartfony, tablety czy telewizory. Każdy piksel wyświetlany na ekranie powstaje właśnie przez mieszanie trzech składowych – czerwonej, zielonej i niebieskiej (Red, Green, Blue). To jest standard, którego wymaga praktycznie każda przeglądarka, CMS czy program do obsługi multimediów online. Z mojego doświadczenia, jeśli ktoś wrzuci zdjęcie w innym trybie, np. CMYKa, to kolory mogą się wyświetlić zupełnie nie tak, jak zaplanowano – pojawiają się dziwne przekłamania albo obraz robi się wyblakły. Nawet duże portale, jak Facebook czy Instagram, automatycznie konwertują zdjęcia do RGB. Warto też pamiętać, że większość formatów plików przeznaczonych do internetu (JPEG, PNG, GIF) działa właśnie w tym modelu barw, a praca w RGB pozwala zachować spójność kolorów na różnych urządzeniach. Co ciekawe, w profesjonalnych workflow do webdesignu zawsze kończy się eksport pliku w RGB, bo tylko wtedy masz gwarancję, że barwy będą żywe i zgodne z projektem na każdym ekranie. Sam osobiście uważam, że opanowanie tych podstaw pozwala uniknąć wielu niepotrzebnych problemów podczas pracy z mediami cyfrowymi.

Pytanie 39

Jakie rodzaje stron internetowych są zoptymalizowane do prawidłowego wyświetlania na ekranach różnych urządzeń, takich jak: monitor komputera, laptop, tablet czy smartfon?

A. Informacyjne
B. Interaktywne
C. Statyczne
D. Responsywne
Odpowiedź 'responsywne' jest poprawna, ponieważ strony responsywne są projektowane w taki sposób, aby automatycznie dostosowywały się do rozmiaru ekranu urządzenia, na którym są wyświetlane. Umożliwia to optymalne doświadczenie użytkownika, niezależnie od tego, czy korzysta on z komputera stacjonarnego, laptopa, tabletu czy smartfona. W praktyce oznacza to, że elementy takie jak tekst, obrazy i przyciski zmieniają swoje układ i rozmiar w odpowiedzi na różne rozdzielczości ekranu. Wytyczne wypracowane przez World Wide Web Consortium (W3C) oraz zasady projektowania opartego na siatce (grid-based design) są podstawą tworzenia takich stron. Przykładem mogą być witryny sklepów internetowych, gdzie responsywność jest kluczowa, umożliwiając zakupy na różnych urządzeniach, co przekłada się na wyższą konwersję i lepsze doświadczenie klienta. Ponadto użycie technologii CSS3, takich jak media queries, jest standardem w responsywnym projektowaniu, co zapewnia elastyczność i funkcjonalność stron w różnych kontekstach użytkowych.

Pytanie 40

Która z właściwości CSS pozwala na ustawienie koloru tła dla danego elementu?

A. Bgcolor
B. Background-Color
C. Text-Color
D. Color
Kolory tła w CSS można ustawiać na kilka sposobów, ale niektóre odpowiedzi, które podałeś, są po prostu błędne i mogą wprowadzać w błąd. Na przykład, 'text-color' w ogóle nie istnieje w CSS, bo odpowiednia właściwość to 'color'. I jeszcze 'bgcolor' to stara właściwość używana w HTML, a nie w CSS, więc lepiej ją omijać. Używanie takich przestarzałych terminów może powodować problemy przy tworzeniu stron. Warto też wiedzieć, że 'color' odnosi się tylko do koloru tekstu, a nie tła, więc dobrze się zaznajomić, co każda właściwość oznacza. Z mojej perspektywy, warto poczytać dokumentację CSS i zobaczyć, jak to wygląda w praktyce u doświadczonych projektantów.