In diesem Teil des Webdesign Workshops geht es um Sprungmarken und Anker und abschlie\u00dfend um Zeichenmaskierung\u2026<\/p>\n\n\n\n\n\n\n\n
Sprungmarken und Anker:<\/strong><\/p>\n\n\n\n Mit Sprungmarken und Ankern ist es m\u00f6glich an bestimmte Stellen im Dokument zu springen. Letztendlich sind Sprungmarken und Anker nur eine Variante der bekannten Hyperlinks.<\/p>\n\n\n\n Der bekannte Hyperlink hat ja folgenden Aufbau:<\/p>\n\n\n\n <br \/><\/p>\n\n\n\n <a href=\u201cHyperlink\u201c target=\u201c_blank\u201c>Hyperlinkbezeichnung<\/a><\/p>\n\n\n\n <br \/><\/p>\n\n\n\n Hinter \u201ehref\u201c wird die Webadresse oder ein Pfad angegeben. Mit \u201etarget=\u201c_blank\u201c \u00f6ffnet der Link in einem neuen Fenster oder Tab \u2013 je nach Browsereinstellung des Webseiten-Besuchers.<\/p>\n\n\n\n Ein Anker wird genau wie ein Verweis mit Hilfe des a-Elements erzeugt. Der Unterschied besteht darin, dass kein Attribut \u201ehref\u201c notiert wird, sondern stattdessen ein Attribut \u201ename\u201c. Ein kompletter Anker sieht also so aus:<\/p>\n\n\n\n <a name=\u201cankername\u201c>\u2026<\/a><\/p>\n\n\n\n Unter Sprungmarke verstehe ich hier jetzt den Hyperlink zum Anker. Diese Sprungmarke kann auf einen Anker innerhalb der eigenen Datei verweisen oder auf einen Anker in einer anderen Datei.<\/p>\n\n\n\n n der Praxis wird es sich anbieten die \u00dcberschriften von Artikeln auch zu Ankern zu machen. Ein Anker k\u00f6nnte dann so aussehen:<\/p>\n\n\n\n <a name=\u201cartikel-01\u2033>\u00dcberschrift des Artikels<\/a><\/p>\n\n\n\n Noch konkreter:<\/p>\n\n\n\n <article><\/p>\n\n\n\n <h3><a name=\u201cartikel\u201c>14. April 2014 \u2013 Anker und Sprungmarke in der Praxis:<\/a><\/h3><\/p>\n\n\n\n <p><\/p>\n\n\n\n Artikeltext<\/p>\n\n\n\n <\/p><\/p>\n\n\n\n <\/article><\/p>\n\n\n\n Zeichenmaskierung:<\/strong><\/p>\n\n\n\n Die deutschen Umlaute sind das beliebteste Beispiel f\u00fcr HTML Zeichenmaskierungen.<\/p>\n\n\n\n Durch den Wechsel auf utf-8 Zeichencodierung wollte ich mir diese Zusatzarbeit aber ersparen\u2026<\/p>\n\n\n\n Sp\u00e4testens wenn es aber darum geht Quelltext auf einer Webseite anzuzeigen wird dieses Thema wieder wichtig\u2026.<\/p>\n\n\n\n Angenommen man m\u00f6chte auf einer Webseite darstellen wie ein Artikel \u2013 also ein article-Element aufgebaut ist. Es ist dann nicht einfach m\u00f6glich den Quelcode zu schreiben\u2026<\/p>\n\n\n\n Der Webbroser w\u00fcrde das als HTML Element erkennen und nicht auf der Seite darstellen.<\/p>\n\n\n\n Es braucht dazu folgenden Code:<\/p>\n\n\n\n <article><br \/><\/p>\n\n\n\n <h3>\u00dcberschrift<\/h3><br \/><\/p>\n\n\n\n <p><br \/><\/p>\n\n\n\n <\/p><br \/><\/p>\n\n\n\n <\/article><br \/><\/p>\n\n\n\n Die Zeichenmaskierung beginnt also mit dem kaufm\u00e4nnischem Und-Zeichen. Das Semikolon bildet den Abschlu\u00df der Zeichenmaskierung.<\/p>\n","protected":false},"excerpt":{"rendered":" In diesem Teil des Webdesign Workshops geht es um Sprungmarken und Anker und abschlie\u00dfend um Zeichenmaskierung\u2026<\/p>\n","protected":false},"author":1,"featured_media":53,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[23],"class_list":["post-270","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-webdesign","tag-webdesign-gruppe-peine"],"_links":{"self":[{"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/posts\/270","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/comments?post=270"}],"version-history":[{"count":1,"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/posts\/270\/revisions"}],"predecessor-version":[{"id":271,"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/posts\/270\/revisions\/271"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/media\/53"}],"wp:attachment":[{"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/media?parent=270"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/categories?post=270"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.fuhselab.de\/index.php\/wp-json\/wp\/v2\/tags?post=270"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}