Brak odpowiedzi na to pytanie.
Wyjaśnienie poprawnej odpowiedzi:
Znacznik w dokumentach HTML jest kluczowym elementem, który definiuje początek sekcji nagłówkowej dokumentu. Sekcja ta zawiera meta informacje, które są istotne dla przeglądarek internetowych oraz wyszukiwarek, ale nie są bezpośrednio wyświetlane na stronie. W nagłówku można umieścić takie elementy jak tytuł strony (
), odwołania do arkuszy stylów CSS, skrypty JavaScript, a także meta tagi, które informują o autorze, opisie czy słowach kluczowych. Zgodnie z standardami W3C, poprawne zdefiniowanie nagłówka jest niezbędne dla prawidłowego działania dokumentu HTML, co ma wpływ na SEO oraz na sposób, w jaki strona jest renderowana. Przykładowo, title jest kluczowym elementem, ponieważ pojawia się na pasku tytułowym przeglądarki oraz w wynikach wyszukiwania, co podkreśla znaczenie sekcji <HEAD> w kontekście organizacji i prezentacji treści. Dlatego znajomość struktury dokumentów HTML oraz poprawnego użycia znaczników jest niezbędna w codziennej pracy web dewelopera. </div> </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 33</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="koncowym-efektem-procesu-dtp-desktop-publishing-85847b95" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Finalnym rezultatem procesu DTP (Desktop Publishing) jest</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded bg-success bg-opacity-10 text-success "> <div class="flex-grow-1"> <span>A. stworzenie pliku PDF lub postscriptowego</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. wydanie animacji</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. wybór odpowiedniej palety kolorów</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. organizacja nagłówków</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-warning mb-0"> <p class="mb-2">Brak odpowiedzi na to pytanie.</p> <div class="mt-2"> <strong>Wyjaśnienie poprawnej odpowiedzi:</strong><br> Końcowym efektem procesu Desktop Publishing (DTP) jest utworzenie pliku PDF lub postscriptowego, co jest kluczowym etapem w produkcji materiałów drukowanych i elektronicznych. PDF (Portable Document Format) to format stworzony przez Adobe, który pozwala na zachowanie układu strony oraz wszystkich elementów graficznych i tekstowych, niezależnie od urządzenia, na którym jest wyświetlany. Przykładowo, osoby przygotowujące dokumenty do druku często korzystają z oprogramowania DTP, aby stworzyć profesjonalne publikacje, które następnie eksportują do formatu PDF. To zapewnia, że każdy wydruk będzie identyczny z wersją elektroniczną, co jest niezwykle istotne w kontekście brandingowym i jakościowym. Podobnie, format PostScript to język opisu strony, który jest szeroko stosowany w profesjonalnym druku. Jego zaletą jest to, że precyzyjnie opisuje, jak ma wyglądać strona, co sprawia, że jest preferowany w drukarniach. Użycie tych formatów w DTP odpowiada na potrzeby zarówno projektantów, jak i drukarzy, gwarantując, że końcowy produkt spełnia wysokie standardy branżowe. </div> </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 34</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktorego-narzedzia-programu-coreldraw-nalezy-uzyc-4ec41acf" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Informacja o ograniczonym dostępie dla pytań premium --> <div class="alert alert-info"> <p class="mb-0"> <i class="fas fa-lock me-2"></i> To pytanie jest dostępne tylko dla zalogowanych użytkowników. <a href="/login/?next=/egzamin/a2398f4e-e91c-4b0b-90df-5cb702acecf1/wyniki/" class="alert-link">Zaloguj się</a> lub <a href="/register/student/" class="alert-link">utwórz konto</a> aby zobaczyć pełną treść pytania. </p> </div> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Ukryte odpowiedzi dla premium pytań --> <div class="text-muted fst-italic"> <p>Odpowiedzi dostępne po zalogowaniu.</p> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Ukryty feedback dla premium pytań --> <div class="text-muted fst-italic"> <p>Wyjaśnienie dostępne po zalogowaniu.</p> </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 35</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="jednostka-okreslajaca-rozdzielczosc-obrazu-rastrow-d50abb2d" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Miara określająca rozdzielczość obrazu rastrowego, który ma być wyświetlany na urządzeniach cyfrowych, to liczba</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. próbek na długość jednego centymetra</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded bg-success bg-opacity-10 text-success "> <div class="flex-grow-1"> <span>B. pikseli na długość jednego cala</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. linii na długość jednego cala</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. punktów na długość jednego centymetra</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-warning mb-0"> <p class="mb-2">Brak odpowiedzi na to pytanie.</p> <div class="mt-2"> <strong>Wyjaśnienie poprawnej odpowiedzi:</strong><br> Poprawna odpowiedź to "pikseli na jednostkę długości jednego cala", ponieważ rozdzielczość obrazu rastrowego określa się w pikselach na cal (PPI - pixels per inch). Ta jednostka wskazuje, ile pikseli mieści się w jednym calu długości, co bezpośrednio wpływa na jakość i szczegółowość wyświetlanego obrazu. Wyższa wartość PPI oznacza bardziej szczegółowy obraz, co jest istotne w zastosowaniach takich jak drukowanie, gdzie wysoka jakość jest kluczowa, czy też w wyświetlaczach urządzeń mobilnych, gdzie detale muszą być wyraźnie widoczne. Dla przykładu, standardowa rozdzielczość ekranów smartfonów to często 300 PPI, co zapewnia wyraźny i ostry obraz. Wartości PPI są również istotne w kontekście projektowania graficznego i w tworzeniu materiałów reklamowych, gdzie konieczne jest dostosowanie rozdzielczości do specyfikacji druku. Rozumienie i prawidłowe zastosowanie tej jednostki jest kluczowe w branży cyfrowej, co podkreślają standardy takie jak ISO 12646, które definiują wymagania dotyczące kolorów i jakości obrazu. </div> </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 36</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="widoczny-na-zdjeciach-efekt-modyfikacji-fragmentow-e82b786e" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Informacja o ograniczonym dostępie dla pytań premium --> <div class="alert alert-info"> <p class="mb-0"> <i class="fas fa-lock me-2"></i> To pytanie jest dostępne tylko dla zalogowanych użytkowników. <a href="/login/?next=/egzamin/a2398f4e-e91c-4b0b-90df-5cb702acecf1/wyniki/" class="alert-link">Zaloguj się</a> lub <a href="/register/student/" class="alert-link">utwórz konto</a> aby zobaczyć pełną treść pytania. </p> </div> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Ukryte odpowiedzi dla premium pytań --> <div class="text-muted fst-italic"> <p>Odpowiedzi dostępne po zalogowaniu.</p> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Ukryty feedback dla premium pytań --> <div class="text-muted fst-italic"> <p>Wyjaśnienie dostępne po zalogowaniu.</p> </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 37</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="zgodnie-z-zasadami-typografii-internetowej-w-jedne-0fc63400" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Według zasad typografii w sieci, maksymalna liczba znaków w jednej linii tekstu wynosi</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. 95 znaków</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. 25 znaków</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded bg-success bg-opacity-10 text-success "> <div class="flex-grow-1"> <span>C. 50 znaków</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. 37 znaków</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-warning mb-0"> <p class="mb-2">Brak odpowiedzi na to pytanie.</p> <div class="mt-2"> <strong>Wyjaśnienie poprawnej odpowiedzi:</strong><br> Odpowiedź 50 znaków jest zgodna z zaleceniami typografii internetowej, które sugerują, że optymalna długość linii tekstu powinna wynosić od 50 do 75 znaków. Długość 50 znaków jest szczególnie efektywna, ponieważ wspomaga czytelność i ułatwia skanowanie tekstu przez użytkowników. W praktyce oznacza to, że na stronach internetowych, które stosują tę zasadę, użytkownicy mogą łatwiej przyswajać informacje, co ma pozytywny wpływ na ich doświadczenie. Dobrą praktyką jest także zastosowanie odpowiedniego odstępu między liniami oraz marginesów, co dodatkowo poprawia estetykę i ułatwia czytanie. Warto również zauważyć, że w kontekście urządzeń mobilnych, gdzie przestrzeń jest ograniczona, dąży się do zachowania podobnych zasad, jednak z uwzględnieniem ich specyfiki. Wspierając czytelność, możemy również zwiększyć czas spędzony na stronie oraz zmniejszyć wskaźniki odrzuceń, co jest korzystne z perspektywy SEO. </div> </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 38</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="tworzac-prezentacje-multimedialna-dla-mediow-cyfro-fe046d21" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Przygotowując multimedialną prezentację na potrzeby mediów cyfrowych, warto pamiętać o</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. dodaniu efektów specjalnych</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. umieszczeniu dużej ilości tekstu</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. użyciu wielu kolorów</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded bg-success bg-opacity-10 text-success "> <div class="flex-grow-1"> <span>D. wyborze prostej czcionki, bez ozdobnych elementów</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-warning mb-0"> <p class="mb-2">Brak odpowiedzi na to pytanie.</p> <div class="mt-2"> <strong>Wyjaśnienie poprawnej odpowiedzi:</strong><br> Wybór prostej czcionki, pozbawionej ozdobników, jest kluczowy dla zachowania czytelności treści w prezentacjach multimedialnych. Prosta czcionka, taka jak Arial czy Helvetica, jest łatwiejsza do odczytania, co jest niezwykle istotne, zwłaszcza w warunkach prezentacji, gdzie audytorium może nie mieć możliwości zbliżenia się do ekranu. Badania wykazują, że czcionki bezszeryfowe są bardziej czytelne na ekranach elektronicznych, co czyni je preferowanym wyborem w kontekście mediów cyfrowych. Oprócz tego, stosowanie prostych czcionek ułatwia skupienie uwagi widza na treści merytorycznej, a nie na ozdobnych elementach. W praktyce, projektując prezentację, warto upewnić się, że rozmiar czcionki jest wystarczający (minimum 24 punkty), aby tekst był widoczny z daleka. Ponadto, należy brać pod uwagę kontrast kolorystyczny między tłem a tekstem, aby zapewnić maksymalną czytelność. Dobre praktyki wskazują również na unikanie zbyt dużej ilości tekstu na slajdach, co również poprawia odbiór informacji. </div> </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 39</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="jaki-atrybut-znacznika-ltimggt-nalezy-podac-a-3d71b400" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Który atrybut znacznika <img> powinien być użyty, aby włączyć grafikę do strony WWW w sposób spełniający wytyczne WCAG dotyczące użyteczności oraz dostępności serwisów internetowych?</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. id</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. name</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded bg-success bg-opacity-10 text-success "> <div class="flex-grow-1"> <span>C. alt</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. target</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-warning mb-0"> <p class="mb-2">Brak odpowiedzi na to pytanie.</p> <div class="mt-2"> <strong>Wyjaśnienie poprawnej odpowiedzi:</strong><br> Atrybut 'alt' (alternatywny tekst) znacznika <img> jest kluczowy dla zapewnienia dostępności treści wizualnych w Internecie. Zgodnie z wytycznymi WCAG (Web Content Accessibility Guidelines), każdy obraz umieszczony na stronie WWW powinien mieć przypisany atrybut 'alt', który opisuje jego zawartość lub funkcję. Dzięki temu użytkownicy korzystający z czytników ekranu mogą zrozumieć kontekst grafik, co jest niezbędne dla osób z dysfunkcją wzroku. Przykładowo, jeśli na stronie znajduje się zdjęcie jabłka, atrybut alt powinien zawierać opis, taki jak 'czerwone jabłko na białym tle'. W przypadku, gdy obraz jest czysto dekoracyjny, atrybut alt powinien być pusty (alt=""), co informuje technologie asystujące, że obraz nie niesie ze sobą żadnej istotnej informacji. Użycie atrybutu 'alt' jest nie tylko zgodne z wymaganiami prawnymi, ale również przyczynia się do lepszej jakości doświadczeń użytkowników oraz poprawy SEO, ponieważ wyszukiwarki mogą lepiej zrozumieć treści wizualne. </div> </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 40</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="na-ktorej-ilustracji-zastosowano-wypenienie-gradi-4d4d527c" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Informacja o ograniczonym dostępie dla pytań premium --> <div class="alert alert-info"> <p class="mb-0"> <i class="fas fa-lock me-2"></i> To pytanie jest dostępne tylko dla zalogowanych użytkowników. <a href="/login/?next=/egzamin/a2398f4e-e91c-4b0b-90df-5cb702acecf1/wyniki/" class="alert-link">Zaloguj się</a> lub <a href="/register/student/" class="alert-link">utwórz konto</a> aby zobaczyć pełną treść pytania. </p> </div> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Ukryte odpowiedzi dla premium pytań --> <div class="text-muted fst-italic"> <p>Odpowiedzi dostępne po zalogowaniu.</p> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Ukryty feedback dla premium pytań --> <div class="text-muted fst-italic"> <p>Wyjaśnienie dostępne po zalogowaniu.</p> </div> </div> </article> <!-- Przyciski nawigacyjne --> <div class="d-grid gap-2 mt-4"> <div class="d-inline-block mb-2"> <a href="/egzamin/?profession=technik-fotografii-i-multimediow&qualification=aud-05" class="btn btn-outline-primary"> <i class="fas fa-redo me-2"></i>Rozpocznij nowy egzamin </a> </div> <div class="d-inline-block"> <a href="/" class="btn btn-outline-secondary"> <i class="fas fa-home me-2"></i>Powrót do strony głównej </a> </div> </div> </div> </div> </div> </main> <!-- Footer --> <footer class="footer mt-auto py-4"> <div class="container"> <div class="row"> <!-- About Section --> <div class="col-lg-4 footer-section"> <h2 class="h5">O Egzaminach Zawodowych</h2> <p> Portal z kompleksową bazą pytań egzaminacyjnych dla uczniów szkół technicznych. Przygotuj się do egzaminu zawodowego z naszymi materiałami. </p> </div> <!-- Popular Qualifications --> <div class="col-lg-4 footer-section"> <h2 class="h5">Losowe kwalifikacje</h2> <div class="row"> <div class="col-6"> <a href="/technik-archiwista/EKA.02/" class="footer-link"> <span>EKA.02</span> <small class="text-muted">(514)</small> </a> </div> <div class="col-6"> <a href="/technik-fotografii-i-multimediow/AUD.05/" class="footer-link"> <span>AUD.05</span> <small class="text-muted">(758)</small> </a> </div> <div class="col-6"> <a href="/zlotnik-jubiler/MEP.05/" class="footer-link"> <span>MEP.05</span> <small class="text-muted">(155)</small> </a> </div> <div class="col-6"> <a href="/pracownik-pomocniczy-obsugi-hotelowej/HGT.05/" class="footer-link"> <span>HGT.05</span> <small class="text-muted">(160)</small> </a> </div> <div class="col-6"> <a href="/technik-rolnik/ROL.10/" class="footer-link"> <span>ROL.10</span> <small class="text-muted">(578)</small> </a> </div> <div class="col-6"> <a href="/technik-budowy-jednostek-pywajacych/TWO.03/" class="footer-link"> <span>TWO.03</span> <small class="text-muted">(146)</small> </a> </div> <div class="col-6"> <a href="/technik-hotelarstwa/HGT.03/" class="footer-link"> <span>HGT.03</span> <small class="text-muted">(579)</small> </a> </div> <div class="col-6"> <a href="/tapicer/DRM.05/" class="footer-link"> <span>DRM.05</span> <small class="text-muted">(328)</small> </a> </div> <div class="col-6"> <a href="/technik-architektury-krajobrazu/OGR.04/" class="footer-link"> <span>OGR.04</span> <small class="text-muted">(294)</small> </a> </div> <div class="col-6"> <a href="/technik-teleinformatyk/INF.07/" class="footer-link"> <span>INF.07</span> <small class="text-muted">(335)</small> </a> </div> </div> </div> <!-- Additional Info --> <div class="col-lg-4 footer-section"> <h2 class="h5">O portalu</h2> <p> Baza pytań do egzaminów zawodowych dla uczniów szkół technicznych i branżowych. Materiały zgodne z wymaganiami CKE. </p> </div> </div> <!-- Copyright & Links --> <hr class="footer-divider"> <div class="row align-items-center"> <div class="col-md-8 text-center text-md-start"> <p class="mb-0">© 2025 <a href="https://brylka.net" class="footer-link" aria-label="brylka.net">brylka.net</a> | <a href="/about-me/" class="footer-link" aria-label="O mnie i zawodowe.edu.pl">Bartosz Bryniarski</a></p> </div> <div class="col-md-4 text-center text-md-end"> <!-- <a href="/sitemap.xml" class="footer-link" aria-label="Mapa strony"> <i class="fas fa-sitemap" aria-hidden="true"></i> <span>Mapa strony</span> </a> --> </div> </div> </div> </footer> <!-- Back to top button --> <button id="backToTop" class="btn btn-outline-primary back-to-top" aria-label="Przewiń do góry strony" style="display: none;"> <i class="fas fa-arrow-up" aria-hidden="true"></i> </button> <!-- Cookie Banner --> <div id="cookieConsent" class="position-fixed start-0 bottom-0 py-3 shadow rounded-end" style="display: none; z-index: 1050; max-width: 50%; background-color: rgba(248, 249, 250, 0.95);"> <div class="container-fluid px-4"> <div class="d-flex flex-column gap-2"> <div> <i class="fas fa-cookie-bite me-2 text-secondary" aria-hidden="true"></i> <span class="small"> Strona wykorzystuje pliki cookies do poprawy doświadczenia użytkownika oraz analizy ruchu. <a href="#" class="footer-link" id="cookieDetails" data-bs-toggle="modal" data-bs-target="#cookieModal"> Szczegóły </a> </span> </div> <div class="d-flex gap-2 justify-content-end"> <button id="cookieAccept" class="btn btn-outline-primary btn-sm">Akceptuję</button> <button id="cookieReject" class="btn btn-outline-secondary btn-sm">Odrzuć</button> </div> </div> </div> </div> <!-- Modal z informacjami o cookies --> <div class="modal fade" id="cookieModal" tabindex="-1" aria-labelledby="cookieModalLabel" aria-hidden="true"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-header"> <h2 class="modal-title fs-5" id="cookieModalLabel">Polityka plików cookies</h2> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button> </div> <div class="modal-body"> <h6 class="fw-bold">Czym są pliki cookies?</h6> <p> Cookies to małe pliki tekstowe, które są zapisywane na urządzeniu użytkownika podczas przeglądania stron internetowych. Służą one do zapamiętywania preferencji, śledzenia zachowań użytkowników oraz poprawy funkcjonalności serwisu. </p> <h6 class="fw-bold mt-4">Jakie cookies wykorzystujemy?</h6> <ul class="list-unstyled ps-3"> <li><i class="fas fa-check-circle text-success me-2"></i><strong>Niezbędne cookies</strong> - konieczne do prawidłowego działania strony</li> <li><i class="fas fa-check-circle text-success me-2"></i><strong>Funkcjonalne cookies</strong> - umożliwiające zapamiętanie wybranych ustawień (np. wybrany motyw)</li> <li><i class="fas fa-check-circle text-success me-2"></i><strong>Analityczne cookies</strong> - pozwalające zbierać informacje o sposobie korzystania ze strony</li> </ul> <h6 class="fw-bold mt-4">Jak długo przechowujemy cookies?</h6> <p> Pliki cookies wykorzystywane w naszym serwisie mogą być sesyjne (usuwane po zamknięciu przeglądarki) lub stałe (pozostają na urządzeniu przez określony czas). </p> <h6 class="fw-bold mt-4">Jak zarządzać cookies?</h6> <p> Możesz zarządzać ustawieniami plików cookies w swojej przeglądarce internetowej. Większość przeglądarek domyślnie dopuszcza przechowywanie plików cookies, ale możliwe jest również całkowite zablokowanie tych plików lub usunięcie wybranych z nich. </p> </div> <div class="modal-footer"> <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Zamknij</button> <button type="button" class="btn btn-outline-primary" id="acceptCookiesModal">Akceptuję wszystkie</button> </div> </div> </div> </div> <!-- JavaScript --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" defer></script> <script src="/static/exams/js/code.js" defer></script> <script src="/static/exams/js/report_modal.js" defer></script> <script> document.addEventListener('DOMContentLoaded', function() { // Dodaj obsługę motywów dla banera cookie function updateCookieBannerTheme() { const cookieBanner = document.getElementById('cookieConsent'); const currentTheme = document.body.getAttribute('data-theme'); if (!cookieBanner) return; // Ustaw domyślny jasny styl cookieBanner.style.backgroundColor = 'rgba(248, 249, 250, 0.95)'; cookieBanner.style.color = '#212529'; cookieBanner.classList.remove('border-top', 'border-white'); // Zastosuj style zgodnie z motywem if (currentTheme === 'dark') { cookieBanner.style.backgroundColor = 'rgba(52, 58, 64, 0.95)'; cookieBanner.style.color = '#fff'; } else if (currentTheme === 'high-contrast') { cookieBanner.style.backgroundColor = '#000'; cookieBanner.style.color = '#fff'; cookieBanner.classList.add('border-top', 'border-white'); } } // Sprawdź, czy użytkownik już dokonał wyboru if (!localStorage.getItem('cookieConsent')) { // Jeśli nie, pokaż banner const cookieBanner = document.getElementById('cookieConsent'); if (cookieBanner) { cookieBanner.style.display = 'block'; updateCookieBannerTheme(); // Dostosuj szerokość na małych ekranach function adjustWidth() { if (window.innerWidth < 768) { cookieBanner.style.maxWidth = '100%'; } else { cookieBanner.style.maxWidth = '50%'; } } // Wywołaj przy ładowaniu i przy zmianie rozmiaru okna adjustWidth(); window.addEventListener('resize', adjustWidth); } } // Obsługa zmiany motywu const themeButtons = document.querySelectorAll('.theme-btn'); themeButtons.forEach(btn => { btn.addEventListener('click', function() { setTimeout(updateCookieBannerTheme, 50); }); }); // Obsługa przycisku akceptacji document.getElementById('cookieAccept')?.addEventListener('click', function() { localStorage.setItem('cookieConsent', 'accepted'); document.getElementById('cookieConsent').style.display = 'none'; }); // Obsługa przycisku odrzucenia document.getElementById('cookieReject')?.addEventListener('click', function() { localStorage.setItem('cookieConsent', 'rejected'); document.getElementById('cookieConsent').style.display = 'none'; }); // Obsługa przycisku akceptacji w modalu document.getElementById('acceptCookiesModal')?.addEventListener('click', function() { localStorage.setItem('cookieConsent', 'accepted'); document.getElementById('cookieConsent').style.display = 'none'; // Zamknij modal var cookieModal = bootstrap.Modal.getInstance(document.getElementById('cookieModal')); cookieModal?.hide(); }); }); </script> <!-- Toast messages initialization --> <script> document.addEventListener('DOMContentLoaded', function() { const copyButton = document.getElementById('copy-link-button'); if (copyButton) { copyButton.addEventListener('click', function() { const input = document.getElementById('share-link-input'); input.select(); document.execCommand('copy'); // Zmień tekst przycisku na potwierdzenie const originalText = this.innerHTML; this.innerHTML = '<i class="fas fa-check me-1"></i> Skopiowano!'; // Przywróć oryginalny tekst po 2 sekundach setTimeout(() => { this.innerHTML = originalText; }, 2000); }); } }); </script> </body> </html>