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

deck.js – Präsentationen in HTML Es muss nicht immer Powerpoint sein! Wenn ich eins gelernt habe in meinem ehemaligem Consulter-Leben, dann ist es das, ausreichend früh anzukommen um ...
CSS Crush – noch ein CSS Preprocessor aus De... Ich für meinen Teil bin inzwischen starker Verfechter für den Einsatz von Turbine. Der CSS Preprocessor von Peter Kröner vereinfacht mein Leben nachha...
Respsonsive Design Testing Tool Screenqueri.es Das man heutzutage ein neues Design responsive aufbauen sollte lässt sich wohl nicht mehr weg diskutieren, wie es vielleicht vor einem Jahr noch mögli...
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