odnośniki - Kurs HTML i CSS
HTML5 / Nawigacja <nav><nav>...</nav> Reprezentuje sekcję strony, która zawiera odnośniki nawigacyjne do innych stron albo do określonych fragmentów na tej samej stronie. Nie wszystkie linki na stronie powinny być umieszczane w tym znaczniku. Został on przewidziany przede wszystkim do oznaczania nim podstawowej nawigacji witryny. Często w stopce serwisu znajdują się linki takie jak: kontakt, regulamin, prawa autorskie. Choć teoretycznie można je objąć znacznikiem NAV, zwykle bardziej właściwy do tego będzie element...
- Odsyłacze HTML / Blokada indeksowania odsyłaczy <a "nofollow, ugc, sponsored">
...pozycji strony w wynikach wyszukiwania albo nawet usunięcie z nich całego serwisu. Dlatego jeśli chcemy umieścić na własnej stronie płatne odnośniki sponsorowane, koniecznie należy je oznaczyć atrybutem rel="sponsored".
- Widżety HTML / Ramki HTML
...tę niedogodność, a jednocześnie nie utrudniać naszym użytkownikom nawigacji w serwisie, możemy stworzyć jeden wspólny widżet zawierający odnośniki menu, a następnie osadzić go na każdej podstronie. To samo dotyczy innych stałych elementów witryny: nagłówka (wraz z logotypem) i stopki serwisu. Podobny efekt do ramek pozwalają uzyskać dynamiczne skrypty działające po stronie serwera - np. PHP lub SSI [zobacz: Szablon strony bez ramek]. Dzięki nim menu nawigacyjne tak samo możemy...
Układ wielokolumnowy CSS / Multi-column layout...właściwa treść artykułu znajduje się w pojedynczej kolumnie, a pozostałe kolumny są przeznaczone na menu lub inne elementy kontekstowe (popularne odnośniki, inne podobne artykuły czy reklamę). Jest to zatem sytuacja zupełnie inna, choć w wielu przypadkach całkowicie pożądana. Gazetowy układ wielokolumnowy teoretycznie można próbować symulować za pomocą tabel. Ma to jednak spore wady, które praktycznie dyskwalifikują takie rozwiązanie: Inaczej niż w prawdziwym, gazetowym układzie strony...
- HTML5 / Przeciągnij i upuść <... draggable>
...zwykle konieczna jest znajomość języka JavaScript, to atrybut ten może być przydatny nawet w czystym HTML. Niektóre elementy każdej strony - jak np. odnośniki hipertekstowe - domyślnie mogą być przeciągane przez użytkowników. Jeśli taki link zostanie upuszczony na pasku adresu przeglądarki, nastąpi jego wczytanie. Można je również upuszczać na pola tekstowe formularzy. W niektórych przypadkach możemy jednak nie chcieć takiego zachowania. Aby zablokować przypadkowe przeciągnięcie elementu przez...
- HTML5 / Piaskownica zabezpieczająca <iframe sandbox>
...zezwala na uruchamianie odsyłaczy, których adres zaczyna się od protokołu innego niż "http:" i "https:". Mogą to być np. odnośniki "mailto:", które uruchamiają domyślny program pocztowy. Oprócz tego inne aplikacje, zainstalowane na urządzeniu użytkownika, mogą rejestrować swoje własne, niestandardowe protokoły. Wtedy po kliknięciu w odnośnik do takiego protokołu, nastąpi otwarcie danej aplikacji - najczęściej w określonym widoku. Jeżeli strona w ramce lokalnej...
- Menu w CSS / Rozdzielenia struktury i prezentacji dokumentu
...CSS - praktyczne zastosowanie koncepcji rozdzielenia struktury i prezentacji. Wspólnie postaramy się dla raz ustalonego kodu HTML, zawierającego odnośniki menu nawigacyjnego, zaprojektować kilka osobnych arkuszy stylów, dzięki czemu ten sam kod HTML za każdym razem będzie się prezentował zupełnie inaczej. Być może zapytasz teraz: jaki jest tego cel? Wyobraź sobie, że Twój serwis internetowy zawiera 100 podstron z artykułami. Na każdej podstronie zostało wstawione menu nawigacyjne. Jeśli...
- Menu w CSS / Pionowe menu
...wstawiamy znaną już regułę, która usuwa domyślne formatowanie listy. Ustalamy szerokość menu, aby nie zajmowało całego ekranu. Stylizujemy odnośniki listy tak, aby wyświetlały się w bloku (display: block). Dzięki temu nie trzeba dokładnie wskazywać tekstu, aby link zmienił wygląd (sprawdź). Niestety zachowanie to może nie dotyczyć niektórych bardzo starch przeglądarek, dlatego bezpieczniej jest dodatkowo określić szerokość (width) bloku odnośnika. Zgodnie z modelem pudełkowym...
- Menu w CSS / Menu z nagłówkami
...pozycja może być połączona z dowolną liczbą innych pozycji. Z taką sytuacją mamy właśnie do czynienia w przypadku menu nawigacyjnego z nagłówkami: odnośniki, zawarte w znacznikach <dd>...</dd>, stanowią rozwinięcie krótkiego nagłówka, zapisanego wewnątrz <dt>...</dt> - taki kod również jest poprawny semantycznie: <dl> <dt>CSS</dt> <dd><a href="czcionki.html">Czcionki</a></dd> <dd><a href="tekst.html">Tekst</a></dd> <dd><a href="tlo.html">Tło</a></dd> <dd><a...