jQueryUI Slider auf feste Werte begrenzen

In meinem letzten Artikel habe ich gezeigt, wie man die jQueryUI-Silder auch auf dem iPad zum laufen bringen kann. Auf ähnliche Weise kann man die Slider-Funktion auch auf andere mobile Geräte portieren und mit der dritten Betaversion von jQuery Mobile halten intuitive und einfache Bedienung von Web-Apps weiter Einzug auf die Handys.

Das nehme ich zum Anlass, um einen weiteren Artikel über Slider zu schreiben, diesmal geht es aber darum, wie man einen Schieberegler auf feste Werte festlegen kann. Der Nutzer soll also nicht stufenlos Werte wählen, sondern nur zum Beispiel die Werte 0, 5, 10, 20, 100 und 150 wählen können. Standardmäßig ist diese Funktion nicht vorgesehen, deshalb muss man den normalen Slider etwas »aufbohren«. weiterlesen…

Nutzeroberflächen fürs iPad – jQuery UI Slider

Mittlerweile sollte ja bekannt sein das ich ein jQuery-Junkie bin. Und mit »Junkie« meine ich, dass ich alles nur noch mit jQuery mache – dynamische Nutzeroberflächen, Webanwendungen ohne ein einziges Neuladen der Seite oder eben auch intuitive Bedienelemente wie zum Beispiel Slider. Für Nutzeroberflächen und Slider benutze ich, ganz konkret gesagt, das jQuery-Plugin jQuery UI. Wer jQuery kennt kennt vermutlich auch jQuery UI – das soll ja auch nicht das Thema des Artikels werden – ein paar Links zum Thema findet ihr am Ende aber trotzdem dazu. weiterlesen…

Wie eine einfache Tagcloud zur schlafraubenen Hürde wird

Letzte Woche bekam ich von einem Designer ein Design für eine Internetseite vorgelegt, in der er ein Wordle zur Darstellung der häufigsten Suchbegriffe benutzt wurde. Ein Wordle zu erstellen ist im Grunde ganz einfach, gibt es dafür doch eine einfache Online-Anwendung. Einziger Nachteil: jedes Mal, wenn sich die Begriffe ändern, muss das Wordle von Hand neu erzeugt werden. Da in meinem Fall die Wörter jedoch dynamisch erzeugt werden, stellt dies eine echte Hürde dar.

Auf den ersten Blick erschien mir JavaScript für diese Aufgabe am geeignetsten, auf den zweiten Blick auch, also machte ich mich an die Arbeit und schrieb ein kleines jQuery-Plugin – zumindest dachte ich, es würde ein kleines Plugin werden. Doch schnell tauchten die ersten Probleme auf. Ich konnte zwar recht einfach mit outerWidth() und outerHeight() die Größe, die das Wort brauchen würde, ermitteln, aber wie sollte der Algorithmus aussehen, der diese dann platziert? weiterlesen…

5 Felder für eine Adresse? Zu viel ist zu viel!

Immer wieder steht man als Webentwickler vor dem Problem, dem Nutzer eine Formularoberfläche anbieten zu müssen. Natürlich sollte diese Möglichst benutzerfreundlich sein, denn der Nutzer soll das Formular ja auch ausfüllen. Oft sind einzelne Komponenten des Formulars aber unnötigerweise auf mehrere Formularfelder verteilt. Wie weit sollte man hier bei dem Zusammenfassen von Formularfeldern gehen? weiterlesen…

jQuery: Bilder zuschneiden direkt im Browser

Für die meisten Bildergalerien hat es bisher ausgereicht, wenn ein zufälliger Bildausschnitt als Vorschaubild ausgeschnitten wird. Deshalb war es bisher nicht nötig, dem Nutzer die Möglichkeit zu geben, direkt im Browser einen Bildausschnitt zu wählen. Doch vor kurzem stand ich vor der Aufgabe, für eine junge Fotografin aus Iserlohn eine Bildergalerie zu programmieren. Da die Bilder auf der Internetseite im Vordergrund stehen sollten, mussten sie besser in Szene gesetzt werden.

In diesem Artikel soll es darum gehen, wie man eine Nutzeroberfläche zum Zuschneiden von Bildern realisieren kann. Mit dem JavaScript-Framework jQuery und ein wenig PHP ist dies tatsächlich nicht schwer. weiterlesen…

Nutzeroberflächen müssen intuitiver werden – ein Gastbeitrag auf t3n.de

Es gibt mal wieder einen Gastbeitrag von mir auf t3n.de zu lesen. Hier ein kurzer Auszug:

Nutzeroberflächen müssen intuitiver werden

Heute schreibe ich einen Artikel, den man nicht nur auf Webanwendungen, sondern im Grunde auf jedes Programm und jede digitale Nutzeroberfläche beziehen kann. Warum? Weil mir das Thema seit langem auf der Seele brennt. Es geht um die Kommunikation zwischen Mensch und Maschine. weiterlesen…

CSS3-Buttons ohne Grafiken erstellen – ein Gastartikel auf t3n.de

Nachdem ich für daswebdesignblog.de den Artikel »CSS3-Suchfeld – Verläufe und runde Ecken« geschrieben habe, wird jetzt ein Artikel von mir auf t3n.de veröffentlicht. Hier ein Auszug:

CSS3-Buttons ohne Grafiken erstellen

In diesem Artikel will ich zeigen, wie auch komplexe Buttons ohne Photoshop oder Grafiken nur mit CSS erstellt werden können. weiterlesen…

jQuery UI – intuitive Interaktion zwischen Nutzer und Anwendung

Usability gehört zu den wichtigsten Kriterien für gutes Webdesign. Egal wie toll eine Internetseite aussieht, wenn der Benutzer die Navigation nicht versteht oder es nicht schafft, seine Bestellung abzuschicken, hat die Seite ihren Zweck verfehlt.

Mithilfe von JavaScript lassen sich viele Aufgaben für den Nutzer drastisch vereinfachen. In diesem Artikel geht es darum, wie man mit jQuery UI intuitive und einfach zu bedienende Benutzeroberflächen schaffen kann. weiterlesen…

CSS3-Suchfeld – ein Gastartikel auf daswebdesignblog

Anfang der Woche konntet ihr es schon bei Twitter lesen, jetzt ist es so weit! Bei daswebdesignblog ist jetzt ein Artikel von mir zu lesen. Hier ein Auszug:

CSS3-Suchfeld – Verläufe und runde Ecken

Es ist nicht lange her, da habe ich für ein Suchfeld eine riesige Grafik erstellt und dann mit CSS das Suchfeld und den Submit-Button über die Grafik gelegt – alles sehr kompliziert.

Wieder einmal kann ich nur bewundern, wie schön die Web-Welt doch mit CSS3 geworden ist. Für das gleiche Suchfeld reichen jetzt ein paar Zeilen CSS und ein kleines Icon. weiterlesen…