https://wiki.rettungsdienstblog.eu/api.php?action=feedcontributions&feedformat=atom&user=AlmaFoley3 2026-11-11T02:59:59Z Benutzerbeiträge MediaWiki 1.37.1 https://wiki.rettungsdienstblog.eu/index.php?title=Article_czy_section:_z%C5%82y_wyb%C3%B3r_psuje_struktur%C4%99_i_SEO&diff=497766 2026-10-19T18:05:19Z

<p>AlmaFoley3: </p> <hr /> <div>Typowy błąd to traktowanie section jako uniwersalnego pojemnika na wszystko, co chcemy pogrupować. Nie używaj go do opakowywania listy produktów, menu nawigacyjnego czy stopki. Do takich celów służą odpowiednio listy, nav i footer. Kolejny częsty błąd to zagnieżdżanie article w article bez powodu. Zagnieżdżenie ma sens tylko wtedy, gdy wewnętrzny fragment jest komentarzem lub odpowiedzią na zewnętrzny artykuł. W przeciwnym razie lepiej użyć section albo div.&lt;br&gt;&lt;br&gt;Konsekwencje są wymierne. Poprawny podział ułatwia tworzenie mapy strony, poprawia odczyt przez czytniki ekranowe i porządkuje stylowanie. Błędny wybór prowadzi do tego, że część treści jest niewidoczna dla wyszukiwarek albo traktowana jako osobna publikacja, choć nią nie jest. Warto poświęcić kilka minut na przemyślenie struktury, zamiast później poprawiać ją w całym serwisie.&lt;br&gt;&lt;br&gt;Zapis szesnastkowy, rgb i hsl — co wybrać w konkretnej sytuacji Zapis szesnastkowy, np. #1e90ff, to skrót od trzech par cyfr. Każda para to jeden kanał w systemie szesnastkowym, od 00 do ff. Jeśli wszystkie pary są takie same, można skrócić zapis do trzech znaków: #ffffff to #fff, #aabbcc to #abc. Skrót działa tylko przy powtórzonych parach — #1e90ff nie da się skrócić. Czwarta para lub czwarty znak to kanał alfa, czyli przezroczystość: #1e90ff80 to kolor z połową krycia.&lt;br&gt;&lt;br&gt;hsl() opisuje kolor przez odcień, nasycenie i jasność. Odcień to stopnie na kole barw, od 0 do 360. Nasycenie i jasność podaje się w procentach. hsl(210 100% 56%) odpowiada temu samemu kolorowi co #1e90ff. Zaletą jest przewidywalność: gdy chcesz rozjaśnić odcień, zmieniasz tylko trzecią wartość. Gdy chcesz go wyciszyć, zmniejszasz drugą. Przy rgb i zapisie szesnastkowym każda taka zmiana wymaga przeliczenia trzech kanałów.&lt;br&gt;&lt;br&gt;Gdzie kończy się sekcja, a zaczyna artykuł Section stosuj do grupowania treści, które razem tworzą większą logiczną całość — rozdział w artykule, zakładkę w opisie produktu, blok z pytaniami i odpowiedziami. Sekcja prawie zawsze powinna mieć nagłówek. Bez niego staje się zwykłym divem i nic nie wnosi. Nie zagnieżdżaj section w section bez powodu, bo robi się z tego głęboka struktura, w której nic nie da się znaleźć.&lt;br&gt;&lt;br&gt;Wybieraj article, gdy dana treść mogłaby zostać wyjęta z kontekstu i nadal być zrozumiała. Klasyczne przypadki to pojedynczy wpis na blogu, opis produktu, komentarz pod tekstem, karta ogłoszenia. Każdy taki blok powinien mieć własny nagłówek, a najlepiej także autora i datę publikacji. Wtedy można go przenieść do innego widoku lub kanału i nic nie traci na znaczeniu.&lt;br&gt;&lt;br&gt;Na koniec kilka sygnałów, które pomagają podjąć decyzję. Jeśli fragment ma tytuł, autora, datę i mógłby funkcjonować jako samodzielna publikacja, wybierz article. Jeśli wydziela logiczną część większego tekstu i nie ma własnej tożsamości, wybierz section. Jeśli to tylko warstwa prezentacyjna, użyj div. Trzymanie się tych zasad sprawi, że dokument będzie czytelny zarówno dla ludzi, jak i dla maszyn.&lt;br&gt;&lt;br&gt;Wybór między elementami article i section sprawia problem nawet doświadczonym twórcom stron. Oba służą do grupowania treści, oba mogą zawierać nagłówki i inne znaczniki strukturalne. Różnica nie polega na wyglądzie, bo przeglądarki domyślnie renderują je podobnie. Chodzi o znaczenie, jakie przypisujesz fragmentowi dokumentu. Od tego zależy, czy czytniki ekranu, roboty wyszukiwarek i inne narzędzia poprawnie zinterpretują Twoją stronę.&lt;br&gt;&lt;br&gt;Praktyczna zasada: najpierw napisz treść i zastanów się, czy dany fragment mógłby trafić na osobną stronę lub do innego serwisu. Jeśli tak, to article. Jeśli istnieje tylko jako część większej opowieści i bez niej nie ma sensu, to section. Gdy masz wątpliwość, użyj diva, a nie na siłę wciskaj semantyczny element tam, gdzie nie pasuje.&lt;br&gt;&lt;br&gt;Trzecia pułapka to wartości procentowe i jednostki. Dla top i left procenty odnoszą się do wysokości i szerokości bloku zawierającego, dla translate — do wymiarów samego elementu. Mieszanie tych dwóch mechanizmów daje przesunięcia, które trudno policzyć w głowie. Przy wyśrodkowaniu elementu absolutnego najpewniej działa para left: 50% i transform: translateX(-50%), ustawiona na elemencie potomnym, a nie na kontenerze.&lt;br&gt;&lt;br&gt;Uwaga na typowe pułapki. Opakowanie całej strony w article jest błędem, bo strona nie jest pojedynczą treścią. Wrzucanie wszystkich akapitów w osobne sekcje bez nagłówków nic nie daje. Używanie section jako zamiennika diva do stylowania to zaprzepaszczenie sensu semantyki. Zagnieżdżanie article w article ma sens tylko wtedy, gdy wewnętrzna treść faktycznie jest niezależna, na przykład komentarz pod wpisem.&lt;br&gt;&lt;br&gt;Proporcje mieszane i pułapka sztywnej kolum&lt;br&gt;&lt;br&gt;Oba elementy są semantycznymi pojemnikami na treść, ale mają różne role i pomylenie ich to jeden z najczęstszych błędów w kodzie. Artykuł ma sens sam w sobie, sekcja jest częścią większej całości. Jeśli zamienisz je miejscami, dokument nadal się wyświetli, lecz straci czytelny podział, a roboty wyszukiwarek i technologie asystujące gorzej go zrozumieją.</div>

AlmaFoley3 https://wiki.rettungsdienstblog.eu/index.php?title=Benutzer:AlmaFoley3&diff=497765 2026-10-19T18:05:16Z

<p>AlmaFoley3: Die Seite wurde neu angelegt: „Pasjonat praktycznego designu z wieloletnią praktyką. Dzielę się tym, jak łączyć wygodę z ładnym wnętrzem. Najchętniej opisuję pomysły, które nie rujnują budżetu.“</p> <hr /> <div>Pasjonat praktycznego designu z wieloletnią praktyką. Dzielę się tym, jak łączyć wygodę z ładnym wnętrzem. Najchętniej opisuję pomysły, które nie rujnują budżetu.</div>

AlmaFoley3