Mit relativen Links bzw. Pfadangaben zu mehr Benutzerfreundlichkeit? ℹ️

avatar
(Edited)

Ich mache mir gerade ein paar Gedanken darüber, wie ich für meine Leser etwas mehr an Benutzerfreundlichkeit (engl. Usability) bieten kann.

der-pfad.jpg
[Symbolbild, CC0, Pixabay]

Worum geht es?

Wie wir alle wissen, ist Steemit nicht der einzige Frontend – engl. für Oberfläche – welches auf die Steem-Blockchain aufsetzt. Daneben gibt es noch Busy.org oder ChainBB um nur zwei zu nennen.

Dadurch ergeben sich mehrere URLs für den selben Artikel, hier die Adressen von meinem letzten Artikel:

Ist an sich kein Problem. Ich finde es sogar sehr gut, dass es mehrere Oberflächen gibt.

Allerdings sehe ich eine Schwierigkeit, wenn ich zum Beispiel einen Artikel auf Busy.org verfasse und dann auf andere Artikel verweise. Bewege ich mich nur innerhalb von Busy, dann werde ich logischerweise nur die Busy-Links einsetzen. Genau so ist es, wenn ich mich nur innerhalb von Steemit oder nur innerhalb von ChainBB bewege.

Das heißt aber, dass ein Busy-, Steemit- oder ChainBB-Nutzer im Regelfall des öfteren aus seinem bekannten Frontend in ein anderes katapultiert wird. Ich bin mir zwar nicht 100%ig sicher, aber ich denke, dass dies viele Leute stört.

Ich weiß, dass es dafür Lösungen gibt in Form von Browser-Addons bzw. von Einstellungen innerhalb Browser-Addons, aber ich weiß nicht ob dass der der Weisheit letzter Schluss ist.

Mit "relativen" Links innerhalb einer Oberfläche bleiben

Es gibt eine andere Möglichkeit, wie man als Autor, den Lesern helfen kann innerhalb ihrer favorisierten Oberfläche zu bleiben. Wenn man verlinkt bzw. wenn man verweist, dann setzt man nicht den absoluten, sondern den "relativen" Pfad ein. Also anstatt:

https://staging.busy.org/@vladimir-simovic/die-top-200-kuratoren-in-der-kategorie-deutsch

setze ich in den Verlinkungen, egal ob HTML oder Markdown, den "relativen" Pfad ein:

/@vladimir-simovic/die-top-200-kuratoren-in-der-kategorie-deutsch

Also ich streiche einfach den Domainnamen raus und der Pfad fängt mit einem Schrägstrich / an.

Bei so einem Pfad ersetzt der Browser dann den fehlenden Teil vor dem Schrägstrich durch https://staging.busy.org, oder durch https://steemit.com oder durch https://chainbb.com. Je nach dem auf welcher Oberfläche man gerade unterwegs ist.

Somit ist garantiert, dass derjenige, der auf den Link klickt innerhalb der Oberfläche bleibt.


Kleiner Exkurs für Schlaumeier & andere Besserwisser 🤓

Wer auf einem Stammtisch oder ähnlichen Veranstaltungen mit zusätzlichem Wissen auftrumpfen möchte, der kann hier weiter lesen. 🤓

Das was ich oben als einen relativen Link bzw. relativen Verweis tituliert habe ist im Grunde genommen kein relativer Link sondern eine:

👉 Absolute Pfadangabe, relativ zu der Basis-URL 👈

Also um einen absoluten Link, relativ zu der Hauptebene. Aber wie du siehst ist der richtige Name etwas sperrig und nicht wirklich dazu geeignet zum weiter lesen zu motivieren. Deswegen habe ich ihn nicht sofort genannt, sondern weiter oben als "relativ" tituliert.

Hier die unterschiedlichen Formen:

  • Absolute Pfadangaben: http://www.domain.abc/grafik/bild.png
  • Relative Pfadangaben: ../../grafik/bild.png
  • Absoluten Pfadangaben relativ zu der Basis-URL: /grafik/bild.png

Was ist der Unterschied? Klar, die absolute Pfadangabe funktioniert immer und die ist immer zu empfehlen wenn man den Link extern einsetzen möchte. Im Fall von Steem-Universum heißt extern, wenn man sich außerhalb des Steem-Ökosystems bewegt.

Die relativen Pfadangaben sind zwar kurz funktionieren aber nur intern, also innerhalb einer Website. Allerdings sind die tückisch, da je nach dem auf welcher Ebene oder Unterebene man sich befindet, der relative Pfad variiert. Die Angabe ../steht für "springe eine Ebene höher".

Das heißt, je nach dem wie tief du innerhalb einer Website bist, muss der passende relative Pfad ../../grafik/bild.png oder ../grafik/bild.png lauten.

Die absolute Pfadangaben relativ zu der Basis-URL vereint die Vorteile, der vorherigen Angaben: sie ist kürzer als die absolute Angabe, aber sie funktioniert immer zuverlässig innerhalb einer Website bzw. in unserem Fall innerhalb des ganzen Steem-Ökosystems.

Der vorangestellte Schrägstrich / signalisiert dem Browser: "gehe so weit nach oben, wie es möglich ist und suche von dort aus die entsprechende Unterseite".

Alles verstanden? Gibt es Fragen dazu?


SelfHTML: HTML/Regeln/Referenzieren in HTML



17 comments
avatar

Ja klar, warum bin ich nicht schon früher darauf gekommen? *Ins Gesicht klatsch*
Werde ich ab sofort auch auf all meinen Artikeln anwenden.

Vielen Dank!

VG Max

avatar

wieder einmal super erklärt--- danke für die Tips
Ui ne Platzierung :D ich bin auf Platz 90 juhuhuhu

raufaser klein.png

avatar
(Edited)

Klasse Info, danke schön!

Was ist mit den Lesern, die gar nicht auf steemit angemeldet sind, sondern einen Beitrag über eine externe Suchmaschine gefunden haben?
Angeblich sind wir mit unserem hochwertigen Content doch oft vorne dran bei den Suchergebnissen.

Klappt das auch, wenn die auf einen solchen Link klicken?

avatar

Das wird klappen. Wenn man über die Suchmaschine gelangt, dann kommt man dennoch auf eine der Oberflächen. In der Regel ist es Steemit und dann gibt es keine Probleme.

avatar

Hallo Vladimir, toller Artikel, ich werde ihn, da ich gerade etwas wenig Votingpower habe, in einem meiner nächsten Posts (vermutlich am Sonntag) empfehlen.

avatar

Alles verstanden 🙃

Ich nutze derzeit eigentlich nur steemit als Frontend, gefällt mir irgendwie optisch am besten. So dezent. Naja

Aber ich hab mir ehrlich gesagt noch gar keine Kopf drum gemacht das andere eben was anderes nutzen und das es u.U. stört zu meinen Steemit-Links zu kommen - von daher, gut das Du den Beitrag geschrieben hast, sonst wäre mir das gar bewusst gewesen.
Werd ich versuchen dran zu denken im Interesse der ... äh.. anders gefrontendeten Leser 😂

avatar
(Edited)

Du Dieb! Darüber wollte ich gerade einen Artikel schreiben. Und was mache ich jetzt? Soll ich jetzt die Geschichte vom blauen Lappen erzählen..? Toll... Aber mein Artikel wäre nicht ganz so gut geworden, also werde ich Deinen einfach mal recyclensteemen.

avatar

Ich wusste bislang nicht, dass auf die Blockchain noch andere Oberflächen als Steemit aufsetzen. Ist es nun mit den 3 getan oder sind da noch mehr und wie begrenzt oder unbegrenzt können sich da Oberflächen andocken?

avatar

Es gibt noch weitere Oberflächen: DTube als YouTube-Ersatz, DLive für Videostreamings, Zappl als Twitter-Klon etc.

avatar

Danke, Dtube kenne ich ja, verstehe das jetzt besser.

avatar

Im Prinzip schon. Jeder kann theoretisch eine andere Maske programmieren. Die sieht dann anders aus, greift aber auf die selbe Blockchain zu. Neben der oben genannten gibt es noch ganz viele andere. Hier ein paar davon:

  • Busy.org
  • SteemKR.com
  • SteemitStage.com
avatar
(Edited)

Oh, danke dir. Ich habe erst gedacht, es betrifft mich nicht, weil ich da keine Ahnung von habe, warum ich auf eine andere Oberfläche gehen sollte. Aber andersherum macht es ja Sinn für diejenigen, die genau dies tun. Jetzt bin ich auch dabei und kürze meine internen Links und es funktioniert. Danke für den Tipp - super erklärt.