Inhalt
- 01. Petersilie.js
- 02. Bist du ein Mensch?
- 03. X-editierbar
- 04. Dillinger
- 05. Character-Code.com
- 06. Malihu jQuery Custom Scroller 2.3
- 07. Eine Div
- 08. Zigg.be Alpha
- 09. RubyJS
- 10. BaconJS
- Mochte dies? Lese das!
Das Sammeln und Validieren von Benutzereingaben scheint ein Thema zu sein, das die frühen Tage des Jahres 2013 durchdringt. Die Überprüfung von Formularen an vorderster Front, die Bearbeitung von Inline-Inhalten und sogar das knifflige Geschäft, die Menschlichkeit eines Benutzers zu etablieren, erhalten einige lohnende Aufmerksamkeit.
Eine andere Facette des Webs, die in letzter Zeit viel Aufmerksamkeit erhalten hat, könnte als kosmetisch bezeichnet werden, aber das lässt es billig klingen, was es nicht ist. Das Web braucht viel Kosmetik, um seine verschiedenen Schönheitsfehler und Anomalien zu verbergen. Hier finden wir also eine universelle Lösung für das unterschiedliche Erscheinungsbild der Bildlaufleiste, ein CSS-basiertes Icon-Set und einen URL-Verkürzungsdienst, der geradezu brillant ist.
Und wenn Sie mit dieser Menge nicht zufrieden sind, gibt es ein paar schwere Lifter. Zuerst haben wir RubyJS - eine Bibliothek, die Ruby-Codierung in einer reinen JavaScript-Umgebung ermöglicht. Und die Kirsche auf dem Kuchen: BaconJS. Eine Implementierung des Paradigmas der funktionalen Programmierung, die einige Ihrer regelmäßigen Ansätze zur interaktiven Programmierung grundlegend in Frage stellt.
Wenn Sie sich also durch dieses Los arbeiten, wird der Februar geschäftig und gutaussehend sein.
01. Petersilie.js
Kostenlos
Formulare stellen den Designer vor ganz bestimmte Probleme, mit denen er sich nur allzu leicht herumschlagen kann. Der bloße Anblick eines leeren Feldes reicht jedoch aus, um einige Benutzer abzuschrecken. Daher ist es wichtig sicherzustellen, dass die Dateneingabe so schmerzfrei und fehlerfrei wie möglich verläuft. Parsley.js möchte dabei helfen.
Parsley ist in die Datenattribute der Eingabefelder Ihres Formulars eingebunden und bietet eine breite Palette von Routinen, von der Mindestlänge bis zur Gültigkeit der URL. Bei 800 Zeilen ist die Bibliothek ebenfalls winzig, sodass die Erweiterung der Routinen für eine intensivere Validierung nicht zu anstrengend sein sollte.
02. Bist du ein Mensch?
Preis: Kostenlos / $ 19 / $ 79 pro Monat
Haben Sie schon einmal ein Captcha-Formular aufgegeben und sind überzeugt, dass das Ding irgendwie kaputt sein muss? Damit bist du nicht allein. Anscheinend ist etwa ein Viertel der Benutzer von dem unhandlichen Captcha-Validierungsprozess abgeschreckt. Und um alles zu begrenzen, ist der Prozess nicht immun gegen Hacking.
Are You a Human bietet eine viel einfachere und freundlichere Möglichkeit, die Menschlichkeit eines Benutzers zu überprüfen. Eine Reihe einfacher Spiele, die menschliches Verständnis und Entscheidungskompetenz beinhalten, erweisen sich als unterhaltsamere und schnellere Lösung. Und sie funktionieren nicht nur besser, sie sind auch äußerst einfach zu implementieren.
03. X-editierbar
Kostenlos
Wenn Sie Twitter Bootstrap, jQuery UI oder reguläres jQuery verwenden, können Sie mit X-Editable nahezu problemlos bearbeitbare Inhalte auf einer Seite erstellen. Es funktioniert reibungslos, ist einfach zu integrieren und lässt sich agnostisch in Ihren serverseitigen Code integrieren.
Sobald Sie die relevanten CSS- und JavaScript-Dateien eingefügt haben - was eine ziemliche Liste sein kann -, ist die Verwendung von X-Editable so einfach wie das Anwenden von .editable () auf die von Ihnen ausgewählten Elemente und das Festlegen des POST-Mechanismus, mit dem Ihr Backend aktualisiert wird.
Diese und die verbleibenden Optionen zum Anpassen der Erfahrung sind gut dokumentiert, was dies zu einer interessanten Ergänzung der Waffenkammer des UI / UX-Champions macht.
04. Dillinger
Kostenlos
Markdown ist eine ansprechende Idee - das Schreiben von Code mithilfe einer E-Mail-ähnlichen Syntax, die leicht lesbar ist und schnell in normales HTML übersetzt wird. Trotzdem ist es nur eine andere Sache zu lernen, oder? Nun, Dillinger macht diesen Prozess so transparent, dass Sie in kürzester Zeit einsatzbereit sind. Und wenn Sie bereits auf dem Markdown-Wagen sitzen, ist dies eine praktische Option für Code überall.
Dillinger wurde mit einigen der beliebtesten Technologien von heute geschrieben und verwendet Node.js für parallele Konnektivität, Twitter Bootstrap für sein Aussehen, Ace Editor für Eingaben und Showdown, um den Markdown selbst zu handhaben. Exportierte Dateien können Markdown bleiben oder zu HTML springen.
05. Character-Code.com
Kostenlos
Manchmal muss man nur die Zeichencodes kennen, so ist es. Möglicherweise suchen Sie nach der HTML-Codierung des Euro oder dem Integralzeichen oder möchten Ihrem Text einen Zirkumflex-Akzent hinzufügen. Niemand behält dieses Zeug im Kopf und es ist ein regelmäßiger Schmerz im Arsch, eine zuverlässige Ressource zu finden, die alle Grundlagen abdeckt. Das war, bis Sie von charakter-code.com gehört haben.
Schönes Layout, sinnvolle Filter, Unicode / HTML / ASCI - auf einen Blick. Was willst du mehr? In Kürze werden Sie auf charakter-code.com aufgeregt Sätze produzieren, die beginnen: "Ich kenne den Unicode-Wert für ..."
06. Malihu jQuery Custom Scroller 2.3
Kostenlos
Wenn Sie Ihrer Website einheitlich schwungvolle, browserübergreifende benutzerdefinierte Bildlaufleisten geben möchten, hat Manos Malihu genau das Richtige für Sie. Es umfasst Trägheits-Scrolling, Mausrad-Unterstützung und vollständig anpassbare Stile und funktioniert nahezu überall. Es basiert jedoch auf jQueryUI.
Es wird Ihnen verziehen, wenn Sie denken, dass das Stylen einer Bildlaufleiste eines der Dinge ist, die wir bis 2013 möglicherweise geknackt haben. Sie würden sich natürlich irren. Webkit als würdige Ausnahme hilft nicht wirklich, da Sie immer noch eine Alternative für Nicht-Webkit-Benutzer implementieren müssen. Das aktualisierte Plugin von Malihu bietet eine zuverlässige Lösung.
07. Eine Div
Kostenlos
Ein Div ist eine Sammlung von Single-Div-Symbolen, die mit CSS3 gezeichnet wurden. Dieser clevere Ansatz hat den Vorteil, dass er animierbar ist und, sofern er unterstützt wird, genau wie SVG problemlos skaliert werden kann.
Das Problem tritt auf, wenn Sie sich die plattformübergreifende Support-Situation ansehen. Leider gibt es derzeit nur eine Teilmenge der gesamten Sammlung, auf die sich jeder Browser verlassen kann. Hoffentlich wird sich diese Situation weiter verbessern. Und so wird die Bibliothek durch Community-Beiträge weiter wachsen.
08. Zigg.be Alpha
Kostenlos
Wenn Sie jemals jemandem telefonisch eine URL mitteilen mussten, wissen Sie, dass alles, was über das .com hinaus passiert, auch in einer Fremdsprache vorliegen kann. Wenn Sie mit einem Verwandten sprechen, ist dies eine Fremdsprache, die er nicht spricht. Zigg.be beendet gerade diesen Schmerz.
Geben Sie einfach Ihre überkomplexe URL ein, entscheiden Sie, wie lange sie bestehen bleiben soll, und los geht's. Das Ergebnis ist eine kurze, lesbare URL wie zigge.be/wide oder zigge.be/bread zigge.be/lamp. Denken Sie nur, sogar Ihre Großmutter könnte rechtzeitig zu Ihrem Geburtstag zur richtigen eBay-Auktion navigieren. Eine API wäre schön, wenn sie kein Alpha mehr hat.
09. RubyJS
Kostenlos
Wenn Sie ein Ruby-Entwickler sind, aber auch eine bestimmte Menge an JavaScript zum Schreiben haben, werden Sie RubyJS lieben. Basierend auf der Ruby-Kernbibliothek können Sie mit diesem cleveren kleinen Skript (20 KB) Ihre JS in einem Ruby-Stil schreiben. Die mögliche Leistungssteigerung könnte gewaltig sein.
RubyJS bietet JavaScript dieselbe vielseitige Standardbibliothek, von der Ruby profitiert. Es kann entweder im Ad-hoc- oder im OO-Modus voll arbeiten, aber der Hauptpunkt ist, dass die zugrunde liegende Ausgabe immer noch JavaScript ist. Was Sie haben, ist die Möglichkeit, auf eine Weise zu arbeiten, die Ruby und Ihr Wissen darüber nutzt.
10. BaconJS
Kostenlos
BaconJS verwandelt die dynamischen Elemente Ihrer Benutzeroberfläche in beobachtbare Eigenschaften und die Aktivitäten Ihrer Benutzer in Ereignisströme. Diese können Sie kombinieren, filtern und neu kombinieren, bevor Ihre Funktionen Nebenwirkungen verursachen.
BaconJS ist eine JavaScript-Bibliothek für diejenigen, die sich für das etwas esoterische Paradigma der funktionalen Programmierung interessieren. Sie bietet erstklassige Dokumentation und hervorragende Tutorials. Das Ergebnis ist ein erheblich optimierter Code für die Handhabung dynamischer Benutzeroberflächen. Die Konzepte können jedoch etwas umwerfend sein, wenn Sie aus einem regulären prozeduralen / OO-Hintergrund stammen.
Mark Penfold hat viel länger über Design und Technologie geschrieben, als er ohne weiteres zugeben würde. Er schreibt und entwickelt aus seiner Wahlheimat Glasgow.
Mochte dies? Lese das!
- So erstellen Sie eine App
- Kostenlose Grafikdesign-Software steht Ihnen jetzt zur Verfügung!
- Unsere bevorzugten Web-Schriftarten - und sie kosten keinen Cent
- Die besten 3D-Filme des Jahres 2013
- Entdecken Sie, was als nächstes für Augmented Reality kommt
- Kostenlose Texturen herunterladen: hohe Auflösung und sofort einsatzbereit
