Bilder & Vektorgrafiken bearbeiten

Responsives Webdesign: So finden Sie die richtigen Fotos

13. August 2015
von Denis Potschien
5
responsivefotos-teaser_DE

Für Webdesigner ist das mobile Internet eine große Herausforderung. Websites müssen auf unterschiedlich großen Displays mit verschiedenen Seitenverhältnissen gut aussehen – vom Desktoprechner, über das Tablet bis zum Smartphone. Dazu kommt, dass hochauflösende Displays an Verbreitung gewinnen. Neben vielen technischen und gestalterischen Dingen, die man als Webdesigner und -entwickler beachten muss, gehört auch die Auswahl geeigneter Fotos. Diese müssen möglichst auf allen Geräten und in allen Auflösungen gut funktionieren. Unser heutiger Artikel soll sich daher gezielt dem Thema widmen, wie Sie die richtigen Fotos für responsives Webdesign finden.

JavaScript & jQuery

Neun JavaScript-Bibliotheken zum Gestalten interaktiver Charts

12. August 2015
von Andreas Hecht
5
interaktivecharts-teaser_DE

Eine Menge Daten mit sehr vielen Variablen möchte gut strukturiert und möglichst interaktiv dargestellt werden. Rohe Datensätze sind schwer zu verstehen, deshalb müssen Daten erst aufbereitet werden, um sie verständlich zu machen. Diagramme können hier hilfreich sein. Im Webdesign können wir für diese Aufgabenstellung Charts nutzen, denn auch hier sind Diagramme eine der besten Möglichkeiten zur Visualisierung von komplexen Datensätzen. Das Hinzufügen von interaktiven Möglichkeiten gibt dem Leser die Möglichkeit, mit den Datensätzen zu interagieren. Interaktive Charts sind recht leicht in eine Website zu integrieren, vor allem mit der Hilfe einiger JavaScript-Bibliotheken. Im heutigen Beitrag stellen wir Ihnen neun Bibliotheken vor, mit denen sich interaktive Diagramme leicht realisieren lassen.

Design

CSS Stats informiert über die Stylesheets einer Website

11. August 2015
von Denis Potschien
1
cssstats-teaser_DE

Bei einer umfangreich gestalteten Website verliert man schon einmal den Überblick über die Stylesheets. Neben allgemeinen CSS-Angaben für das Grundlayout der Website sind häufig auch ganz spezielle Stylesheets für besondere Inhalte vorhanden. Die Website CSS Stats gibt einen umfassenden Überblick über die hinterlegten Stylesheets eines Webprojektes und verrät in nackten Zahlen und übersichtlichen Auflistungen, was alles definiert wurde.

Photoshop

Photoshop kreativ: So einfach simulieren Sie eine doppelte Belichtung

10. August 2015
von Dirk Metzmacher
3
doppelte-belichtung-teaser

Im analogen Zeitalter waren doppelte Belichtungen noch leicht möglich: ein Foto wurde aufgenommen, der Film zurück gespult und ein weiteres Fotos geschossen. Mit etwas Glück entstanden so fast künstlerische Kombinationen zweier Motive. In Photoshop können Sie diesen Effekt simulieren und weitaus leichter kontrollieren. Sie benötigen nur das passende Ausgangsmaterial.

(Kostenlose) Services

Link des Tages: Aktuelle Nachrichten von Webdesigner News

7. August 2015
von Dieter Petereit
0
Webdesigner News

Will man stets auf dem Laufenden sein, was modernes Webdesign und zeitgemäße Entwicklung betrifft, so hat man sich ganz schön was vorgenommen. Mein eigener RSS-Reader ist bepackt mit über 500 Feeds – Tendenz steigend. Natürlich kostet mich allein das Sichten (und Verwerfen) dieser News einen Haufen Zeit, und das, obwohl sämtliche Artikel schon im verhältnismäßig leicht bekömmlichen Leseformat vorliegen. Man stelle sich vor, ich müsste all diese Seiten tatsächlich manuell abklappern. Das wäre beim besten Willen nicht zu leisten und würde auch wirtschaftlich betrachtet, den Aufwand nicht rechtfertigen. Im Tech-Sektor gibt es das beliebte TechMeme, dessen River hinab stets die heißesten Tech-News plätschern, aber was sollen Webdesigner und -entwickler tun? Stimmt schon, es gibt auch für uns ein paar nützliche Dienste, wenn auch vielleicht bloß eine Handvoll. Heute zeige ich Ihnen den gerade gewachsenen sechsten Finger…

Design

Slideout.js: Off-Canvas-Navigation mit Gestensteuerung

7. August 2015
von Denis Potschien
0
slideoutjs

Die Gestaltung einer für Mobilgeräte optimierten Website ist mitunter eine große Herausforderung. Der wenige Platz, der auf mobilen Geräte zur Verfügung steht, macht es nicht immer einfach, alle relevanten Inhalte unterzubringen. Gerade Navigationen stellen häufig ein Problem dar, da sie oft viel Platz einnehmen. Daher verschwinden Navigationen oft außerhalb des sichtbaren Bereichs einer Website und werden über eine Schaltfläche eingeblendet. Solche Off-Canvas-Navigationen sind beliebt, praktisch und werden vor allem in mobilen Apps gerne eingesetzt. Mit Slideout.js lässt sich eine Off-Canvas-Navigation einfach in ein eigenes Webprojekt integrieren – inklusive Gestensteuerung, was vor allem auf Mobilgeräten der Usability entgegenkommt.

Tipps, Tricks & Tutorials

WordPress Loop mal anders: So heben Sie den ersten Beitrag ab

6. August 2015
von Andreas Hecht
0
wordpress-loop-teaser_DE

Eine häufig genutzte Funktion des beliebtesten CMS der Welt ist die unterschiedliche Darstellung des ersten Artikels in der Blogansicht, wie es auch hier bei Dr. Web auf der Startseite realisiert ist. Allerdings ergeben sich bei der Umsetzung dieser Aufgabe Fallstricke, die es zu umgehen gilt. Ich zeige Ihnen heute, wie Sie etwa den ersten Artikel anders darstellen können und so Darstellungsprobleme vermeiden.

E-Business

8 Dienste für freie E-Mail-Newsletter-Templates und wie man sie einsetzt

5. August 2015
von Andreas Hecht
3
8 Dienste für freie E-Mail-Newsletter-Templates und wie man sie einsetzt

Für viele Online-Geschäftsbereiche ist es mittlerweile unerlässlich, E-Mail-Newsletter zu versenden. Doch auch private Anwendungsbereiche für Newsletter sind durchaus vorstellbar. Vielleicht möchten Vereine oder Hobby-Gruppen sich auf diese Art und Weiseim Gespräch halten. Egal welchen Anwendungsbereich Sie sich für einen E-Mail-Newsletter vorstellen können, zuerst einmal benötigen Sie eine schicke Vorlage, die möglichst responsiv ist, damit man den Newsletter auf allen denkbaren Geräten einwandfrei lesen kann. Daher stellen wir Ihnen in diesem Artikel einige Quellen für kostenlose Newsletter-Templates vor und zeigen Ihnen, wie einfach sich die Templates mit dem E-Mail-Client Ihrer Wahl nutzen lassen.

Design

SmallPDF: Umfassender PDF-Werkzeugkasten als Web-App

4. August 2015
von Denis Potschien
0
SmallPDF: Umfassender PDF-Werkzeugkasten als Web-App

Adobe Acrobat ist nach wie vor die Standardlösung für das Erstellen, Bearbeiten und Optimieren von PDF-Dateien. Seit es die Document Cloud gibt, steht einem neben der Desktopanwendung auch eine Webanwendung mit den wichtigsten PDF-Funktionen zur Verfügung. Mit smallpdf gibt es einen ganz ähnlichen Dienst, mit dem man per Webanwendung PDF-Dateien unter anderem erstellen, konvertieren und zusammenfügen kann. Im Gegensatz zur Document Cloud von Adobe ist smallpdf kostenlos.

Design

SVG Circus: Animationen per Web App

3. August 2015
von Denis Potschien
1
svgcircus-teaser_DE

Mit dem SVG-Format ist es nicht nur möglich, statische Vektorgrafiken zu erstellen. Auch Animationen lassen sich damit realisieren. Während Grafikprogramme wie Adobe Illustrator das Speichern statischer SVG-Formate ermöglichen, gibt es kaum Anwendungen, mit denen auch SVG-Animationen erstellt werden können. Über die Web App SVG Circus können genau solche animierten Grafiken im SVG-Format angelegt werden. Anders als bei vielen JavaScript-SVG-Frameworks muss man hier weder JavaScript, noch SVG-Auszeichnung beherrschen. Alles läuft über eine grafische Oberfläche, die sehr einfach zu bedienen ist.