Wyniki egzaminu

Informacje o egzaminie:
  • Zawód: Technik programista
  • Kwalifikacja: INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych
  • Data rozpoczęcia: 20 kwietnia 2026 10:53
  • Data zakończenia: 20 kwietnia 2026 11:15

Egzamin zdany!

Wynik: 27/40 punktów (67,5%)

Wymagane minimum: 20 punktów (50%)

Nowe
Analiza przebiegu egzaminu- sprawdź jak rozwiązywałeś pytania
Pochwal się swoim wynikiem!
Szczegółowe wyniki:
Pytanie 1

Którą rozdzielczość należy ustawić w opcjach kodera, aby przygotować do publikacji film w rozdzielczości HD Ready?

A. 720x480
B. 480x360
C. 1280x720
D. 1920x1080
W tym pytaniu pułapka polega na tym, że wszystkie podane rozdzielczości są w jakiś sposób „znane”, ale tylko jedna odpowiada standardowi HD Ready. Bardzo często myli się ogólne pojęcie „HD” z konkretnymi rozdzielczościami, a jeszcze częściej patrzy się tylko na to, która liczba jest większa, zamiast na obowiązujące standardy branżowe. Rozdzielczość 480x360 to typowa niska rozdzielczość kojarzona raczej ze starym streamingiem internetowym, materiałami SD do podglądu lub bardzo lekkimi plikami do słabego łącza. Ma inne proporcje niż klasyczne 16:9 i nie spełnia żadnego współczesnego standardu HD. Obraz w takiej rozdzielczości będzie wyraźnie mniej ostry, szczególnie na większych ekranach – to raczej jakość zbliżona do starego YouTube sprzed wielu lat. 720x480 z kolei bywa mylone z HD, bo liczba „720” sugeruje HD, ale tu akurat chodzi o coś zupełnie innego. 720x480 to typowa rozdzielczość SD z systemu NTSC (DVD-Video, stare kamery cyfrowe), często w proporcjach 4:3 lub 16:9 osiąganych dopiero przez tzw. piksele nieskwadratowe (aspect ratio pikseli). Jest to nadal standard definition, nie high definition. To klasyczny przykład błędu: ktoś kojarzy 720p, widzi 720 w liczbie, i automatycznie uznaje, że to HD. Niestety tak to nie działa. Z kolei 1920x1080 to już Full HD, czyli 1080p lub 1080i, zależnie od sposobu skanowania. Technicznie jest to jak najbardziej HD, ale inny poziom – wyższy niż HD Ready. Jeśli w zadaniu albo w dokumentacji projektu jest wyraźnie napisane „HD Ready”, to ustawienie Full HD jest po prostu inne niż wymagane. Plik będzie cięższy, będzie wymagał wyższego bitrate’u, a w wielu zastosowaniach webowych będzie to niepotrzebne obciążenie serwera i łącza użytkownika. Typowym błędem jest myślenie: „im większa rozdzielczość, tym lepiej”, bez zastanowienia się nad wymaganiami, możliwościami odtwarzania i standardami sprzętu (telewizory HD Ready natywnie mają matryce 1366x768, więc 1280x720 jest dla nich naturalnym formatem). Dlatego w kontekście przygotowania materiału do publikacji, szczególnie na strony WWW i do prostego streamingu, warto kojarzyć trzy podstawowe poziomy: SD (np. 720x480), HD Ready (1280x720) i Full HD (1920x1080). Wtedy łatwiej uniknąć pomyłek i dobrać taką rozdzielczość, która jest zgodna z założeniami projektu i możliwościami odbiorców, zamiast kierować się tylko intuicją albo większą liczbą pikseli.

Pytanie 2

W edytorze grafiki wektorowej stworzono przedstawiony kształt, który powstał z dwóch figur: trójkąta i koła. W celu stworzenia tego kształtu, po narysowaniu figur i odpowiednim ich ustawieniu, należy skorzystać z funkcji

Ilustracja do pytania
A. rozdzielenia.
B. wykluczenia.
C. różnicy.
D. sumy.
Wybór odpowiedzi 'Wykluczenia', 'Różnicy' lub 'Rozdzielenia' jest błędny w tym kontekście. Funkcje te są używane w innych celach w edytorach grafiki wektorowej. 'Różnica' jest używana do odejmowania jednej figury od innej, co nie jest potrzebne do tworzenia kształtu pokazanego na zdjęciu. 'Rozdzielenie' służy do rozdzielania złożonych kształtów na prostsze elementy, co także nie jest potrzebne w tym przypadku. 'Wykluczenia' używa się do tworzenia kształtów z wykluczeniem wspólnych obszarów. Często błędem jest mylenie tych funkcji i niewłaściwe ich stosowanie, co prowadzi do niespodziewanych wyników. Zasada jest taka, że każda z tych funkcji ma swoje specyficzne zastosowanie, i ważne jest zrozumienie tego, zanim zaczniemy pracować z edytorem grafiki wektorowej. W tym przypadku, aby uzyskać pokazany kształt, powinniśmy skorzystać z funkcji 'Sumy'.

Pytanie 3

W tabeli pokazano cechy pliku graficznego. Aby rysunek ładował się szybciej na stronie WWW, należy

Wymiary: 4272 x 2848px
Rozdzielczość: 72 dpi
Format: JPG
A. zmienić proporcje szerokości do wysokości
B. zwiększyć rozdzielczość
C. zmienić format grafiki na CDR
D. zmniejszyć wymiary rysunku
Zmniejszenie wymiarów rysunku to kluczowy krok w optymalizacji czasu ładowania grafiki na stronę WWW. Mniejsze wymiary oznaczają mniejszą ilość danych do przesłania, co skraca czas ładowania strony. Praktycznym przykładem jest zmniejszenie wymiarów obrazu z 4272 x 2848 pikseli do bardziej standardowego rozmiaru, jak np. 1920 x 1080 pikseli dla grafik wyświetlanych na ekranach. Zmniejszenie wymiarów nie tylko przyspiesza ładowanie ale także zmniejsza zużycie transferu danych co jest istotne przy ograniczeniach mobilnych. Warto pamiętać że mniejsze grafiki są też mniej zasobożerne dla urządzeń użytkowników co wpływa na ogólną wydajność strony. Zastosowanie odpowiednich wymiarów jest zgodne z dobrymi praktykami optymalizacji webowej rekomendowanymi przez Google PageSpeed Insights i inne narzędzia analityczne. Optymalizacja grafiki poprzez zmniejszenie jej wymiarów jest podstawową czynnością w procesie tworzenia responsywnych i szybko działających witryn internetowych.

Pytanie 4

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

A. treści, która zostanie pokazana, gdy grafika nie może być załadowana
B. lokalizacji i nazwy pliku źródłowego grafiki
C. opisu, który pojawi się pod grafiką
D. parametrów grafiki, takich jak wymiary, ramka, wyrównanie
Atrybut <b>alt</b> znacznika <b>img</b> w języku HTML jest niezwykle istotnym elementem, który ma na celu zapewnienie dostępności treści wizualnych dla użytkowników. Gdy obrazek nie może zostać załadowany (np. z powodu problemów z siecią lub błędnej ścieżki do pliku), tekst zawarty w atrybucie <b>alt</b> zostaje wyświetlony zamiast obrazu. W praktyce oznacza to, że osoba korzystająca z technologii asystujących, takich jak czytniki ekranu, będzie miała możliwość zrozumienia, co miało się pojawić w danym miejscu na stronie. Zgodnie z wytycznymi WCAG (Web Content Accessibility Guidelines), stosowanie atrybutu <b>alt</b> jest kluczowe dla zapewnienia dostępności stron internetowych. Przykładem może być sytuacja, w której na stronie internetowej znajduje się obrazek przedstawiający produkt. Atrybut <b>alt</b> powinien zawierać opis tego produktu, co pozwoli użytkownikom, którzy nie widzą obrazu, zrozumieć jego znaczenie. Prawidłowe użycie atrybutu <b>alt</b> nie tylko poprawia dostępność, ale także może wpłynąć na SEO strony, ponieważ wyszukiwarki traktują ten atrybut jako dodatkowy kontekst dla treści wizualnych.

Pytanie 5

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

A. SVG
B. BMP
C. PNG
D. JPG
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 6

Jakie kolory wchodzą w skład modelu barw CMYK?

A. cyjan, magenta, żółty i czarny
B. cyjan, magenta, żółty i karmazyn
C. czerwony, zielony, niebieski oraz kanał alfa
D. czerwony, zielony oraz niebieski
Czerwony, zielony i niebieski to kolory, które są składowymi modelu RGB (Red, Green, Blue), który jest stosowany głównie w kontekście wyświetlaczy elektronicznych, takich jak monitory i telewizory. W modelu RGB kolory są generowane przez dodawanie światła, co różni się od modelu CMYK, w którym kolory są uzyskiwane przez subtraktywne mieszanie barw. W kontekście druku, użycie RGB może prowadzić do nieprzewidywalnych rezultatów, gdyż kolory na ekranie nie zawsze odpowiadają tym, które pojawią się na wydruku. Często następuje konieczność konwersji kolorów z RGB na CMYK, aby uzyskać właściwe odwzorowanie kolorów. Cyjan, magenta, żółty i karmazyn to kombinacja kolorów, która nie jest standardowym zestawem składowych w modelu barw. Karmazyn, jako kolor pochodny, nie jest uznawany za podstawowy składnik modelu CMYK, a zamiast tego jest blisko związany z magentą, co może wprowadzać w błąd. Z kolei pojęcie kanału alfa odnosi się do przezroczystości w obrazach rastrowych, co jest związane z modelem kolorów RGBA, a nie z CMYK. Kanał alfa jest istotny w kontekście edycji grafiki komputerowej, ale nie ma zastosowania w tradycyjnych procesach druku, gdzie priorytetem jest odwzorowanie kolorów w formacie CMYK.

Pytanie 7

Rozmycie Gaussa, wygładzanie oraz szum RGB to funkcje wykorzystywane w programach do obróbki

A. grafiki rastrowej
B. dźwięku w formacie MIDI
C. ścieżki dźwiękowej
D. grafiki wektorowej
Rozmycie Gaussa, wygładzanie i szum RGB to techniki stosowane w grafice rastrowej, która opiera się na bitmapach. Rozmycie Gaussa jest szczególnie użyteczne w przypadku usuwania szumów i wygładzania obrazów, co poprawia ich estetykę oraz jakość, a także umożliwia bardziej naturalne przejścia tonalne. Na przykład, fotografowie korzystają z rozmycia Gaussa przy edycji zdjęć, aby zmiękczyć ostre krawędzie i stworzyć efekt bokeh. Szum RGB odnosi się do różnych typów zakłóceń, które mogą występować w obrazach rastrowych i które można zredukować za pomocą odpowiednich filtrów. Wygładzanie, z kolei, może być stosowane w grafice komputerowej do poprawy jakości renderingu oraz eliminacji niepożądanych efektów aliasingu. W branży graficznej dobrą praktyką jest stosowanie tych technik w sposób przemyślany, aby uzyskać najlepszą jakość wizualną, zgodnie z zasadami profesjonalnej edycji obrazu, jak również przy poszanowaniu standardów kolorystycznych i rozdzielczości dostosowanej do różnych platform wyjściowych.

Pytanie 8

Kolor zapisany w modelu RGB(255, 0, 0) to

A. żółty
B. niebieski
C. czerwony
D. zielony
Odpowiedź czerwona jest poprawna, ponieważ w modelu RGB kolor jest definiowany przez kombinację trzech podstawowych kolorów: czerwonego, zielonego i niebieskiego. Wartości w modelu RGB mieszczą się w zakresie od 0 do 255, gdzie 255 oznacza pełną intensywność danego koloru, a 0 brak intensywności. W przypadku RGB(255, 0, 0), maksymalna wartość oznacza, że kolor czerwony jest w pełni nasycony, podczas gdy wartości zielonej i niebieskiej są równe zeru, co skutkuje uzyskaniem czystego koloru czerwonego. W praktyce, model RGB jest powszechnie stosowany w technologii wyświetlania kolorów na ekranach komputerów, telewizorów oraz w grafice komputerowej. Zrozumienie modelu RGB jest kluczowe dla projektantów interfejsów użytkownika, grafików i specjalistów od marketingu wizualnego, którzy muszą umieć manipulować kolorami, aby osiągnąć zamierzony efekt wizualny lub brandingowy. Dobre praktyki w zakresie doboru kolorów obejmują uwzględnienie harmonii kolorystycznej oraz różnorodności percepcji kolorów przez różne osoby, co można osiągnąć poprzez testy A/B lub badania użytkowników.

Pytanie 9

Z uwagi na zaprezentowany styl CSS, plik rysunek.gif jest używany jako tło strony:

body {
    background-image: url("rysunek.gif");
    background-repeat: repeat-y;
}
A. zarówno w pionowym, jak i poziomym kierunku z kadrowaniem
B. zarówno w pionowym, jak i poziomym kierunku ze skalowaniem
C. w pionowym kierunku
D. w poziomym kierunku
Styl CSS określa `background-repeat: repeat-y;`, co oznacza, że obraz tła będzie powtarzany w osi pionowej. Wartość `repeat-y` jest odpowiedzialna za powtarzanie obrazu tylko w pionie, podczas gdy `repeat-x` powtarza w poziomie. Jeśli chcemy, aby obraz powtarzał się w obu kierunkach, używamy `repeat`, co jest domyślną wartością właściwości `background-repeat`. W praktyce zastosowanie tego stylu jest przydatne, gdy chcemy utworzyć efekt pasków lub pionowych wzorów na stronie internetowej, które zmieniają się dynamicznie wraz z wysokością zawartości. Warto zwrócić uwagę, że poprawna implementacja powtarzania tła w pionie może być wykorzystana do oszczędnego zarządzania zasobami, zwłaszcza gdy obraz tła jest niewielki, co wpływa na szybkość ładowania strony. W kontekście standardów, takie podejście jest zgodne z zaleceniami W3C, które promują optymalizację zasobów i efektywne zarządzanie mediami na stronach www.

Pytanie 10

Który z parametrów obiektu graficznego zmieni się po dostosowaniu wartości kanału alfa?

A. Nasycenie kolorów
B. Przezroczystość
C. Kolejność wyświetlania pikseli
D. Ostrość krawędzi
Kanał alfa jest kluczowym składnikiem grafiki komputerowej, odpowiadającym za przezroczystość obiektów graficznych. Zmiana wartości kanału alfa wpływa na to, w jaki sposób obiekt jest renderowany na tle innych elementów wizualnych. Przykładowo, gdy wartość kanału alfa wynosi 0, obiekt jest całkowicie przezroczysty i nie wpływa na widoczność tła. Natomiast gdy wartość ta wynosi 1, obiekt jest całkowicie nieprzezroczysty. Wartości pośrednie pozwalają na uzyskanie efektów półprzezroczystości, co jest niezwykle istotne w tworzeniu różnych efektów wizualnych, takich jak cienie czy rozmycia. W standardach takich jak RGBA, kanał alfa jest integralną częścią modelu kolorów, który umożliwia artystom i projektantom precyzyjne manipulowanie przezroczystością w aplikacjach graficznych i środowiskach gier. W praktyce, modyfikacja wartości kanału alfa może być wykorzystana w programach do edycji zdjęć, takich jak Adobe Photoshop, gdzie użytkownicy mogą tworzyć warstwy o różnej przezroczystości, co pozwala na uzyskanie efektów wizualnych wymagających subtelności i detali.

Pytanie 11

Podczas definiowania koloru w formacie RGBA, na przykład rgba(100, 40, 50, 0.2), ostatnia liczba odnosi się do

A. przezroczystości, gdzie 0 oznacza pełną przezroczystość, a 1 jej brak
B. przezroczystości, gdzie 1 oznacza pełną przezroczystość, a 0 jej brak
C. saturacji barw RGB
D. nasycenia koloru czarnego
Wartość w notacji RGBA, która odpowiada za przezroczystość, jest kluczowym elementem definiowania koloru w grafice komputerowej. W notacji rgba(100, 40, 50, 0.2) ostatnia wartość, czyli 0.2, reprezentuje stopień przezroczystości koloru. Wartość ta oscyluje w zakresie od 0 do 1, gdzie 0 oznacza całkowitą przezroczystość (kolor jest niewidoczny), a 1 oznacza całkowitą nieprzezroczystość (kolor jest w pełni widoczny). Taka notacja jest niezwykle użyteczna w projektowaniu stron internetowych i aplikacji, gdzie często zachodzi potrzeba nakładania elementów wizualnych na siebie, np. w przypadku przycisków, tła czy efektów modalu. Dzięki zastosowaniu przezroczystości można uzyskać ciekawy efekt estetyczny, poprawić czytelność tekstów na kolorowych tłach czy stworzyć wrażenie głębi. W przypadku standardów CSS, użycie RGBA jest zalecane w kontekście projektowania responsywnego i dostępności, co jest zgodne z najlepszymi praktykami branżowymi.

Pytanie 12

Aby osiągnąć pokazany rezultat w programie graficznym wykorzystano

Ilustracja do pytania
A. kanał alpha
B. zmianę intensywności kolorów
C. gradient okrągły
D. gradient liniowy
Gradient liniowy to narzędzie stosowane w edytorach grafiki rastrowej do tworzenia płynnych przejść pomiędzy dwoma lub więcej kolorami w zadanym kierunku najczęściej poziomym lub pionowym. W praktyce gradient liniowy jest kluczowy w projektowaniu graficznym ponieważ pozwala na subtelne cieniowanie i nadawanie głębi elementom wizualnym. Przykładowo stosuje się go w tworzeniu tła logotypów czy też przycisków interfejsów użytkownika. Proces tworzenia gradientu liniowego opiera się na ustawieniu punktów początkowych i końcowych oraz przypisaniu im odpowiednich wartości kolorystycznych co podkreśla jego wszechstronność. Standardowym podejściem jest użycie gradientu liniowego w celu uzyskania efektu trójwymiarowości co jest zgodne z dobrymi praktykami projektowania UX i UI. W kontekście branżowym gradienty liniowe są nieodłącznym elementem narzędzi takich jak Adobe Photoshop czy GIMP gdzie umożliwiają manipulację barwą i luminancją co jest kluczowe w profesjonalnym edytowaniu obrazów.

Pytanie 13

Kolor Chartreuse przedstawiony w formie heksadecymalnej jako #7FFF00 odpowiada wartości RGB wynoszącej

A. rgb(192, 255, 0)
B. rgb(127, 255, 0)
C. rgb(64, 255, 0)
D. rgb(128, 255, 0)
Odpowiedź rgb(127, 255, 0) jest poprawna, ponieważ odpowiada wartościom RGB z koloru Chartreuse zapisanego w postaci heksadecymalnej #7FFF00. W systemie heksadecymalnym, pierwsze dwa znaki (7F) odpowiadają wartości czerwonej (R), drugie dwa znaki (FF) wartości zielonej (G), a ostatnie dwa znaki (00) wartości niebieskiej (B). Przekształcając te wartości na system dziesiętny, 7F w heksadecymalnym to 127 w dziesiętnym, FF to 255, a 00 to 0. Użycie tego koloru w projektach graficznych, web designie czy w aplikacjach mobilnych jest szerokie, zwłaszcza w kontekście tworzenia interfejsów użytkownika, gdzie Chartreuse może być wykorzystany jako kolor akcentujący, przyciągający uwagę. Dobrą praktyką jest stosowanie kolorów o wysokim kontraście dla elementów interaktywnych, co sprawia, że korzystanie z tak żywego koloru jak Chartreuse może poprawić użyteczność oraz estetykę projektu. Warto również zaznaczyć, że znajomość konwersji kolorów między różnymi modelami (HEXA, RGB, CMYK) jest kluczowa dla każdego projektanta wizualnego, z uwagi na różne zastosowania w druku i w mediach cyfrowych.

Pytanie 14

Jakie formaty wideo są obsługiwane przez standard HTML5?

A. Ogg, QuickTime
B. MP4, Ogg, WebM
C. MP4, AVI
D. Ogg, AVI, MPEG
Wybór odpowiedzi MP4, AVI, Ogg czy Ogg, AVI, MPEG jest błędny z kilku powodów. Format AVI, mimo swojej popularności, nie jest obsługiwany w standardzie HTML5. AVI to stary format, który nie jest zoptymalizowany do użytku w sieci, co prowadzi do problemów z kompatybilnością i wydajnością. Z kolei QuickTime, chociaż używany w niektórych aplikacjach, nie jest standardowo wspierany przez HTML5, co ogranicza jego zastosowanie w nowoczesnych stronach internetowych. W przypadku formatu MPEG, choć jest on dość powszechnie stosowany, to nie jest preferowany w kontekście HTML5, a jego wsparcie jest ograniczone w porównaniu do MP4, Ogg i WebM. Warto zaznaczyć, że najnowsze przeglądarki internetowe szybko przechodzą na otwarte standardy, co sprawia, że formaty, które opierają się na patencie, stają się mniej popularne. W związku z tym, korzystanie z formatów takich jak MP4, Ogg czy WebM nie tylko zapewnia lepszą jakość i wydajność, ale również zwiększa dostępność treści w sieci. Wybór niewłaściwych formatów może prowadzić do problemów z odtwarzaniem na różnych platformach, co negatywnie wpływa na doświadczenia użytkowników oraz zasięg treści. W efekcie, aby zachować optymalne standardy w tworzeniu stron internetowych, kluczowe jest stosowanie formatów zgodnych ze specyfikacją HTML5.

Pytanie 15

Aby obraz dodany za pomocą kodu HTML był zrozumiały dla programów wspierających osoby niewidome, konieczne jest zdefiniowanie atrybutu

A. sizes
B. alt
C. src
D. border
Atrybut 'src' w znaczniku <img> jest odpowiedzialny za określenie źródła obrazu, czyli lokalizacji pliku graficznego, który ma być wyświetlony. Choć jest to kluczowy element dla poprawnego wyświetlenia obrazów, nie ma on żadnego związku z dostępnością treści dla osób niewidomych. Wybór 'src' jako odpowiedzi na pytanie świadczy o niepełnym zrozumieniu roli, jaką odgrywają atrybuty w kontekście dostępności. Z kolei atrybut 'border' definiuje szerokość obramowania wokół obrazka i również nie wnosi nic do kwestii dostępności, ponieważ nie dostarcza żadnych informacji osobom, które nie mogą zobaczyć obrazu. Natomiast 'sizes' jest używany do określenia, jak obraz powinien być wyświetlany w różnych warunkach, ale ponownie, nie odnosi się to do potrzeb osób z ograniczeniami wzrokowymi. Nieprawidłowe odpowiedzi często wynikają z mylenia funkcji atrybutów, co prowadzi do błędnego wniosku, że inne atrybuty mogą zaspokajać potrzeby dostępności. W praktyce, aby strona była dostępna, należy stosować atrybut 'alt', który spełnia kluczową rolę w komunikacji treści wizualnych z użytkownikami wymagającymi wsparcia, a ignorowanie tej zasady może skutkować wykluczeniem części użytkowników z korzystania z serwisu internetowego.

Pytanie 16

W ramce przedstawiono właściwości pliku graficznego:

Wymiary:4272 x 2848px
Rozdzielczość:72 dpi
Format:JPG
W celu optymalizacji czasu ładowania rysunku na stronę WWW należy:
A. zmienić format grafiki na CDR.
B. zmienić proporcje szerokości do wysokości.
C. zwiększyć rozdzielczość.
D. zmniejszyć wymiary rysunku.
Odpowiedź jest poprawna. Czas ładowania obrazu na stronę WWW jest w dużej mierze zależny od jego rozmiaru. Zasada jest prosta: im mniejszy rozmiar pliku, tym szybciej zostanie załadowany. Zmniejszenie wymiarów rysunku prowadzi do zmniejszenia rozmiaru pliku, co optymalizuje czas ładowania. W praktyce, oznacza to, że jeżeli masz obraz o wymiarach 2000x2000 pikseli, a na stronie prezentowany jest w wymiarach 500x500 pikseli, to wartość ta jest zdecydowanie za duża i może spowalniać ładowanie strony. Dobrą praktyką jest dostosowanie rozmiaru obrazu do rozmiaru, w jakim ma być wyświetlany na stronie. Warto jednak pamiętać, że zmniejszanie rozmiaru obrazu może wpływać na jego jakość, dlatego ważne jest znalezienie odpowiedniego balansu pomiędzy czasem ładowania a jakością prezentowanego rysunku.

Pytanie 17

Który efekt został zaprezentowany na filmie?

A. Zmiana jasności zdjęć.
B. Zwiększenie ostrości zdjęcia.
C. Przenikanie zdjęć.
D. Zmniejszenie kontrastu zdjęcia.
Poprawnie wskazany efekt to przenikanie zdjęć, często nazywane też płynnym przejściem (ang. crossfade). Polega to na tym, że jedno zdjęcie stopniowo zanika, jednocześnie drugie pojawia się z narastającą widocznością. W praktyce technicznej realizuje się to najczęściej przez zmianę przezroczystości (opacity) dwóch warstw – jedna warstwa z pierwszym obrazem ma zmniejszaną wartość opacity z 1 do 0, a druga z kolejnym zdjęciem zwiększaną z 0 do 1. Na stronach WWW taki efekt robi się zwykle za pomocą CSS (transition, animation, keyframes) albo JavaScriptu, czasem z użyciem bibliotek typu jQuery czy gotowych sliderów. Moim zdaniem to jest jeden z podstawowych efektów, który warto umieć odtworzyć, bo pojawia się w galeriach, sliderach na stronach głównych, prezentacjach produktów czy prostych pokazach slajdów. W materiałach multimedialnych, np. w edycji wideo, dokładnie ten sam efekt nazywa się przejściem typu „cross dissolve” lub „fade”, i zasada działania jest identyczna – płynne nakładanie się dwóch klatek obrazu w czasie. Dobre praktyki mówią, żeby nie przesadzać z czasem trwania przenikania: zwykle 0,5–1,5 sekundy daje przyjemny, profesjonalny wygląd, bez wrażenia „zamulenia” interfejsu. Warto też pilnować spójności – jeśli na stronie używasz przenikania w jednym miejscu, dobrze jest utrzymać podobny styl animacji w innych elementach, żeby całość wyglądała konsekwentnie i nie rozpraszała użytkownika. W kontekście multimediów na WWW przenikanie jest też korzystne wydajnościowo, bo operuje głównie na właściwości opacity i transformacjach, które przeglądarki potrafią optymalizować sprzętowo.

Pytanie 18

Zapis koloru w formacie #ff00e0 jest równoważny reprezentacji

A. rgb(ff, 0, e0)
B. rgb(255, 0, 128)
C. rgb(255, 0, 224)
D. rgb(f, 0, e0)
Odpowiedź rgb(255, 0, 224) jest poprawna, ponieważ kolor zapisany w formacie szesnastkowym #ff00e0 odpowiada wartościom RGB, gdzie 'ff' oznacza maksymalną wartość czerwonego koloru (255), '00' oznacza zerową wartość zielonego koloru (0), a 'e0' odpowiada wartości niebieskiego koloru w systemie szesnastkowym, co daje 224 w systemie dziesiętnym. W praktyce oznacza to, że mamy do czynienia z kolorem różowym, z dominującym światłem czerwonym i niebieskim, co tworzy ciekawe odcienie. Taki sposób reprezentacji kolorów jest powszechnie stosowany w web designie i grafice komputerowej, co pozwala na łatwe i precyzyjne definiowanie kolorów w stylach CSS oraz HTML. Przykładowo, używanie kodów szesnastkowych do definiowania kolorów w kodzie CSS jest standardową praktyką, umożliwiającą spójną i estetyczną prezentację treści wizualnych na stronach internetowych.

Pytanie 19

Formatem grafiki wektorowej jest

A. GIF
B. PNG
C. JPG
D. SVG
W tym pytaniu łatwo się pomylić, bo wszystkie podane formaty są popularne w internecie, ale tylko jeden z nich jest wektorowy. Kluczowa różnica to sposób przechowywania obrazu. Grafika rastrowa zapisuje informację o każdym pikselu, a wektorowa opisuje kształty za pomocą równań matematycznych. To fundamentalne, bo wpływa na skalowanie, jakość i zastosowanie w praktyce. Formaty JPG, GIF i PNG to typowe formaty grafiki rastrowej. JPG (JPEG) jest używany głównie do zdjęć i skomplikowanych obrazów z wieloma kolorami oraz przejściami tonalnymi. Stosuje kompresję stratną, więc zmniejsza rozmiar pliku kosztem jakości. Przy powiększaniu obraz JPG zaczyna się „pikselizować”, czyli widać pojedyncze piksele i artefakty kompresji. To kompletnie inny świat niż grafika wektorowa. GIF to również format rastrowy, dosyć stary, obsługujący ograniczoną liczbę kolorów (do 256). Kojarzy się głównie z prostymi animacjami w internecie, ale nadal operuje na siatce pikseli. Nie nadaje się do skalowalnych ikon czy logotypów, bo po powiększeniu traci ostrość. PNG z kolei jest rastrowym formatem bezstratnym, świetnym do zrzutów ekranu, interfejsów, grafiki z przezroczystością. Mimo że jakość PNG jest bardzo dobra, obraz dalej pozostaje nieprzystosowany do dowolnego skalowania bez utraty ostrości. Typowym błędem jest myślenie, że skoro GIF czy PNG są używane w interfejsach, ikonach i elementach stron, to muszą być „wektorowe”. W praktyce to po prostu dobrze wyglądające bitmapy w określonej rozdzielczości. Kiedy zwiększymy rozmiar, widać piksele. Grafika wektorowa, jak SVG, zachowuje ostrość niezależnie od skali. Dlatego przy pytaniach o formaty wektorowe warto zawsze z tyłu głowy mieć tę prostą zasadę: JPG, GIF, PNG – raster; SVG – wektor (w kontekście WWW). Zrozumienie tej różnicy bardzo pomaga później przy projektowaniu layoutów, doborze formatów i optymalizacji grafiki na stronach.

Pytanie 20

Który z formatów plików używa kompresji stratnej?

A. GIF
B. PNG
C. BMP
D. JPEG
Poprawnie – spośród podanych formatów to właśnie JPEG wykorzystuje kompresję stratną. Oznacza to, że podczas zapisu obrazu część informacji o pikselach jest bezpowrotnie usuwana, żeby zmniejszyć rozmiar pliku. Algorytm JPEG analizuje obraz, rozkłada go na składowe (m.in. za pomocą DCT – dyskretnej transformacji cosinusowej), a następnie odrzuca te detale, których ludzkie oko zazwyczaj i tak nie zauważa, szczególnie w przejściach tonalnych i drobnych teksturach. Dzięki temu zdjęcie może ważyć np. 10 razy mniej niż w BMP, przy akceptowalnej jakości. W praktyce JPEG jest standardem do zapisu fotografii na stronach WWW, w mediach społecznościowych, w aparatach cyfrowych czy telefonach. Stosuje się go tam, gdzie ważniejszy jest mały rozmiar pliku niż idealna, bezstratna jakość – np. galerie produktowe w sklepach internetowych, blogi, portfolia. Dobrą praktyką w webdevie jest używanie JPEG do zdjęć i skomplikowanych obrazów, a PNG lub SVG do grafiki z ostrymi krawędziami, logotypów, ikon. Warto też pamiętać o ustawianiu rozsądnego poziomu kompresji: zbyt mocna kompresja JPEG powoduje widoczne artefakty (blokowe kwadraty, rozmycia krawędzi), zbyt słaba – niepotrzebnie duże pliki. Moim zdaniem sensownie jest testować kilka poziomów jakości (np. 60–80%) i wybierać kompromis między wagą a wyglądem, bo to dokładnie ta decyzja, z którą spotykasz się później w realnych projektach WWW.

Pytanie 21

Jakim kodem określa się kolor czerwony?

A. #00EEEE
B. #00EE00
C. #0000EE
D. #EE0000
Poprawna odpowiedź to #EE0000, co jest kodem szesnastkowym reprezentującym kolor czerwony w systemie RGB. W tym kodzie, wartość R (czerwony) wynosi 238, co oznacza maksymalne nasycenie tego koloru. Wartości G (zielony) i B (niebieski) są ustawione na 0, co oznacza, że brak tych kolorów powoduje, że czerwony staje się dominujący. Kolory w formacie szesnastkowym są powszechnie stosowane w projektowaniu stron internetowych oraz w grafice komputerowej, ponieważ umożliwiają precyzyjne określenie kolorów. Na przykład, w CSS można użyć tego kodu, aby ustawić kolor tła przycisku: 'background-color: #EE0000;'. Taka praktyka pozwala na łatwe i konsekwentne utrzymanie estetyki wizualnej projektu. Warto również zaznaczyć, że w kontekście kolorów, czerwony często symbolizuje energię, pasję i akcję, co czyni go popularnym wyborem w marketingu i reklamie, gdzie przyciągnięcie uwagi jest kluczowe.

Pytanie 22

Model barw o parametrach: odcień, nasycenie, jasność i przezroczystość, to

A. SRGB
B. CMYK
C. RGBA
D. HSLA
W tym pytaniu chodzi o model barw, w którym występują dokładnie cztery parametry: odcień, nasycenie, jasność i przezroczystość. Kluczowe są tu trzy pierwsze słowa: odcień, nasycenie, jasność. To już samo w sobie powinno kierować myślenie w stronę rodziny HSL/HSV, a nie klasycznego RGB czy modeli drukarskich takich jak CMYK. Typowym błędem jest patrzenie tylko na obecność kanału przezroczystości i automatyczne kojarzenie go z RGBA, bo wiele osób zapamiętuje po prostu „A = alpha, czyli przeźroczystość”, bez zwracania uwagi na to, jakie są pozostałe składowe. W modelu RGBA mamy składniki Red, Green, Blue plus Alpha. Nie ma tam odcienia, nasycenia i jasności jako osobnych parametrów, tylko trzy liczby opisujące natężenie podstawowych składowych RGB. To oczywiście też może zawierać informację o kolorze, ale w zupełnie inny sposób. Jeżeli w pytaniu pojawia się słowo „odcień”, to z mojego doświadczenia w zadaniach testowych prawie zawsze chodzi o HSL/HSLA albo HSV/HSVA, bo tam kolor opisuje się kołem barw i procentami. Samo SRGB to nie jest model z parametrami odcień–nasycenie–jasność–przezroczystość, tylko standardowa przestrzeń barw RGB dla monitorów, zdefiniowana m.in. przez konsorcjum W3C i Microsoft. W CSS co prawda używamy funkcji `rgb()` czy `rgba()`, ale to tylko zapisy w przestrzeni sRGB, a nie osobny czteroparametrowy model jak w treści pytania. Wybranie SRGB często wynika z tego, że ktoś kojarzy skrót z „kolorami w przeglądarce”, ale to za mało, bo pytanie precyzyjnie opisuje właściwości. Z kolei CMYK jest modelem typowo poligraficznym: Cyan, Magenta, Yellow, Key (Black). Stosuje się go w druku, a nie w definicjach kolorów w CSS i nie ma tam żadnego kanału alpha ani parametrów odcień/nasycenie/jasność. Mylenie CMYK z HSL/HSLA to zwykle wynik tego, że ktoś kojarzy „inny niż RGB, więc może ten”. W projektowaniu stron WWW i interfejsów użytkownika, zgodnie z dobrymi praktykami front-end, warto rozróżniać: RGB/RGBA – składowe podstawowych barw światła, HSLA – odcień, nasycenie, jasność plus alpha, CMYK – druk, a sRGB – nazwa przestrzeni, nie czteroelementowego modelu H+S+L+A.

Pytanie 23

Kolor reprezentowany w formacie heksadecymalnym #0000FF to

A. czarny
B. zielony
C. niebieski
D. czerwony
Kolor zapisany w notacji heksadecymalnej #0000FF to odcień niebieskiego. Notacja heksadecymalna jest powszechnie stosowana w projektowaniu stron internetowych oraz grafice komputerowej do definicji kolorów w systemie RGB. W tej notacji sześć znaków reprezentuje wartości czerwonego, zielonego i niebieskiego (RGB), gdzie pierwsze dwa znaki to wartość czerwonego, kolejne dwa to wartość zielonego, a ostatnie dwa to wartość niebieskiego. W przypadku #0000FF, wartości są następujące: 00 (czerwony), 00 (zielony), FF (niebieski), co oznacza maksymalny poziom niebieskiego światła. Taki kolor jest czystym niebieskim, uzyskiwanym gdy intensywność czerwonego i zielonego jest zerowa, a niebieskiego maksymalna. Przykładami użycia niebieskiego w designie mogą być logo Facebooka, które wykorzystuje podobny odcień, czy tła niektórych stron internetowych. Heksadecymalne kody kolorów są zgodne z standardem W3C, co zapewnia ich uniwersalność i spójność w różnych aplikacjach graficznych i interfejsach użytkownika.

Pytanie 24

Jakiej opcji w edytorze grafiki rastrowej należy użyć, aby przygotować obraz do wyświetlenia na stronie w taki sposób, aby widoczna była tylko część znajdująca się w obrębie ramki?

Ilustracja do pytania
A. Odbicie
B. Skalowanie
C. Perspektywa
D. Kadrowanie
Kadrowanie to proces polegający na usuwaniu niechcianych części obrazu w celu skupienia uwagi na jego istotnych elementach. W kontekście przygotowywania rysunku do wyświetlenia na stronie internetowej, kadrowanie pozwala na wyeksponowanie tylko tych fragmentów grafiki, które mają być widoczne dla odbiorcy, jednocześnie usuwając zbędne tło czy elementy. Jest to technika szeroko stosowana w branży graficznej i fotograficznej, gdzie precyzyjne dostosowanie kompozycji wizualnej ma kluczowe znaczenie dla estetyki oraz komunikacji wizualnej. Kadrowanie wspiera także optymalizację plików graficznych, redukując ich rozmiar i poprawiając czas ładowania strony. W edytorach grafiki rastrowej, takich jak Adobe Photoshop czy GIMP, kadrowanie jest intuicyjnym narzędziem, które pozwala na szybkie i efektywne dostosowanie kadru do wymogów projektu. Dobre praktyki branżowe zalecają regularne kadrowanie w celu zwiększenia czytelności i nadania profesjonalnego wyglądu materiałom wizualnym. Poprawnie wykadrowany obraz nie tylko poprawia estetykę, ale również może wpłynąć na przekaz oraz zaangażowanie użytkowników. Wybór właściwych proporcji i skali podczas kadrowania jest istotny dla uzyskania spójnego i harmonijnego efektu końcowego, który będzie zgodny z założeniami projektu oraz oczekiwaniami odbiorcy.

Pytanie 25

Który z wymienionych formatów umożliwia zapisanie materiału wideo z towarzyszącą ścieżką dźwiękową?

A. WAV
B. AAC
C. MP4
D. WMA
Odpowiedź MP4 jest poprawna, ponieważ jest to jeden z najpopularniejszych formatów kontenerowych używanych do przechowywania wideo wraz z dźwiękiem. Format MP4 (MPEG-4 Part 14) pozwala na efektywne kodowanie wideo, przy jednoczesnym zachowaniu wysokiej jakości obrazu i dźwięku. Umożliwia on przechowywanie różnorodnych strumieni danych, w tym wideo, audio, a także tekstu, co czyni go bardzo wszechstronnym rozwiązaniem dla twórców multimediów. Przykładowo, format MP4 jest często używany w aplikacjach do strumieniowania wideo, takich jak YouTube, oraz w systemach zarządzania treścią (CMS) do publikacji materiałów wideo w Internecie. Dzięki kompresji zgodnej z kodekiem H.264 dla wideo i AAC dla audio, pliki MP4 są względnie małe, co ułatwia ich przesyłanie i przechowywanie. To czyni format MP4 standardem branżowym w produkcji filmowej, telewizyjnej oraz w aplikacjach mobilnych i webowych.

Pytanie 26

W CSS zapisany w ten sposób:

p { background-image: url("rysunek.png"); }

spowoduje, że rysunek.png stanie się

A. widoczny obok każdego akapitu
B. tłem całej witryny
C. wyświetlony, jeśli w kodzie użyty zostanie znacznik img
D. tłem każdego akapitu
Zapis CSS p { background-image: url("rysunek.png"); } oznacza, że dla każdego elementu akapitowego <p> w dokumencie zostanie ustawione tło w postaci grafiki o nazwie rysunek.png. Ta reguła selektora p dotyczy wyłącznie znaczników akapitu, więc nie wpłynie na inne elementy strony, takie jak body czy img. Tak się to stosuje w praktyce: projektując na przykład bloga, możesz dodać delikatny deseń lub obrazek w tle akapitu, żeby całość wyglądała ciekawiej albo podkreślała styl witryny. Co ciekawe, background-image w CSS pozwala na olbrzymią elastyczność — możesz wykorzystać obrazy, gradienty czy nawet SVG jako tło. Standardy CSS jasno to definiują: background-image działa zawsze na tym elemencie, dla którego zadeklarowano regułę w selektorze. Warto pamiętać, że tło nie przesłoni tekstu w akapicie, tylko się pod nim wyświetli, więc czytelność jest zachowana. Z własnego doświadczenia uważam, że umiejętność stosowania background-image do konkretnych elementów to jedno z podstawowych narzędzi webdevelopera — pozwala przygotować naprawdę estetyczne i przejrzyste layouty. Dobrym nawykiem jest także testowanie widoczności tła na różnych urządzeniach, bo rozdzielczości i skalowanie potrafią zaskoczyć. Dla porządku, jeśli podasz background-image bez żadnych dodatkowych parametrów (jak powtarzanie czy pozycjonowanie), obrazek domyślnie będzie się powtarzał w poziomie i pionie, aż pokryje cały akapit.

Pytanie 27

System baz danych gromadzi multimedia, co wiąże się z przechowywaniem znacznych ilości danych binarnych. Jakiego typu danych należy użyć w tym przypadku?

A. DOUBLE
B. LONGTEXT
C. ENUM
D. BLOB
Wybór innych typów danych, takich jak ENUM, DOUBLE czy LONGTEXT, do przechowywania danych multimedialnych jest nieodpowiedni z kilku powodów. ENUM jest typem danych służącym do przechowywania z góry zdefiniowanych wartości, co oznacza, że jego zastosowanie ogranicza się do małych zestawów danych, takich jak kategorie czy statusy, a nie do dużych, binarnych plików multimedialnych. Przykładowo, jeśli chcielibyśmy przechować obraz jako ENUM, napotkalibyśmy na problem z rozmiarem oraz elastycznością tego rozwiązania, co w praktyce byłoby nieefektywne. DOUBLE z kolei jest typem służącym do przechowywania liczb zmiennoprzecinkowych, co również nie ma zastosowania w kontekście danych binarnych, takich jak multimedia. Użycie DOUBLE do przechowywania plików audio czy wideo byłoby błędne, ponieważ nie jest on przystosowany do przechowywania danych binarnych, a jedynie do reprezentacji wartości numerycznych. LONGTEXT, mimo że może pomieścić dużą ilość danych tekstowych, również nie jest odpowiedni do przechowywania danych binarnych. Jest to typ przeznaczony do długich łańcuchów znaków, co nie pasuje do formatu plików multimedialnych, które wymagają innego podejścia. Użycie niewłaściwych typów danych w bazach danych może prowadzić do problemów z wydajnością, a także do trudności w zarządzaniu danymi. Dlatego ważne jest, aby dobrze rozumieć różnice między typami danych i ich zastosowaniem w praktyce, aby zapewnić optymalne przechowywanie i zarządzanie danymi w aplikacjach.

Pytanie 28

W jakim typie pliku powinno się zapisać zdjęcie, aby mogło być wyświetlane na stronie WWW z zachowaniem efektu przezroczystości?

A. PNG
B. BMP
C. JPG
D. CDR
Format PNG (Portable Network Graphics) jest idealnym wyborem do przechowywania obrazów z przezroczystością, ponieważ obsługuje kanał alfa, który pozwala na reprezentację przezroczystości w obrazach. Ta cecha jest szczególnie cenna w projektowaniu stron internetowych, gdzie grafiki muszą być dopasowane do różnych tła bez widocznych krawędzi. Przykładowo, logo firmy zapisane w formacie PNG może być umieszczone na stronie o różnych kolorach tła, zachowując estetyczny wygląd i nie zaburzając kompozycji. Ponadto, PNG jest formatem bezstratnym, co oznacza, że zachowuje jakość oryginalnego obrazu podczas kompresji, co jest ważne, gdy zależy nam na zachowaniu szczegółów i kolorów. W praktyce, wiele przeglądarek internetowych i edytorów graficznych obsługuje ten format, co czyni go standardem w branży. Dlatego dla grafik z przezroczystością PNG jest najczęściej zalecanym formatem, zgodnym z aktualnymi standardami i najlepszymi praktykami w dziedzinie projektowania stron internetowych.

Pytanie 29

Które z poniższych stwierdzeń dotyczy grafiki wektorowej?

A. Zapisywany obraz jest opisywany za pośrednictwem figur geometrycznych umieszczonych w układzie współrzędnych
B. Zawiera przedstawienie obrazu przy użyciu siatki składającej się z kolorowych pikseli ustawionych w pionie i poziomie na monitorze komputera, drukarce lub innym urządzeniu wyjściowym
C. Służy do zapisu cyfrowych zdjęć
D. Może być zapisywana w formacie JPG lub PNG
Pierwsza z odpowiedzi odnosi się do grafiki rastrowej, która wykorzystuje siatkę pikseli do przedstawiania obrazów. Tego typu grafika jest ograniczona do rozdzielczości, co oznacza, że powiększanie obrazu prowadzi do utraty jakości i widocznych pikseli. Drugą nieprawidłową odpowiedzią jest stwierdzenie, że grafika wektorowa może być przechowywana w formacie JPG lub PNG. Te formaty są dedykowane dla grafiki rastrowej, a nie wektorowej. JPG to format stratny, który kompresuje obraz, co prowadzi do utraty szczegółów, natomiast PNG, choć obsługuje przezroczystość, nadal jest formatem rastrowym. Ostatnia z nieprawidłowych odpowiedzi podaje, że grafika wektorowa jest wykorzystywana do zapisu fotografii cyfrowej, co jest nieprecyzyjne, ponieważ fotografie cyfrowe są najczęściej zapisywane w formatach rastrowych, a nie wektorowych. Grafika wektorowa jest bardziej odpowiednia dla ilustracji, logo i innych elementów graficznych, które wymagają zmienności bez degradacji jakości, natomiast fotografie wymagają złożoności detali, którą lepiej uchwyci grafika rastrowa. W związku z tym, każda z podanych niepoprawnych odpowiedzi zawiera błędne założenia dotyczące charakterystyki grafiki wektorowej, jej formatów oraz zastosowania.

Pytanie 30

W jakich formatach można przechować wideo razem z dźwiękiem?

A. WMA
B. AAC
C. MP4
D. WAV
MP4 to jeden z najbardziej popularnych formatów plików multimedialnych, który jest szeroko stosowany do zapisywania materiałów wideo wraz ze ścieżkami dźwiękowymi. MP4, jako kontener, obsługuje różne kodeki wideo, takie jak H.264, a także kodeki audio, w tym AAC. Dzięki tej wszechstronności, format MP4 jest idealny do przechowywania zarówno obrazu, jak i dźwięku w jednym pliku, co jest kluczowe dla wielu zastosowań, od streamingu wideo po przechowywanie lokalne. MP4 jest zgodny z wieloma platformami i urządzeniami, co czyni go standardem dla treści wideo w Internecie. Przykładem zastosowania MP4 mogą być platformy takie jak YouTube, gdzie użytkownicy przesyłają filmy w tym formacie, aby zapewnić wysoką jakość obrazu i dźwięku. Warto również zauważyć, że MP4 wspiera różne metadane, co umożliwia dodawanie informacji o pliku, takich jak tytuł, artysta czy okładka albumu. Dzięki tym wszystkim właściwościom, MP4 jest niezastąpionym formatem w dziedzinie multimediów.

Pytanie 31

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

A. A. AVI
B. D. WebM
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 32

Na ilustracji przedstawiono ustawienia programu służącego do montażu filmów. Nowy projekt ma ustawienia

Ilustracja do pytania
A. 25 klatek na cały film.
B. 48 minut czasu trwania filmu.
C. wysokość 1920 px i szerokość 1080 px.
D. 25 klatek na każdą sekundę filmu.
Prawidłowa odpowiedź wynika bezpośrednio z oznaczenia „25 fps” w ustawieniach projektu. Skrót fps oznacza „frames per second”, czyli liczbę klatek na sekundę. Jeśli projekt ma 25 fps, to znaczy, że każda sekunda gotowego filmu będzie złożona z 25 kolejnych klatek wideo. To jest właśnie standardowa liczba klatek na sekundę stosowana w Europie (standard telewizyjny oparty na PAL), bardzo często używana w programach do montażu i w kamerach. W praktyce wygląda to tak: jeżeli nagrasz materiał w 25 fps i zmontujesz projekt również w 25 fps, to ruch będzie wyglądał naturalnie, a odtwarzanie będzie płynne i zgodne z typowymi ustawieniami telewizorów i wielu platform VOD. Gdybyś ustawił np. 10 fps, obraz byłby wyraźnie „szarpiący”, a przy 60 fps – bardzo płynny, ale też wymagający więcej miejsca na dysku i większej mocy obliczeniowej przy montażu. Moim zdaniem warto zapamiętać, że liczba klatek na sekundę to jedna z kluczowych decyzji przy zakładaniu nowego projektu: wpływa na płynność ruchu, rozmiar pliku wynikowego i komfort montażu. W programach do edycji wideo zawsze szukaj parametru „Frame Rate” lub właśnie „fps”. Jeżeli widzisz tam liczbę, np. 24, 25, 30, 50 czy 60, to zawsze będzie chodziło o liczbę klatek przypadających na jedną sekundę odtwarzania filmu, a nie o całkowitą liczbę klatek czy czas trwania projektu. W tym zadaniu opis 25 fps dokładnie odpowiada odpowiedzi „25 klatek na każdą sekundę filmu”.

Pytanie 33

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

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

Pytanie 34

Wskaż prawidłowe twierdzenie odnoszące się do zaprezentowanego kodu HTML.

<video width="640" height="480" controls>
    <source src="animacja.mp4" type="video/mp4">
</video>
A. Plik animacja.mp4 powinien mieć rozdzielczość 640x480 pikseli, aby można go było odtworzyć.
B. Ścieżka do pliku jest niepoprawna, nie zawiera pełnej ścieżki.
C. Kod może nie działać w przeglądarkach, które nie wspierają HTML5.
D. Użytkownik nie będzie miał możliwości kontrolowania odtwarzania wideo.
Pierwsze stwierdzenie sugeruje, że plik animacja.mp4 musi mieć rozdzielczość 640x480 pikseli, co jest nieprawdziwe, ponieważ atrybuty width i height w znaczniku <video> nie narzucają wymagań rozdzielczości dla samego pliku wideo, lecz jedynie definiują rozmiar ramki odtwarzacza w przeglądarce. Jeśli plik ma inną rozdzielczość, przeglądarka odpowiednio go przeskaluje. Drugie stwierdzenie, że użytkownik nie będzie miał możliwości sterowania odtwarzaniem animacji, jest błędne, ponieważ atrybut controls w znaczniku <video> dokładnie to umożliwia, dostarczając przyciski do odtwarzania, pauzowania oraz regulacji głośności. Ostatnie stwierdzenie dotyczące lokalizacji pliku jest również mylne, ponieważ kod nie wymaga ścieżki bezwzględnej dla pliku animacja.mp4. W przypadku gdy plik znajduje się w tym samym katalogu co strona HTML, wystarczy podać jego nazwę. W przeciwnym razie można zastosować ścieżkę względną, co jest zgodne z dobrymi praktykami w zakresie organizacji plików na serwerze. Te nieporozumienia mogą prowadzić do mylnych wniosków, dlatego ważne jest zrozumienie zasad działania znaczników HTML oraz podstawowych koncepcji związanych z odtwarzaniem multimediów w sieci.

Pytanie 35

Taki styl CSS sprawi, że na stronie internetowej

ul{ list-style-image: url('rys.gif'); }
A. każdy punkt listy zyska osobne tło z grafiki rys.gif
B. rys.gif stanie się ramką dla listy nienumerowanej
C. rys.gif wyświetli się jako tło dla listy nienumerowanej
D. punkt listy nienumerowanej będzie rys.gif
Deklaracja CSS ul{ list-style-image: url('rys.gif'); } powoduje, że każdy element listy nienumerowanej (ul) używa obrazu rys.gif jako punktora. Właściwość list-style-image pozwala na zamianę domyślnego stylu punktów listy, takiego jak kropki czy kwadraty, na dowolny obrazek. Jest to przydatne, gdy chcemy nadać stronie unikalny wygląd lub dostosować ją do identyfikacji wizualnej marki. W praktyce oznacza to, że zamiast klasycznego punktora, użytkownicy zobaczą wybrany obraz, co może wpłynąć na estetykę i czytelność strony. Ważne jest, aby obraz był odpowiednio skalowany, aby nie zaburzał układu listy. List-style-image to standardowa właściwość CSS uznawana przez większość przeglądarek, co czyni ją uniwersalnym narzędziem w rękach projektanta stron. W procesie projektowania warto upewnić się, że wybrany obrazek jest dostępny dla wszystkich użytkowników, co można osiągnąć np. poprzez dodanie atrybutu alt w wersji tekstowej listy dla lepszej dostępności.

Pytanie 36

W programie Audacity, podczas edytowania dźwięku pozyskanego z płyty analogowej, konieczne jest usunięcie pojedynczych trzasków typowych dla płyt winylowych. Jakie narzędzie jest do tego celu przeznaczone?

A. Usuwanie stukotu (Click Removal)
B. Obwiednia (Envelope)
C. Normalizuj (Normalize)
D. Redukcja szumu (Noise Reduction)
Wybór narzędzi takich jak 'Obwiednia (Envelope)', 'Normalizuj (Normalize)' oraz 'Redukcja szumu (Noise Reduction)' wskazuje na nieporozumienie dotyczące funkcji tych opcji w programie Audacity. Narzędzie 'Obwiednia' służy do dynamicznej regulacji głośności dźwięku w czasie, co nie ma zastosowania w przypadku usuwania pojedynczych trzasków. Chociaż może być użyteczne w kontekście ogólnej edycji utworu, nie jest odpowiednie do eliminacji krótkotrwałych zakłóceń. Z kolei 'Normalizuj' ma na celu podniesienie poziomu głośności całego nagrania do maksymalnego poziomu bez zniekształceń, co może skutkować wzmocnieniem trzasków zamiast ich eliminacji. Używanie tego narzędzia przed usunięciem trzasków może sprawić, że będą one bardziej wyraźne, co jest przeciwnym efektem do zamierzonego. 'Redukcja szumu' jest narzędziem, które usuwa szumy tła, a nie krótkotrwałe dźwięki, takie jak trzaski. Chociaż może być użyta w procesie poprawy jakości nagrania, nie jest ona w stanie skutecznie rozwiązać problemu z trzaskami, które mają inną charakterystykę. W praktyce, nieodpowiedni wybór narzędzi prowadzi do nieefektywnej obróbki dźwięku, co może skutkować niezadowalającą jakością finalnego nagrania.

Pytanie 37

Kolor określony kodem RGB, mający wartość rgb(255, 128, 16) w przedstawieniu szesnastkowym, przyjmie jaką wartość?

A. #ff0fl0
B. #ff8011
C. #ff8010
D. #008010
Odpowiedź #ff8010 jest trafna. Konwersja wartości RGB na szesnastkowy to w sumie przekształcanie kolorów: czerwony, zielony i niebieski. W przypadku rgb(255, 128, 16), czerwony (255) zmienia się w 'ff', zielony (128) w '80', a niebieski (16) w '10'. Gdy to wszystko połączymy, dostajemy kod #ff8010. To wiedza, która naprawdę się przydaje, gdy pracujesz z kolorami w stronach www, aplikacjach graficznych czy przy projektowaniu interfejsów. W branży IT używanie standardu RGB i konwersji do HEX to normalka, bo to pozwala na dokładne określenie kolorów w kodzie. Na przykład, w CSS łatwo będzie używać kolorów w tym formacie, a to pomaga w lepszej czytelności kodu.

Pytanie 38

Aby uzyskać przezroczyste tło w obrazie formatu JPG, należy wykonać

A. dodanie kanału alfa
B. użycie filtru Gaussa
C. korekcję nasycenia kolorów
D. właściwe przycięcie
Dodanie kanału alfa do obrazu JPG jest kluczowym krokiem, aby uzyskać przezroczystość tła. Format JPG, z definicji, nie obsługuje przezroczystości, dlatego konieczne jest przekształcenie obrazu do formatu, który to umożliwia, takiego jak PNG. Kanał alfa to dodatkowa warstwa, która przechowuje informacje o przezroczystości dla każdego piksela obrazu, pozwalając na uzyskanie efektu przezroczystości. Aby dodać kanał alfa, można skorzystać z programów graficznych takich jak Adobe Photoshop, GIMP czy Affinity Photo. Przykładowo, w Photoshopie można użyć funkcji 'Zaznaczenie i maska', aby wyodrębnić obiekt z tła, a następnie zapisać go z kanałem alfa jako PNG. Użycie kanału alfa jest standardową praktyką w edytowaniu grafiki, szczególnie w kontekście tworzenia logo, grafik do stron internetowych i zasobów do gier wideo, gdzie przezroczystość odgrywa kluczową rolę w integracji elementów wizualnych.

Pytanie 39

Jaką cechę wyróżnia format PNG?

A. możliwość obsługi animacji
B. możliwość reprezentacji grafiki wektorowej
C. niedostępność kanału alfa
D. kompresję bezstratną
Odpowiedzi dotyczące obsługi animacji, braku obsługi kanału alfa oraz reprezentacji grafiki wektorowej są niepoprawne na poziomie technicznym. Format PNG nie wspiera animacji, co czyni go innym od formatów takich jak GIF, które pozwalają na tworzenie prostych animacji. PNG został zaprojektowany do przechowywania statycznych obrazów, co jest istotną różnicą w jego zastosowaniach w porównaniu do animowanych formatów graficznych. Ponadto, PNG obsługuje kanał alfa, co oznacza, że można tworzyć obrazy z przezroczystością, umożliwiając projektantom używanie tego formatu do tworzenia złożonych kompozycji wizualnych z różnymi poziomami przezroczystości. Na koniec, PNG nie jest formatem do reprezentacji grafiki wektorowej. Grafika wektorowa opiera się na matematycznych opisach kształtów, a typowymi formatami dla takich zastosowań są SVG lub AI. PNG natomiast jest formatem rastrowym, który składa się z pikseli, co ogranicza jego zastosowanie do ilustracji złożonych z bitmap, a nie z definicji wektorowych. Dlatego dla każdego z wymienionych punktów istnieją konkretne podstawy techniczne, które potwierdzają, dlaczego nie są one odpowiednie dla opisanego formatu.

Pytanie 40

Edytor, który realizuje zasady WYSIWYG, powinien umożliwiać

A. osiągnięcie podobnego rezultatu tworzonej strony do jej wizualizacji w przeglądarce internetowej
B. tworzenie elementów podstawowej grafiki wektorowej
C. przetwarzanie plików dźwiękowych przed ich umieszczeniem na stronie internetowej
D. publikację serwisów na serwerze przy użyciu wbudowanego klienta FTP
Edytor WYSIWYG (What You See Is What You Get) jest narzędziem, które umożliwia użytkownikom tworzenie treści internetowych w sposób intuicyjny, bez konieczności znajomości kodu HTML czy CSS. Kluczowym założeniem tego typu edytora jest to, że użytkownik widzi na ekranie dokładny obraz tego, co będzie wyświetlane w przeglądarce. Uzyskanie zbliżonego wyniku tworzonej strony do jej obrazu w przeglądarce internetowej oznacza, że edytor powinien umożliwiać podgląd na żywo oraz edytowanie treści w sposób, który bezpośrednio odzwierciedla rezultaty. Przykładem takiego edytora jest WordPress, który pozwala na tworzenie stron za pomocą edytora blokowego, gdzie użytkownik może na bieżąco widzieć, jak jego strona będzie wyglądać. Standardy, takie jak HTML5 oraz CSS3, są kluczowe w kontekście tworzenia responsywnych i interaktywnych stron, a edytory WYSIWYG powinny wspierać te standardy, aby zapewniać zgodność z nowoczesnymi praktykami webowymi. Dodatkowo, funkcje takie jak przeciąganie i upuszczanie elementów, możliwość dodawania multimediów oraz formatowania tekstu są nieodłącznymi elementami, które przyczyniają się do efektywności edytorów WYSIWYG.