Articles by Denis Potschien

Google Profile: http://plus.google.com/+DenisPotschien

JavaScript & jQuery

Textures.js: SVG-Texturen für jede Oberfläche

26. April 2015
von
TEXTURE.JS

Das SVG-Format stellt eine Vielzahl an Möglichkeiten bereit, um komplexe grafische Inhalte umzusetzen. Auch Texturen lassen sich mit dem „<pattern>“-Element erstellen und auf Formen anwenden. Aber gerade bei einfachen und gängigen Texturen ist der Aufwand, diese selbst per SVG auszuzeichnen, im Verhältnis zum Ergebnis recht hoch. Daher stellt die JavaScript-Bibliothek „Texture.js“ solche Texturen, die weitestgehend nur aus Linien und Punkten bestehen, für SVG-Elemente zur Verfügung....

HTML/CSS

Was bedeutet Googles neuer Ranking-Faktor mobile-friendly?

21. April 2015
von
Ranking-Faktor mobile-friendly

Immer wieder schraubt Google an seinem Suchalgorithmus, um bessere Ergebnisse liefern zu können. So spielen eine Reihe von Faktoren wie Schlüsselwörter, Linkaufbau und Ladegeschwindigkeit eine entscheidende Rolle dabei, wie stark eine Website von Google bei den Suchergebnissen berücksichtigt wird. Ab dem 21. April, also ab dem heutigen Tage, kommt ein weitere Ranking-Faktor dazu: die Mobilfreundlichkeit einer Seite. Was bedeutet das für Seitenbetreiber und was bedeutet...

JavaScript & jQuery

Awesomplete: Schnelles Autocomplete-Widget, individuell gestaltbar

16. April 2015
von
Awesomplete: Schnelles Autocomplete-Widget, individuell gestaltbar

Dass einem bei einer Sucheingabe per Dropdown eine Liste mit Autocomplete-Vorschlägen angezeigt wird, ist keine Seltenheit. Dank des HTML5-Datalist-Elements lassen sich sehr einfach und ohne JavaScript solche Autocomplete-Listen erstellen. Die Möglichkeiten, diese Listen zu konfigurieren, sind jedoch beschränkt. So lässt sich mit dem Element beispielsweise nicht definieren, ab wie vielen Eingabezeichen die Liste mit den Vorschlägen dargestellt werden soll. Auch gibt es keine Möglichkeit, Vorschläge aus anderen...

Sonstige Programme

WebAnimator Plus: Anspruchsvolle Animationen für moderne Browser erstellen

13. April 2015
von
WebAnimator Plus: Anspruchsvolle Animationen für moderne Browser erstellen

Bis vor einigen Jahren war Flash fester Bestandteil des Webs – vor allem, wenn es darum ging, Animationen zu erstellen und diese auf einer Website bereitzustellen. Abgesehen davon, dass Flash damals fast die einzige Möglichkeit war, um Bewegung in eine Website zu bringen, trug sicher auch die grafische Oberfläche zum Erfolg bei. Animationen ließen sich ohne Programmierkenntnisse erstellen. Mit HTML5 und CSS3 hat sich die...

Apps

UX Companion: Fachbegriffe einfach erklärt per App

11. April 2015
von
UX Companion: Fachbegriffe einfach erklärt per App

Als Webdesigner und -entwickler hat man es häufig mit Fachbegriffen zu tun. Viele dieser Begriffe sind einem so in Fleisch und Blut übergegangen, dass man sich zuweilen schwer tut, diese zu erklären oder zu umschreiben. Bei anderen Begrifflichkeiten weiß man möglicherweise nur grob, was sie bedeuten. Da ist es nicht schlecht, wenn man den ein oder anderen Fachbegriff einmal nachschlägt. „UX Companion“ ist eine Nachschlage-App für...

HTML/CSS

Gut ankommen: Responsives CSS-Dropdown-Menü ohne JavaScript

7. April 2015
von
Gut ankommen: Responsives CSS-Dropdown-Menü ohne JavaScript

Wohin mit der Navigation? Diese Frage muss bei eigentlich jedem Webprojekt beantwortet werden. Gerade bei umfangreichen Websites ist es nicht immer einfach, die richtige Antwort darauf zu finden. Besteht eine Webpräsenz aus vielen Seiten und Unterseiten, bietet sich häufig ein Dropdown-Menü an. Dank CSS lassen sich Dropdown-Menüs ganz ohne Einsatz von JavaScript anlegen und mit Hilfe von Media Queries responsiv gestalten. Das macht die Menüs auch auf mobilen...

HTML/CSS

Circulus.SVG – Kreismenüs mit SVG zum Zusammenklicken

1. April 2015
von
Circulus.SVG – Kreismenüs mit SVG zum Zusammenklicken

Das SVG-Format kann deutlich mehr als vektorbasierte Grafiken bereitzustellen. So lassen sich auch ungewöhnliche Navigationen realisieren, die sich von den sonstigen Menüs sehr schön abheben. Mit Circulus.SVG ist es beispielsweise möglich, eine Navigation in Form eines Kreises oder auch Halbkreises zu gestalten. Dabei lässt sich das Aussehen des Kreises und die Anzahl der Menüpunkte einfach über ein Konfigurationsmenü zusammenstellen. Grundlayout für Kreismenü erstellen Bei vielen SVG-Frameworks muss...

(Kostenlose) Services

Stitches: Kostenloser CSS-Sprite-Generator (auch zum Selberhosten)

30. März 2015
von
Stitches: Kostenloser CSS-Sprite-Generator (auch zum Selberhosten)

Bei der Entwicklung von Websites gilt ja bekanntlich: Je weniger Dateien geladen werden müssen, desto besser ist das für die Ladegeschwindigkeit und den Seitenaufbau. Daher werden gerade Icons und andere vor allem kleine Grafiken oftmals nicht als Einzeldateien angelegt, sondern als Sprite. Dabei werden mehrere Grafiken in einer Bilddatei zusammengefasst. Die Erstellung eines Sprites per Hand erfordert etwas Arbeit. Die Grafiken werden in einer Bilddatei angeordnet....

Design

Flickity: Schicke Galerien auf allen Geräten – responsiv und mit Gestensteuerung

28. März 2015
von
Flickity: Schicke Galerien auf allen Geräten – responsiv und mit Gestensteuerung

Es gibt zahlreiche Lösungen, um Galerien per JavaScript zu realisieren. Mal überzeugt die Bedienung nicht, mal ist der Funktionsumfang eher bescheiden. „Flickity“ hingegen ist ein zeitgemäßes JavaScript-Framework für Galerien, welches nicht nur am Desktop funktioniert, sondern auch für Mobilgeräte bestens geeignet ist. Die Galerie ist responsiv und lässt sich sowohl per Maus als auch per Gesten bedienen – bei Bedarf auch per Tastatur. Dank CSS3 kann man...

Design

HTML5 und CSS3: So machen Sie Ihre Website fit für hochauflösende Displays

16. März 2015
von
HTML5 und CSS3: So machen Sie Ihre Website fit für hochauflösende Displays

Als Apple vor einigen Jahren anfing, seine iPhones, iPads und MacBooks mit hochauflösenden Displays – den sogenannten Retina-Displays – auszustatten, hat das zu einer deutlichen Verbesserung der Darstellungsqualität geführt. Einzelne Pixel sind auf diesen Displays nicht mehr als solche zu erkennen. Mittlerweile sind hochauflösende Displays längst keine Besonderheit mehr. Vor allem aktuelle Mobilgeräte sind schon in der Mittelklasse hochauflösend. Während viele Apps für Mobilgeräte...