Es wird wohl kaum jemanden geben, der nicht mit mir übereinstimmt, dass die Nutzerfreundlichkeit einer Webseite beziehungsweise eines Blogs äußerst wichtig ist. Je umständlicher eine Seite für seine Besucher gestaltet ist, desto höher ist auch die Absprungrate.
Klar, dass sich der Nutzer im Design-Dschungel zurechtfinden muss. Einer der Nachteile von viel gelesenen und damit auch kommentierten Blogs in Sachen Nutzerfreundlichkeit ist das mit dem direkten Lesen und Surfen auf dem Blog ewig verbundene Scrollen.
Wem ist dabei nicht schon mal fast der Finger abgebrochen, rauf, runter, wieder von unten nach oben – hin und her scrollen, da wird die Maus richtig gefordert und schon ganz schön heiß durch das dauernde Scrollen.
Eine wirklich wertvolle Abhilfe schafft ein kleines AddOn, eine so genannte html Textmarke, die es ermöglichlicht, mit nur einem Klick von unten nach oben an den Seitenanfang zu springen.
Kaum einer, der sich etwas mit html auseinandergesetzt hat, kennt Textmarken nicht und die bekannteste davon ist mit Sicherheit die mit einem Klick von unten nach oben Springen Textmarke. Nutzerfreundlichkeit pur. Nur den meisten wird es wohl genauso gehen wie mir, hast du daran gedacht eine solche Textmarke in deinen Blog zu integrieren? Ich nicht.
So erstellst du eine Html Sprunmarke
In diesem Sinne hat mit der mittlerweile nicht mehr existierende Beitrag von Maya so hervorragend gefallen, dass ich dies natürlich auch gleich hier umgesetzt habe. Ist ja wirklich nicht schwer und da ich die Nutzerfreundlichkeit meines Blogs ganz oben ansetze, natürlich ein absolutes Must Have. Danke liebe Maya, ohne dich wäre ich da in hundert Jahren wohl nicht mehr drauf gekommen, ich habe es schlicht und ergreifend vergessen.
Mit einem Klick von unten nach oben springen ist nicht wirklich schwer zu implementieren im eigenen Blog. Maya hatte es auch ausführlich beschrieben in Ihrem Beitrag. Direkt unter dem einleitenden Body Tag muss als erstes einmal die Textmarke als Zielsprungpunkt definiert werden. Diesen einleitenden Body Tag findest du in der header.php. Direkt darunter einfügen:
1 | <a name="oben"></a> |
Dabei bist du vollkommen frei in der Begriffswahl. Anstatt “oben” kannst du die Textmarke absolut beliebig benennen.
Der zweite Schritt der dazu notwendig ist, den Usern zu ermöglichen mit einem Klick von unten noch oben zu springen ist unten, an beliebiger Stelle, den nutzerfreundlichen Link zum springen einzufügen. Da bietet sich vor allem die footer.php an.
Natürlich kann dieser Link alternativ auch direkt in die darüber liegenden Templates eingebunden werden, z. B. in die comments.php. Nur musst du dann auch daran denken, den Link eventuell auch in der index.php, der archive.php etc. einzubinden. Also die footer.php öffnen und an gewünschter Stelle folgendes eingeben:
1 | <a href="#oben">Ganz nach oben springen</a> |
“#oben” muss natürlich der gleiche Text sein, den du in der header.php gewählt hast. Beim Linktext bist du wiederum total frei in der Wahl. Auch das Einbinden eines Bildes bzw. eines Icons ist statt dem Linktext möglich:
1 | <a href="#oben"><img src="eure bild details" /></a> |
Ich habe meinen von unten nach oben springen Link zusätzlich zur header.php und footer.php noch in meine single.php eingebunden, und zwar unter dem Beitrag direkt vor der Kommentarfunktion. Hast du noch zusätzliche oder andere Ideen für die Nutzerfreundlichkeit?
Loading...
5 Kommentare zu WordPress Sprungmarken: Mit einem Klick von unten nach oben springen im WordPress Blog!