Tworzenie strony HTML krok po kroku

Tworzenie strony HTML krok po kroku to umiejętność, którą każdy może opanować. HTML, czyli HyperText Markup Language, to fundament każdej strony internetowej. Dzięki niemu możemy strukturalnie zorganizować treści, takie jak teksty, obrazy czy multimedia, w sposób, który jest zrozumiały dla przeglądarek internetowych.

Warto zauważyć, że według danych z 2023 roku, aż 90% stron internetowych korzysta z HTML jako podstawowego języka opisu treści. Umiejętność ta otwiera drzwi do świata programowania i web developmentu. W dzisiejszych czasach, kiedy obecność w sieci jest kluczowa dla rozwoju biznesu, znajomość HTML staje się nieocenionym atutem.

Wprowadzenie do tworzenia strony HTML krok po kroku

W dalszej części artykułu przyjrzymy się szczegółowo, jak przygotować środowisko do tworzenia strony HTML krok po kroku. Dowiesz się, jakie narzędzia i edytory kodu są najczęściej wykorzystywane przez programistów oraz jak skonfigurować lokalne środowisko testowe.

Następnie omówimy podstawową strukturę dokumentu HTML, co pozwoli Ci zrozumieć, jak różne elementy współdziałają ze sobą, aby stworzyć funkcjonalną stronę. Nie zabraknie również informacji na temat stylizacji oraz dodawania interaktywności do stron.

Przygotowanie środowiska do tworzenia strony HTML krok po kroku

Przygotowanie odpowiedniego środowiska do tworzenia strony HTML krok po kroku jest kluczowym elementem, który znacząco wpływa na komfort pracy oraz efektywność w nauce. Aby rozpocząć, potrzebujesz edytora kodu, który pozwoli Ci na pisanie i edytowanie plików HTML.

Dwa z najpopularniejszych edytorów to Visual Studio Code oraz Notepad++. Oba oferują różne funkcje, które mogą ułatwić proces tworzenia strony HTML krok po kroku.

Visual Studio Code to zaawansowany edytor, który wspiera wiele języków programowania, w tym HTML. Oferuje szereg rozszerzeń, które pozwalają na automatyczne uzupełnianie kodu, podpowiedzi oraz integrację z systemami kontroli wersji.

Aby zainstalować Visual Studio Code, wystarczy pobrać go z oficjalnej strony i przejść przez prosty proces instalacji. Z kolei Notepad++ to lżejsza alternatywa, idealna dla osób, które preferują prostotę. Jego instalacja jest również szybka i intuicyjna, a interfejs użytkownika jest przyjazny dla początkujących.

Po zainstalowaniu edytora, warto skonfigurować lokalne środowisko testowe. Można to zrobić, tworząc folder na swoim komputerze, w którym będziesz przechowywać wszystkie pliki projektu. Zaleca się, aby każdy projekt miał swoją osobną lokalizację, co ułatwi organizację i zarządzanie plikami.

W folderze projektu stwórz nowy plik o rozszerzeniu .html, na przykład index.html, który będzie głównym dokumentem Twojej strony. Warto również pomyśleć o korzystaniu z przeglądarki internetowej, która umożliwia podgląd Twojej strony na żywo.

Większość współczesnych przeglądarek, takich jak Google Chrome czy Firefox, oferuje narzędzia dla programistów, które pozwalają na debugowanie i testowanie kodu. Dzięki tym narzędziom możesz na bieżąco sprawdzać, jak zmiany wprowadzone w kodzie wpływają na wygląd strony.

To podejście jest szczególnie przydatne w procesie tworzenia strony HTML krok po kroku, ponieważ pozwala na szybkie wprowadzanie poprawek i eksperymentowanie z różnymi rozwiązaniami.

Podsumowując, przygotowanie środowiska do tworzenia strony HTML krok po kroku obejmuje wybór odpowiedniego edytora kodu, organizację plików oraz korzystanie z narzędzi do testowania. Dzięki temu możesz skupić się na nauce i rozwijaniu swoich umiejętności w tworzeniu stron internetowych.

Tworzenie strony HTML krok po kroku - 1

Podstawowa struktura strony HTML krok po kroku

Tworzenie strony HTML krok po kroku zaczyna się od zrozumienia podstawowej struktury dokumentu HTML. Każda strona internetowa jest zbudowana z kilku kluczowych elementów, które współdziałają ze sobą, aby stworzyć funkcjonalną i estetyczną witrynę.

Na początku warto zwrócić uwagę na znaczniki, które są fundamentem każdego dokumentu HTML. Bez nich, nie bylibyśmy w stanie zbudować żadnej strony. Podstawowa struktura dokumentu HTML składa się z czterech głównych sekcji: ``, ``, `` oraz `<body>`.</p> <p></p> <p>Znacznik `<html>` jest kontenerem dla całej zawartości strony i informuje przeglądarkę, że mamy do czynienia z dokumentem HTML. Wewnątrz tego znacznika znajdują się dwa kluczowe elementy: `<head>` oraz `<body>`.</p> <p></p> <p>Sekcja `<head>` zawiera metadane, które nie są bezpośrednio widoczne dla użytkownika, ale są niezwykle istotne dla przeglądarek i wyszukiwarek. To tutaj umieszczamy tytuł strony, który jest wyświetlany na karcie przeglądarki, a także linki do stylów CSS czy skryptów JavaScript.</p> <p></p> <p>Warto również zaznaczyć, że znacznik `<title>` jest jednym z najważniejszych elementów w sekcji `<head>`. To on definiuje tytuł strony, który pojawia się w wynikach wyszukiwania oraz na pasku tytułowym przeglądarki.</p> <p></p> <p>Dobrze dobrany tytuł nie tylko przyciąga uwagę użytkowników, ale również wpływa na SEO, co może zwiększyć widoczność naszej strony w Internecie. Po sekcji `<head>` następuje sekcja `<body>`, która jest miejscem, gdzie umieszczamy całą widoczną zawartość naszej strony, taką jak tekst, obrazy, linki czy formularze.</p> <p></p> <p>To tutaj odbywa się „akcja”, a użytkownicy mogą wchodzić w interakcje z naszą stroną. Warto pamiętać, że struktura HTML jest hierarchiczna, co oznacza, że elementy mogą być zagnieżdżane w innych elementach, co pozwala na tworzenie bardziej złożonych układów.</p> <p></p> <p>Podsumowując, <strong>tworzenie strony HTML krok po kroku</strong> zaczyna się od zrozumienia i zbudowania podstawowej struktury dokumentu. Znajomość znaczenia każdego z elementów jest kluczowa, aby móc tworzyć funkcjonalne i estetyczne strony internetowe.</p> <p></p> <h2><span class="ez-toc-section" id="Style_i_formatowanie_w_tworzeniu_strony_HTML_krok_po_kroku"></span><strong>Style i formatowanie w tworzeniu strony HTML krok po kroku</strong><span class="ez-toc-section-end"></span></h2> <p>W procesie <strong>tworzenia strony HTML krok po kroku</strong> niezwykle istotnym elementem jest stylizacja, która pozwala nadać stronie atrakcyjny wygląd oraz poprawić doświadczenia użytkowników. W tym celu najczęściej korzystamy z CSS, czyli kaskadowych arkuszy stylów.</p> <p></p> <p>CSS umożliwia nam kontrolowanie wyglądu elementów HTML, takich jak kolory, czcionki, marginesy czy rozmieszczenie elementów na stronie. Warto zrozumieć różnice między stylami inline, wewnętrznymi i zewnętrznymi, aby efektywnie wykorzystać możliwości, jakie oferuje CSS.</p> <p></p> <p>Style inline to najprostsza forma stylizacji, którą możemy zastosować bezpośrednio w znaczniku HTML. Przykładowo, jeśli chcemy zmienić kolor tekstu w elemencie <code><p></code>, możemy to zrobić, dodając atrybut <code>style</code>: <code><p style="color: red;">To jest czerwony tekst.</p></code>.</p> <p></p> <p>Choć jest to szybkie rozwiązanie, nie jest zalecane dla większych projektów, ponieważ utrudnia zarządzanie stylem w dłuższej perspektywie. Styl wewnętrzny, z kolei, umieszczamy w sekcji <code><head></code> naszego dokumentu HTML, co pozwala na grupowanie stylów dla całej strony.</p> <p></p> <p>Możemy to zrobić za pomocą znacznika <code><style></code>. Przykład: <code><style> p { color: blue; } </style></code>. Dzięki temu wszystkie akapity na stronie będą miały niebieski kolor, co ułatwia edytowanie i zarządzanie stylami.</p> <p></p> <p>Warto zaznaczyć, że style wewnętrzne są bardziej efektywne niż inline, ale wciąż mogą być mniej praktyczne w przypadku większych witryn. Najbardziej zalecaną metodą stylizacji jest użycie zewnętrznych arkuszy stylów.</p> <p></p> <p>Tworzymy plik CSS, który następnie łączymy z naszą stroną HTML za pomocą znacznika <code><link></code> w sekcji <code><head></code>: <code><link rel="stylesheet" href="styles.css"></code>.</p> <p></p> <p>Taki sposób nie tylko ułatwia zarządzanie stylem, ale także pozwala na ponowne wykorzystanie tych samych stylów na różnych stronach. To szczególnie ważne w przypadku większych projektów, gdzie spójność wizualna jest kluczowa.</p> <p></p> <p>Warto również wspomnieć o możliwościach, jakie daje CSS w kontekście responsywności. Używając mediów, możemy dostosować wygląd strony do różnych urządzeń, co jest niezbędne w dzisiejszym świecie, gdzie dostęp do internetu odbywa się głównie przez smartfony i tablety.</p> <p></p> <p>Dzięki temu, <strong>tworzenie strony HTML krok po kroku</strong> staje się nie tylko prostsze, ale i bardziej efektywne, pozwalając na tworzenie estetycznych i funkcjonalnych witryn.</p> <p></p> <figure class="wp-block-image size-large"><img decoding="async" loading="lazy" src="https://pineapple-media.pl/wp-content/uploads/2026/01/86163.avif" alt="Tworzenie strony HTML krok po kroku - 2"></figure> <h2><span class="ez-toc-section" id="Interaktywnosc_w_tworzeniu_strony_HTML_krok_po_kroku"></span><strong>Interaktywność w tworzeniu strony HTML krok po kroku</strong><span class="ez-toc-section-end"></span></h2> <p>Dodawanie interaktywności do strony HTML to kluczowy krok, który może znacznie poprawić doświadczenie użytkownika. W tej sekcji omówimy, jak w prosty sposób wykorzystać JavaScript, aby wzbogacić naszą stronę o różnorodne funkcje.</p> <p></p> <p>Dzięki temu, <strong>tworzenie strony HTML krok po kroku</strong> stanie się nie tylko technicznym wyzwaniem, ale również kreatywną przygodą. JavaScript to język programowania, który pozwala na dynamiczne zmiany w treści i stylach strony.</p> <p></p> <p>Dzięki niemu możemy reagować na działania użytkowników, takie jak kliknięcia przycisków czy wprowadzenie danych w formularzach. Na przykład, jeśli dodamy przycisk „Kliknij mnie”, możemy napisać prosty skrypt, który po naciśnięciu zmieni tekst na stronie lub wyświetli komunikat powitalny.</p> <p></p> <pre><code> <button id="myButton">Kliknij mnie</button> <p id="demo"></p> <script> document.getElementById("myButton").onclick = function() { document.getElementById("demo").innerHTML = "Witaj na mojej stronie!"; }; </script> </code></pre> <p></p> <p>W powyższym przykładzie, użyliśmy zdarzenia `onclick`, aby zareagować na kliknięcie przycisku. To bardzo prosty sposób na wprowadzenie interaktywności, który można łatwo rozbudować o bardziej zaawansowane funkcje.</p> <p></p> <p>Warto również zwrócić uwagę na to, że według badań, strony internetowe z interaktywnymi elementami mogą zwiększyć czas spędzany przez użytkowników na stronie nawet o 50%!</p> <p></p> <p>Interaktywność nie ogranicza się tylko do przycisków. Możemy również wykorzystać formularze, które pozwalają użytkownikom na wprowadzanie danych, takich jak imię czy adres e-mail.</p> <p></p> <p>Dzięki JavaScript możemy walidować te dane przed ich wysłaniem, co zwiększa komfort korzystania z naszej strony. Na przykład, możemy sprawdzić, czy wszystkie wymagane pola zostały wypełnione, zanim użytkownik kliknie przycisk „Wyślij”.</p> <p></p> <p>W miarę jak rozwijamy nasze umiejętności w zakresie <strong>tworzenia strony HTML krok po kroku</strong>, warto również eksplorować biblioteki JavaScript, takie jak jQuery, które znacznie ułatwiają manipulację elementami DOM i obsługę zdarzeń.</p> <p></p> <p>Dzięki nim możemy tworzyć bardziej złożone interakcje, które przyciągną uwagę użytkowników i sprawią, że nasza strona będzie bardziej atrakcyjna. Warto więc poświęcić czas na naukę tych narzędzi, aby w pełni wykorzystać potencjał interaktywności w projektowaniu stron internetowych.</p> <p></p> <h2><span class="ez-toc-section" id="Testowanie_i_publikacja_strony_HTML_krok_po_kroku"></span><strong>Testowanie i publikacja strony HTML krok po kroku</strong><span class="ez-toc-section-end"></span></h2> <p>Po zakończeniu procesu <strong>tworzenia strony HTML krok po kroku</strong>, nadszedł czas na testowanie i publikację. Testowanie jest kluczowym etapem, który pozwala upewnić się, że nasza strona działa poprawnie i jest wolna od błędów.</p> <p></p> <p>Warto zacząć od sprawdzenia, jak strona wygląda w różnych przeglądarkach, takich jak Chrome, Firefox, Safari czy Edge. Każda z nich może interpretować kod HTML nieco inaczej, dlatego testowanie na różnych platformach pomoże zidentyfikować potencjalne problemy.</p> <p></p> <p>Nie mniej istotne jest przeprowadzenie testów na różnych urządzeniach – zarówno komputerach stacjonarnych, jak i tabletach czy smartfonach. W dzisiejszych czasach, gdy coraz więcej użytkowników korzysta z internetu na urządzeniach mobilnych, responsywność strony staje się kluczowa.</p> <p></p> <p>Można skorzystać z narzędzi takich jak Google Mobile-Friendly Test, które pomogą ocenić, czy strona jest przyjazna dla użytkowników mobilnych. Po przeprowadzeniu testów i wprowadzeniu ewentualnych poprawek, czas na publikację strony.</p> <p></p> <p>Istnieje wiele metod hostingu, które można wykorzystać do umieszczenia strony w internecie. Najpopularniejsze to hosting współdzielony, VPS (Virtual Private Server) oraz hosting w chmurze.</p> <p></p> <p>Dla początkujących twórców stron, hosting współdzielony może być najlepszym rozwiązaniem ze względu na niskie koszty i łatwość obsługi. Przykłady takich usług to Bluehost, SiteGround czy OVH.</p> <p></p> <p>Warto również rozważyć korzystanie z platform do publikacji, takich jak GitHub Pages, które umożliwiają darmowe hostowanie statycznych stron HTML.</p> <p></p> <p>To idealne rozwiązanie dla osób, które dopiero zaczynają swoją przygodę z <strong>tworzeniem stron HTML krok po kroku</strong> i chcą szybko zobaczyć efekty swojej pracy w internecie.</p> <p></p> <p>Na zakończenie, nie zapominajmy o regularnym aktualizowaniu i monitorowaniu naszej strony po jej publikacji. Użycie narzędzi analitycznych, takich jak Google Analytics, pozwoli nam śledzić ruch na stronie oraz zrozumieć, jakie elementy wymagają dalszej optymalizacji.</p> <p></p> <p>Dzięki tym krokom, możemy być pewni, że nasza strona nie tylko jest dobrze zaprojektowana, ale również efektywnie działa w sieci.</p> <p></p> <h2><span class="ez-toc-section" id="Najczesciej_zadawane_pytania_o_tworzenie_strony_HTML_krok_po_kroku"></span><strong>Najczęściej zadawane pytania o tworzenie strony HTML krok po kroku</strong><span class="ez-toc-section-end"></span></h2> <ul> <li> <p><strong>Co to jest HTML i dlaczego jest ważny w <strong>tworzeniu stron internetowych</strong>?</strong></p> <p>HTML, czyli HyperText Markup Language, to podstawowy język znaczników używany do <strong>tworzenia stron internetowych</strong>. Dzięki HTML strukturyzujemy treść, dodajemy nagłówki, akapity i inne elementy, co jest kluczowe dla wyświetlania strony w przeglądarkach.</p> </li> <li> <p><strong>Jakie są podstawowe elementy, które powinny znaleźć się w każdej stronie HTML?</strong></p> <p>Podstawowe elementy to doctype, elementy <html>, <head>, <title> oraz <body>. Dzięki nim strona ma odpowiednią strukturę i może być poprawnie interpretowana przez przeglądarki.</p> </li> <li> <p><strong>Jakie są zalety używania HTML w <strong>tworzeniu stron internetowych</strong>?</strong></p> <p>HTML jest łatwy do nauki i pozwala na szybkie <strong>tworzenie prostych stron</strong>. Ponadto, jest to standardowy język w sieci, co zapewnia szeroką zgodność z różnymi przeglądarkami.</p> </li> <li> <p><strong>Jakie są najczęstsze błędy podczas pisania kodu HTML i jak ich unikać?</strong></p> <p>Typowe błędy to brak zamknięcia znaczników oraz niepoprawne zagnieżdżanie elementów. Dobrą praktyką jest korzystanie z narzędzi do walidacji HTML, które pomogą zidentyfikować i poprawić błędy.</p> </li> <li> <p><strong>Czy mogę <strong>tworzyć strony HTML</strong> bez znajomości programowania?</strong></p> <p>Tak, wiele edytorów wizualnych pozwala na <strong>tworzenie stron HTML</strong> bez potrzeby znajomości kodu. Dzięki nim możesz skupić się na treści i układzie strony, a programowanie zostanie zautomatyzowane.</p> </li> <li> <p><strong>Jak HTML porównuje się do innych języków programowania w <strong>tworzeniu stron internetowych</strong>?</strong></p> <p>HTML jest językiem znaczników, podczas gdy inne języki, jak CSS i JavaScript, są używane do stylizacji i dodawania interaktywności. Wspólnie te języki tworzą pełnoprawne doświadczenie webowe.</p> </li> <li> <p><strong>Jakie są kroki do stworzenia prostej strony HTML od podstaw?</strong></p> <p>Pierwszym krokiem jest stworzenie pliku HTML i dodanie podstawowej struktury. Następnie możesz dodawać treść, obrazy oraz linki, a na końcu przetestować stronę w przeglądarce.</p> </li> </ul> <div class="post-views content-post post-557 entry-meta load-static"> <span class="post-views-icon dashicons dashicons-chart-bar"></span> <span class="post-views-label">Post Views:</span> <span class="post-views-count">85</span> </div><div class="crp_related crp-rounded-thumbs"><h2>Related Posts:</h2><ul><li><a href="https://pineapple-media.pl/tworzenie-strony-html-w-notatniku-krok-po-kroku-do-samodzielnej-witryny/" class="crp_link post-445"><figure><img width="150" height="150" src="https://pineapple-media.pl/wp-content/uploads/2026/01/1516-150x150.avif" class="crp_featured crp_thumb crp_thumbnail" alt="1516" style="" title="Tworzenie strony HTML w notatniku: Krok po kroku do samodzielnej witryny" /></figure><span class="crp_title">Tworzenie strony HTML w notatniku: Krok po kroku do…</span></a></li><li><a href="https://pineapple-media.pl/tworzenie-strony-internetowej-html-klasa-8-przewodnik-krok-po-kroku/" class="crp_link post-422"><figure><img width="150" height="150" src="https://pineapple-media.pl/wp-content/uploads/2026/01/167070-150x150.avif" class="crp_featured crp_thumb crp_thumbnail" alt="167070" style="" title="Tworzenie strony internetowej HTML klasa 8 – Przewodnik krok po kroku" /></figure><span class="crp_title">Tworzenie strony internetowej HTML klasa 8 –…</span></a></li><li><a href="https://pineapple-media.pl/tworzenie-stron-www-praca-jak-zaczac-kariere-w-branzy-web-developmentu/" class="crp_link post-551"><figure><img width="150" height="150" src="https://pineapple-media.pl/wp-content/uploads/2026/01/14244-150x150.avif" class="crp_featured crp_thumb crp_thumbnail" alt="14244" style="" title="Tworzenie stron www praca: Jak zacząć karierę w branży web developmentu" /></figure><span class="crp_title">Tworzenie stron www praca: Jak zacząć karierę w…</span></a></li><li><a href="https://pineapple-media.pl/jezyki-programowania-do-tworzenia-stron-internetowych-przewodnik-po-najlepszych-rozwiazaniach/" class="crp_link post-983"><figure><img width="150" height="150" src="https://pineapple-media.pl/wp-content/uploads/2026/01/14244-150x150.avif" class="crp_featured crp_thumb crp_thumbnail" alt="14244" style="" title="Języki programowania do tworzenia stron internetowych – Przewodnik po najlepszych rozwiązaniach" /></figure><span class="crp_title">Języki programowania do tworzenia stron…</span></a></li><li><a href="https://pineapple-media.pl/tworzenie-stron-internetowych-w-jezyku-html-kompendium-wiedzy/" class="crp_link post-924"><figure><img width="150" height="150" src="https://pineapple-media.pl/wp-content/uploads/2026/01/1516-150x150.avif" class="crp_featured crp_thumb crp_thumbnail" alt="1516" style="" title="Tworzenie stron internetowych w języku HTML - Kompendium wiedzy" /></figure><span class="crp_title">Tworzenie stron internetowych w języku HTML -…</span></a></li><li><a href="https://pineapple-media.pl/jak-sie-tworzy-strony-internetowe-przewodnik-krok-po-kroku/" class="crp_link post-673"><figure><img width="150" height="150" src="https://pineapple-media.pl/wp-content/uploads/2026/01/28350053-150x150.avif" class="crp_featured crp_thumb crp_thumbnail" alt="28350053" style="" title="Jak się tworzy strony internetowe: Przewodnik krok po kroku" /></figure><span class="crp_title">Jak się tworzy strony internetowe: Przewodnik krok po kroku</span></a></li></ul><div class="crp_clear"></div></div> </div> <div class="entry-meta entry-meta-after"> <time class="entry-date" datetime="2026-02-24T05:37:04+00:00"> 📅 24 lutego, 2026 </time> <span class="entry-author"> 👤 <a href="https://pineapple-media.pl/author/polinfor-pro/">Polinfor</a> </span> <div class="entry-categories"> <span class="label">🏷️ Kategorie:</span> <a href="https://pineapple-media.pl/category/seo/">SEO</a>, <a href="https://pineapple-media.pl/category/sklepy-internetowe/">Sklepy internetowe</a>, <a href="https://pineapple-media.pl/category/strony-www/">Strony www</a> </div> </div> </article> </div> </main> <footer class="site-footer"> <div class="footer-bottom"> <div class="container"> <div class="footer-bottom-inner"> <div class="copyright"> Reklama internetowa - SEO strony www i sklepy internetowe </div> </div> </div> </div> </footer> <script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/modev/*","/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <script id="ez-toc-scroll-scriptjs-js-extra"> var eztoc_smooth_local = {"scroll_offset":"30","add_request_uri":"","add_self_reference_link":""}; //# sourceURL=ez-toc-scroll-scriptjs-js-extra </script> <script id="ez-toc-scroll-scriptjs-js" src="https://pineapple-media.pl/wp-content/plugins/easy-table-of-contents/assets/js/smooth_scroll.min.js"></script> <script id="ez-toc-js-cookie-js" src="https://pineapple-media.pl/wp-content/plugins/easy-table-of-contents/vendor/js-cookie/js.cookie.min.js"></script> <script id="ez-toc-jquery-sticky-kit-js" src="https://pineapple-media.pl/wp-content/plugins/easy-table-of-contents/vendor/sticky-kit/jquery.sticky-kit.min.js"></script> <script id="ez-toc-js-js-extra"> var ezTOC = {"smooth_scroll":"1","visibility_hide_by_default":"","scroll_offset":"30","fallbackIcon":"\u003Cspan class=\"\"\u003E\u003Cspan class=\"eztoc-hide\" style=\"display:none;\"\u003EToggle\u003C/span\u003E\u003Cspan class=\"ez-toc-icon-toggle-span\"\u003E\u003Csvg style=\"fill: #999;color:#999\" xmlns=\"http://www.w3.org/2000/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"\u003E\u003Cpath d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"\u003E\u003C/path\u003E\u003C/svg\u003E\u003Csvg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http://www.w3.org/2000/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"\u003E\u003Cpath d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"/\u003E\u003C/svg\u003E\u003C/span\u003E\u003C/span\u003E","chamomile_theme_is_on":""}; //# sourceURL=ez-toc-js-js-extra </script> <script id="ez-toc-js-js" src="https://pineapple-media.pl/wp-content/plugins/easy-table-of-contents/assets/js/front.min.js"></script> <script id="modev-main-js" defer src="https://pineapple-media.pl/wp-content/themes/modev/assets/js/main.min.js"></script> </body> </html>