5 jQuery Plugins für eine gute Usability

Hier stelle ich kurz und knapp 5 jQuery Plugins vor die ich bei surfen entdeckt habe. Eingesetzt habe ich davon noch gar keins. Sobald ich aber eins in zukünftigen Projekten eingesetzt habe werde ich eine kleine Stellungnahme hinzufügen.

  1. Hook.js

    Hook.js bringt das bekannte „Pull to refresh“-Feature ins Web. Während dieses Feature auf Touchgeräten sehr sinnvoll ist finde ich es fürs Web eigentlich überflüssig. Aber wir werden sehen…

    Pull to refresh. For the web.

    Motto von Hook.js

  2. alertify.js

    alertify.js hat es sich zu Aufgabe gemacht alert() Dialoge zu verschöner und zu verbessern. Herausgekommen ist ein Plugin mit vielen Möglichkeiten, z. Bsp.: Callbacks oder Log. Ich werde diese Libary im nächsten Projekt definitiv benutzen.

    browser dialogs never
    looked so good

    Motto von ALERTIFY.js

  3. Pickadate.js

    Wer einen kleinen, schnellen Datepicker braucht der dazu auch noch responsive sein soll. Ist mit Pickadate.js mehr als gut bedient. Mit deaktivierten Daten, eingebauten Clear-Buttons oder Massen von Hooks, kann man den Datepicker gut für seinen Zweck anpassen. Auch das simple Design gefällt mir gut. Ein Anpassen ist dennoch leicht möglich.

    A mobile-friendly, responsive, and lightweight jQuery dateinput picker

    Beschreibung von Pickadate.js

  4. Chart.js

    Chart.js ist DIE Alternative für hässliche und langsame Flashdiagramme. Mit 6 verschiedenen Diagrammtypen und einer sehr gut dokumentierten und einfachen API ist es ein Klacks gut lesbare und semantisch korrekte Diagramme zu erstellen. Und.. die Bibliothek ist objekt-orientiert, was das Herz von JavaScript-Nerds höher schlagen lassen wird.

    Easy, object oriented client side graphs for designers and developers

    Motto von Chart.js

  5. Parsley.js bietet eine Client Form Validation ohne eine einzige Zeile Javascript. Im HTML werden alle Regeln für die einzelnen Felder definiert:

    <form>
     <label for="website">Website :</label>
     <input type="text" id="website" name="website" data-trigger="change" data-type="url" />
    
      <label for="message">Message (20 chars min, 200 max) :</label>
      <textarea id="message" name="message" data-trigger="keyup" data-rangelength="[20,200]"></textarea>
    </form>
    

    Sobald ein Fehler auftritt lässt sich das Formular nicht mehr abschicken! Eine einfachere Validierung auf der Clientseite ist mir bisher nicht bekannt!

    Javascript forms validation.
    Powerful, UX aware & Dead simple.

    Motto von Parsley.js

Ich hoffe auch euch können diese Plugins ein wenig helfen. Wenn ihr bereits Erfahrungen mit dem ein oder anderen Plugin gemacht habt, schreibt doch ein Kommentar.

Ich bin Kevin, und schreibe hier über Themen die sich von CSS über Designs bis zur testgetriebenen Entwicklung mit PHP erstrecken. Ich arbeite in einer kleinen Firma als PHP-Entwickler und entwickle dort PHP Backends für verschiedene Projekte vorallem mit Laravel. Privat betreibe ich noch diesen Blog und notesafe.

Schreibe einen Kommentar