Dzień 9: Dodatkowa pomoc w nawigacji

Być może znasz tag <link> używany do włączania zewnętrznych arkuszy stylów. Podobny kod może wskazywać położenie Twojej strony głównej oraz poprzedniej i następnej strony w sekwencji. Na przykład na archiwum dziennym możesz w ten sposób wskazać stronę z wpisami z dnia poprzedniego i następnego (jeżeli istnieją). Jeżeli prezentujesz pojedynczy wpis na stronie to możesz wskazać wpis następny i poprzedni.

<link rel="home" title="Strona główna" href="http://url/strony/głównej" />
<link rel="prev" title="Tytuł poprzedniej strony" href="http://poprzednia/strona" />
<link rel="next" title="Tytuł następnej strony" href="http://następna/strona" />

Te linki są niewidoczne w Internet Explorerze, ale mogą być z powodzeniem wykorzystane w innych przeglądarkach i mogą pomóc użytkownikom w nawigacji po stronie. Być może już masz kilka sposobów nawigacji, np. archiwa miesięczne, tygodniowe, link do wpisów aktualnych, kalendarz wpisów itp. Może nawet masz wyraźne linki do wpisów poprzednich i następnych. Wszystkie te linki są przydatne; zostaw je tak jak są, ale dodaj również powyższe.

Kto na tym skorzysta?

  1. Marek skorzysta. Lynx, jego przeglądarka tekstowa, wyświetla dodatkowe linki nawigacyjne na górze strony używając tytułów podanych w atrybutach title. Na przykład czytając archiwum dzienne z dnia 18. czerwca na blogu z dobrze zdefiniowanymi linkami, Marek powinien zobaczyć coś takiego:

    #Start 17 czerwca 2002 19 czerwca 2002

    (Znak # na początku sygnalizuje Markowi, że ta linia to metadane a nie zawartość strony. Lynx umieszcza taki znak również na początku linii z tytułem strony.)

  2. Michał skorzysta. Jego przeglądarka tekstowa, Links (nie myl z Lynx, przeglądarką Marka) również wyświetla te specjalne linki nawigacyjne na początku strony. Wygląda to mniej więcej tak:

    Link: home
Link: prev
Link: next

    Druga przeglądarka Michała, Opera (począwszy od wersji 7), wyświetla linki nawigacji strony na specjalnym pasku nawigacyjnym ("Navigation Bar"). Typ linku ("home", "prev", "next") jest pokazany na przycisku. Ponadto nowe wersje Opery implementują technologię Fast Forward, która udostępnia użytkownikowi dodatkowy przycisk prowadzący do prawdopodobnej następnej strony jaką będzie chciał zobaczyć. Jeżeli na stronie jest zdefiniowany odnośnik <link rel="next"> to właśnie on będzie użyty jako adres dla przycisku "Fast Forward".

  3. Bill skorzysta. Mozilla podobnie jak nowa Opera pokazuje dodatkowy pasek klawiszy nawigacyjnych. Typ linku jest pokazany na przycisku, oraz dodatkowo tytuł linku pojawia się jako tooltip.

  4. Użytkownicy przeglądarki iCab skorzystają. iCab wyświetla linki nawigacyjne w menu w pasku narzędzi używając tytułu zdefiniowanego przy każdym linku.

Jak to zrobić?

  • W Movable Type dodaj następujące linie do szablonu "Date-Based Archive", zaraz za tagiem <head>:

    <link rel="home" href="<$MTBlogURL$>" title="Home" />
    <MTArchivePrevious>
    <link rel="prev" href="<$MTArchiveLink$>" title="<$MTArchiveTitle$>" />
    </MTArchivePrevious>
    <MTArchiveNext>
    <link rel="next" href="<$MTArchiveLink$>" title="<$MTArchiveTitle$>" />
    </MTArchiveNext>

    Natomiast w szablonie "Individual Entry Archive", również zaraz za <head> dodaj:

    <link rel="home" href="<$MTBlogURL$>" title="Home" />
    <MTEntryPrevious>
    <link rel="prev" href="<$MTEntryLink$>" title="<$MTEntryTitle$>" />
    </MTEntryPrevious>
    <MTEntryNext>
    <link rel="next" href="<$MTEntryLink$>" title="<$MTEntryTitle$>" />
    </MTEntryNext>

  • W systemie Greymatter dodaj poniższe tagi zaraz za <head> w szablonach:

    <link rel="home" title="Home" href="{{pageindexlink}}">
    <link rel="prev" title="{{previousentrysubject}}" href="{{entrieswebpath}}/{{previousentrynumberpadded}}.html">
    <link rel="next" title="{{nextentrysubject}}" href="{{entrieswebpath}}/{{nextentrynumberpadded}}.html">

  • W Radio cała sprawa jest uproszczona przez makra Navigation Links For Radio Sjoerda Visschera.

    1. Pobierz Navigation Links macros.

    2. Rozpakuj 4 pliki (navigationLinks.txt, nextDayLink.txt, prevDayLink.txt, permalinkUrl.txt) do katalogu Macros. W standardowej instalacji dla Windows będzie to C:\Program Files\Radio UserLand\Macros.

    3. W głównym szablonie, zaraz za tagiem <head> wstaw kod:

      <%navigationLinks()%>

Niestety nie znam satysfakcjonującego sposobu dodania linków do poprzedniej i następnej strony w systemach blog.pl, niByLog, Manila czy Blogger, ale możesz przynajmniej dać link do strony głównej umieszczając zaraz za tagiem <head> kod:

<link rel="home" title="Początek" href="http://adres/strony/głównej">

Zobacz także

 
<< Dzień 8: Tworzenie znaczących tytułów stron | Spis treści | Dzień 10: Główna treść jako pierwsza >>