Technik - Glossar Teil 2

Welche Sprache spricht unsere Website?

Ein Relaunch ist mit einem großen technischen Aufwand verbunden. Gerne verliert man den Überblick bei all den Abkürzungen, die einem von Informatikern um die Ohren geschleudert werden.
Der folgende Artikel dient als Glossar für die relevanten Abkürzungen des Fachjargons.

Relaunch Redaktion


Eine Übersetzungshilfe für die vielen Begriffe, die bei einem Relaunch verwendet werden

HTML (Hypertext Markup Language)

HTML ist eine Auszeichnungssprache zum Strukturieren von Inhalten auf einer Website – Überschrift, Text, Bild, Text. Sie dient quasi als Innenarchitekt für unser Wohnzimmer. Wo befindet sich was?
Die aktuellste Fassung ist HTML5, die neue Funktionen in der Verarbeitung von beispielsweise Audio und Video bietet.
 

CSS (Cascading Style Sheets)

Mit CSS werden gestalterische Aspekte im Aufbau einer Website in eine separate Datei ausgelagert. Zwar ist es keine eigenständige Computersprache, aber eine Gestaltungssprache in Kombination mit HTML. Mit CSS kann man einen in HTML beschriebenen Inhalt optisch anpassen, ohne diesen zu verändern. Das vom Innenarchitekten (HTML) eingerichtete Wohnzimmer kann gestrichen werden, ohne dass Möbel ihren Platz verlassen müssen.
 

JS (JavaScript)

Die Skriptsprache JS funktioniert als ein Erweiterungspaket für HTML und CSS. Die gebotenen Möglichkeiten für animierte Inhalte sind breit gefächert. Von der Auswertung von Benutzerinteraktionen über die Darstellung von Dialogfenstern bis zum Einblenden von Werbebannern – vieles ist möglich. Übertragen auf das Beispiel des Wohnzimmers könnte es sich bei JS um eine Zeitschaltuhr handeln, die regelmäßig zu einer bestimmten Zeit die Rollläden runterfährt. Oder auf eine Aktion wie das Öffnen der Tür von außen reagiert und das Licht einschaltet oder per Lichtschranke zählt, der wievielte Besucher man ist.
 

Open-Graph-Tags

Werden auch kurz als OG-Tags bezeichnet und sind kurze Code-Zeilen, die Facebook beschreiben, wie Inhalte in einem Post vorzugsweise dargestellt werden sollen. Wir können Facebook also für jede Detailseite sagen, wie unsere Headline genau lauten soll (praktisch um lange Überschriften passend zu kürzen), welches Bild dargestellt werden soll (nützlich um auf plakativen Blickfang zu optimieren) und welche Kurzbeschreibung angezeigt werden soll (und Zusatzinformationen, wie Autor, etc.). Der Website-Besucher kann jeden Teil des Postings vor dem Abschicken verändern, allerdings tun das die Wenigsten.
 

Twitter-Cards

Das sind kurze Tags, die Twitter beschreiben, wie der Tweet zu dieser Seite gefüllt werden soll. Ähnlich wie bei den Open-Graph-Tags für Facebook, können Headlines, Beschreibungen und Bilder für jede Detailseite individuell festgelegt werden. Twitter bietet dafür verschiedene Kartentypen zur Auswahl, die es außerdem ermöglichen über die übliche 140-Zeichen-Beschränkungen in den Mitteilungen hinaus zu gehen.

  • Die Summary Card, in der wir sowohl den Tweettext, als auch eine Headline, plus Zusammenfassung der Seite in 200 Zeichen und ein kleines Bild (120x120 Pixel) angeben können.
  • Die Summary Card with Large Image, in der wir statt der kleinen, ersten Option auch ein Bild in 280x150 Pixeln einsetzen können plus Summary-Card-Optionen.
  • Die App Card, die sich den Titel und das Logo der App zieht und 200 Zeichen App-Beschreibung akzeptiert.
  • In der Player Card,kann neben 200 Zeichen Beschreibung direkt Audio oder Video abgespielt werden.

Kombiniert mit kostenlosen Optionen aus Twitter Ads lässt sich auch eine Lead Generation Card generieren, die es zum Beispiel ermöglicht, aus dem Twitter-Stream heraus mit einem Klick eine Nachricht an den Urheber der Seite zu schicken, die bereits mit dem Namen und Accountangaben des Twitter-Users vorausgefüllt ist.


Mit diesem kurzen Einblick in die Abkürzungen der Programmierer sollte das nächste Gespräch hoffentlich weniger Verwirrung erzeugen.
Im nächsten Teil des Glossars geht es um die Darstellungsform einer Website.
 

Weitere Teile der Serie:

Glossar Teil 1: Welche Adresse hat unsere Website?

Glossar Teil 3: Wie wird unsere Website dargestellt?

Glossar Teil 4: Wo befindet sich unsere Website?

Glossar Teil 5: Wie wäre es mit einer App?