Frontend Entwicklung

Praktisch jeder PHP Entwickler bzw. Frontend Entwickler kennt das Gefühl, wenn man sich nicht erklären kann warum PHP bzw. JavaScript sich verhalten, wie sie es tun. Beide dynamischen Sprachen verwirren dabei am liebsten mit ihrem…

Erst seit wenigen Wochen ist die neue Community CodePen online. Gedacht ist diese Plattform zum Austauschen von html, css oder Javascript Snippets. Wenn man möchte, kann man aber auch einfach nur durch die Snippets der anderen Nutzer stöbern. Auf der Startseite befinden sich Listen mit den neuesten oder populärsten Snippets. Von einfachen CSS3-Beispielen bis hin zu komplexen Animationen ist alles vorhanden.…

Animationen waren schon immer ein gutes Stilmittel die eigene Website zu bereichern. Browsergames kommen nicht ohne sie aus. Aber auch einfache Sites profitieren von tollen Animationen wie: - 3D-Menüs mit weichen Effekten (Stichwort "Smoothness") - Links, Buttons, Input-Felder usw. können mit ebenso weichen Feedback-Animationen ausgestattet werden - Coole Übergänge in Bildergalerien und Listings - usw.…

Im ersten Teil dieses Tutorials habe ich die Vorteile und die grundlegende Vorgehensweise, um Javascript nachzuladen, beschrieben. Im zweiten Teil werde ich nun zeigen wie man eine Callback-Funktion integriert und direkt Funktionen aus dem nachgeladenen Script auszuführen. Die Funktion aus dem ersten Teil wird wie folgt…

Viele Webseiten sind inzwischen schon kleine Anwendungen, die jede Menge Javascript-Zeilen beinhalten. In der Regel werden Javascrip-Dateien im Head global für alle Seiten eingebunden. Je nach Anzahl der Scripts können schon einige hundert Kilobyte entstehen, die vom Browser heruntergeladen und interpretiert werden müssen. Das kann den Seitenaufbau verlangsamen. Besonders ärgerlich, wenn eine Funktion nur bei einem Klick auf einen…

Ihr habt das eine oder andere Projekt unter Berücksichtigung von Responsive Webdesign umgesetzt und freut euch nun, dass die Seiten auf allen Displaygrößen gut aussehen. Doch die Bilder werden noch mittels CSS Media Queries im Browser skaliert, was euch stört, weil die Rechenpower der mobilen…

CSS3 bietet Webentwicklern viele neue Möglichkeiten. Die Farbverläufe (linear-gradients) von CSS3 können auch dazu genutzt werden, um coole Muster zu erzeugen.  Neben einfachen Streifen-Effekten sind aber auch Pfeil-, Zick-Zack- oder Würfelmuster möglich. Zunächst aber erst ein einfaches…

Ihr wollt ein neues, modernes Web-Projekt auf die Beine stellen und seid dabei diverse Tools in euer Rohgerüst zu integrieren? Dazu gehört evtl.: Die HTML5Boilerplate (H5BP) Twitters Bootstrap (erfreut sich immer mehr Beliebtheit) und vielleicht auch noch den…

Vor Kurzem habe ich das Frontend-Framework Bootstrap kurz vorgestellt. Heute möchte ich näher auf die Responsive-Eigenschaften eingehen und kurz erklären, wie man diese…

An dieser Stelle haben wir vor zwei Wochen SASS vorgestellt. Was Sass ist und wie man es benutzen kann, könnt ihr in Teil 1 nachschlagen. Ein erstes Feature haben wir mit den…