Intention.js – Responsive direkt im HTML definieren

Screenshot von Intention.js

Je nach Einsatz von Responsive ist es normal, das man auch Bilder austauschen muss, oder Design-Elemente anpassen. Die Intention dahinter ist stets klar, das gleiche Bild, mehrere Formate. In der Regel ist dies recht einfach zu handhaben, komplex wird die Sache dann, wenn wir zum Beispiel über eine individuelle Webapp im Intranet sprechen, die einige tausend Seiten mit einigen tausend Bildern ausgibt. Man kommt nämlich hier sehr schnell in einen Bereich, in dem man Inline auf die Seite JavaScript setzt, und das ist weder schön, sondern auch nicht das was man semantisch korrekt nennen würde.

Responsive Änderungen am DOM automatisch

Die jQuery-Bibliothek intention.js erlaubt es hierbei HTML so zu schreiben, das es dem Responsive-Gedanken entspricht, aber trotzdem noch semantisch lesbar ist. Man schreibt hierbei einige Befehle in die entsprechden Tags, und Intention.js schreibt dann das DOM automatisch je nach Client um. Ein Beispiel für den IMG-Tag:


In einem IMG-Tag sind hier je nach Auflösung 2 verschiedene Bilder möglich. Was mir insbesondere an Intention.js gefällt ist, das der Quelltext lesbar und verständlich bleibt. Ferner bricht man sich bei einer dynamischen Ausgabe von HTML nicht mehr die Finger, um zum Beispiel Bilder responsive zu machen. Die Bibliothek solltet ihr euch einmal näher anschauen, ich denke ich werde es in einem meiner nächsten Projekte einmal ausprobieren.

Ähnliche Beiträge

Tooltips in 100% CSS Tooltips sind inzwischen in jeder Web-Applikation zu finden, einfach um dem Benutzer mehr Informationen zu geben oder besser zu führen. Bei ganz windi...
CSScomb – Sortieren einer CSS-Datei Die Übernahme von komplexen Seiten dritter ist kein Spaß, aber leider Alltag. In der Regel sieht dieses Szenario bei mir so aus: irgendein Hobby-Frick...
Cached Commons – CDN für JavaScript und CSS Neuerdings lädt man ja Javascript nicht mehr vom eigenen Server, sondern verwendet die Google Libraries API, das ist zwar ganz nett, aber der Dienst b...
Einfaches HTML Testing mit dem HTML Inspector Damals, als ich noch den Firefox verwendet habe, gab es ein nettes Tool mit dem man testen konnte ob HTML valide ist. Dann kam HTML5, alles wurde ande...

Schreibe einen Kommentar