Daten auf der eigenen Webseite präsentieren

Wenn Sie Daten auf der eigenen Webseite präsentieren möchten gibt es verschiedene Möglichkeiten wie z.B. Diagramme oder Tabellen.

Daten als HTML Tabelle präsentieren

HTML verfügt über einen speziellen Tag für Tabellen, nähmlich <table>. Dieser Tag erlaubt es Ihnen Daten übersichtlich auf der eigenen Webseite einzubinden. Wichtig ist dabei die HTML-Tabelle möglichst übersichtlich zu halten. So kann Ihr Besucher einfach Daten verstehen und vergleichen. Auch der Stil der Tabelle spielt eine wichtige Rolle und kann dabei helfen, Daten schneller zu verstehen. Sollte die Tabelle über zu viele Zellen verfügen kann es schwierig für den Benutzer sein, den Inhalt zu verstehen und er wandert eher ab.

Daten in einem Web-Diagramm darstellen

Diagramme und Charts sind ein geeignetes Mittel um Daten anschaulich mit Ihren Seitenbesuchern zu kommunizieen. Es gibt verschiedene Diagramm-Arten wie z.B. Liniendiagramme, Streudiagramme oder Balkendiagramme.

Screenshot eines Schaubildes einfügen

Viele Webseiten-Betreiber fügen Diagramme als Bild in ihre Webseite ein. Das Einfügen erfolgt folgendermaßen: Mit Hilfe einer Tabellenkalkulations-Software wie z.B. Excel oder LibreOffice werden die Daten erfasst und ein entsprechendes Diagramm wird erstellt. Vom Diagramm wird dann ein Screenshot erstellt und in der Webseite eingefügt - wie ein beliebig anderes Bild. Dieser Vorgang ist sehr einfach da keine spezielle Diagramm-Software benötigt wird.

Der Nachteil dieses Ansatzes ist, dass ein Bild einen negativen Einfluss auf die Ladezeit der Seite haben könnte, insbesondere wenn eine zu hohe Auflösung verwendet wird. Außerdem können die Diagramme nicht animiert werden und für den Seitenbesucher sind auch keine Interaktionen wie z.B. das Zoomen möglich. Die Diagramm-Bilder sind einfach nur statisch.

JavaScript basierte Charts verwenden

Als Alternative können jedoch auch mit Hilfe von JavaScripts dynamische Diagramme erstellt werden. Beispiel für solche Bibliotheken sind chart.js und morris.js. In diesem Fall wird eine kleine JavaScript in Ihrer Seite eingebunden mit deren Hilfe die Diagramme dann im Browser des Besuchers gerendert werden.

PrettyCharts.com bietet eine WYSIWYG Diagramm Software an welche es erlaubt Web-Diagramme ohne Programmier-Kenntnisse zu erstellen. Auch eine spezielle Software wird angeboten um automatisiert HTML Tabellen in Diagramme umzuwandeln. Auch das erstellen von dynamischen Charts anhand von statischen Screenshots wird unterstützt. Falls Sie nicht extra eine JavaScript API für das Erstellen von Diagrammen erlernen möchten, könnte diese Lösung ein geeignetes Mittel sein, um Diagramme in der eigenen Webseite einzufügen.