Tipps für Entwickler und Designer
Design Tipps

Praktische Design-Tipps für Ihre Webseite

Hier wollen wir euch regelmäßig über Neuigkeiten aus der Design Branche informieren und ein paar Tipps und Tricks aus der Szene verraten. Ob Mockup oder Diagramme erstellen, jQuery Builder, Tutorials und vieles mehr – in unserem Newsletter erfahren Sie wie Sie die verschiedenen Komponenten noch schneller lösen können.

Webseiten schnell und unkompliziert selbst zusammenstellen

 

Auf der Seite layoutit.com können Sie Bootstrap Webseiten einfach und schnell zusammenbauen. Texte, Buttons und andere Bootstrap Module einfach einfügen und danach den HTML Code runterladen. Insbesondere für kleinere Webseiten-Projekte eignet sich diese Methode besonders gut, wenn es nicht eine Seite sein soll, die auf WordPress basiert.
Sie haben hier die Möglichkeit, kurzerhand ein Mockup der Seite zu erstellen sowie Text einzufügen, und können sich damit einen ersten Eindruck über Ihre potentielle neue Seite verschaffen. Das HTML-Gerüst steht dann bereits und braucht lediglich vom Designer oder Entwickler angepasst werden.

Screenshot http://www.layoutit.com/

Screenshot http://www.layoutit.com/

Auf der Seite layoutit.com können Sie Bootstrap Webseiten einfach und schnell zusammenbauen. Texte, Buttons und andere Bootstrap Module einfach einfügen und danach den HTML Code runterladen. Insbesondere für kleinere Webseiten-Projekte eignet sich diese Methode besonders gut, wenn es nicht eine Seite sein soll, die auf WordPress basiert.
Sie haben hier die Möglichkeit, kurzerhand ein Mockup der Seite zu erstellen sowie Text einzufügen, und können sich damit einen ersten Eindruck über Ihre potentielle neue Seite verschaffen. Das HTML-Gerüst steht dann bereits und braucht lediglich vom Designer oder Entwickler angepasst werden.

jQuery Builder

Mit dem jQuery Builder ist es Ihnen möglich, ausschließlich die Module auszuwählen, die Sie auf Ihrer Webseite brauchen. Die entsprechende Version können Sie anschließend problemlos exportieren. Vor allem bei kleineren oder mobilen Webseiten ist dies von besonderem Vorteil, da hier nur wenig jQuery genutzt wird. Anstatt hierbei die vollständige Library einzubinden, können Sie ungenutzte Anwendungen wie beispielsweise „effects“ oder „ajax“ rauslassen. Positiver Nebeneffekt: Sie sparen wieder ein paar KB.

Screenshot http://projects.jga.me/jquery-builder

Screenshot http://projects.jga.me/
jquery-builder

Nettes Feature für eine bessere Usability

Sie haben eine tolle Software, doch die Besucher verstehen nicht, wo sie klicken müssen, um diese Features auch zu nutzen? Dann entscheiden auch Sie sich für dieses JS Plugin. Per Overlay wird den Nutzern hierbei erklärt, wie sie Ihre Software benutzen müssen. Das Plugin lässt sich schnell einrichten und sorgt auch auf Ihrer Webseite für eine bessere Usability und damit eine geringere Absprungrate. Geben Sie Ihrem Webseitenbesucher mit dem JS Plugin eine Hilfe an die Hand und steigern auch Sie Ihre Conversion damit.

Screenshot http://usablica.github.io/intro.js/

Screenshot http://usablica.github.io/intro.js/

Diagramme erstellen leicht gemacht

 

Mit wenigen Handgriffen ein schickes Diagramm erstellen? Mit dem JS Plugin morris.js ist dies ganz einfach möglich. Folgen auch Sie der intuitiven Anleitung und erstellen Sie auf Ihrer Seite mit diesem Plugin ein Diagramm im Handumdrehen.

Screenshot http://www.oesmith.co.uk/morris.js/index.html

Screenshot http://www.oesmith.co.uk/
morris.js/index.html

Bildnachweis

Beitrags- & Headerbild: © Photo by rawpixel on Unsplash

Weitere Beiträge aus dem Bereich