Wyniki egzaminu

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

Egzamin zdany!

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

Wymagane minimum: 20 punktów (50%)

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

Jaki jest cel wykorzystania znacznika <i> w języku HTML?

A. określenia nagłówka w treści
B. zmiany kroju pisma na pochylony
C. wstawienia obrazka
D. określenia formularza
Znacznik <i> w języku HTML jest używany do oznaczania tekstu, który powinien być wyświetlany w kroju pisma pochyłym. Takie użycie jest zgodne ze standardami HTML, gdzie <i> zwykle wskazuje na tekst, który ma być wyróżniony w kontekście stylistycznym, na przykład w przypadku tytułów książek, nazw gatunków czy terminów technicznych. Z perspektywy semantycznej, HTML5 wprowadza większą elastyczność w definiowaniu znaczenia tekstu, co czyni <i> bardziej konwencjonalnym narzędziem niż w poprzednich wersjach. Warto zaznaczyć, że dla lepszej dostępności i SEO, często zaleca się użycie znacznika <em>, który nie tylko zmienia styl, ale także podkreśla znaczenie tekstu. Przykład zastosowania <i>: <i>„Wojna i pokój”</i> to książka autorstwa Lwa Tołstoja. Z perspektywy użytkowników i wyszukiwarek, ważne jest, aby znać różnice między tymi znacznikami, co pozwala na efektywniejsze tworzenie treści internetowych.

Pytanie 2

W CSS wartości takie jak: underline, overline, line-through oraz blink odnoszą się do właściwości

A. font-style
B. text-decoration
C. text-align
D. font-decoration
Właściwość CSS 'text-decoration' jest używana do określenia dekoracji tekstu. Do jej wartości zaliczają się między innymi: 'underline' (podkreślenie), 'overline' (nadpisanie), 'line-through' (przekreślenie) oraz 'blink' (miganie), chociaż ostatnia z nich jest obecnie rzadko używana z powodu problemów z dostępnością i wsparciem w nowoczesnych przeglądarkach. W praktyce, użycie 'text-decoration' pozwala na poprawę czytelności tekstu oraz jego wyróżnienie w kontekście estetyki strony internetowej. Na przykład, stosując 'text-decoration: underline;' możemy podkreślić linki, co jest powszechną praktyką w projektowaniu stron. Zgodnie z wytycznymi W3C, stosowanie dekoracji tekstu powinno być przemyślane, aby nie wprowadzać zamieszania w interpretacji treści przez użytkowników. Przykładowo, nadpisanie może być użyte w kontekście wskazywania błędów, co wprowadza dodatkowe znaczenie do przekazu. Zrozumienie i umiejętne stosowanie 'text-decoration' jest kluczowe dla tworzenia profesjonalnych i funkcjonalnych interfejsów użytkownika.

Pytanie 3

Aby obraz w filmie zmieniał się gładko, liczba klatek (niezachodzących na siebie) w ciągu sekundy musi mieścić się przynajmniej w zakresie

A. 20 do 23 fps
B. 16 do 19 fps
C. 31 do 36 fps
D. 24 do 30 fps
Wybór '31 do 36 fps' jest trochę mylący, bo chociaż teoretycznie mogłoby to zapewnić płynny obraz, to w praktyce nie jest to standard w produkcjach filmowych. Klatki powyżej 30 fps w tradycyjnym kinie to rzadkość, co może wprowadzać zamieszanie co do efektów wizualnych. Ponadto sztuczne zwiększenie fps takich jak 31 może sprawić, że ruch będzie wyglądał na rozmyty, a to niespecjalnie pasuje do estetyki filmowej. Z drugiej strony, '20 do 23 fps' to zdecydowanie za mało, by zapewnić przyzwoitą jakość w profesjonalnych produkcjach. Takie wartości mogą się sprawdzić w animacjach czy niskobudżetowych filmach, ale już w bardziej skomplikowanych ujęciach nie dają płynności. Natomiast '16 do 19 fps' to totalna porażka, bo powoduje skoki i zacięcia, a to w branży nie przechodzi. Dlatego w pracy z wideo, warto pilnować minimum 24 fps, żeby widzowie mieli fajne wrażenia wizualne.

Pytanie 4

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

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

Pytanie 5

Podaj zapis w języku JavaScript, który sprawdzi, czy spełniony jest przynajmniej jeden z następujących warunków: 1) dowolna liczba naturalna a jest liczbą trzycyfrową, 2) dowolna liczba całkowita b jest liczbą ujemną?

A. ((a>99) && (a<1000)) || (b<0)
B. ((a>99) && (a<1000)) && (b<0)
C. ((a>99) || (a<1000)) || (b<0)
D. ((a>99) || (a<1000)) && (b<0)
Odpowiedź ((a>99) && (a<1000)) || (b<0) jest prawidłowa, ponieważ warunek ten skutecznie sprawdza, czy dowolna naturalna liczba a jest trzycyfrowa lub czy dowolna całkowita liczba b jest ujemna. Część wyrażenia (a>99) && (a<1000) weryfikuje, czy liczba a jest w przedziale od 100 do 999, co definiuje liczby trzycyfrowe. Z kolei druga część (b<0) sprawdza, czy liczba b jest mniejsza od zera. Całość połączona jest operatorem OR (||), co oznacza, że wystarczy spełnienie jednego z tych warunków, aby cały warunek był spełniony. W praktyce, takie wyrażenia są powszechnie stosowane w programowaniu, szczególnie w formularzach walidacyjnych, gdzie ważne jest, aby dane wprowadzone przez użytkowników spełniały określone kryteria. Dobrą praktyką jest dbałość o czytelność kodu i stosowanie odpowiednich nazw zmiennych, co ułatwia zrozumienie logiki działania aplikacji. Warto również pamiętać o testowaniu różnych przypadków, aby upewnić się, że warunki działają zgodnie z zamierzeniami, co jest kluczowe w zapewnieniu wysokiej jakości oprogramowania.

Pytanie 6

W języku JavaScript, funkcja Math.pow() wykorzystuje się do obliczenia

A. wartości bezwzględnej liczby
B. potęgi liczby
C. wartości przybliżonej liczby
D. pierwiastka kwadratowego liczby
Wybierając odpowiedzi, które nie są zgodne z funkcją Math.pow(), można popełnić pewne typowe błędy myślowe. Odpowiedź dotycząca wartości bezwzględnej liczby nie ma związku z działania funkcji Math.pow(). Funkcja ta nie jest zaprojektowana do obliczania wartości bezwzględnej, co jest zadaniem funkcji Math.abs(). Wartość bezwzględna to odległość liczby od zera na osi liczbowej, a obliczenia potęgowania nie mają tutaj zastosowania. Z kolei pierwiastek kwadratowy liczy się zupełnie inaczej. Aby obliczyć pierwiastek kwadratowy z liczby, należy użyć funkcji Math.sqrt(), która zwraca liczbę, która podniesiona do kwadratu daje oryginalną liczbę. Zastosowanie Math.pow() do wyznaczenia pierwiastka kwadratowego, na przykład Math.pow(9, 0.5), daje prawidłowy wynik, ale jest mniej klarowne i mniej wydajne niż użycie dedykowanej funkcji. Ostatnia opcja, dotycząca wartości przybliżonej liczby, również jest błędna, ponieważ Math.pow() nie służy do przybliżania wartości, a jedynie do podnoszenia jej do odpowiedniej potęgi. Ważne jest, aby zrozumieć, jakie funkcje są dostępne w JavaScript i jak mają być stosowane w odpowiednich kontekstach, aby uniknąć nieporozumień oraz poprawić czytelność i efektywność kodu w projektach programistycznych.

Pytanie 7

Aby umożliwić wybór kilku opcji jednocześnie w rozwijanej liście formularza HTML, należy dodać atrybut do znacznika select

Ilustracja do pytania
A. multiple
B. size
C. disabled
D. value
Atrybut multiple w znaczniku select w HTML to super sprawa, bo dzięki niemu można zaznaczyć więcej niż jedną opcję z listy rozwijalnej. To się przydaje, jak ktoś musi wybrać kilka elementów w formularzu. Jak dodasz atrybut multiple, to przeglądarka pokazuje to jako pole do wyboru, gdzie można klikać na kilka wartości za pomocą klawiszy Ctrl albo Shift. Fajnie, że ten atrybut nie wymaga żadnych dodatkowych wartości, wystarczy, że go wrzucisz do znacznika select. To zgodne z dobrymi praktykami UX, bo pozwala na większą elastyczność i interaktywność formularzy. Co więcej, nie trzeba być programistycznym guru, żeby to wdrożyć, więc każdy może to zrobić. Używa się go w różnych aplikacjach webowych, zwłaszcza tam, gdzie zbieranie danych od użytkowników w prosty i przejrzysty sposób jest ważne.

Pytanie 8

W podanym kodzie JavaScript występuje błąd logiczny. Program ma za zadanie wyświetlić informację, czy liczby są równe, jednak nie działa poprawnie. Wskaż, która odpowiedź odnosi się do tego błędu.

A. W klauzuli if użyto przypisania zamiast porównania
B. Zmienne zostały zadeklarowane w niewłaściwy sposób
C. Zawartość sekcji if oraz else powinna być zamieniona miejscami
D. Brak średnika przed klauzulą else
W kontekście analizy błędów w kodzie JavaScript, istnieje kilka odpowiedzi, które nie są poprawne. Po pierwsze, stwierdzenie, że zmienne zostały nieprawidłowo zadeklarowane, jest mylące. W rzeczywistości zmienne x i y zostały zadeklarowane poprawnie za pomocą słowa kluczowego var, co jest standardową praktyką w JavaScript. Wartości, które przypisano do tych zmiennych, są również poprawne i zgodne z typem liczbowym. Po drugie, stwierdzenie, że przed klauzulą else nie powinno być średnika, również nie jest adekwatne. W JavaScript średnik jest opcjonalny na końcu instrukcji, a jego brak w tym przypadku nie wpływa na działanie programu. Klauzula else działa prawidłowo, niezależnie od obecności średnika w kodzie. Ponadto, twierdzenie, że instrukcje wewnątrz sekcji if oraz else powinny być zamienione miejscami, jest błędne, ponieważ logika programu nie wymaga takiej zamiany. Program powinien najpierw sprawdzić, czy zmienne są równe, a następnie zareagować w zależności od wyniku tego porównania. Właściwa struktura kontrolna jest kluczowa dla poprawności działania kodu, dlatego zamiana sekcji if i else prowadziłaby do wyświetlania błędnych komunikatów.

Pytanie 9

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 10

Jakie zadanie wykonuje funkcja napisana w JavaScript?

function fun1(a,b)
{
    if ( a % 2 != 0 ) a++;
    for(n=a; n<=b; n+=2)
        document.write(n);
}
A. wypisanie wszystkich liczb w zakresie od a do b
B. wypisanie liczb parzystych w przedziale od a do b
C. sprawdzenie, czy liczba a jest liczbą nieparzystą; jeśli tak, to jej wypisanie
D. zwrócenie parzystych wartości liczb od a do b
Analiza niepoprawnych odpowiedzi wymaga zrozumienia, dlaczego poszczególne opcje nie pasują do działania funkcji fun1. W pierwszym przypadku, opcja dotycząca sprawdzania, czy liczba a jest nieparzysta i jej wypisywania, nie jest zgodna z logiką funkcji. Chociaż funkcja sprawdza, czy a jest nieparzysta, to nie wypisuje jej, lecz zmienia ją na parzystą, co wskazuje, że jej celem nie jest wypisywanie liczby a, ale przygotowanie jej do dalszej iteracji. Wypisanie wszystkich liczb z przedziału od a do b również nie jest prawidłowe, ponieważ funkcja nie iteruje po wszystkich liczbach, lecz wyłącznie po liczbach parzystych. Warto zauważyć, że funkcja pomija wszystkie liczby nieparzyste, co wyklucza tę opcję. Kolejna możliwa odpowiedź sugeruje zwracanie wartości parzystych liczb od a do b, jednak funkcja nie wykorzystuje żadnej procedury zwracania wartości, a jej konstrukcja wskazuje na bezpośrednie wypisywanie wyników, co wyklucza tę możliwość. Typowy błąd myślowy to niepoprawne rozumienie działania pętli for oraz operacji wypisywania danych w kontekście przeglądarki internetowej, co jest istotne z punktu widzenia dynamicznych aplikacji webowych. Zrozumienie, jak działa operator modulo i jego rola w wyznaczaniu parzystości liczb, jest kluczowe dla poprawnego interpretowania takich fragmentów kodu. Wskazane jest również, aby programiści byli świadomi różnicy między wypisywaniem a zwracaniem wyników, co często prowadzi do nieporozumień w kontekście funkcji i metod w JavaScript i innych językach programowania.

Pytanie 11

Jaką wartość w systemie szesnastkowym przyjmie kolor określony kodem RGB rgb(255, 128, 16)?

A. #ff8010
B. #ff0f10
C. #008010
D. #ff8011
Odpowiedź #ff8010 jest prawidłowa, ponieważ kolor o wartości rgb(255, 128, 16) w systemie szesnastkowym przekłada się na poszczególne wartości RGB. Wartości te są konwertowane w sposób następujący: 255 w systemie dziesiętnym odpowiada FF w systemie szesnastkowym, 128 to 80, a 16 to 10. Zatem, łącząc te składniki, otrzymujemy #ff8010. W praktyce, kolory te są często stosowane w projektowaniu graficznym oraz tworzeniu stron internetowych, gdzie dokładne odwzorowanie kolorów jest kluczowe. Kod szesnastkowy jest powszechnie używany ze względu na swoją kompaktowość i łatwość odczytu dla programistów. Warto więc zaznaczyć, że znajomość konwersji kolorów między różnymi systemami jest ważnym elementem w pracy nad kolorystyką w projektach cyfrowych oraz w branżach zajmujących się grafiką i designem. Dobre praktyki obejmują stosowanie narzędzi do wizualizacji kolorów oraz testowanie ich na różnych urządzeniach, aby zapewnić spójność wizualną.

Pytanie 12

Jaką maksymalną liczbę znaczników &lt;td&gt; można zastosować w tabeli składającej się z trzech kolumn i trzech wierszy, która nie zawiera złączeń między komórkami oraz wiersza nagłówkowego?

A. 12
B. 3
C. 9
D. 6
Odpowiedź 9 jest poprawna, ponieważ w tabeli składającej się z trzech kolumn i trzech wierszy, każdy wiersz może zawierać trzy komórki danych. Zatem, aby obliczyć maksymalną liczbę znaczników &lt;td&gt;, należy pomnożyć liczbę kolumn przez liczbę wierszy: 3 kolumny x 3 wiersze = 9 znaczników &lt;td&gt;. Ważne jest, aby pamiętać, że w kontekście HTML, znacznik &lt;td&gt; służy do definiowania komórek tabeli i jest używany tylko do umieszczania danych w tabeli. Przy projektowaniu tabel w HTML, dobrym rozwiązaniem jest stosowanie przejrzystej struktury oraz odpowiednich znaczników, aby poprawić czytelność i dostępność stron. Zgodnie z dobrymi praktykami, zawsze warto używać znaczników &lt;th&gt; do nagłówków kolumn, ale w tym przypadku, zgodnie z treścią pytania, zakładamy, że nie stosujemy wiersza nagłówkowego. W efekcie maksymalna liczba komórek, które można wykorzystać w takiej tabeli, wynosi 9. Przykładem zastosowania takiej tabeli może być wyświetlanie danych o produktach, gdzie każda komórka zawierać może różne informacje, takie jak nazwa produktu, cena i ilość.

Pytanie 13

Zaprezentowano tabelę stworzoną za pomocą kodu HTML, bez zastosowania stylów CSS. Który z poniższych fragmentów kodu HTML odnosi się do pierwszego wiersza tabeli?

Ilustracja do pytania
A. C
B. A
C. B
D. D
W przypadku odpowiedzi A zastosowano znaczniki <td> co jest błędną praktyką dla nagłówków tabeli. Znaczniki <td> służą do definiowania zwykłych komórek danych a nie komórek nagłówkowych. Użycie <td> w nagłówkach pozbawia tabelę odpowiednich walorów semantycznych co utrudnia jej późniejsze stylizowanie oraz dostępność. W odpowiedzi B użyto znacznika <i> jako części nagłówków co jest nieoptymalne ponieważ znacznik ten semantycznie oznacza zmianę tonu lub stylu i nie jest przeznaczony do formatowania komórek tabeli. Oznacza to że formatowanie takie może być odebrane jako nieodpowiednie przez czytniki ekranowe co dodatkowo wpływa na dostępność. Natomiast w odpowiedzi C zastosowano znacznik <center> wewnątrz <td> co jest przestarzałą techniką HTML oraz nie jest zalecane we współczesnym tworzeniu stron internetowych. Znacznik <center> został zdeprecjonowany w HTML 4.01 i nie powinien być używany ponieważ jego funkcjonalność można osiągnąć za pomocą CSS. Wszystkie te podejścia pomijają aspekty semantycznego tworzenia stron internetowych co jest kluczowe dla utrzymania prawidłowej struktury dokumentu oraz dostępności dla użytkowników z różnymi potrzebami.

Pytanie 14

Wskaż kod CSS, który odpowiada layoutowi bloków 2 – 5, zakładając, że są one utworzone na podstawie podanego kodu HTML.

Ilustracja do pytania
A. Kod 3
B. Kod 2
C. Kod 4
D. Kod 1
Kod 2 jest poprawny, ponieważ najlepiej odpowiada przedstawionemu układowi bloków. W tym układzie blok 2 ma style float: left i szerokość 40%, co oznacza, że jest wypływany w lewo i zajmuje 40% dostępnej szerokości. Blok 3 również jest ustawiony z float: left, ale z szerokością 30%, co pozwala na ułożenie go obok bloku 2, o ile suma szerokości nie przekracza 100%. Blok 4 jest ustawiony z float: right i szerokością 30%, co umieszcza go po prawej stronie kontenera. Takie ustawienie float pozwala na zapełnienie przestrzeni między blokiem 2 i 4 blokiem 3, przy zachowaniu równowagi wizualnej. Blok 5 został ustawiony z float: left i szerokością 30%, co pozwala mu na umieszczenie poniżej bloku 3, ale z wyrównaniem do lewej. Taki układ jest częsty w projektowaniu stron, gdzie używa się systemu float do tworzenia responsywnych układów. W praktyce jednak, float jest coraz częściej zastępowany flexboxem lub gridem, które oferują bardziej elastyczne i intuicyjne sposoby zarządzania układem elementów na stronie.

Pytanie 15

Definicja obiektu została zapisana w języku JavaScript jako var osoba={imie:"Anna", nazwisko:"Kowalska", rok_urodzenia:1985}; Jak można odwołać się do właściwości nazwisko?

A. osoba[1]
B. osoba[2]
C. osoba.nazwisko
D. osoba::nazwisko
W języku JavaScript obiekty są kluczowymi strukturami danych, które pozwalają na grupowanie danych w formie par klucz-wartość. W omawianym przypadku mamy obiekt osoba, który zawiera trzy właściwości: imie, nazwisko oraz rok_urodzenia. Aby uzyskać dostęp do właściwości nazwisko, należy użyć notacji kropkowej, co jest standardową metodą w JavaScript. Notacja kropkowa jest czytelna i intuicyjna, co czyni ją preferowanym sposobem odwołania się do właściwości obiektu. Przykładowo, aby wyświetlić nazwisko, możemy użyć polecenia console.log(osoba.nazwisko), co zwróci wartość 'Kowalska'. Inna metoda dostępu do właściwości obiektu to notacja z nawiasami kwadratowymi, na przykład osoba['nazwisko'], która również zadziała, ale jest mniej czytelna, zwłaszcza w przypadku kluczy, które zawierają znaki specjalne. Warto podkreślić, że zgodnie z ECMAScript, standardem, na którym bazuje JavaScript, obiekty są fundamentalnym elementem języka, a umiejętność ich wykorzystania jest kluczowa dla każdego programisty.

Pytanie 16

Wskaż pętlę w języku JavaScript, która wypisze sześć kolejnych liczb parzystych.

A. for(i=2;i<=12;i+=2) {document.write(i);}
B. for(i=2;i<=12;i++) {i=i+2; document.write(i);}
C. for(i=2;i<12;i+=2) {document.write(i);}
D. for(i=2;i<12;i++) {i++; document.write(i);}
Prawidłowa odpowiedź to pętla for(i=2;i<=12;i+=2) {document.write(i);}, ponieważ jest ona skonstruowana w sposób, który pozwala na wyświetlenie sześciu kolejnych liczb parzystych, zaczynając od 2 do 12 włącznie. Pętla for składa się z trzech głównych części: inicjalizacji (i=2), warunku (i<=12) oraz inkrementacji (i+=2). Inicjalizacja ustawia zmienną i na 2, co jest pierwszą liczbą parzystą. Warunek i<=12 zapewnia, że pętla będzie kontynuowana do momentu, gdy i osiągnie wartość większą niż 12, co oznacza, że ostatnią liczbą, która zostanie wyświetlona, będzie 12. Inkrementacja i+=2 powoduje, że przy każdej iteracji wartość i zwiększa się o 2, co pozwala na przechodzenie pomiędzy kolejnymi liczbami parzystymi (2, 4, 6, 8, 10, 12). Taki sposób konstrukcji pętli jest zgodny z zasadami programowania w JavaScript oraz pozwala na efektywne i kontrolowane wyświetlanie danych na stronie. Istotne jest również, że wykorzystanie metody document.write() jest jedną z prostszych form wyświetlania danych w JavaScript, aczkolwiek w praktyce jest zalecane korzystanie z bardziej nowoczesnych metod, takich jak manipulacja DOM, aby uniknąć nadpisywania całej zawartości strony.

Pytanie 17

Zaprezentowane pole input daje możliwość

<input type="checkbox" name="text1" value="text2">
A. wprowadzenia hasła
B. wybrania opcji
C. zaznaczenia opcji z listy zawierającej wartości text1 i text2
D. wpisania dowolnego tekstu
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 18

Grafik pragnie zmienić obraz JPG na format PNG bez utraty jakości, tak aby w obszarach, gdzie pierwotnie był kolor biały, w finalnym obrazie występowała przezroczystość. W tym celu powinien

A. przekształcić obraz w odcienie szarości
B. zaimportować obraz do edytora grafiki wektorowej
C. zmniejszyć rozdzielczość obrazu
D. dodać kanał alfa
Zarówno zmniejszenie rozdzielczości obrazu, jak i przekształcenie go w odcienie szarości są podejściami, które nie spełniają wymagań postawionych w pytaniu. Zmniejszenie rozdzielczości oznacza, że zmniejszamy liczbę pikseli w obrazie, co skutkuje utratą detali i jakości, co jest zupełnie niezgodne z celem przekształcenia bez utraty jakości. Takie działanie nie ma również związku z dodawaniem przezroczystości, a może wręcz pogorszyć wizualną jakość końcowego obrazu. Ponadto, konwersja obrazu do odcieni szarości eliminuje wszystkie kolory, co sprawia, że problem z białym kolorem, który ma zostać przekształcony w przezroczystość, staje się bezprzedmiotowy. Importowanie obrazu do edytora grafiki wektorowej, chociaż może być użyteczne w niektórych przypadkach, nie jest odpowiednim narzędziem do przekształcania bitmapy z JPG na PNG z przezroczystością. Grafika wektorowa jest oparta na matematycznych formułach, a nie na pikselach, więc nie można w prosty sposób przenieść bitmapowych właściwości obrazu. Podejścia te mogą prowadzić do błędnych wniosków, w których użytkownicy mogą sadzić, że redukcja jakości i przekształcanie kolorów są wystarczającymi krokami do osiągnięcia zamierzonych efektów graficznych.

Pytanie 19

Jaki rezultat zostanie wyświetlony po wykonaniu przedstawionego kodu HTML?

<ol>
    <li>punkt</li>
    <li>punkt
        <ul>
            <li>punkt</li>
            <li>punkt</li>
        </ul>
    </li>
    <li>punkt</li>
</ol>
<ol type="A" start="4">
    <li>punkt</li>
</ol>

1. punkt

2. punkt

  • punkt
  • punkt

3. punkt

4. punkt

A.

1. punkt

2. punkt

  • punkt
  • punkt

3. punkt

4. punkt

B.

1. punkt

2. punkt

  • punkt
  • punkt

3. punkt

D. punkt

C.

1. punkt

2. punkt

  • punkt
  • punkt

3. punkt

D. punkt

D.

A. B.
B. A.
C. D.
D. C.
Niestety, twoja odpowiedź nie była poprawna. Może wynikać to z braku zrozumienia struktury i semantyki kodu HTML, szczególnie w kontekście list uporządkowanych (``) i nieuporządkowanych (``). Kod HTML w pytaniu składa się z dwóch uporządkowanych list, z których pierwsza zawiera trzy elementy. Drugi element pierwszej listy zawiera zagnieżdżoną nieuporządkowaną listę z dwoma elementami. Warto zaznaczyć, że elementy listy nieuporządkowanej są zazwyczaj wyświetlane z kropkami. Druga lista uporządkowana zaczyna numerację od litery 'D', co jest zgodne z poprawną odpowiedzią. Typowym błędem jest niezauważenie zagnieżdżonych list lub niepoprawne zrozumienie funkcji atrybutu start w liście uporządkowanej. W praktyce, zrozumienie struktury i semantyki tagów HTML jest kluczowe dla tworzenia efektywnych i użytecznych stron internetowych. Proponuję, abyś ponownie przeanalizował kod HTML, skupiając się na strukturze list i zrozumieniu atrybutów stosowanych w tagach list.

Pytanie 20

Dla celu strony internetowej stworzono grafikę rysunek.jpg o wymiarach: szerokość 200 px, wysokość 100 px. Aby zaprezentować tę grafikę jako miniaturę – pomniejszoną z zachowaniem proporcji, można użyć znacznika

A. <img src="/rysunek.png" style="width: 25px; height:25px;">
B. <img src="/rysunek.png" style="width: 50px">
C. <img src="/rysunek.png">
D. <img src="/rysunek.png" style="width: 25px; height:50px;">
Wybór innych opcji, takich jak <img src="/rysunek.png" style="width: 25px; height:50px;"> czy <img src="/rysunek.png" style="width: 25px; height:25px;"> prowadzi do nieproporcjonalnego wyświetlenia obrazu, co skutkuje jego zniekształceniem. Ustalenie zarówno szerokości, jak i wysokości w stylach CSS sprawia, że obrazek jest zmuszony do dopasowania się do tych wymiarów, co narusza jego naturalne proporcje. To podejście jest niezgodne z zaleceniami dotyczącymi responsywności, które sugerują, aby ograniczać się do jednego wymiaru, co pozwala drugiemu na automatyczne dostosowanie. Typowym błędem jest przyjęcie, że podanie obu wymiarów w pikselach zawsze przyniesie optymalny efekt wizualny, co jest mylące i może prowadzić do złego doświadczenia użytkownika. Zniekształcenie obrazów nie tylko obniża estetykę strony, ale także może wpływać na jej użyteczność oraz SEO. Dobrą praktyką jest również używanie atrybutów 'alt' w znacznikach obrazów, aby poprawić dostępność i SEO, co nie zostało uwzględnione w żadnej z opcji. Warto także zauważyć, że stosowanie odpowiednich formatów obrazów i ich optymalizacja pod względem rozmiaru pliku są kluczowe dla przyspieszenia ładowania strony.

Pytanie 21

W zamieszczonym przykładzie pseudoklasa hover sprawi, że styl pogrubiony będzie przypisany

a:hover { font-weight: bold; }
A. odnośnikowi, w momencie kiedy najechał na niego kursor myszy.
B. wszystkim odnośnikom nieodwiedzonym.
C. wszystkim odnośnikom odwiedzonym.
D. każdemu odnośnikowi niezależnie od aktualnego stanu.
Twoja odpowiedź jest prawidłowa. Pseudoklasa :hover w CSS jest używana do stylizacji elementów, na które najechał kursor myszy. Na przykład, jeżeli użyjemy stylu 'font-weight: bold;' z pseudoklasą :hover, tekst odnośnika stanie się pogrubiony tylko wtedy, kiedy na niego najedziemy kursorem. Jest to bardzo przydatne w interaktywnym designie strony internetowej, gdzie możemy w prosty sposób zasygnalizować użytkownikowi, że dany element jest aktywny lub interaktywny. Pamiętaj, że pseudoklasy w CSS są potężnym narzędziem, które pozwala nam na tworzenie zaawansowanych efektów bez konieczności użycia JavaScriptu. Znajomość i umiejętność wykorzystania pseudoklas jest zatem kluczową umiejętnością każdego front-end developera.

Pytanie 22

W CSS zapis w postaci ```h1::first-letter{color:red;}``` spowoduje, że kolor czerwony będzie dotyczył

A. pierwszej litery nagłówka pierwszego poziomu
B. pierwszej linii akapitu
C. tekstów nagłówka pierwszego poziomu
D. pierwszej litery nagłówka drugiego poziomu
Zapis CSS h1::first-letter {color: red;} odnosi się do selektora pseudo-elementu first-letter, który jest używany do stylizacji pierwszej litery bloku tekstowego w nagłówkach. W tym wypadku, gdy selektor jest zastosowany do elementu h1, oznacza to, że kolor pierwszej litery nagłówka pierwszego stopnia (h1) zostanie zmieniony na czerwony. Pseudo-element first-letter działa tylko dla elementów blokowych, takich jak nagłówki, akapity czy listy. W praktyce, jeśli w dokumencie HTML mamy element <h1> z tekstem, np. 'Witaj świecie', to wyłącznie litera 'W' zostanie wyświetlona w kolorze czerwonym. To podejście jest zgodne ze standardami CSS, które definiują pseudo-elementy jako specyficzne fragmenty dokumentu, które można stylizować niezależnie od reszty zawartości. Warto również zauważyć, że stosowanie takich selektorów pozwala na uzyskanie bardziej złożonych efektów wizualnych bez konieczności modyfikacji struktury HTML. Umożliwia to projektantom stron internetowych większą elastyczność i kontrolę nad estetyką treści.

Pytanie 23

Skrypt napisany w języku JavaScript wylicza cenę promocyjną dla swetrów w kolorach: zielonym i niebieskim (zmienna kolor) przy zakupach powyżej 200 zł (zmienna zakupy). Warunek do obliczeń powinien być sformułowany za pomocą wyrażenia logicznego?

A. zakupy > 200 || kolor == 'zielony' || kolor == 'niebieski'
B. zakupy > 200 && kolor == 'zielony' && kolor == 'niebieski'
C. zakupy > 200 && (kolor == 'zielony' || kolor == 'niebieski')
D. zakupy > 200 || (kolor == 'zielony' && kolor == 'niebieski')
W analizowanych odpowiedziach istnieje kilka kluczowych błędów logicznych, które prowadzą do niepoprawnych wniosków. W pierwszym przypadku, użycie operatora alternatywy (||) w połączeniu z warunkiem o wartości zakupów nie spełnia wymagań zadania, ponieważ sugeruje, że promocja jest dostępna niezależnie od koloru, co jest sprzeczne z intencją zadania. To błędne podejście prowadzi do wniosku, że każdy zakup powyżej 200 zł, bez względu na kolor, kwalifikuje się do promocji, co jest niepoprawne. Kolejny błąd występuje w drugim podejściu, gdzie zastosowano koniunkcję (&&) dla obu kolorów. Takie sformułowanie wymagałoby, aby sweter był jednocześnie zielony i niebieski, co jest logicznie niemożliwe. Taka konstrukcja nie tylko jest nielogiczna, ale i niepraktyczna, ponieważ nie spełnia podstawowych zasad logiki boolowskiej. Ostatnia niepoprawna odpowiedź wprowadza dodatkową złożoność bez potrzeby, łącząc warunek o wartościach zakupów z wymaganiem o kolorze za pomocą operatora alternatywy (||), co również skutkuje błędnym wnioskiem. Poprawne wyrażenie powinno jasno uwzględniać, że kolor swetra musi być jednym z dwóch dozwolonych wariantów oraz że musi istnieć minimalna wartość zakupów, co jest kluczowe dla prawidłowego obliczenia ceny promocyjnej.

Pytanie 24

W ramce przedstawiono kod JavaScript z błędem logicznym. Program powinien wypisywać informację, czy liczby są sobie równe czy nie, lecz nie wykonuje tego. Wskaż odpowiedź, która dotyczy błędu.

var x = 5;
var y = 3;
if (x = y)     document.getElementById("demo").innerHTML = 'zmienne są równe';
else         document.getElementById("demo").innerHTML = 'zmienne się różnią';
A. Nieprawidłowo zadeklarowano zmienne.
B. W klauzuli if występuje przypisanie zamiast porównania.
C. Przed klauzulą else nie powinno być średnika.
D. Instrukcje wewnątrz sekcji if oraz else powinny być zamienione miejscami.
Z rozważanych odpowiedzi można zauważyć pewne nieporozumienia dotyczące składni języka JavaScript. Po pierwsze, deklaracja zmiennych w prezentowanym kodzie jest prawidłowa. W JavaScript, zmienne można zadeklarować za pomocą słów kluczowych var, let lub const. W tym przypadku, zmienne x i y są prawidłowo zadeklarowane za pomocą słowa kluczowego var. Co więcej, klauzula else w JavaScript nie powinna być poprzedzona średnikiem. Średnik w JavaScript jest używany do oddzielenia instrukcji i nie jest wymagany po klauzuli else. Również instrukcje wewnątrz sekcji if i else nie powinny być zamienione miejscami - błąd polega na używaniu operatora przypisania zamiast operatora porównania. Nieporozumienie dotyczące operatorów jest częstym błędem, który można uniknąć poprzez zrozumienie różnicy między operatorem przypisania (=) a operatorem porównania (== lub ===) w JavaScript.

Pytanie 25

Który kod HTML spowoduje identyczne formatowanie jak przedstawione na obrazku?

W tym paragrafie zobaczysz sposoby formatowania tekstu w HTML


  1. <p>W tym <i>paragrafie zobaczysz sposoby formatowania</i> tekstu w HTML</p>

  2. <p>W tym <b>paragrafie <i>zobaczysz</i> sposoby formatowania</b> tekstu w HTML</p>

  3. <p>W tym <i>paragrafie <b>zobaczysz</b> sposoby formatowania</i> tekstu w HTML</p>

  4. <p>W tym <i>paragrafie </i><b>zobaczysz</b><i> sposoby formatowania</i> tekstu w HTML</p>

A. Odpowiedź A
B. Odpowiedź B
C. Odpowiedź C
D. Odpowiedź D
Wybór odpowiedzi C jest trafny, bo stosujesz odpowiednie znaczniki HTML, aby osiągnąć zamierzony efekt formatowania. Przykład świetnie pokazuje, jak używać znaczników <i> i <b>, które służą do pochylania i pogrubiania tekstu. Znak <p> to z kolei paragraf, który odseparowuje tekst i zaczyna nową linię. Tutaj znacznik <i> przed słowem 'paragrafie' sprawia, że jest ono kursywą, a <b> wokół 'zobaczysz' wyróżnia go na pogrubionym tle. To takie podstawowe zasady HTML, które pokazują, jak można różne style formatowania łączyć, żeby uczynić treści bardziej estetycznymi i przyjemnymi do czytania. Warto pamiętać o odpowiednim używaniu znaczników, bo to nie tylko poprawia wygląd, ale też dostępność treści, co jest ważne dla osób korzystających z czytników ekranu. Z mojego doświadczenia, im lepiej rozumiesz te zasady, tym łatwiej tworzyć strony, które będą dobrze odbierane przez użytkowników.

Pytanie 26

W języku HTML stworzono definicję tabeli. Który z rysunków ilustruje jej działanie?

Ilustracja do pytania
A. Rysunek 1
B. Rysunek 2
C. Rysunek 3
D. Rysunek 4
Prawidłowa odpowiedź to Rysunek 1 ponieważ odwzorowuje on strukturę tabeli opisaną w kodzie HTML zaprezentowanym w pytaniu. Kod HTML przedstawia tabelę z dwoma wierszami. Pierwszy wiersz zawiera dwie komórki z tekstami 'pierwszy' i 'drugi'. Drugi wiersz posiada jedną komórkę z tekstem 'trzeci' która zajmuje szerokość dwóch kolumn dzięki zastosowaniu atrybutu colspan=2. Właśnie ta cecha sprawia że drugi rysunek jest poprawny gdyż w nim komórka z tekstem 'trzeci' rozciąga się na szerokość dwóch kolumn tabeli. Takie podejście jest zgodne z zasadami projektowania tabel w HTML gdzie atrybut colspan pozwala na łączenie kolumn co jest szczególnie przydatne przy tworzeniu złożonych układów danych w tabelach. Dzięki zastosowaniu tego atrybutu można efektywnie zarządzać szerokością komórek i ich położeniem co zwiększa elastyczność w projektowaniu układów na stronach internetowych. Warto zwrócić uwagę na fakt że użycie atrybutu 'border' z wartością 1 powoduje wyświetlenie widocznej ramki co jest dobrze zilustrowane na Rysunku 1. Zrozumienie i umiejętne zastosowanie takich technik w projektowaniu stron jest kluczowe dla tworzenia przejrzystych i funkcjonalnych interfejsów użytkownika.

Pytanie 27

Podczas przygotowywania grafiki na stronę internetową konieczne jest wycięcie jedynie określonego fragmentu. Jak nazywa się ta operacja?

A. kadrowanie.
B. zmiana rozmiaru.
C. łączenie warstw.
D. lustrzane odbicie obrazu.
Kadrowanie to proces polegający na wycinaniu fragmentu obrazu w celu skupienia uwagi na określonym elemencie lub poprawienia kompozycji. W kontekście grafiki internetowej, kadrowanie jest kluczowe, aby dostosować zdjęcia do wymagań wizualnych strony, zachowując jednocześnie wysoką jakość obrazu. Przykładowo, jeśli tworzymy stronę dla restauracji, możemy wyciąć fragment zdjęcia dania, aby lepiej zaprezentować jego szczegóły. Dobre praktyki w kadrowaniu obejmują stosowanie zasady trzech, która polega na umiejscowieniu kluczowych elementów obrazu w punktach przecięcia linii podziału. Warto również pamiętać o rozdzielczości i proporcjach, aby uniknąć rozmycia lub zniekształcenia obrazu. Kadrowanie jest często używane w różnych formatach wizualnych, takich jak posty w mediach społecznościowych, banery reklamowe czy galerie zdjęć. W ten sposób, odpowiednie kadrowanie przyczynia się do lepszej prezentacji treści oraz poprawia estetykę i przejrzystość strony internetowej.

Pytanie 28

Która z metod wyświetlenia tekstu nie jest określona w języku JavaScript?

A. Funkcja MessageBox()
B. Właściwość innerHTML
C. Metoda document.write()
D. Funkcja window.alert()
Funkcja MessageBox() nie jest zdefiniowana w języku JavaScript, co czyni tę odpowiedź poprawną. W JavaScript do wyświetlania interaktywnych okien dialogowych służy metoda window.alert(), która wyświetla prosty komunikat. Metoda ta przyjmuje jeden argument, który jest tekstem wyświetlanym w oknie alertu. Przykład użycia: window.alert('To jest komunikat');. Kolejną metodą jest document.write(), która umożliwia dynamiczne dodawanie treści do dokumentu HTML. Przykład: document.write('<h1>Witaj w JavaScript!</h1>');. W praktyce, podczas tworzenia interaktywnych aplikacji webowych, wybór metody prezentacji danych powinien być przemyślany, biorąc pod uwagę doświadczenia użytkowników. Warto również stosować standardy dotyczące dostępności, aby zapewnić, że wszyscy użytkownicy, niezależnie od ich umiejętności technicznych, mogą z łatwością korzystać z aplikacji.

Pytanie 29

Aby prawidłowo zorganizować hierarchiczną strukturę tekstu na stronie internetowej, powinno się wykorzystać

A. znacznik <p> z formatowaniem
B. znacznik <div>
C. znaczniki <h1>, <h2> oraz <p>
D. znaczniki <frame> i <table>
Aby poprawnie zdefiniować hierarchiczną strukturę tekstu witryny internetowej, kluczowe jest zastosowanie znaczników <h1>, <h2>, oraz <p>. Znacznik <h1> jest najważniejszym nagłówkiem na stronie i powinien być używany tylko raz, aby wskazać główny temat treści. Z kolei znaczniki <h2> służą do wyodrębnienia podtematów, co pozwala na tworzenie czytelnej i logicznej struktury dokumentu. Dzięki tym znacznikom, zarówno użytkownicy, jak i wyszukiwarki internetowe mogą łatwiej zrozumieć hierarchię treści. Znacznik <p> jest używany do definiowania akapitów, co dodatkowo poprawia czytelność tekstu. Zastosowanie tej struktury jest zgodne z wytycznymi W3C oraz zasadami SEO, co przyczynia się do lepszego indeksowania przez wyszukiwarki. Przykładowo, strona internetowa poświęcona zdrowemu stylowi życia może mieć <h1> jako 'Zdrowy Styl Życia', a <h2> jako 'Dieta' i 'Ćwiczenia', co ułatwia użytkownikom nawigację oraz przyswajanie treści.

Pytanie 30

W języku HTML sposób na zdefiniowanie kodowania polskich znaków to

A. atrybut znacznika <meta>
B. atrybut znacznika <p>
C. znacznik <title>
D. znacznik <charset>
Inne opcje, które rozważono jako poprawne, nie są odpowiednie do określenia kodowania znaków w HTML. Znacznik <charset> nie istnieje w standardzie HTML, co czyni go niewłaściwym wyborem. Kodowanie znaków nie jest definiowane przez atrybut znacznika <p>, który jest używany głównie do formatowania tekstu, a więc nie ma wpływu na kodowanie znaków. Warto również zauważyć, że znacznik <title> jest stosowany do nadania tytułu dokumentu, który pojawia się na karcie przeglądarki, ale nie ma on związku z kodowaniem znaków. Wybór odpowiedniego kodowania jest kluczowy dla zachowania integralności tekstu, a niewłaściwe przypisanie może prowadzić do problemów z wyświetlaniem znaków i błędów w interpretacji treści. Często użytkownicy mylnie zakładają, że inne znaczniki HTML mogą mieć wpływ na kodowanie, co prowadzi do nieporozumień. Dlatego istotne jest, aby być świadomym roli znacznika <meta> w kontekście kodowania znaków, zwłaszcza w przypadku języków z diakrytykami, takich jak język polski.

Pytanie 31

W skrypcie JavaScript operatory: ||, && są klasyfikowane jako operatorzy

A. logicznymi
B. przypisania
C. bitowe
D. arytmetyczne
Operatory || (OR logiczny) oraz && (AND logiczny) w języku JavaScript należą do grupy operatorów logicznych. Używają ich programiści do prowadzenia operacji na wartościach boolowskich (true/false), co jest kluczowe w tworzeniu warunków w instrukcjach warunkowych i pętlach. Operator && zwraca true, jeśli obie jego operandy są prawdziwe, natomiast operator || zwraca true, gdy przynajmniej jedna z operand jest prawdziwa. Przykładem praktycznego zastosowania operatora && może być sprawdzanie, czy użytkownik jest zalogowany i ma odpowiednie uprawnienia do wykonania danej operacji. Z kolei operator || może być użyty do wyświetlenia komunikatu, jeśli użytkownik nie podał danych, bądź podał niewłaściwe wartości. Dobrze jest stosować te operatory w kontekście logiki programowania, co pozwala na tworzenie bardziej złożonych, ale jednocześnie czytelnych i efektywnych warunków. Warto również pamiętać, aby w kodzie unikać zbyt skomplikowanych warunków, co może prowadzić do trudności w utrzymaniu kodu oraz zwiększać ryzyko błędów.

Pytanie 32

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

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

Pytanie 33

W języku JavaScript zdefiniowano funkcję potega. Funkcja ta

function potega(a, b = 2) { ... return wynik; }
A. nie przyjmuje żadnych argumentów
B. wymaga podania dwóch argumentów przy wywołaniu
C. nie zwraca wartości
D. może być wywołana z jedną wartością
Odpowiedź 3 jest poprawna, ponieważ funkcja potega w JavaScript została zdefiniowana z jednym parametrem obowiązkowym (a) oraz jednym parametrem opcjonalnym (b) z domyślną wartością wynoszącą 2. Oznacza to, że można ją wywołać z jednym argumentem, a wtedy drugi argument przyjmie wartość domyślną. Taka konstrukcja jest użyteczna w przypadku, gdy chcemy zapewnić elastyczność wywołania funkcji bez konieczności podawania wszystkich argumentów. W praktyce, użycie wartości domyślnych pozwala na tworzenie bardziej zwięzłego kodu i łatwiejsze utrzymywanie funkcji. Standard ECMAScript 2015 (ES6) wprowadził możliwość definiowania wartości domyślnych dla parametrów funkcji, co jest obecnie powszechną praktyką w JavaScript. Dzięki temu programiści mogą lepiej zarządzać przypadkami, w których nie wszystkie dane wejściowe są dostępne, co pozwala na unikanie błędów związanych z nieokreślonymi wartościami i zwiększa efektywność kodu.

Pytanie 34

W JavaScript zapis a++; można przedstawić w inny sposób jako

A. a = a & 1
B. a << 1
C. a = a + 1
D. 1 += a
Odpowiedź 'a = a + 1;' jest poprawna, ponieważ dokładnie odzwierciedla działanie operatora inkrementacji 'a++;'. Operator '++' w JavaScript zwiększa wartość zmiennej o 1. W przypadku użycia 'a = a + 1;', operacja ta jest explicite zapisana jako przypisanie aktualnej wartości 'a' powiększonej o 1. Taki zapis jest często stosowany w sytuacjach, gdy chcemy lepiej zrozumieć, co się dzieje w kodzie, szczególnie dla początkujących programistów. Przykładowo, jeśli mamy zmienną, która przechowuje liczbę, możemy użyć 'a = a + 1;' w pętli, aby zliczać ilość iteracji. Warto zauważyć, że użycie operatora '++' jest bardziej zwięzłe i często preferowane w profesjonalnym kodzie, jednak zrozumienie, jak działa to na poziomie podstawowym, jest kluczowe. Dobrą praktyką jest dbałość o przejrzystość kodu, zwłaszcza w zespołach, gdzie różne osoby mogą pracować nad tym samym projektem.

Pytanie 35

Jak określa się proces przedstawiania informacji zawartych w dokumencie elektronicznym w formie odpowiedniej dla konkretnego środowiska?

A. Teksturowanie
B. Renderowanie
C. Mapowanie
D. Rasteryzacja
Mapowanie to proces związany z przypisywaniem wartości z jednego systemu do innego, często w kontekście baz danych lub geolokalizacji, ale nie odnosi się bezpośrednio do transformacji danych w formę wizualną. Rasteryzacja to technika przekształcania obrazów wektorowych na obrazy rastrowe, co jest jedynie etapem w renderowaniu, a nie samodzielnym procesem. Teksturowanie to proces nakładania tekstur na powierzchnie obiektów 3D, co również jest aspektem renderowania, ale nie obejmuje całości procesu przedstawienia dokumentów elektronicznych. Często zdarza się pomylić te pojęcia, ponieważ wszystkie dotyczą przetwarzania danych, jednak ich zastosowania są różne. Zrozumienie różnic między tymi terminami jest kluczowe dla efektywnej komunikacji w dziedzinie technologii cyfrowych. Wnioskując, kluczowym błędem jest mylenie renderowania z innymi technikami przetwarzania danych, co może prowadzić do nieprawidłowego stosowania technologii w projektach, a także do nieporozumień w zespole projektowym. W związku z tym, właściwe rozpoznawanie i stosowanie terminologii technicznej jest niezbędne do skutecznego zarządzania projektami oraz do osiągania zamierzonych rezultatów w branży IT.

Pytanie 36

Instrukcja przypisania elementu do tablicy w języku JavaScript dotyczy tablicy:

Tablica['technik'] = 'informatyk';
A. statycznej.
B. numerycznej.
C. asocjacyjnej.
D. wielowymiarowej.
Poprawna odpowiedź to 'asocjacyjna'. W języku JavaScript, tablice asocjacyjne są strukturami danych, które używają kluczy zamiast indeksów numerycznych. Kluczem może być dowolny ciąg znaków, co oznacza, że elementy tablicy są identyfikowane za pomocą unikalnych kluczy. W praktyce, gdy używamy tablicy asocjacyjnej, przypisujemy wartość do określonego klucza, jak w przedstawionym przykładzie, gdzie wartość 'informatyk' przypisana jest do klucza 'technik'. Jest to często stosowane w praktyce, ponieważ pozwala na bardziej intuicyjne i zrozumiałe indeksowanie danych. Ważne jest jednak, aby pamiętać, że mimo iż tablice asocjacyjne są bardzo użyteczne, nie są one oficjalnie uznawane przez specyfikację języka JavaScript, co oznacza, że różne środowiska mogą je obsługiwać w różny sposób.

Pytanie 37

Który z poniższych obrazów został sformatowany przy użyciu zaprezentowanego stylu CSS?

Ilustracja do pytania
A. D
B. B
C. A
D. C
Odpowiedź A jest prawidłowa, ponieważ zastosowane style CSS dokładnie odzwierciedlają podany kod. Styl img { padding: 5px; border: 1px solid grey; border-radius: 10px; } oznacza, że obrazek otrzymuje wewnętrzny margines o wartości 5 pikseli, szary, jednopikselowy, ciągły obramowanie oraz zaokrąglenie narożników o promieniu 10 pikseli. Efektem tego jest estetyczny wygląd, który umożliwia lepszą prezentację treści graficznych w projektach webowych. Padding pozwala na uzyskanie równowagi wizualnej, natomiast border-radius zapewnia miękkość krawędzi, co jest często stosowane w nowoczesnym web designie. Praktycznym zastosowaniem takich stylów jest m.in. tworzenie kart wizualnych na stronach internetowych, gdzie estetyka i czytelność są kluczowe. Dobrym przykładem jest stosowanie tych technik w responsywnych projektach, gdzie obrazy muszą dobrze współgrać z różnymi elementami interfejsu użytkownika. CSS umożliwia tworzenie atrakcyjnych wizualnie stron, które przyciągają uwagę i poprawiają interakcję użytkownika z treścią.

Pytanie 38

W dokumencie HTML umieszczono tekst sformatowany określonym stylem. Aby wprowadzić w treści kilka słów o zróżnicowanym stylu, należy użyć znacznika

A. <section>
B. <span>
C. <hr>
D. <table>
Znacznik <span> jest używany w HTML do definiowania niewielkich fragmentów tekstu, które można stylizować niezależnie od reszty treści. Przy jego pomocy możemy wprowadzać różne style CSS, co pozwala na skomponowanie bardziej zróżnicowanego wizualnie tekstu. Na przykład, możemy użyć znacznika <span> do podkreślenia ważnych słów w zdaniu, zmieniając ich kolor lub czcionkę. Ważne jest, aby znacznik <span> nie wprowadzał żadnych zmian semantycznych w treści; jest to znacznik czysto stylistyczny. W praktyce, korzystając z CSS, możemy zastosować różne klasy do elementów <span>, co zwiększa elastyczność w zakresie stylizacji. Przykład: <span class='highlight'>ważne słowo</span> może zostać zapisane w arkuszu stylów jako .highlight { background-color: yellow; }. To podejście jest zgodne z zasadami semantycznego HTML oraz wykorzystania CSS, co jest rekomendowaną praktyką w tworzeniu stron internetowych.

Pytanie 39

W przedstawionym kodzie HTML, zaprezentowany styl CSS jest stylem:

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

Pytanie 40

Fragment kodu JavaScript, który sumuje dwie liczby, przedstawia się następująco. Aby wykonać dodawanie po kliknięciu przycisku o nazwie dodaj, należy umieścić kod w wykropkowanym miejscu.

Podaj pierwszą liczbę: <input type="text" name="liczba1" />
Podaj drugą liczbę: <input type="text" name="liczba2" />
....
<script>
function dodaj()
{
// ta funkcja realizuje dodawanie i podaje jego wynik
}
</script>
A. <button onselect="return dodaj()">dodaj</button>
B. <button onclick="return dodaj()">dodaj</button>
C. <button onselect="return dodaj()">oblicz</button>
D. <button onclick="return oblicz()">dodaj</button>
W JavaScript funkcje mogą być wywoływane w odpowiedzi na zdarzenia użytkownika takie jak kliknięcie przycisku. Atrybut onclick jest powszechnie stosowany do określenia, jaka funkcja powinna zostać wywołana w momencie kliknięcia. W tym przypadku celem jest wywołanie funkcji dodaj() po kliknięciu przycisku. Dlatego odpowiedź <button onclick="return dodaj()">dodaj</button> jest prawidłowa, ponieważ używa właściwego atrybutu onclick do przypisania zdarzenia kliknięcia funkcji dodaj(). To podejście jest zgodne z dobrymi praktykami w zakresie obsługi zdarzeń w HTML oraz JavaScript, umożliwiając elastyczne interakcje użytkownika z aplikacją. Ważne jest, by pamiętać o tym, że funkcja przypisana do onclick powinna zwracać wartość false, jeśli chcemy, by domyślne działanie przeglądarki zostało zatrzymane. W tym przypadku funkcja dodaj() powinna realizować operację dodawania liczb wprowadzonych przez użytkownika w formularzu, co jest typowym scenariuszem użycia JavaScript do manipulacji danymi wprowadzanymi przez użytkownika w czasie rzeczywistym. Implementacja tej funkcji powinna zawierać również walidację danych wejściowych oraz kontrolę błędów, co jest standardem w nowoczesnym programowaniu webowym, zapewniającym stabilność i bezpieczeństwo aplikacji.