Wyniki egzaminu

Nowy egzamin

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 15:58
Data zakończenia: 20 kwietnia 2026 16:24

Egzamin zdany!

Wynik: 35/40 punktów (87,5%)

Wymagane minimum: 20 punktów (50%)

Nowe

Analiza przebiegu egzaminu- sprawdź jak rozwiązywałeś pytania

Przebieg egzaminu

Pochwal się swoim wynikiem!

Facebook

X.com

Szczegółowe wyniki:

Pytanie 1

W CSS zastosowano poniższe formatowanie. Kolorem czerwonym będzie wyświetlony

h1 i {
   color: red;
}

A. cały tekst nagłówka pierwszego stopnia oraz wszelki tekst italic, niezależnie od lokalizacji na stronie

B. cały tekst nagłówka pierwszego stopnia oraz tekst italic akapitu

C. jedynie tekst italic we wszystkich poziomach nagłówków

D. tylko tekst italic nagłówka pierwszego stopnia

W stylach CSS selektor złożony h1 i oznacza, że formatowanie będzie stosowane tylko do elementów pochylonych i znajdujących się wewnątrz nagłówka pierwszego poziomu h1. W praktyce oznacza to, że taki zapis CSS zmienia kolor na czerwony tylko dla tekstu wewnątrz tagu <i> znajdującego się w <h1>. Selekcja złożona umożliwia precyzyjne określanie, które elementy są formatowane, co jest kluczowe w przypadku dużych i złożonych stron internetowych. Zrozumienie działania selektorów jest fundamentem efektywnego stylizowania dokumentów HTML. Pozwala to na zachowanie spójności wizualnej oraz lepszą kontrolę nad wyglądem strony. Dobór odpowiednich selektorów w CSS to również jedna z dobrych praktyk, które sprzyjają czytelności kodu oraz jego łatwiejszej konserwacji w przyszłości. Taki zapis pozwala na minimalizację konfliktów stylów, które mogą się pojawić przy bardziej ogólnych selektorach. Praktyczne użycie selektorów złożonych jest więc zalecane w celu uzyskania bardziej kontrolowanego i przewidywalnego wyglądu strony internetowej, co jest zgodne ze standardami webowymi promującymi semantyczne i uporządkowane kodowanie.

Pytanie 2

Podano fragment kodu HTML, który nie przechodzi walidacji. Problemy z walidacją tego kodu będą dotyczyć:

<!DOCTYPE HTML>
<html>
<head>
    <title>Test</title>
</head>
<body>

<img src="obraz.gif">
<br>
<img src="obraz.gif">

</body>
</html>

A. braku zamknięcia znacznika <img>

B. braku atrybutu alt w znaczniku <img>

C. braku zamknięcia znacznika <br>

D. duplikacji nazwy pliku graficznego

Patrząc na fragment kodu, można zauważyć kilka miejsc, które czasem wprowadzają w błąd osoby uczące się HTML-a, szczególnie jeśli ktoś nie śledzi na bieżąco aktualnych specyfikacji. Zacznijmy od zamknięcia znaczników <br> i <img>. W HTML5 oba te tagi mogą być zapisywane jako samodzielne, bez ukośnika (tzn. nie trzeba pisać <br /> czy <img />). To, że w starszych materiałach lub w XHTML-u stosowało się ukośnik przed zamknięciem, wynikało z wymagań tamtych standardów, ale obecnie walidatory nie traktują to już jako błąd. Często spotyka się przekonanie, że każda para tagów musi być zamknięta, co nie zawsze jest prawdą w przypadku tzw. self-closing tags w HTML. Jeśli chodzi o duplikację nazwy pliku graficznego – powielanie atrybutu src z tą samą wartością w dwóch obrazkach nie stanowi żadnego problemu z punktu widzenia składni czy walidacji HTML. To jest po prostu dwukrotne użycie tego samego obrazka i nie wpływa na poprawność kodu. Czasami osoby początkujące myślą, że takie powtórzenia mogą być błędem, bo wydaje się to nieoptymalne, ale walidator HTML patrzy wyłącznie na poprawność struktury i wymaganych atrybutów. Najpoważniejszym problemem, który rzeczywiście zostanie wychwycony przez walidator, jest brak atrybutu alt w znaczniku <img>. To właśnie jego brak narusza wymagania dostępności i standardów HTML. W praktyce, jeśli dążymy do zgodności z HTML5 i zasadami web accessibility, zawsze trzeba dodawać alt, bo to jest istotne dla użytkowników i systemów wspierających. Moim zdaniem, wiele osób nadmiernie skupia się na detalach typu ukośniki czy powtórzenia obrazków, a nie zawsze zwraca uwagę na aspekt dostępności, który jest obecnie jednym z ważniejszych wymogów jakościowych w branży webowej.

Pytanie 3

.format1 {
    …
}

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

A. style = "format1"

B. class = "format1"

C. div = "format1"

D. id = "format1"

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

Pytanie 4

Deklaracja

<!DOCTYPE html>

informuje przeglądarkę internetową o:

A. wersji języka HTML zastosowanej w dokumencie strony internetowej.

B. dostosowaniu strony internetowej do różnych rozmiarów urządzeń.

C. indeksowaniu strony internetowej na potrzeby pozycjonowania witryny.

D. tytule strony internetowej.

Deklaracja <!DOCTYPE html> to wbrew pozorom bardzo ważny element każdej poprawnej strony internetowej. Informuje przeglądarkę, jaka wersja języka HTML została użyta w dokumencie, a w praktyce – że ma renderować stronę w trybie zgodnym ze współczesnym standardem HTML5. Dzięki temu przeglądarka nie próbuje włączać tzw. „quirks mode”, czyli trybu zgodności ze starymi, historycznymi błędami Internet Explorera, tylko stosuje aktualne zasady specyfikacji. Moim zdaniem to jest jeden z tych drobiazgów, które po prostu trzeba pisać z automatu na górze każdego pliku .html. W starszych wersjach HTML deklaracja DOCTYPE była dużo dłuższa i określała konkretne DTD (Document Type Definition), np. dla HTML 4.01 Transitional czy XHTML 1.0 Strict. W HTML5 uproszczono to do jednej, krótkiej formy: <!DOCTYPE html>. To właśnie ta linijka mówi: „to jest dokument HTML5”. Na tej podstawie silnik przeglądarki dobiera reguły parsowania, walidacji struktury i sposób interpretacji wielu elementów, np. sekcji <header>, <footer>, <section>, a także nowych atrybutów formularzy. W praktyce, gdy tworzysz nową stronę, zawsze zaczynasz od: <!DOCTYPE html> <html lang="pl"> <head>… Jeśli pominiesz DOCTYPE albo wpiszesz go błędnie, możesz mieć kłopot z tym, że strona wygląda inaczej w różnych przeglądarkach, pojawią się problemy z modelu pudełkowym CSS (box model), z obsługą nowych znaczników lub z poprawnym działaniem responsywnego layoutu. Walidatory W3C też zakładają konkretną wersję HTML na podstawie DOCTYPE i pod nią sprawdzają poprawność kodu. Z mojego doświadczenia wynika, że poprawny DOCTYPE to absolutna podstawa profesjonalnego front-endu, nawet jeśli wygląda jak coś „magicznego” na samej górze pliku.

Pytanie 5

Zaprezentowane pole input daje możliwość

<input type="checkbox" name="text1" value="text2">

A. wpisania dowolnego tekstu

B. zaznaczenia opcji z listy zawierającej wartości text1 i text2

C. wybrania opcji

D. wprowadzenia hasła

Element HTML z atrybutem type="checkbox" jest używany do tworzenia pól wyboru które pozwalają użytkownikowi zaznaczać jedną lub więcej opcji. Checkboxy są częstym elementem formularzy internetowych gdyż umożliwiają elastyczne zbieranie danych od użytkowników. Przykładowo w formularzach rejestracyjnych można używać ich do akceptacji regulaminu zapisów na newslettery czy wyboru zainteresowań. Składnia takiego elementu jest prosta: tag <input> z atrybutami name i value. Atrybut name jest niezbędny do grupowania checkboxów a value do przekazywania wartości zaznaczonej opcji do serwera podczas wysyłania formularza. Dobre praktyki zalecają dodawanie etykiet opisujących znaczenie checkboxa co poprawia dostępność dla osób korzystających z czytników ekranowych. Stosowanie checkboxów powinno być przemyślane by nie przeciążać użytkownika zbyt dużą liczbą opcji co mogłoby negatywnie wpłynąć na UX. Właściwe użycie checkboxów zgodne ze standardami HTML i UX jest kluczowe dla intuicyjnego interfejsu użytkownika.

Pytanie 6

Atrybut colspan służy do poziomego łączenia komórek tabeli, natomiast rowspan pozwala na łączenie ich w pionie. Którą z poniższych tabel ukazuje fragment kodu napisany w języku HTML?
<table border="1" cellspaing="0" cellpadding="10" >
<tr> <td rowspan="2"> </td> <td> </td> </tr>
<tr> <td> </td> </tr>
</table>

A. rys. B

B. rys. D

C. rys. A

D. rys. C

W języku HTML atrybut rowspan w znaczniku <td> pozwala na scalanie komórek w pionie co oznacza że dana komórka zajmuje miejsce w kilku wierszach tabeli W podanym kodzie pierwsza komórka w pierwszym wierszu posiada atrybut rowspan z wartością 2 co sprawia że zajmuje ona miejsce w dwóch wierszach Pierwszy wiersz zawiera dwie komórki z czego pierwsza jest połączona pionowo z komórką w drugim wierszu Druga komórka w pierwszym wierszu oraz jedyna komórka w drugim wierszu nie posiadają atrybutu rowspan ani colspan dlatego nie są połączone z innymi komórkami Takie użycie rowspan jest zgodne z praktykami HTML które umożliwiają tworzenie bardziej złożonych układów tabeli dzięki czemu można lepiej zarządzać przestrzenią w interfejsie użytkownika Jako że kod tworzy tabelę z dwiema kolumnami i dwoma wierszami gdzie pierwsza komórka po lewej stronie zajmuje dwa wiersze przedstawia to układ jak na rysunku B Możliwości jakie daje rowspan są niezwykle przydatne w sytuacjach gdy chcemy aby dane w tabeli były czytelniejsze i bardziej zorganizowane szczególnie w raportach czy formularzach gdzie różne kategorie danych muszą być jasno oddzielone

Pytanie 7

Jakie dane zostaną wyświetlone po wykonaniu poniższych poleceń? bool gotowe=true; cout<<gotowe;

A. tak

B. 1

C. 0

D. nie

W wyniku wykonania przedstawionych instrukcji, zostanie wypisane "1". Wynika to z faktu, że zmienna typu bool w języku C++ jest reprezentowana jako liczba całkowita, gdzie wartość "true" jest interpretowana jako "1", a "false" jako "0". Kiedy wykonujemy instrukcję z użyciem cout, która jest standardowym strumieniem wyjściowym w C++, zmienna gotowe, która przechowuje wartość true, zostanie przekonwertowana na jej reprezentację liczbową, co skutkuje wypisaniem "1" na ekran. W praktyce, zrozumienie konwersji typów danych w C++ jest kluczowe dla programowania, zwłaszcza w kontekście obliczeń logicznych i kontroli przepływu programu. Standardy C++ określają zasady konwersji typów, co wpływa na optymalizację kodu oraz unikanie błędów w logice programowania, dlatego wiedza na ten temat jest niezbędna dla każdego programisty.

Pytanie 8

Przedstawiony styl generuje pojedyncze obramowanie, które posiada następujące właściwości:

border: solid 1px;
 border-color: red blue green yellow;

A. krawędź górna jest koloru czerwonego, krawędź prawa koloru niebieskiego, krawędź dolna koloru zielonego, krawędź lewa koloru żółtego

B. krawędź górna ma kolor czerwony, krawędź lewa w kolorze niebieskim, krawędź dolna w odcieniu zielonym, krawędź prawa w kolorze żółtym

C. krawędź prawa ma kolor czerwony, krawędź dolna w kolorze niebieskim, krawędź lewa w odcieniu zielonym, krawędź górna w kolorze żółtym

D. krawędź lewa ma kolor czerwony, krawędź dolna w kolorze niebieskim, krawędź prawa w odcieniu zielonym, krawędź górna w kolorze żółtym

Prawidłowa odpowiedź wynika z użycia właściwości CSS border-color z czterema wartościami przypisanymi kolejno do górnej prawej dolnej i lewej krawędzi elementu. W tym przypadku border-color: red blue green yellow; przypisuje kolor czerwony do górnej krawędzi kolor niebieski do prawej zielony do dolnej i żółty do lewej. Jest to powszechna praktyka w stylizacji stron internetowych gdzie cztery wartości podane dla border-color definiują odpowiednio kolory górnej prawej dolnej i lewej krawędzi. Taki styl umożliwia projektantom tworzenie wizualnie interesujących i wyróżniających się elementów poprzez łatwe manipulowanie kolorami i szerokościami obramowań. Zastosowanie tego w praktyce może być wykorzystane do zaznaczenia ważnych sekcji strony lub wyróżnienia określonych elementów. Tego rodzaju technika stylizacji jest zgodna z dobrymi praktykami i standardami CSS co pozwala na uzyskanie estetycznego i funkcjonalnego interfejsu użytkownika. Wiedza o przypisaniu kolorów do poszczególnych krawędzi jest kluczowa w projektowaniu elastycznych i responsywnych układów stron.

Pytanie 9

Który z akapitów został zapisany w wskazanym stylu, zakładając, że pozostałe właściwości akapitu mają wartości domyślne?

A. Efekt 1

B. Efekt 2

C. Efekt 3

D. Efekt 4

Odpowiedź Efekt 3 jest poprawna, ponieważ odzwierciedla wszystkie zadane style CSS. Styl zawiera padding 20px co oznacza, że wewnętrzna przestrzeń wokół tekstu w paragrafie powinna wynosić 20 pikseli. Daje to efekt przestrzeni pomiędzy tekstem a obramowaniem. Kolor tekstu został ustawiony na niebieski co powoduje, że sam tekst przyjmuje niebieską barwę. Parametr font-weight jest ustawiony na 900 co oznacza, że tekst powinien być bardzo pogrubiony. Obecnie jest to maksymalna wartość dla własności font-weight w standardzie CSS która powoduje, że tekst wygląda na bardzo wyrazisty i wyróżnia się na tle innych elementów. Dodatkowo border ustawiono na 1px solid co oznacza, że paragraf powinien mieć jednolitą linię o grubości jednego piksela otaczającą jego obszar. Wszystkie te style są poprawnie zastosowane w Efekcie 3 gdzie tekst jest niebieski bardzo pogrubiony z przestrzenią 20 pikseli do obramowania oraz otoczony cienką linią. Taki styl jest często wykorzystywany w projektach stron internetowych dla wyraźnego wyróżnienia ważnych sekcji co zgodne jest z dobrymi praktykami projektowania interfejsów użytkownika.

Pytanie 10

Język JavaScript wspiera

A. klasy abstrakcyjne

B. wysyłanie ciasteczek z identycznymi informacjami do wielu klientów witryny

C. funkcje wirtualne

D. obiekty DOM

JavaScript to język skryptowy, który ma wbudowaną obsługę obiektowego modelu dokumentu (DOM), co umożliwia dynamiczne manipulowanie strukturą HTML oraz CSS stron internetowych. Dzięki DOM programiści mogą dodawać, usuwać lub modyfikować elementy na stronie w czasie rzeczywistym, co czyni aplikacje bardziej interaktywnymi. Przykładem może być zmiana tekstu przycisku po jego kliknięciu, co można osiągnąć dzięki metodom takim jak `getElementById` oraz `innerHTML`. JavaScript jest nieodłącznym elementem nowoczesnego podejścia do tworzenia aplikacji webowych, a jego kompatybilność z DOM sprawia, że jest to kluczowa umiejętność dla programistów. Wiedza na temat manipulacji DOM jest fundamentem dla technologii takich jak React czy Angular, które opierają się na zasadach wydajnego zarządzania interfejsem użytkownika przez wirtualny DOM. Współczesne standardy, takie jak ECMAScript, rozwijają możliwości JavaScript, a znajomość DOM jest niezwykle cenna na rynku pracy.

Pytanie 11

W języku JavaScript rezultat wykonania polecenia ```zmienna1 -= 1;``` będzie tożsamy z wynikiem polecenia

A. zmienna1--;

B. zmienna1 === zmienna1 - 1;

C. zmienna1++;

D. zmienna1 = zmienna1 - 0;

Odpowiedź zmienna1--; jest poprawna, ponieważ jest to skrócona forma wyrażenia zmienna1 -= 1;. Oba wyrażenia mają ten sam efekt, który polega na zmniejszeniu wartości zmiennej zmienna1 o 1. W języku JavaScript operator '--' jest operatorem dekrementacji, który zmienia wartość zmiennej o jeden w dół. Użycie tego operatora jest zgodne z dobrymi praktykami kodowania, gdyż zwiększa czytelność kodu, czyniąc intencje programisty bardziej jasnymi. Użycie dekrementacji jest powszechne w sytuacjach, gdzie iterujemy przez kolekcje z użyciem pętli, co ogranicza potrzebę stosowania bardziej skomplikowanych instrukcji. Na przykład, w przypadku pętli for, zamiast pisać for(let i = n; i > 0; i -= 1), można zastosować for(let i = n; i > 0; i--), co jest bardziej zwięzłe i zrozumiałe. W kontekście standardów kodowania, preferowanym podejściem jest używanie operatorów, które maksymalizują przejrzystość i minimalizują możliwość popełnienia błędów.

Pytanie 12

Który z wartości atrybutu background-attachment w CSS powinien być użyty, aby tło strony pozostało nieruchome w stosunku do okna przeglądarki?

A. Fixed

B. Scroll

C. Local

D. Inherit

Atrybut background-attachment w języku CSS służy do określenia, w jaki sposób tło elementu jest powiązane z przewijaniem okna przeglądarki. Wybór wartości 'fixed' sprawia, że tło jest nieruchome w stosunku do widoku przeglądarki, co oznacza, że podczas przewijania zawartości strony tło pozostaje na swoim miejscu. Przykładowo, jeśli ustawimy tło za pomocą 'background-attachment: fixed;' w naszym arkuszu stylów, efekt wizualny pozwoli na stworzenie głębi oraz wrażenia trójwymiarowości, co jest często wykorzystywane w projektach graficznych i stronach internetowych. Ta technika jest zgodna z standardami CSS, które umożliwiają deweloperom tworzenie atrakcyjnych interfejsów użytkownika. Ponadto, zastosowanie tła nieruchomego może wpłynąć na doświadczenia użytkownika, zwłaszcza w przypadku stron zawierających dużą ilość przewijanej treści. Warto również wspomnieć, że background-attachment: fixed; może być używane z innymi atrybutami, takimi jak background-image, background-size czy background-position, aby uzyskać jeszcze lepsze efekty wizualne.

Pytanie 13

W celu stylizacji strony internetowej stworzono odpowiednie reguły. Reguły te będą stosowane tylko do wybranych znaczników (np. niektóre nagłówki, kilka akapitów). W tej sytuacji, aby zastosować styl do kilku wybranych znaczników, najlepiej będzie użyć

{ text-align: right; }

A. klasy.

B. pseudoklasy.

C. identyfikatora.

D. selektora akapitu.

Zastosowanie pseudoklas, identyfikatorów czy selektorów akapitów w sytuacji, gdy potrzebujemy przypisać ten sam styl do różnych elementów, nie jest efektywnym rozwiązaniem. Pseudoklasy, takie jak :hover, :focus czy :nth-child, służą do stylizacji elementów w szczególnych stanach lub według ich pozycji w dokumencie. Nie są one przeznaczone do grupowego przypisywania stylów do wielu elementów, przez co ich użycie w tym kontekście obniża elastyczność i powtarzalność kodu. Identyfikatory, chociaż mogą przypisać unikalny styl do konkretnego elementu, są ograniczone do jednego miejsca w dokumencie HTML. Oznacza to, że ich użycie jest nieefektywne w kontekście wielokrotnego stylizowania, co jest sprzeczne z zasadami semantycznego HTML i CSS. Selektor akapitu, z kolei, odnosi się do elementów <p> i pozwala na stylizację tych elementów w sposób globalny, jednak nie pozwala na precyzyjne dostosowanie stylów do wybranych akapitów w sposób, w jaki może to zrobić klasa. Właściwe zrozumienie koncepcji klas w CSS stanowi podstawę efektywnej stylizacji dokumentów HTML, a ich niewłaściwe zastąpienie innymi metodami może prowadzić do złożonych, mniej czytelnych i trudnych w zarządzaniu arkuszy stylów.

Pytanie 14

W języku HTML zapisano formularz. Który z efektów działania kodu będzie wyświetlony przez przeglądarkę zakładając, że w pierwsze pole użytkownik przeglądarki wpisał wartość "Przykładowy text"?

A. Efekt 1.

B. Efekt 4.

C. Efekt 3.

D. Efekt 2.

Dobra robota! Odpowiedź, którą wybrałeś, to Efekt 2. W formularzu HTML masz różne elementy, które służą do zbierania danych od użytkownika. Tutaj mamy pole tekstowe i dwa checkboxy. Jak wpiszesz 'Przykładowy text' w pole tekstowe i wyślesz formularz, to właśnie to się wyświetli w przeglądarce. Efekt 2 pokazuje, że pole tekstowe ma wpisany tekst i dwa niezaznaczone checkboxy. Dlatego to jest zgodne z tym, co zobaczysz w przeglądarce. A to oznacza, że Efekt 2 jest poprawną odpowiedzią. Właściwie to wszystko jest zgodne z tym, jak HTML działa, czyli jak powinny wyglądać i działać różne elementy formularza.

Pytanie 15

Który z poniższych znaczników jest częścią sekcji <head> dokumentu HTML?

A. <span>

B. <img>

C. <title>

D. <section>

Znacznik <title> jest fundamentalnym elementem sekcji <head> dokumentu HTML. Jego głównym zadaniem jest określenie tytułu strony, który jest wyświetlany na pasku tytułowym przeglądarki oraz w wynikach wyszukiwania. Dobrze skonstruowany tytuł powinien być zwięzły, ale jednocześnie informacyjny, aby skutecznie przyciągnąć uwagę użytkowników. Zgodnie z wytycznymi W3C, tytuł powinien mieć od 50 do 60 znaków, aby uniknąć obcinania w wynikach wyszukiwania. Przykładem dobrze sformułowanego tytułu może być: „Jak stworzyć responsywną stronę internetową - poradnik krok po kroku”. Ważne jest, aby tytuł był unikalny dla każdej podstrony w witrynie, co nie tylko poprawia SEO, ale również ułatwia użytkownikom nawigację. W kontekście standardów i dobrych praktyk, należy również unikać umieszczania w tytule zbędnych słów kluczowych, co może być uznane za spam przez wyszukiwarki. Dobrze zaprojektowany tytuł jest kluczem do efektywnego pozycjonowania i budowania marki w sieci.

Pytanie 16

W HTML5 semantycznym znacznikiem, który służy do określenia dwóch sekcji widocznych po prawej stronie na rysunku, zawierających wiadomości oraz aktualności, jest

A. <article>

B. <footer>

C. <main>

D. <nav>

Element <article> w HTML5 został stworzony właśnie do oznaczania niezależnych, samodzielnych treści, które mają sens nawet poza kontekstem strony – czyli takich, które można zamieścić np. w RSS, podlinkować czy udostępnić osobno. W praktyce oznacza to np. pojedyncze wpisy na blogu, wiadomości, ogłoszenia czy aktualności – dokładnie tak jak w tym zadaniu. Dzięki użyciu <article>, osoby korzystające z czytników ekranowych czy wyszukiwarek łatwiej rozpoznają strukturę strony, bo semantyka jest czytelna dla maszyn. Z mojego doświadczenia, stosowanie <article> dla wiadomości i aktualności jest też zgodne z dobrą praktyką tworzenia dostępnych stron – Google nawet sugeruje, by tak wyodrębniać własne, kompletne treści. To ma ogromne znaczenie przy pozycjonowaniu (SEO), bo roboty wyszukiwarek potrafią lepiej rozumieć, co jest główną treścią strony. Dodatkowo, używanie odpowiednich znaczników semantycznych poprawia współpracę z różnymi narzędziami, które analizują układ i zawartość strony, a także ułatwia późniejszą przebudowę lub rozwój projektu. Moim zdaniem, nadanie sekcjom z wiadomościami i aktualnościami znacznika <article> to podstawa nowoczesnego kodowania stron internetowych.

Pytanie 17

W języku CSS określono formatowanie znacznika h1 według poniższego wzoru. Zakładając, że do znacznika h1 nie dodano żadnego innego formatowania, wskaż sposób formatowania tego znacznika.

h1 {
    font-style: oblique;
    font-variant: small-caps;
    text-align: right;
}

A. C.

B. D.

C. B.

D. A.

Gratulacje, Twoja odpowiedź jest prawidłowa. W CSS określono, że znacznik h1 ma być wyświetlany z pochyłą czcionką, co jest osiągane za pomocą właściwości 'font-style: oblique'. Dodatkowo, małe wielkie litery są realizowane przez 'font-variant: small-caps', które zmieniają wszystkie małe litery na wielkie litery, ale z zachowaniem mniejszego rozmiaru. Wreszcie, do wyrównania tekstu do prawej strony służy 'text-align: right'. Wszystko to razem składa się na formatowanie znacznika h1, które zostało zdefiniowane w CSS. To jest dobra praktyka, aby zrozumieć i zapamiętać różne właściwości CSS, ponieważ pozwalają one na bardzo szczegółowe kontrolowanie wyglądu i układu elementów na stronie. Pamiętaj, że CSS jest niezwykle potężnym narzędziem w rękach doświadczonego programisty front-end i pozwala na tworzenie estetycznych, responsywnych i przyjaznych dla użytkownika interfejsów.

Pytanie 18

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

A. sizes

B. src

C. border

D. alt

Atrybut 'alt' w znaczniku <img> jest kluczowy dla dostępności treści internetowych. Jego główną funkcją jest dostarczenie alternatywnego opisu obrazu, który jest odczytywany przez programy wspierające osoby niewidome i niedowidzące, takie jak czytniki ekranu. Dzięki atrybutowi 'alt', użytkownicy, którzy nie mogą zobaczyć obrazu, są w stanie zrozumieć, co on przedstawia. Na przykład, jeśli obrazek przedstawia psa bawiącego się w parku, odpowiednia treść atrybutu 'alt' mogłaby brzmieć: 'Pies bawiący się w parku'. To nie tylko zwiększa dostępność strony, ale również poprawia doświadczenia użytkowników. Zgodnie z wytycznymi WCAG (Web Content Accessibility Guidelines), dostarczenie tekstu alternatywnego dla wszystkich obrazów jest niezbędne do zapewnienia pełnej dostępności treści. Przykład zastosowania: W przypadku strony e-commerce, gdzie obrazy produktów są kluczowe, odpowiednio zdefiniowany atrybut 'alt' pozwala osobom z ograniczeniami wzrokowymi na pełne zrozumienie oferty, co może wpłynąć na ich decyzje zakupowe.

Pytanie 19

W jakim przypadku w JavaScript warunek jest spełniony, jeśli zmienna x przyjmuje wartość

if ((!isNaN(x)) && (x > 0))

A. pusty ciąg znaków

B. wszelką całkowitą wartość liczbową

C. nie-liczbową wartość

D. wszelką dodatnią wartość liczbową

Warunek zapisany w JavaScript if (!isNaN(x) && x>0) jest prawdziwy, gdy zmienna x przechowuje dowolną dodatnią wartość liczbową Takie podejście jest zgodne z dobrymi praktykami programistycznymi ponieważ umożliwia skuteczne sprawdzenie czy wartość jest zarówno liczbowa jak i dodatnia Funkcja isNaN(x) zwraca true gdy x nie jest liczbą co powoduje że !isNaN(x) zwraca true tylko wtedy gdy x jest liczbą Następnie dodatkowy warunek x>0 sprawdza czy liczba jest większa od zera co oznacza że jest dodatnia Takie warunki są często używane w aplikacjach webowych do walidacji danych użytkownika Na przykład podczas wprowadzania kwoty transakcji system może używać podobnego warunku aby upewnić się że użytkownik nie wprowadza ujemnych wartości co mogłoby prowadzić do błędów logicznych w aplikacji Używanie takich warunków wspiera bezpieczeństwo i poprawność kodu co jest kluczowe w profesjonalnym środowisku programistycznym Dodatkowo takie podejście jest zgodne z zasadą przewidywalności działania kodu co jest istotne dla zapewnienia jego łatwej utrzymywalności i czytelności dla innych programistów

Pytanie 20

Jaką wartość zwróci poniższa instrukcja w JavaScript?

document.write(5==='5');

A. true

B. false

C. 1

D. 0

Instrukcja JavaScript użyta w tym przykładzie wykorzystuje operator potrójnego równości === który jest używany do porównywania wartości i typu danych. W przeciwieństwie do podwójnego równości == który porównuje tylko wartości potrójne równości wymaga aby zarówno typ jak i wartość były identyczne. W przedstawionym kodzie porównywana jest liczba 5 z ciągiem znaków '5'. Chociaż mają tę samą widoczną wartość ich typy danych są różne. Liczba jest typem numericznym podczas gdy '5' jest ciągiem znaków. Ponieważ typy danych nie są identyczne operator === zwróci wartość false. Operator potrójnego równości jest preferowany w dobrych praktykach branżowych JavaScript ponieważ eliminuje problemy wynikające z niejawnej konwersji typów co może prowadzić do nieoczekiwanych wyników. Użycie potrójnego równości poprawia czytelność kodu i jego niezawodność ponieważ zmusza programistę do świadomego zwracania uwagi na typy danych co jest szczególnie ważne w złożonych aplikacjach gdzie takie błędy mogą skutkować trudnymi do wykrycia problemami. Praktyka ta jest zalecana w celu utrzymania wysokiej jakości i przewidywalności działania aplikacji webowych.

Pytanie 21

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

A. opisu, który pojawi się pod obrazem

B. tekstu, który będzie prezentowany, gdy obraz nie może być załadowany

C. atrybutów obrazu, takich jak rozmiar, ramka, wyrównanie

D. ścieżki oraz nazwy pliku źródłowego

Atrybut alt w znaczniku img w HTML to naprawdę ważny element, jeśli chodzi o dostępność stron www. Jego głównym zadaniem jest pomóc osobom z problemami ze wzrokiem zrozumieć, co widnieje na obrazku. Jeśli nie da się wyświetlić grafiki – na przykład przez zły internet czy błąd w ścieżce do pliku – tekst w atrybucie alt pokazuje się jako alternatywa. Na przykład <img src='example.jpg' alt='Zachód słońca nad morzem'>, co by ułatwiło osobom korzystającym z czytników ekranu zrozumienie treści. Warto też pamiętać, że ten atrybut ma znaczenie dla SEO, bo wyszukiwarki mogą go wykorzystać do lepszego zrozumienia zawartości strony, co wpływa na jej indeksowanie. Ogólnie rzecz biorąc, używanie odpowiednich atrybutów alt to dobra praktyka w budowaniu stron www.

Pytanie 22

W języku JavaScript zdefiniowano następującą funkcję:

function fun1(f) {
    if (f < 0) f = f * (-1);
    return f;
}

Jej celem jest:

A. Wypisać wartość bezwzględną argumentu f

B. Wypisać wartość odwrotną do argumentu f

C. Zwrócić wartość odwrotną do argumentu f

D. Zwrócić wartość bezwzględną argumentu f

Funkcja w języku JavaScript przedstawiona w pytaniu realizuje zadanie zwracania wartości bezwzględnej z argumentu f. Wartość bezwzględna liczby jest jej odległością od zera na osi liczbowej i jest zawsze liczbą nieujemną. Mechanika działania funkcji polega na sprawdzeniu za pomocą instrukcji warunkowej if czy wartość przekazanego argumentu f jest mniejsza od zera. Jeśli tak, wartość ta jest mnożona przez -1 co przekształca ją w liczbę dodatnią. W przeciwnym razie liczba pozostaje bez zmian. Ostatecznie funkcja zwraca wynik operacji co jest typowym podejściem w programowaniu funkcyjnym. Warto zwrócić uwagę że takie podejście jest zgodne z dobrymi praktykami programistycznymi ponieważ funkcja ma jednoznacznie określony cel i nie powoduje efektów ubocznych takich jak modyfikacja zmiennych globalnych. W realnych projektach często korzysta się z funkcji Math.abs która jest wbudowana w JavaScript i zwraca wartość bezwzględną liczby co jest bardziej wydajnym podejściem i zgodnym ze standardami języka

Pytanie 23

W języku JavaScript trzeba sformułować warunek, który będzie spełniony, gdy zmienna a będzie dowolną liczbą naturalną dodatnią (więcej niż 0) lub gdy zmienna b będzie dowolną liczbą z przedziału domkniętego od 10 do 100. Wyrażenie logiczne w tym warunku powinno mieć postać

A. (a > 0) && ((b >= 10) && (b <= 100))

B. (a > 0) || ((b >= 10) || (b <= 100))

C. (a > 0) || ((b >= 10) && (b <= 100))

D. (a > 0) && ((b >= 10) || (b <= 100))

Poprawna odpowiedź (a > 0) || ((b >= 10) && (b <= 100)) uwzględnia wymaganie, aby warunek był spełniony, gdy zmienna a jest liczbą naturalną dodatnią bądź zmienna b znajduje się w przedziale od 10 do 100, włącznie. W tym przypadku użycie operatora logicznego '||' (lub) jest kluczowe, ponieważ wystarczy, że jeden z warunków będzie prawdziwy, aby cały warunek był spełniony. Przykładem może być skrypt walidujący dane wejściowe użytkownika: jeśli zmienna a przechowuje wartość 5 (czyli liczbę naturalną dodatnią), to niezależnie od wartości zmiennej b, warunek będzie prawdziwy. Analogicznie, jeśli a wynosi 0, a b = 15, warunek również będzie spełniony, ponieważ b mieści się w wymaganym przedziale. Taka konstrukcja warunku jest zgodna z dobrą praktyką programistyczną, gdyż pozwala na jasne i zrozumiałe określenie, kiedy pewne zasady powinny być stosowane. Zastosowanie operatorów logicznych w taki sposób wspiera tworzenie czytelnych i elastycznych warunków, co jest istotne w kontekście utrzymania kodu i jego przyszłych modyfikacji.

Pytanie 24

Atrybut value w elemencie formularza XHTML

 <input type="text" name="name" value="value">

A. ustawia pole jako tylko do odczytu

B. definiuje maksymalną długość pola

C. określa nazwę pola

D. określa domyślną wartość

Atrybut 'value' w polu formularza XHTML ma kluczowe znaczenie, ponieważ określa wartość, która będzie domyślnie wyświetlana w polu tekstowym. Kiedy użytkownik otworzy formularz, będzie widział w polu tekstowym wpisaną wartość, co ułatwia interakcję, zwłaszcza w przypadkach, gdy potrzebne są przykłady lub domyślne odpowiedzi. Na przykład, w formularzu rejestracyjnym można ustawić atrybut 'value' na 'Jan Kowalski', co sugeruje użytkownikowi, jak powinien wypełnić swoje imię i nazwisko. Jest to zgodne z dobrymi praktykami projektowania formularzy, które dążą do poprawy użyteczności i zmniejszenia liczby błędów użytkowników. Warto również zauważyć, że w przypadku formularzy, jeśli użytkownik zdecyduje się nie zmieniać tej wartości, atrybut 'value' sprawia, że odpowiedź zostanie przesłana w formularzu po jego wysłaniu. To podkreśla znaczenie predefiniowania wartości w kontekście UX, ponieważ dobrze zaprojektowane formularze mogą znacznie poprawić doświadczenia użytkowników.

Pytanie 25

W kaskadowych arkuszach stylów do oznaczenia selektora klasy wykorzystuje się symbol

A. . (kropka)

B. : (dwukropek)

C. *

D. #

Odpowiedź . (kropka) jest prawidłowa, ponieważ w kaskadowych arkuszach stylów (CSS) selektor klasy definiuje się poprzez użycie symbolu kropki przed nazwą klasy. Przykład: jeśli mamy klasę o nazwie 'przyklad', to w CSS zapisujemy selektor jako '.przyklad'. Taki selektor pozwala na stosowanie określonych stylów do wszystkich elementów HTML, które zawierają tę klasę. Dobrą praktyką jest używanie klas do grupowania elementów, co ułatwia zarządzanie stylami oraz zwiększa czytelność kodu. Na przykład, możemy zdefiniować wspólny wygląd dla przycisków: .przycisk { background-color: blue; color: white; }. Ponadto, korzystanie z klas zamiast identyfikatorów (które definiuje się przez symbol #) pozwala na wielokrotne stosowanie jednego stylu w różnych miejscach dokumentu. Klasy są bardziej elastyczne i umożliwiają lepszą organizację kodu, co jest zgodne z zasadami DRY (Don't Repeat Yourself) w programowaniu.

Pytanie 26

Efekt przedstawiony w filmie powinien być zdefiniowany w selektorze

A. tr { background-color: Pink; }

B. tr:active { background-color: Pink; }

C. tr:hover { background-color: Pink; }

D. td, th { background-color: Pink; }

Poprawny selektor to tr:hover { background-color: Pink; }, bo dokładnie opisuje sytuację pokazaną na filmie: efekt pojawia się dopiero po najechaniu kursorem na cały wiersz tabeli. Pseudo-klasa :hover w CSS służy właśnie do definiowania stylów w momencie, gdy użytkownik „najeżdża” myszką na dany element. Jeśli więc chcemy, żeby podświetlał się cały rząd tabeli, logiczne i zgodne z dobrymi praktykami jest przypięcie efektu do znacznika tr, a nie do pojedynczych komórek. W praktyce taki zapis stosuje się bardzo często w interfejsach webowych: w panelach administracyjnych, listach zamówień, tabelach z uczniami, produktami, logami systemowymi itd. Dzięki temu użytkownik łatwiej śledzi, który wiersz właśnie ogląda. To niby detal, ale z punktu widzenia UX robi sporą różnicę. Z mojego doświadczenia to jeden z tych prostych trików CSS, które od razu poprawiają „odczuwalną” jakość strony. Ważne jest też to, że :hover jest częścią standardu CSS (opisane m.in. w specyfikacji CSS Selectors Level 3/4) i działa w praktycznie wszystkich współczesnych przeglądarkach. Nie trzeba do tego żadnego JavaScriptu, żadnych skomplikowanych skryptów – czysty CSS. Dobrą praktyką jest również używanie bardziej stonowanych kolorów niż Pink w prawdziwych projektach, np. #f5f5f5 albo lekki odcień niebieskiego, tak żeby kontrast był czytelny i nie męczył wzroku. Warto też pamiętać, że podobny mechanizm możesz zastosować na innych elementach: np. a:hover dla linków, button:hover dla przycisków czy nawet div:hover dla całych kafelków w layoutach. Kluczowe jest to, żeby pseudo-klasa :hover była przypięta dokładnie do tego elementu, który ma reagować na interakcję użytkownika.

Pytanie 27

Jakie polecenie jest poprawne w kontekście walidacji HTML5?

A. <img src = "mojPiesek.jpg" alt = "pies">

B. <img src = mojPiesek.jpg" alt = "pies>

C. <img src = mojPiesek.jpg alt = pies>

D. <img src = "mojPiesek.jpg" >

Odpowiedź <img src = "mojPiesek.jpg" alt = "pies"> jest poprawna zgodnie z zasadami walidacji HTML5. W tej konstrukcji atrybut 'src' jest prawidłowo sformatowany, z odpowiednimi cudzysłowami otaczającymi wartość, co jest wymagane przez standardy HTML. Dodatkowo atrybut 'alt' również jest poprawnie użyty, co jest kluczowe z perspektywy dostępności. Atrybut 'alt' zapewnia tekst alternatywny, który jest istotny dla osób korzystających z czytników ekranu oraz w sytuacjach, gdy obrazek nie może zostać załadowany. Odpowiednia walidacja kodu HTML jest nie tylko wymagana dla poprawnego działania strony, ale także wpływa na SEO i ogólną użyteczność witryny. Przykład ten pokazuje, jak ważne jest przestrzeganie standardów, aby zapewnić lepsze doświadczenia użytkowników oraz uniwersalność strony internetowej. W praktyce, stosowanie właściwych atrybutów i ich wartości powinno być zawsze brane pod uwagę podczas tworzenia treści webowych.

Pytanie 28

W języku JavaScript zapis w ramce oznacza, że x=przedmiot.nazwa);

A. zmienna x będzie przechowywać wynik działania funkcji przedmiot

B. zmienna x będzie zawierać wynik działania metody nazwa

C. nazwa jest atrybutem klasy przedmiot

D. nazwa jest cechą obiektu przedmiot

Niepoprawne odpowiedzi wskazują na brak zrozumienia koncepcji obiektów w JavaScript oraz różnic pomiędzy właściwościami a metodami. Stwierdzenie, że 'nazwa jest polem klasy przedmiot', jest mylące, ponieważ w JavaScript nie ma klas w tradycyjnym sensie znanym z innych języków, jak Java czy C#. W JavaScript mamy do czynienia z prototypami, a atrybuty obiektów są nazywane właściwościami, a nie polami klasy. Kolejne stwierdzenie, że 'nazwa jest właściwością obiektu przedmiot', jest częściowo prawdziwe, ale w kontekście zadania nie jest wystarczająco precyzyjne, ponieważ może sugerować, że 'nazwa' jest statyczną wartością, podczas gdy w rzeczywistości może to być metoda, której wynikiem jest dynamiczna wartość. Ostatnia błędna odpowiedź, sugerująca, że 'zmienna x będzie przechowywać wynik działania funkcji przedmiot', również jest niepoprawna, ponieważ 'przedmiot' nie jest funkcją, lecz obiektem. W JavaScript, aby wywołać funkcję, potrzebujemy jej nazwy i odpowiednich nawiasów, co w tym przypadku nie ma miejsca. Zrozumienie tych różnic jest kluczowe dla efektywnego programowania w tym języku oraz korzystania z jego pełnych możliwości.

Pytanie 29

Która operacja nie wpłynie na wielkość zajmowanej pamięci przez plik graficzny?

A. Kompresja

B. Interpolacja

C. Modyfikacja rozdzielczości obrazu

D. Zmiana rozmiaru obrazu z użyciem atrybutów HTML

Skalowanie obrazu za pomocą atrybutów HTML jest prawidłową odpowiedzią, ponieważ ta operacja nie modyfikuje samego pliku graficznego, a jedynie zmienia sposób, w jaki obraz jest wyświetlany na stronie internetowej. Przykładowo, użycie atrybutów 'width' i 'height' w tagu <img> pozwala na dostosowanie rozmiarów obrazu w kontekście przeglądarki, nie ingerując w jego zawartość ani nie zmieniając rozdzielczości. W praktyce oznacza to, że oryginalny plik graficzny pozostaje niezmieniony, co jest zgodne z dobrymi praktykami w zakresie optymalizacji wydajności stron. Zmiana rozmiaru na poziomie HTML jest często stosowana, aby zapewnić elastyczność w projektowaniu responsywnych stron internetowych, gdzie obrazy muszą dostosowywać się do różnych rozmiarów ekranów bez potrzeby ich fizycznej edycji. Warto jednak pamiętać, że nadmierne skalowanie może prowadzić do pogorszenia jakości widocznej na ekranie, ale nie wpływa na wagę pliku. Istotnym aspektem jest również, że takie podejście wspiera standardy dostępności, umożliwiając lepsze dostosowanie treści wizualnych dla osób z różnymi potrzebami.

Pytanie 30

Podczas testowania skryptu JavaScript można w konsoli wyświetlać obecnie przechowywane wartości zmiennych przy użyciu funkcji

A. console.count()

B. console.error()

C. console.warn()

D. console.log()

Funkcja console.log() jest najczęściej używaną metodą do wyświetlania informacji w konsoli JavaScript. Umożliwia ona programistom monitorowanie wartości zmiennych w czasie rzeczywistym, co jest niezwykle pomocne podczas debugowania aplikacji. Używając console.log(), można łatwo wprowadzić komunikaty do konsoli, co pozwala na śledzenie zachowań aplikacji oraz identyfikację potencjalnych problemów. Przykładowo, jeśli mamy zmienną 'x' i chcemy zobaczyć jej wartość, wystarczy wpisać console.log(x). Dobre praktyki inżynierii oprogramowania sugerują, aby używać tego narzędzia do logowania istotnych informacji, w tym danych wejściowych oraz wyników operacji, co ułatwia późniejszą analizę i utrzymanie kodu. Ponadto, console.log() jest częścią standardu Web API, co potwierdza jego znaczenie i powszechność w branży. Warto też pamiętać, że nadmierne logowanie może prowadzić do zagracenia konsoli, dlatego kluczowe jest stosowanie tej funkcji w umiarkowany sposób, szczególnie w środowisku produkcyjnym.

Pytanie 31

Fragment kodu powyżej został napisany w języku JavaScript. Co należy umieścić w miejsce kropek, aby program przypisywał wartość 1 co trzeciemu elementowi w tablicy?

for (i = 0; i < T.length; ...)
 {
     T[i] = 1;
 }

A. i += 3

B. i =+ 3

C. i = 3

D. i ++ 3

Prawidłowa odpowiedź to i += 3 ponieważ w języku JavaScript operator += służy do zwiększania wartości zmiennej o zadany krok. W kontekście pętli for oznacza to że po każdej iteracji zmienna i zostanie zwiększona o 3 co pozwala na przypisanie wartości 1 co trzeciemu elementowi w tablicy. Jest to standardowa praktyka przy iteracji co kilka elementów w tablicy. Użycie += jest preferowane ze względu na jego zwięzłość i czytelność co jest zgodne z dobrymi praktykami programistycznymi. W przypadku tablicy T użycie poprawnego inkrementu i += 3 umożliwi przypisanie wartości tylko do tych elementów które są indeksowane przez wielokrotności liczby 3. Dzięki temu kod jest bardziej czytelny i zgodny z zasadami DRY (Don't Repeat Yourself) pozwalając na efektywne operacje na strukturach danych. Przykładowo jeśli mamy tablicę o długości 9 to po wykonaniu pętli elementy o indeksach 0 3 i 6 zostaną ustawione na wartość 1 co pozwala na efektywne zarządzanie pamięcią i czasem obliczeniowym. Tego typu konstrukcje są podstawą wielu algorytmów iteracyjnych.

Pytanie 32

Który z poniższych zapisów w HTML określa kodowanie znaków stosowane w dokumencie?

A. <charset="UTF-8">

B. <encoding="UTF-8">

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

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

Zapis <meta charset="UTF-8"> jest prawidłową deklaracją kodowania znaków w dokumencie HTML. Element <meta> jest używany w sekcji <head> dokumentu i pozwala na zdefiniowanie różnych metadanych, w tym kodowania znaków. Użycie "UTF-8" jako wartości dla atrybutu charset oznacza, że dokument będzie używał kodowania Unicode, które jest standardem preferowanym w sieci. Dzięki temu, dokumenty mogą poprawnie wyświetlać znaki z różnych języków, co jest kluczowe w zglobalizowanym świecie internetu. Przykładem zastosowania tego zapisu może być strona internetowa, która zawiera teksty w wielu językach, co wymaga wsparcia dla różnorodnych znaków diakrytycznych i symboli. Warto również podkreślić, że zgodnie z zasadami dobrych praktyk, zawsze powinno się definiować kodowanie znaków w dokumencie HTML, aby uniknąć problemów z wyświetlaniem treści, co może negatywnie wpłynąć na doświadczenia użytkowników oraz SEO strony.

Pytanie 33

Jakiego znacznika w języku HTML nie można użyć do wstawienia grafiki dynamicznej na stronę?

A. <object>

B. style="margin-bottom: 0cm;"><embed>

C. <strike>

D. style="margin-bottom: 0cm;"><img>

Wybór odpowiedzi 1, 3 lub 4 może wydawać się zrozumiały, jednak każdy z tych znaczników ma swoje specyficzne zastosowanie i może być użyty do integrowania grafik dynamicznych. Element <img> jest jednym z najbardziej powszechnie używanych znaczników do wyświetlania obrazów, zarówno statycznych, jak i dynamicznych, takich jak animacje w formacie GIF. Odpowiedź 3, <embed>, umożliwia osadzenie multimediów, takich jak wideo czy animacje Flash, a odpowiedź 4, <object>, jest elastycznym elementem, który może wyświetlać różne typy mediów, w tym grafiki i aplikacje interaktywne. Wybierając te odpowiedzi, można dojść do błędnego wniosku, że są one nieodpowiednie, gdyż wszystkie one wspierają umieszczanie mediów na stronie. Typowym błędem myślowym jest mylenie stylizacji tekstu z funkcjonalnością mediów, co prowadzi do niewłaściwego korzystania z semantyki HTML. Zrozumienie różnic między tymi znacznikami i ich zastosowaniem jest kluczowe dla efektywnego tworzenia stron internetowych oraz ich dostępności dla użytkowników.

Pytanie 34

Który zapis znacznika <meta> jest poprawny w kontekście użytych atrybutów?

A. <meta background = blue>

B. <meta title = 'Strona dla hobbystów'>

C. <meta name = '!DOCTYPE'>

D. <meta name = 'description' content = 'Masz jakieś hobby? To jest strona dla Ciebie!'>

Poprawny zapis znacznika <meta> to <meta name = "description" content = "Masz jakieś hobby? To jest strona dla Ciebie!">. Ten znacznik odgrywa kluczową rolę w SEO, ponieważ pozwala na dostarczenie wyszukiwarkom informacji o treści strony. Atrybut 'name' definiuje typ informacji, którą dostarczamy, w tym przypadku 'description', co pozwala wyszukiwarkom zrozumieć, co znajduje się na stronie. Atrybut 'content' zawiera właściwą treść, która powinna być zwięzła i trafna, aby przyciągnąć użytkowników. Zgodnie z najlepszymi praktykami SEO, opis powinien mieć od 150 do 160 znaków, aby był w pełni widoczny w wynikach wyszukiwania. Poprawne użycie tego znacznika zwiększa szanse na wyższe pozycje w wynikach wyszukiwania oraz poprawia współczynnik klikalności (CTR) poprzez przyciągający opis, który może zachęcić użytkowników do odwiedzenia strony. Zgodność z tymi standardami jest niezbędna dla skutecznej optymalizacji witryn internetowych oraz poprawy ich widoczności w Internecie.

Pytanie 35

Dostosowanie wyglądu witryny do indywidualnych preferencji użytkownika oraz jego identyfikacja w systemie są możliwe dzięki mechanizmowi

A. formularzy

B. obiektów DOM

C. łączenia z bazą

D. cookie

Wybór formularzy, DOM i łączenia z bazą danych jako sposobów na personalizację strony i identyfikację użytkownika to trochę nieporozumienie. Formularze pozwalają na wysyłanie danych, jak logowanie czy rejestracja, ale same w sobie nie przechowują informacji o użytkownikach. Ich głównym celem jest interakcja z użytkownikiem. Obiekty DOM to właściwie struktura dokumentu HTML i umożliwiają modyfikację elementów na stronie, ale nie służą do identyfikacji użytkownika. Łączenie z bazą danych jest ważne dla przechowywania danych, ale to nie to samo co lokalne przechowywanie, które jest kluczowe dla personalizacji. Jeśli chcesz dobrze projektować aplikacje webowe, warto zrozumieć te różnice, bo błędy mogą się zdarzyć, zwłaszcza jeśli chodzi o cookies.

Pytanie 36

Jakiego typu tablicy dotyczy instrukcja dodawania elementu w JavaScript?

Tablica['technik'] = 'informatyk';

A. asocjacyjnej

B. wielowymiarowej

C. stałej

D. liczbowej

Tablica asocjacyjna w JavaScript to struktura danych, która przechowuje wartości w formie par klucz-wartość, co pozwala na efektywne i dynamiczne przypisywanie i pobieranie danych. Klucze w tablicy asocjacyjnej mogą być dowolnymi łańcuchami znaków, co daje dużą elastyczność w organizacji danych. Przykładem jest przypisanie Tablica['technik'] = 'informatyk'; gdzie 'technik' jest kluczem, a 'informatyk' wartością. To podejście jest zgodne ze standardami JavaScript, w którym tablice asocjacyjne są implementowane jako obiekty. W praktyce używa się ich często do przechowywania konfiguracji, danych użytkowników lub innych danych, które wymagają szybkiego dostępu i modyfikacji. Tablice asocjacyjne umożliwiają dynamiczne dodawanie nowych par klucz-wartość, co jest cenioną cechą w aplikacjach wymagających skalowalności. Warto zauważyć, że podczas gdy tradycyjne tablice używają indeksów liczbowych, tablice asocjacyjne oferują większą elastyczność poprzez użycie kluczy tekstowych, co jest zgodne z dobrymi praktykami kodowania i ułatwia czytelność oraz utrzymanie kodu.

Pytanie 37

Elementem, który odnosi się do imienia Agata w pokazanej tablicy JavaScript, jest

A. Imiona['Agata']

B. Imiona[Agata]

C. Imiona[3]

D. Imiona[4]

JavaScript ma fajne tablice, które pozwalają trzymać różne wartości w jednej zmiennej. Pamiętaj, że w tablicach numerację zaczynamy od zera, więc pierwszy element to 0. W naszym przypadku mamy tablicę Imiona z pięcioma imionami: Anna, Joanna, Monika, Agata. Żeby dostać się do czwartego imienia, musisz użyć indeksu 3, czyli Imiona[3]. To standardowa zasada w JavaScript i naprawdę w wielu innych językach programowania, więc warto się tego nauczyć. W praktyce umiejętność indeksowania tablic jest bardzo ważna, zwłaszcza gdy chcesz przefiltrować, posortować albo po prostu przejść przez dane. Dlatego dobrze jest zapamiętać, jak działa indeksowanie zerowe, bo to kluczowa rzecz dla każdego, kto pracuje z danymi w tym języku.

Pytanie 38

Aby uzyskać płynne przejścia obrazów w filmie, liczba klatek (niewchodzących w interakcję ze sobą) na sekundę powinna znajdować się w co najmniej takim zakresie

A. 24 - 30 fps

B. 20 - 23 fps

C. 31 - 36 fps

D. 16 - 19 fps

Odpowiedź 24 - 30 fps jest prawidłowa, ponieważ to właśnie w tym zakresie klatek na sekundę (fps) uzyskuje się płynność ruchu, która jest akceptowana w większości produkcji filmowych i telewizyjnych. Standard 24 fps jest powszechnie stosowany w kinematografii, ponieważ pozwala na naturalne odwzorowanie ruchu, a także jest zgodny z technologią filmową. W praktyce, filmy kręcone w tym standardzie mają charakterystyczną estetykę, która jest ceniona przez widzów. Dodatkowo, przy 30 fps można uzyskać płynniejsze efekty w produkcjach telewizyjnych, szczególnie w transmisjach na żywo i sportowych, gdzie dynamika ruchu jest kluczowa. Utrzymanie liczby klatek w tym zakresie zmniejsza ryzyko efektów stroboskopowych, które mogą wystąpić przy niższych liczbach klatek. Warto również dodać, że nowoczesne technologie filmowe i animacyjne często korzystają z wyższych wartości fps, jednak standardowe ramy dla klasycznych produkcji pozostają w tym zakresie, co czyni je uniwersalnym punktem odniesienia dla twórców.

Pytanie 39

W języku JavaScript zdefiniowano funkcję o nazwie liczba_max, która porównuje trzy liczby naturalne przekazane jako argumenty i zwraca największą z nich. Prawidłowa forma wywołania tej funkcji, razem z przypisaniem jej wyniku, powinna wyglądać następująco

A. var wynik = liczba_max(a, b, c);

B. liczba_max(a, b, c) = wynik;

C. liczba_max(a, b, c, wynik);

D. liczba_max(a, b, c);

Wywołanie funkcji 'liczba_max' w postaci 'var wynik = liczba_max(a, b, c);' jest prawidłowe, ponieważ stosuje syntaksę języka JavaScript do przypisania wartości zwróconej przez funkcję do zmiennej. Zdefiniowana funkcja 'liczba_max' przyjmuje trzy argumenty, które są porównywane, a maksymalna z nich jest zwracana jako wynik. W tym przypadku 'var wynik' tworzy nową zmienną, która przechowuje tę wartość, co jest zgodne z najlepszymi praktykami programowania, gdzie wyniki operacji są przypisywane do zmiennych dla dalszego wykorzystania. Użycie 'var' (lub 'let', 'const' w nowszych wersjach JavaScript) jest kluczowe, aby jasno określić zakres zmiennej. Przykładowo, jeśli a = 5, b = 10, c = 3, to po wywołaniu 'var wynik = liczba_max(a, b, c);', zmienna 'wynik' będzie miała wartość 10. Tego typu konstrukcje są podstawą programowania w JavaScript i są niezwykle przydatne w tworzeniu dynamicznych aplikacji webowych, gdzie operacje na danych są na porządku dziennym.

Pytanie 40

var obj1 = { czescUlamkowa: 10, czescCalkowita: 20, oblicz: function) {...} } Kod przedstawiony powyżej jest zapisany w języku JavaScript. W podanej definicji obiektu, metodą jest element o nazwie

A. oblicz

B. czescCalkowita

C. czescUlamkowa

D. obj1

Wiesz co? W definicji obiektu w JavaScript, metoda to po prostu funkcja, która jest przypisana do jakiegoś klucza w obiekcie. Mamy tutaj obiekt obj1, który ma dwie właściwości: czescUlamkowa i czescCalkowita, a do tego jedną metodę, czyli oblicz. Metody to taki ważny temat w programowaniu obiektowym, bo pozwalają manipulować danymi, które są w obiekcie. W naszym przypadku, ta metoda oblicz może robić różne obliczenia, na przykład sumować te nasze właściwości. Można ją zdefiniować tak: obj1.oblicz = function() { return this.czescUlamkowa + this.czescCalkowita; }. Kiedy potem wywołasz obj1.oblicz(), dostaniesz wynik 30. To jest właśnie to, jak metody działają na danych obiektów i czemu są niezastąpione, zwłaszcza w JavaScript czy ECMAScript.

Rozpocznij nowy egzamin

Powrót do strony głównej