Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

HTML-Tipps für Webentwickler: Jede Woche neu

ins, del und s - Textbearbeitungen und mehr

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Unabhängig davon, ob es sich bei Ihrem Projekt um eine "große" Website handelt oder eine "kleine", Sie einen Webshop aufsetzen wollen oder einen privaten Blog betreuen – eines haben alle Webseiten gemeinsam: die Basis ist HTML. Profitieren Sie in dieser praktischen Tipps&Tricks-Sammlung von der jahrelangen Erfahrung der Trainerin Florence Maurice, die Ihnen unbekannte Features nahe bringt, zur Übersicht über die einzelnen Versionen verhilft oder oftmals nur mit kleinen, pfiffigen Hinweisen Ihren Alltag als Webdesigner und -programmierer erleichtert.
05:39
  Lesezeichen setzen

Transkript

Weniger bekannt sind die Elemente del, ins, und s, dabei haben Sie einen genau definierten Einsatzbereich. Sehen wir uns das einmal an. Beginnen wir mit einem kleinen Beispiel: Wir haben ein Aufziehauto, eine unverbindliche Preisempfehlung und einen neuen Preis, derzeit sieht das so aus. Jetzt wäre es natürlich sinnvoll zu kennzeichnen, dass dieser Preis nicht mehr gilt, weil wir diesen Sonderpreis haben. Für diesen Fall, dass eine Information nicht mehr relevant oder nicht mehr gültig ist, gibt es das s-Element. Die unverbindliche Preisempfehlung habe ich damit als nicht mehr gültig gekennzeichnet, im Browser wird diese dann durchgestrichen, was natürlich eine sinnvolle Formatierung ist, aber man könnte das per CSS auch ändern. Wenn es sich hingegen um reine Textbearbeitungen oder Texteditionen handelt, dann ist das Element "s" nicht das Richtige, sondern dann sollten Sie die Elemente "ins" und "del" verwenden. Sehen wir uns ein Beispiel an: Ich bin bei der Wikipedia und lasse mir Versionsunterschiede anzeigen und da gibt es jetzt Teile, die gelöscht wurden und andere Teile, die hinzugefügt wurden, und wenn wir uns das dann einmal in den Entwickler-Tools ansehen, dann sehen wir, die gelöschten Elemente werden mit "del" gekennzeichnet, das ist auch das Richtige und die Teile, die eingefügt wurden, im Vergleich der Versionen werden durch "ins" gekennzeichnet. Das Element "del" ist auch richtig, um beispielsweise bei einer To-Do-Liste die Punkte, die bereits erledigt wurden oder sie durchgestrichen dargestellt werden sollen. zu kennzeichnen. Da habe ich hier ein kleines Beispiel: Mit einer To-Do-Liste und zwei Punkte sind bereits erledigt und deswegen durchgestrichen und dafür wird das del-Element benutzt. Beim del-Element können Sie über Attribute weitere Informationen liefern, Sie können mit "datetime" angeben, wann das beispielsweise gestrichen wurde, und außerdem können Sie mit "cite" auf eine Quelle verweisen, also hier eine URL angeben. Das waren Beispiele für "del", genauso funktioniert im Prinzip "ins", nur dass es das Umgekehrte kennzeichnet. Wenn ich hier beispielsweise etwas ergänzen möchte, kann ich das ins-Element nehmen und sagen "bei weitem". Schauen wir uns das einmal an, auch wie das standardmäßig dargestellt wird. Das ist meine Einfügung mit "ins", die wird standardmäßig unterstrichen, Sie frage, ob das so eine glückliche Formatierung ist, das kann ich natürlich auch ändern. Dafür muss ich die Eigenschaft "Text-decoration" verwenden, standardmäßig wird "ins" mit "Text-decoration-underline" dargestellt, wenn ich das entfernen möchte, schreibe Text-decoration an. Ich kann natürlich auch eine andere Formatierung wählen, dabei sollte natürlich zu erkennen sein, was damit gemeint ist. Wir hätten jetzt zwei Felder für "ins" und "del", also beispielsweise "del" bei einer To-Do-Liste oder "ins" und "del" bei so einem Versionsvergleich, weitere Einsatzbereiche werden beispielsweise, wenn sich in einem offiziellen Dokument, wie einem Gesetz oder einer Vereinbarung etwas geändert hat, dann kann man das auch auf diese Art kennzeichnen. Eine Besonderheit gibt es beim Einsatz von "ins" und "del", diese können Sie inline verwenden, beispielsweise also innerhalb eines Absatzes, Sie können aber "del" beispielsweise auch um zwei Absätze herummachen, also dann als Block-Element verwenden, Sie dürfen diese beiden Arten aber nicht mischen. Das heißt, was nicht funktioniert ist, dass Sie einen Absatz haben, Sie beginnen mit der Kennzeichnung der Entfernung und diese hört dann auf im nächsten Absatz. Also so etwas darf nicht sein, damit haben wir natürlich auch keine korrekte Verschachtelung, dann müsste hier das del-Element geschlossen werden und dann an dieser Stelle wieder neu geöffnet werden, wenn man diese Kennzeichnung eben benötigt. Sie haben in diesem Film drei Elemente kennengelernt, zum einen das Element "s", um zu kennzeichnen, dass eine Information nicht mehr relevant ist, und außerdem gibt es "ins" und "del" für alle Arten von Textbearbeitungen, nützlich sind dabei die Attribute "datetime", um den Zeitpunkt der Änderung anzugeben, und "cite", wo Sie auf eine Quelle verweisen können.