Kategorien
Webdesign

9 Kalendergeneratoren für digital-analoge Weltenwanderer [Update]

Es mag schon etwas altmodisch klingen, wenn ich über Möglichkeiten schreibe, Kalender zu generieren. Immerhin gibt es heutzutage zahlreiche bequemere Möglichkeiten, an eigene Termine erinnert zu werden. Dennoch sind Kalender, welche auf eine „altmodische“ Art und Weise erstellt wurden, nicht sinnlos und können beispielsweise ein schönes Geschenk sein. Im folgenden Beitrag präsentiere ich Ihnen einige Dienste, die sich dem Thema gewidmet haben. Viel Spass damit!

Kalendergeneratoren

Kalenderblattgenerator

Die erste Quelle ist Kalenderblattgenerator. Auf dieser Seite können Sie sich Ihr persönliches Kalenderblatt erstellen, allerdings nur für einen Monat. Um dies zu tun, wählen Sie den gewünschten Zeitraum aus den unten stehenden Jahr- und Monatslisten. Zusätzlich können Sie Ihr Kalenderblatt mit einem Photo versehen (im PNG-Format). Dafür müssen Sie das gewünschte Bild von Ihrer Festplatte hochladen. Es wird automatisch skaliert. Um das Kalenderblatt fertig zu stellen, klicken Sie auf „bauen“. Nun wird Ihr Kalenderblatt erzeugt.

kalender-1
Kalenderblatt mit Motiv generieren

Hartmanns Kalendergenerator

Weiter geht es mit Kalendergenerator von Hartmann. Mit dem Kalendergenerator erstellen Sie eine iCalendar-Datei (.ics) mit Ihrer Monatseinteilung. Diese iCalendar-Datei können Sie in allen gängigen Kalenderprogrammen, wie z.B. iCal, Outlook, Google Calendar, etc. importieren. Bevor der Dienst allerdings genutzt werden kann, muss man sich registrieren.

kalender-2
Möglichkeit, eigene Touren zu planen: Kalendergenerator.hartmann

Kestos Kalendergenerator

Kommen wir zum Kalendergenerator von Kesto. Hier geht’s besonders einfach: Kalendervorlage auswählen, Zeitraum wählen und auf „pdf generieren“ klicken. Das war’s. Unter „erweiterte Optionen“ haben Sie die Möglichkeit, bestimmte Wochentage oder Feiertage hervorzuheben.

kalender-3
Kaledergenerator von Kesto

Kalendergenerator von Time And Date

Weiter geht es mit einem Kalendergenerator von Time And Date. Der Generator steht seit Dezember 2015 auch in einer deutschen Variante zur Verfügung. Hier können Sie ebenfalls für ein beliebiges Jahr einen Kalender erstellen lassen. Um dies zu tun, müssen Sie das gewünschte Jahr in das entsprechende Fenster eintippen. Sie können auch einen Kalender erstellen, indem Sie ein bestimmtes Land auswählen. Auf diese Weise wird Ihr Kalender mit länderspezifischen Feiertagen ausgestattet.

kalender-4
Kalendergenerator von Time And Date

Kalendergenerator von Linker.ch

Der nächste Kalendergenerator stammt von von Linker.ch. Linkers Generator verhält sich identisch zu dem von Time And Date.

kalender-5
Kalendergenerator von Linker.ch

Kalendergenerator von BigHugeLabs

Auch die BigHugeLabs kommen mit etwas vergleichsweise weder big, noch hugem wie einem Kalendergenerator. Hier finden Sie die Möglichkeit, einen Monatskalender mit Ihren Fotos erstellen lassen. Sie können ein gewünschtes Bild aus Ihrem Flickr- oder Facebookaccount auswählen und dabei festlegen, welcher Bildteil auf dem Kalender gezeigt werden soll. Zusätzlich können Sie sich eine Kalendergröße aussuchen.

kalender-6
Kalendergenerator von BigHugeLabs

Dodecahedron von Ole Arntzen

Ole Arntzen aus Norwegen bietet Ihnen die Möglichkeit, einen Kalender ungewöhnlicher Form erstellen zu können. Zur Wahl stehen verschiedene Dodecaeder, 12-seitige Würfel mit Monatskalendarien darauf. Haben Sie das übersichtliche Konfigurationsformular ausgefüllt, können Sie Ihren Kalender als PDF oder PostScript downloaden. Nun heißt es ausdrucken und basteln. Viel Spaß dabei…

kalender-7
Kalender in Dodecaederform

Kalender von Incompetech

Incompetech, mutiger Name übrigens, bietet Ihnen die Möglichkeit, Kalender verschiedener Größen generieren zu können. Wählen Sie gewünschte Parameter aus der Tabelle auf der Homepage, klicken Sie auf „get pdf“ und fertig ist Ihr Kalender!

kalender-9
Kalender von Incompetech

Onlinekalender mit iKalender

Zum Schluss noch eine Quelle, mit deren Unterstützung Sie nicht Kalender für Ihre Homepage erstellen, sondern auch Ihre gesamte Terminverwaltung im Stile etwa des Google Calendar online erledigen können. Diese Möglichkeiten bietet Ihnen iKalender. Um den Dienst nutzen zu können, müssen Sie sich auf der Homepage registrieren. iKalender ist kostenlos, bitte aber um Spendenunterstützung.

kalender-10
Demo eines iKalender

(dpe)

Kategorien
Fotografie Inspiration

Mund zu! 30+ erstaunliche Fotomanipulationen

Wer gerne fotografiert, der bearbeitet seine Bilder auch gerne. Profifotografen sagen: „You don’t just take a photo, you make it!“ Was gibt es Schöneres, als mit einem Foto zu spielen, indem man verschiedene Effekte, Filter oder Farben hinzufügt. Die Ergebnisse sind unterschiedlich: manchmal unschön, manchmal mittelmäßig, aber sehr oft wahrhaftig erstaunlich! Einige Beispiele schöner Fotomanipulationen stelle ich Ihnen im folgenden Beitrag vor. Mir ist des Öfteren der Kiefer runtergefallen…

Designer: Erik Johannson Werkzeug/Technik: Photoshop CS6 Quelle: erikjohanssonphoto.com

Diese Fotomanipulationen sind nichts für labile Kiefer!

Im Folgenden stelle ich Ihnen einige von mir ausgewählte Beispiele vor. Ausschlaggebend für die Auswahl war mein persönlicher Geschmack ;-)

Designer: Mikko Lagerstedt Werkzeug/Technik: Photoshop CS6 Quelle: behance.net
Designer: Mikko Lagerstedt

Werkzeug/Technik: Photoshop CS6

Quelle: behance.net

Designer: Fábio Araujo Werkzeug/Technik: Photoshop CS6 Quelle: behance.net
Designer: Fábio Araujo

Werkzeug/Technik: Photoshop CS6

Quelle: behance.net

Designer: FINISHIZER Werkzeug/Technik: Photoshop CS6 Quelle: behance.net
Designer: FINISHIZER

Werkzeug/Technik: Photoshop CS6

Quelle: behance.net

Designer: Fabio Arajuo Werkzeug/Technik: Photoshop CS6 Quelle: behance.net
Designer: Fabio Arajuo

Werkzeug/Technik: Photoshop CS6

Quelle: behance.net

Designer: The Swan Photography Werkzeug/Technik: Photoshop CS6 Quelle: thedesigninspiration.com
Designer: The Swan Photography

Werkzeug/Technik: Photoshop CS6

Quelle: thedesigninspiration.com

Designer: Michael Oswald Werkzeug/Technik: Photoshop CS6 Quelle: boredpanda.com
Designer: Michael Oswald

Werkzeug/Technik: Photoshop CS6

Quelle: boredpanda.com

Designer: Michael Oswald Werkzeug/Technik: Photoshop CS6 Quelle: boredpanda.com
Designer: Michael Oswald

Werkzeug/Technik: Photoshop CS6

Quelle: boredpanda.com

Designer: Michael Oswald Werkzeug/Technik: Photoshop CS6 Quelle: boredpanda.com
Designer: Michael Oswald

Werkzeug/Technik: Photoshop CS6

Quelle: boredpanda.com

Designer: Michael Oswald Werkzeug/Technik: Photoshop CS6 Quelle: boredpanda.com
Designer: Michael Oswald

Werkzeug/Technik: Photoshop CS6

Quelle: boredpanda.com

Designer: Allison Wonderland Werkzeug/Technik: Photoshop CS6 Quelle: flickr.com
Designer: Allison Wonderland

Werkzeug/Technik: Photoshop CS6

Quelle: flickr.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: Patrick Monkel Werkzeug/Technik: Photoshop CS6 Quelle: creattica.com
Designer: Patrick Monkel

Werkzeug/Technik: Photoshop CS6

Quelle: creattica.com

Designer: Tomek Zelmanski Werkzeug/Technik: Photoshop CS6 Quelle: creattica.com
Designer: Tomek Zelmanski

Werkzeug/Technik: Photoshop CS6

Quelle: creattica.com

Designer: Kevin Roodhorst Werkzeug/Technik: Photoshop CS6 Quelle: creattica.com
Designer: Kevin Roodhorst

Werkzeug/Technik: Photoshop CS6

Quelle: creattica.com

Designer: ClockworkDesigns Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: ClockworkDesigns

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: Emerald-Depths Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: Emerald-Depths

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: Erik Johannson Werkzeug/Technik: Photoshop CS6 Quelle: erikjohanssonphoto.com
Designer: Erik Johannson

Werkzeug/Technik: Photoshop CS6

Quelle: erikjohanssonphoto.com

Designer: Erik Johannson Werkzeug/Technik: Photoshop CS6 Quelle: erikjohanssonphoto.comWerkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: Erik Johannson

Werkzeug/Technik: Photoshop CS6

Quelle: erikjohanssonphoto.com

Designer: Erik Johannson Werkzeug/Technik: Photoshop CS6 Quelle: erikjohanssonphoto.comWerkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: Erik Johannson

Werkzeug/Technik: Photoshop CS6

Quelle: erikjohanssonphoto.com

Designer: Erik Johannson Werkzeug/Technik: Photoshop CS6 Quelle: erikjohanssonphoto.comWerkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: Erik Johannson

Werkzeug/Technik: Photoshop CS6

Quelle: erikjohanssonphoto.com

Designer: Erik Johannson Werkzeug/Technik: Photoshop CS6 Quelle: erikjohanssonphoto.comWerkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: Erik Johannson

Werkzeug/Technik: Photoshop CS6

Quelle: erikjohanssonphoto.com

Designer: Erik Johannson Werkzeug/Technik: Photoshop CS6 Quelle: erikjohanssonphoto.comWerkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: Erik Johannson

Werkzeug/Technik: Photoshop CS6

Quelle: erikjohanssonphoto.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com

Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

Designer: streetatmosphere Werkzeug/Technik: Photoshop CS6 Quelle: devianart.com
Designer: streetatmosphere

Werkzeug/Technik: Photoshop CS6

Quelle: devianart.com

(dpe)

Kategorien
Fortbildung Inspiration JavaScript & jQuery Programmierung Tutorials

JavaScript und jQuery: Mit diesen Tutorials gelingt der Einstieg auf jeden Fall

Wenn man etwas Neues lernen will, ist es wichtig, von Anfang an gute Quellen zu verwenden. Schlechte Lernquellen vermitteln unqualitatives, häufig auch fehlerhaftes Wissen. So ist es überall – natürlich auch beim Erlernen von JavaScript. Ich habe daher im folgenden Beitrag einige zuverlässige Websites mit Anleitungscharakter zusammengestellt. Die Tutorials zu jQuery sind dabei nicht nur für Einsteiger interessant. Da kann sicherlich der ein oder andere Profi sein Wissen mindestens aufpolieren.


(Bildquelle: shutterhacks auf Flickr | CC-BY-SA)

JS The Right Way: ein Leitfaden für JavaScript-Anfänger

Um Missverständnisse rund um JavaScript zu vermeiden und zu verhindern, dass Anfängern fehlerhaftes Wissen vermittelt wird, kreierte William Oliveira unter JS the right way einen sehr nützlichen Leitfaden, der uneingeschränkt empfehlenswert ist.

Was ist „JS The Right Way“?

Hinter der Entstehung von „JS The Right Way“ steckt die Motivation, Anfängern in JavaScript qualitativ hochwertiges Wissen zu vermitteln. Die Webseite stellt einen Leitfaden dar, welcher Quellen mit nützlicher Lehrinformation aufzeigt. Er beginnt mit einer kleinen Einleitung, die das Ziel des Tutorial erklärt. Der Guide befindet sich noch in der Aufbauphase, wobei einige gute Sachen schon eingefügt sind. Jeder kann zum Aufbau beitragen, Vorschläge werden vor einer eventuellen Integration sorgfältig überprüft.

Bisheriger Umfang des Leitfadens

Nach der Einleitung und einigen Erläuterungen zum entstehenden Guide startet man mit dem Leitfaden. Darin finden Sie Quellen zum Thema JavaScript, die der Betreiber für seriös und gut befunden hat. Als erstes wird kurz erklärt, was JavaScript eigentlich ist und wie sich die Verwendung entwickelt hat. Längst ist JavaScript zu einem der Motoren des Web geworden, was Beispiele wie das serverseitige Framework node.js eindrücklich belegen.


node.js: Server-side JavaScript

Als weitere gute Quelle, welche zahlreiche Referenzen, Neuigkeiten rund um JavaScript sowie verschiedene Versionen davon enthält, wird das Mozilla Developer Network vorgestellt.


Referenzen und Neuigkeiten rund um JavaScript finden Sie auf Mozilla Developer Network

Weiter geht es mit Stil. Hier wird ein Styleguide mit einem interessanten Namen empfohlen: Idiomatic. Um den Code sauber zu bekommen, sollten Sie das Tool JSHint benutzen.


Ein Guide für JS-Anfänger: Idiomatic.js


Zahlreiche Patterns werden vorgestellt

Ein Beispiel hierfür kommt aus der Rubrik „Creational Design Patterns“ und stammt von Addy Osmani.


Factory Patterns: ein Ausschnitt aus dem Code

Wo gehobelt wird, da fallen Späne. Dennoch sollte man versuchen, durch gezielten Einsatz des Hobels so wenig Späne wie möglich zu erzeugen. Hierzu bieten sich Testing Tools an. Auch zu diesem Thema finden Sie einige gute Quellen. Zum Beispiel Mocha, ein Framework zum Testen von JavaScript.


Mocha: ein Code-Beispiel

Zur Weiterbildung sind Bücher sowie auch Kontakte zu wichtigen Leuten in diesem Bereich nützlich. Eine Liste kostenloser JS-eBooks wird vorgestellt. Ebenfalls in Listenform findet sich eine Übersicht interessanter JS-Profis, denen zu folgen sich nicht nur für Anfänger lohnt.


Kostenlose JS-Bücher

Listen finden sich noch etliche, so etwa solche mit JavaScript PaaS Providern, JavaScript Package Managern und Frameworks. Es kann als sicher gelten, dass Sie etwas Nützliches für sich finden werden.

jQuery-Tutorials nicht nur für Anfänger

Vielleicht beschäftigen Sie sich schon eine Weile mit Webdesign und kennen sich in HTML5, CSS und anderen Sprachen gut aus. Vielleicht sind Sie ein Anfänger im Webdesign und beginnen erst, diese wunderbare Welt zu erforschen. Auf jeden Fall ist Ihnen der Begriff „jQuery“ schon viele male begegnet. Ob Sie ein Profi darin sind oder – wie ich – noch keine Ahnung davon haben, werden Ihnen die folgenden Tutorials der Website jQuery Fundamentals sicherlich behilflich sein.


(Bildquelle: methodshop auf Flickr | CC-BY-SA)

jQuery Fundamentals

Wir beginnen mit einem englischsprachigen Tutorial von Bocoup, einer Open Web Technology Firma. Der Name des Tutorial lautet erklärend: jQuery Fundamentals. Das Tutorial verspricht Ihnen, dass Sie nach dem Durcharbeiten in der Lage sind, jQuery Probleme selbstständig zu lösen. Dafür müssen Sie natürlich die Lektionen im Tutorial samt der Übungen gewissenhaft durchkauen.

JavaScript Basics

Sie beginnen mit Grundlagen von JavaScript, da jQuery eine Bibliothek von JavaScript ist. In dieser Rubrik werden Ihnen diese Grundlagen in ziemlich knapper und übersichtlicher Form mit Beispielen erklärt. Oben rechts finden Sie einen Editor. In jedem Beispiel gibt es oben ein Augenzeichen. Klicken Sie darauf, erscheint das Beispiel im obigen Editor und Sie können das Ergebnis des Code sehen.


Ein Code-Ausschnitt

Traversal and Manipulation Methods

In diesem Abschnitt werden Ihnen Funktionen vorgestellt, mit deren Hilfe Sie verschiedene Elemente in einer DOM-Struktur effektiv suchen und verändern können. Die Funktionen, welche dies gewährleisten nennt man traversale und manipulierende Funktionen.


Ein Code-Ausschnitt

Event Handler

Hier geht es mit Event Handlers weiter. Dabei handelt es sich um Mechanismen, die verschiedene Ereignisse, z.B. Mausklicks, erkennen. Nach der Erkennung ruft das Skript bestimmte Funktionen auf und führt diverse Aktionen als Antworten auf diese Ereignisse aus.


Event Handler: ein Code-Ausschnitt

Effects

In diesem Kapitel erfahren Sie einiges über Effekte, welche mit jQuery realisiert werden können.


Einführung in die Effekte: ein Code-Ausschnitt

Zudem finden Sie einige Workshop-Angebote rund um jQuery.

jQuery-Tutorial: Einführung und Grundlagen von Matthias Schütz

Ein weiteres jQuery-Tutorial für Anfänger kommt von Matthias Schütz. Das Tutorial ist deutschsprachig. Schütz gibt eine Einführung in die Welt von jQuery in Form eines Artikels. Weiter unten finden Sie zahlreiche hilfreiche Links zum Thema, sodass Ihr jQuery-Studium keinesfalls nur auf diesen Beitrag beschränkt ist.


Matthias Schütz gibt Ihnen eine kompakte jQuery-Einführung in deutscher Sprache

Links zu weiteren jQuery-Tutorials

Wer nun immer noch nicht genug hat, findet hier eine große Liste mit Tutorials und zahlreichen Tipps und Tricks zum Thema.


Eine grosse Sammlung von jQuery-Tutorials

(dpe)

Kategorien
(Kostenlose) Services Design Essentials HTML/CSS

8+ Formulargeneratoren für die eigene (mobile) Homepage

Formulargeneratoren sind so alt wie das Netz und entstammen der Zeit der alten Geocities und anderer Selbstbau-Website-Heimstätten. Niemand der dort Aktiven hatte Ahnung von HTML, teilweise war auch der Codezugriff gar nicht möglich. So wurden Formulargeneratoren, sogar Gästebuchgeneratoren galt es zu erdulden, zur Selbstverständlichkeit. Bevor Sie jetzt denken, dass diese Dienste heutzutage völlig überflüssig wären, sollte erwähnt werden, dass die heutigen Generatoren mit denen aus grauer Vorzeit zumeist (leider nicht stets) nur noch den schlechten Ruf gemein haben. Ich habe mir einige dieser Vertreter angesehen und dabei auch vor mobilen Websites nicht halt gemacht. Erschrecken Sie nicht: auch von der üblen Sorte sind noch haufenweise am Markt…

5 Formulargeneratoren für die klassische Website

Hier werden wir sie finden, die Gespenster der Vergangenheit ;-)

Der Formular-Chef

Das erste Tool für die Erstellung von HTML-Formularen ist der Formular-Chef. Mit Hilfe dieses kostenlosen Tools können Sie ganz hundsgemeine Formulare erstellen, wie sie jeden Tag im Alltag benötigt werden. Auf der Hauptseite wird Ihnen das Tool kurz vorgestellt. Dann können Sie sich die Grundkonfiguration eines Formulars anschauen, sich über die Minimalanforderungen informieren, sowie die Beispielformulare ansehen. Bei den Beispielformularen handelt es sich um Templates. Sie suchen sich einfach einen Formulartyp aus und erhalten den entsprechenden Code kostenfrei.


Beispielformulare als Templates


Start: die Grundkonfiguration

Beim Stöbern auf der Webseite des Formular-Chef finden Sie zahlreiche weitere Informationen zu Features, aber auch Anleitungen und FAQs. Das Tool richtet sich nach meinem Verständnis vornehmlich an die Anfänger im Webdesign, respektive den DIY-Homepagebauer.

All U Want

Nicht „all you can eat“, aber trotzdem sehr nützlich, wenn es um einen kostenlosen Formgenerator geht. All U Want bietet Ihnen kostenlose Homepage-Tools für die eigene Webseite. Hier finden Sie Features für Umfragen, Gästebucheinträge, Formulare, Formmailer oder Fotoalben. Die angebotenen Features können vom Nutzer mit einem individuellen HTML-Code oder einem Link in die Homepage integriert werden. Um den Zugang zu diesen Features zu erlangen, müssen Sie sich bei dem Anbieter registrieren. Das ist kostenlos. Laut All U Want werden Ihre Daten nicht an Dritte ohne Ihr Einverständnis weitergegeben. Auch dieser Dienst ist vor allem für diejenigen hilfreich, die keine (oder keine guten) HTML-Kenntnisse haben.


All U Want: ein Überblick über die Tools

Frontend DWFormgenerator

DW-Formmailer soll laut der Beschreibung des Anbieters ein Tool für Profis sein. Damit ist es möglich, individuelle Formulare zu erstellen. Der Formmailer dient zur Übermittlung von Daten, die in ein Web-Formular eingegeben wurden. Das Tool kann sowohl kostenlos als auch gegen Bezahlung, dann mit erweiterten Möglichkeiten verwendet werden.


DWFormgenerator: die Startseite

Kingtools

Auch für die Verwendung der Kingtools wird kein HTML-Wissen benötigt. Kingtools bietet Ihnen 20 Homepagetools. Die Tools können schnell in die Webseite eingebunden werden und sind einfach zu verwalten. Das Design kann per CSS individuell angepasst werden. Um das ganze Paket zu erhalten und in die Webseite einbauen zu können, ist eine Registrierung notwendig. Vorsicht: auch wenn das Angebot sehr verlockend aussieht, so muss man mit dem Datenschutz doch aufpassen. Der Betreiber behält sich vor, persönliche Daten der Nutzer beispielsweise für Werbung oder Marktforschung weiterzugeben.


Kingtools: ein Überblick

Interwebline

Interwebline ist ein weiteres Portal für Seitenbetreiber, welches zahlreiche Tools kostenlos anbietet, unter anderem auch einen Formmailer. Für Neulinge auf dem Gebiet der Homepageerstellung wird ein Support angeboten. Für Fortgeschrittene und Profis sind verschiedene Tools geeignet, mit deren Hilfe die Webseite aufgestockt werden kann. Auf der gut strukturierten Webseite finden Sie zudem Tutorials für HTML-Anfänger, einige Infos zum Thema Graphik, sowie Tipps und Tricks. Eine interessante Quelle für Anfänger und (Semi-)Profis!


Interwebline: die Startseite

Drei Dienste, die Kontaktformulare für mobile Geräte generieren

Das mobile Internet entwickelt sich rasch. Noch vor wenigen Jahren schien es undenkbar, eine Webseite auf einem mobilen Gerät auch nur anzuschauen. Heute gehört es zum Alltag. Wer sich mit Webdesign beschäftigt, muss sich nicht nur um eine „normale“ Version seiner Webseite kümmern. Vielmehr wird immer häufiger zusätzlich eine mobile Variante gefordert. Das betrifft dann natürlich auch etwa Kontakt- und andere Formulare. Im folgenden stelle ich Ihnen ein paar Dienste vor, welche dabei helfen wollen, Kontaktformulare für mobile Webseiten schnell zu erstellen.


So können Ihre mobilen Formulare aussehen

Get Formly: online mobile Formulare erstellen

Erster Dienst, welcher es erlaubt, mobile Webseitenformulare schnell zu erstellen ist Get Formly. Sie können sofort online ein eigenes Formular erstellen. Der Dienst ist allerdings nicht kostenlos. Nur eine Demo Version eines Formulars kann erstellt werden. Um ordentlich mit dem Dienst zu arbeiten, muss man sich für einen von drei Tarifen entscheiden, den Geldbeutel auspacken und kann erst dann los legen. Eine gute Einführung in die Dienstnutzung vermittelt Ihnen ein aussagekräftiges Bild. So können Sie qualifiziert entscheiden, ob sich die Investition wohl für Sie lohnen wird.

Klicken Sie auf „Build your first form“, werden Sie zu einer Formularauswahl weitergeleitet. Um zu verstehen, was die jeweilige Formularart bedeutet, führen Sie den Mauszeiger über den jeweiligen Button. Beispielsweise möchten Sie ein Multiple-Choice-Formular basteln. Ziehen Sie den entsprechenden Button in ein Feld, welches sofort bei der Auswahl rechts erscheint. Ein Menu entsteht, in dem sich Ihre Frage und Antwortmöglichkeiten befinden. Der Dienst schlägt Ihnen irgendeine beliebige Frage vor, weist Sie aber sogar darauf hin, dass Sie doch lieber eine interessantere Frage verwenden sollten.


Get Formly: Formulare erstellen mit Tipps

Der Hinweis auf eine interessantere Frage ist nicht der einzige, der Ihnen begegnen wird. Buchstäblich jeder Button wird erläutert. Nachdem Sie sich da durchgecklickt haben, können Sie endlich weitere Optionen zu Ihrem Formular hinzufügen und schliesslich auf „Preview“ klicken.


Vorschau eines fertigen Formulars

Schlussendlich geben Sie Ihre E-Mail-Adresse an und wählen ein Passwort. Get Formly verspricht Ihnen, Ihr Postfach nicht mit Spam zu füllen.


Um Ihr Formular zu erhalten,müssen Sie erst Ihre E-Mail-Adresse angeben

Form Smarts

Formsmarts ist ein Dienst, welcher ebenfalls eine Möglichkeit bietet, Formulare für mobile Geräte zu erstellen. Hier gibt es sowohl kostenpflichtige Versionen als auch eine kostenlose Basic-Version. Um die Basic-Version nutzen zu können, müssen Sie sich erstmal registrieren. Nach der Bestätigung der E-Mail-Adresse kann es nun mit der Formerstellung losgehen. Melden Sie sich mit Ihrem Account an, klicken Sie auf „My Forms“ auf der Startseite unten. Geben Sie alle notwendigen Informationen ein und klicken Sie auf „Create Forms“. Danach gehen Sie auf „create fields“ und erstellen Sie ein Feld. Sind Sie damit zufrieden, klicken Sie auf den Button „Forms“. Sie erhalten einen Code für Ihren Formular.


Embed Code Ihres Formulars

Um weitere Einstellungen im Formular durchzuführen, klicken Sie auf den Bleistift in der oberen Menüleiste. Ein Fenster mit weiteren Einstellungsmöglichkeiten erscheint. Nicht alle Funktionen können bei der Basic-Version genutzt werden, allerdings halte ich persönlich diese für nicht nötig. Für die private Webseite reichen meiner Meinung nach die angebotenen Möglichkeiten vollkommen. Nachdem Sie fertig sind, speichern Sie die Einstellungen unter „save changes“. Sind Sie mit allem zufrieden, kopieren Sie den Code und bauen ihn auf Ihrer Webseite ein. Wie Sie es am besten tun sollten, erfahren Sie indem Sie auf das Fragezeichen neben „URL“ klicken. Ihnen werden ausführlichste Informationen darüber gegeben, wie Sie Ihr Formular in Ihre Webseite einbauen können.

P-Form

Noch eine Quelle zum Erstellen von HTML5-Formularen, welche auch für eine mobile Webseite geeignet sind, ist pForm. Hier wählen Sie als erstes ein Layout in IHrer Wunschfarbe. Unten klicken Sie auf „Next“. Im Menu rechts wählen Sie eine Formularart. Dann gestalten Sie Ihr Formular beliebig und nachdem Sie fertig sind, klicken Sie auf „Download Form“. Der HTML-Code samt Bottom, Header, den CSS-Dateien und weiterem Zubehör kommt zu Ihnen in einer zip-Datei verpackt. Was ich gut finde: hier ist keine Registrierung oder die Angabe einer E-Mail-Adresse notwendig.


P-Form: ein kleines Beispiel

Fazit: Als ich auf der Suche nach Möglichkeiten zur Erstellung mobiler Formulare war, musste ich feststellen, dass die meisten davon nicht kostenlos sind. Viele versprechen zunächst, sie seien kostenlos. Dann aber verlangen sie eine aufwändige Registrierung und am Ende stellt sich heraus, dass nur ein Formular kostenlos erstellt werden kann. Die kostenlosen Anbieter reichen meiner Meinung nach nur für sehr simple Formulare. Möchten Sie aber etwas Qualitatives haben, empfehle ich Ihnen doch den Griff zum Geldbeutel. Zum Schluss habe ich für Sie noch drei nette Mobile-Forms-Anbieter aufgelistet, welche nicht kostenlos sind, aber dafür durch die Qualität an Formularen eher überzeugen.

  • iFlyMobi-Applikation zur Erstellung von mobilen Formularen.
  • DeviceMagic: mobile Formulare werden mittels eines Online-Designers erstellt.
  • Mobify: ein Editor für die Erstellung von mobilen Webseiten (und Formularen).

(dpe)

Kategorien
Essentials Icons & Fonts

Angebissen: 5 Iconsets für echte Apple-Fans

Heute stellen wir Ihnen ganz spezielle Icons vor, nämlich solche für wahre Apple-Fans. Wenn wir die Verkaufszahlen etwa des iPhone 5 als aussagekräftig definieren, dann können wir wohl als sicher annehmen: Wahre Apple-Fans gibt es ganz schön viele. Falls Sie sich angesprochen fühlen, wird Sie der folgende Beitrag besonders freuen. Wir stellen Ihnen nämlich fünf Iconsets in Apple-Optik vor. Alle sind völlig kostenfrei, aber nicht alle zu jedem Zweck verwendbar! Egal, schön sind sie alle. Und darauf kommt es bei echten Fans schließlich an!

appicns

Appicns ist ein Projekt, geführt von Kara und Andrew McCarthy. Die Icons erhalten Sie gegen eine ungewöhnliche Bezahlung. Sie müssen einen Tweet darüber versenden. Nachdem der Tweet abgeschickt ist, können alle Icons als Zip-Datei runtergeladen werden.


Einige Apple-Icons von appicns.com


So sieht der Download aus: Pay with a Tweet

Polestack

Das Polestack Icon-Set wurde von Delta Nine, einem User der deviantArt-Plattform, entwickelt. Im Paket sind drei Symbolsätze enthalten. Im ersten Set sind alle Icons in Schwarz dargestellt. Der zweite Satz beinhaltet Icons, welche im Stil einer Schultafel kreiert sind. Der dritte enthält Icons, welche wie ein Holzaufdruck aussehen. Jeder Satz enthält die Icons im ICNS-, PSD- und PNG-Format, alle sind in einer Zip-Datei verpackt. Die Größe der Icons in jedem Set beträgt 512×512 px. Der Download ist kostenlos, genutzt werden dürfen diese allerdings nur privat. Ich fand dieses Set dennoch sehr hübsch und als Inspirationsquelle gut geeignet.


Polestack-Set: ein Überblick


Black Stack: ein Beispiel


Schultafel-Style: ein Beispiel


Holz-Style: ein Beispiel

Holz-Laufwerke

Dieses Icon-Set enthält Symbole in der Optik hölzerner Laufwerke. Diese originelle Idee und ihre Umsetzung stammt von Thrasos Varnava, ebenfalls ein User von deviantArt. Die Icons sind im ICNS- und PNG-Format enthalten und in einer Zip-Datei verpackt. Die Größe aller Icons ist 512×512 px. Sie stehen unter der Creative Commons Attribution-Noncommercial-No Derivative Works 3.0 Lizenz.


Wooden-Slick-Drives-Set: ein Überblick


Wooden-Slick-Drive Icon: Movies

Mac USB Icons

Die Icons dieses Sets sehen aus wie USB-Stecker für den Mac. Meiner Meinung nach eine ebenfalls coole Idee. Der Designer des Set ist Ömer Cetin, ein Illustrator aus der Türkei. Die Icons sind im ICN- und PNG-Format enthalten und wiederum in einer zip-Datei verpackt. Die Größen der Icons im PNG-Format betragen 256×256 px, 128×128 px, 64×64px und 32×32 px. Icons im ICN-Format sind nur in der Größe von 256×256 px vorhanden. Das Set steht unter der Creative Commons Attribution-Noncommercial-No Derivative Works 3.0 Lizenz.


Mac USB Icon

Totem Pole Icons

Diese Icons sind von Talos Tsui kreiert. Allerdings dürfen Sie diese ausschliesslich zu privaten Zwecken verwenden. Die Icons liegen im dmg-Format in einer Zip-Datei verpackt vor und sind für die Betriebssysteme Mac und Windows verfügbar.


Totem Pole Icon Set

(dpe)

Kategorien
(Kostenlose) Services Essentials Icons & Fonts

Typechart und Typophile: Nützliche Ressourcen für Typografie-Interessierte

Über die Bedeutung der Typografie im Webdesign wissen wir alle Bescheid. Ohne Basiskenntnisse in Typografie geht gar nichts. Kein schönes, aber ein aussagefähiges Beispiel dafür ist die Webseite meiner ersten Schule in Minsk. Nachdem Sie auf „Ok“ klicken, dürfen Sie ein starkes Beispiel schlechter Webseitentypografie sehen. Ich persönlich hatte nach dem Betrachten dieser Website den drigenden Wunsch, wieder mal ein paar nützliche Typografie-Quellen für Sie herauszufischen. Dabei bin ich auf zwei hochinteressante Dienste gestoßen. Es handelt sich um Typechart und Typophile, die ich Ihnen im folgenden Beitrag vorstellen möchte.


(Bildquelle: zigazou76 auf Flickr | CC-BY-SA)

Typechart: Schnell beurteilen, wie welche Schriftart auf welchem System aussehen wird

Typechart ist ein Service, der Ihnen Arbeit und schlechte Erfahrungen ersparen kann. Er bietet Ihnen die Möglichkeit, sich anzuschauen, wie Schriften auf verschiedenen Betriebsystemen (Windows und Mac OS) aussehen. Haben Sie eine Schriftart gefunden, welche für die von Ihnen entwickelte Webseite optimal ist, können Sie auch den CSS-Code bekommen und dürfen diesen auf Ihrer Webseite verwenden. Der Service ist komplett kostenfrei.

Typechart: die Herangehensweise

Bei Typechart haben Sie mehrere Möglichkeiten. Zum einen können Sie in der Rubrik „Typeface“ direkt nach einer Schriftart suchen. Die von Ihnen gewählte Schriftart (z.B. Arial/Helvetica) wird in allen Größen und Hervorhebungen aufgelistet.


Arial/Helvetica: alle Größen und Hervorhebungen

Zum zweiten können Sie nach bestimmten Hervorhebungen unter der Rubrik Emphasis suchen. Hier wählen Sie zwischen „Normal“, „Bold“,“Italics“ und „Uppercase“ und schon erhalten Sie eine Liste von Schriften in der gewünschten Hervorhebung:


Schriften mit der Hervorhebung „Bold“

Schließlich können Sie noch nach einer bestimmten Schriftgröße schauen. Das ist unter „Type size“ möglich. Wählen Sie zwischen „Small“, „Medium“, „Large“ oder „Extra large“ und bekommen Sie alle Schriftarten in der entsprechenden Größe aufgelistet.


Schriften in der Größe „Medium“

Was noch erwähnt werden muss, ist die sogenannte Style ID für schnelle Suche einer bestimmten Schriftart. Jede Schriftart hat so eine Style ID. Kennt man diese, kann man sie im Suchfeld eintippen und direkt finden.

Neben jeder Schriftart rechts befinden sich drei Buttons: „Win“, „Mac“ und „Get CSS“. Wenn Sie auf „Win“ klicken, sehen Sie, wie eine bestimmte Schrift auf dem Windows-Betriebssystem aussieht. Analog verhält sich der „Mac“-Button für das Betriebssystem Mac OS. Und mit einem Klick auf „Get CSS“ bekommen Sie den CSS-Code für die von Ihnen gewählte Schriftart.


Anatomischer Überblick

Typophile: News, Foren, Blogs, Wiki – alles rund um die Typografie

Foren sind die Dinosaurier des digitalen Zeitalters. Fragen stellen, Antworten geben, über verschiedene Themen diskutieren… Das gefiel schon den Nutzern, die noch via Akustikkoppler auf die damals sog. Bulletin Board Systems gegangen sind, um dort Gleichgesinnte zu finden. Und natürlich verhält es sich so nicht nur bei Fussball-oder Lady Gaga-Fans, sondern auch bei Freunden der Typografie. (Gibt es überhaupt ein Thema, zu dem es kein Forum gibt?)

Deshalb stelle ich Ihnen im folgenden ein Forum vor, welches speziell für Typografie-Fans gemacht ist: Typophile.


(Bildquelle: !!!! scogle auf Flickr | CC-BY-SA)

Typophile.com: ein umfangreiches Angebot

Erstmal ein paar allgemeine Informationen zur Website. Typophile wurde im Jahre 2000 von Jared Benson als Forum gegründet. Das Forum beschäftigte sich mit den Themen Typografie, Fonts und Schriftarten. Typophile bietet heutzutage aber viel mehr als nur die Beantwortung von Fragen und Themendiskussionen. Das ist, was Sie auf Typophile.com alles finden werden:


Typophile: Startseite

Eine Vielfalt unterschiedlicher Foren zum Oberbegriff Typografie

Als Erstes finden Sie hier viele Foren, in denen rund um Typographie, also über Schriftarten, aber auch Software und Bücher diskutiert wird. Gestellte Fragen oder Diskussionsthemen werden klassifiziert. So wird ein Durcheinander vermieden. Sie können nach einer Schriftart fragen, ein Quizz spielen, Kritik abgeben und etliches mehr. Besonders beliebt scheint das Thema Font-Identifizierung zu sein, beim Durchstöbern bin ich permanent auf Fragen á la „Welcher Font ist das denn?“ gestoßen.


Typophile: ein Ausschnitt der Foren-Palette

Eine Vielfalt unterschiedlicher Blogs zum Oberbegriff Typografie

Hier finden Sie eine Ansammlung von User-Blogs. Bei Typophile können User eigene Blogs zum Thema führen. Schöne Fonts zum Verkauf gefunden? Fonts aus der Geschichte? Etwas anderes, was mit Typografe zu tun hat? Dann nichts wie etwa einen Screenshot davon machen und im Blog posten.


User-Blog Beispiel 1: Fonts zum Verkauf


User-Blog Beispiel 2: ein Font aus den Fünfzigern


User-Blog Beispiel 3: Graphic Design aus den Achtzigern

TypoWiki: user-generiertes Lexikon zu Typografie

Unter TypoWiki finden Sie ein Lexikon, welches von Usern des Forum erschaffen wurde. Dieses Lexikon wird auch von den Usern verwaltet und weiterentwickelt, mit der Motivation, eine hilfreiche nützliche Wissensquelle für Typographie-Liebhaber daraus zu machen.


TypoWiki: eine Übersicht

Hier finden Sie zu jedem Begriff eine Reihe von informativen Links, die Sie tiefer in das interessierende Thema führen können. Blogs, Geschichte, Geographie, Bücher, Terminologie und viel mehr: User von Typophile leisten hier meiner Meinung nach tolle Arbeit.

Aktuelle News zum Thema

In der Rubrik News finden Sie frische Nachrichten aus der Typographie-Welt. Seien es Konferenzen, neue Software oder Fonts: fleissige User filtern das Netz auf Neuigkeiten und bereiten es für die restlichen Leser auf.


News: Beispiel

Typophile Film Festival

Ein typographischer Trailer muss in diesem Post ebenfalls erwähnt werden. Laut meiner Recherche hat das letzte Festival im Jahre 2009 stattgefunden. Insgesamt wurden fünf solche Festivals durchgeführt. Hier ging es um die besten typographischen Filme, welche von Menschen aus der ganzen Welt gemacht wurden.


Screenshots aus den Festival-Filmen

Fazit: Persönlich finde ich die Webseite Typophile.com gut gelungen. Wer sich für Typographie leidenschaftlich interessiert, findet hier zahlreiche Informationen und Quellen zum Thema, sowie auch Möglichkeiten, bei interessanten Projekten mitzumachen und neue Kontakte zu knüpfen. Was mich etwas stört, sind Posts, die nicht am richtigen Platz sind. Leider kommt das häufiger vor. Beispielsweise werden Fragen, welche eigentlich in ein Forum gehören, teilweise als Blogpost oder Kommentar publiziert. Der User wird zwar darauf hingewiesen, sein Post bleibt jedoch am falschen Ort. Abgesehen von diesem kleinen Wermutstropfen ist Typophile sehr empfehlenswert. Schauen Sie selbst. Ich bin sicher, es werden auch für Sie interessante Informationen dabei sein.

(dpe)

Kategorien
(Kostenlose) Services Essentials

4 komfortable Webservices zur Bearbeitung von PDF-Dateien

PDF, das Portable Document Format aus dem Hause Adobe, ist aus dem Internet nicht mehr wegzudenken. Insbesondere die Tatsache, dass PDF-Dateien ihr Layout über alle Plattformen konsistent, inklusive etwaiger Schriftarten, behalten und recht gut gegen unberechtigte Manipulationen geschützt werden können, hat PDF zu einem der wichtigsten Dokument-Formate des Web werden lassen.

Trifft man irgendwo auf einen Text zum Download, er wird in der Regel als PDF vorliegen. Der kostenfreie PDF-Reader ist eine der am weitesten verbreiteten Softwares überhaupt. Zum Lesen taugt er, aber was tun, wenn man ab und an mal ein PDF bearbeiten muss?

Gelegentlich ist es notwendig, mehrere PDF-Dateien in eine zusammenzufügen, sie aufzuteilen oder zu drehen. Hier erweisen sich Online-Dienste, die diverse Bearbeitungen schnell durchführen können und einfach zu bedienen sind, als sehr hilfreich. Heute werde ich Ihnen einige solcher Dienste vorstellen.

Sejda

Sejda ist ein Webdienst zur Bearbeitung von PDF-Dokumenten. Die PDFs können nach dem Hochladen gedreht, aufgeteilt, zusammenfügt, per Passwort verschlüsselt werden und noch einiges mehr. Auf der Startseite des Dienstes steht eine umfangreiche Featureübersicht bereit. Haben Sie sich für einen Bearbeitungsvorgang entschieden, laden Sie Ihr Dokument hoch, klicken auf „Continue“ und warten das Resultat ab. Schnell und bequem bekommen Sie Ihre PDF-Datei bearbeitet zurück. Sejda befindet sich derzeit noch in der Beta-Phase. Weitere Features werden für die finale Version versprochen.


Sejda.com: Startseite

I Love PDF

Ein weiterer Dienst zur PDF-Bearbeitung ist I Love PDF. Hier funktioniert es ähnlich wie bei Sejda. Allerdings ist I Love PDF nicht ganz kostenlos. Dennoch können Sie mit Ihren PDF-Dateien schon einiges anstellen, bevor der Griff ins Portemonnaie erforderlich wird. Nur ist dann die Anzahl an Dokumenten, welche hochgeladen werden, geringer und ebenso die nutzbare Speicherplatzgröße.


I Love PDF: Startseite

PDFescape

PDFescape reiht sich fast nahtlos in unsere kleine Zusammenstellung ein. Allerdings liegt der Fokus hier mehr auf der Bearbeitung der Inhalte. Sie können Textstellen mit einem Marker hervorheben, eine Notiz einfügen, die Reihenfolge ändern und das alles online im Browser. Voraussetzung für die Nutzung ist eine Registrierung. Legen Sie sich einen Account zu und laden Sie Ihr Dokument hoch. Sie finden zahlreiche Tools zur PDF-Bearbeitung.


PDFescape

PDF My URL

PDF My URL fällt etwas aus dem rahmen, kann dafür aber etwas spezielles. Der Name des Dienstes spricht für sich: PDF My URL wandelt die von Ihnen angegebene URL in eine PDF-Datei um, um Sie lokal speichern zu können.


PDF My URL konvertiert die von Ihnen angegebene Webseite in PDF

Joli Print

Joli Print verfolgt einen ähnlichen Ansatz wie „PDF my URL“. Auch hier können Sie eine URL in PDF umwandeln lassen. Geben Sie jedoch den Link beispielsweise zu einem Artikel an, erhalten Sie in wenigen Sekunden diesen Artikel als PDF. Der Text samt Bildern wird dabei schön formatiert und werbungsfrei an Sie geliefert.


Joli Print: Beiträge aus Online-Medien schick formatiert als PDF

Leider wurde Joliprint zwischenzeitlich eingestellt. Danke für den Hinweis an Aaron Ethan Fox.

Haben wir einen wichtigen Dienst vergessen? Ergänzen Sie gern in den Kommentaren!

(dpe)

Kategorien
Inspiration Showcases

Hohoho 2012: Noch mehr Wallpaper mit Weihnachtsmotiven

Alle Jahre wieder. Fröhliche, oder auch weniger fröhliche Weihnachtsstimmung, Geschenke einkaufen, Tannenbaum schmücken, Weihnachtsmärkte und und und… Fast ist es soweit. Morgen ist Heiligabend. Jetzt müssten Sie eigentlich alle Aufgaben erledigt, alle Geschenke beisammen haben. Alle? Haben Sie auch an Ihren Computer-Desktop gedacht? Wie, der ist noch mit dem Strandbild aus dem Sommerurlaub versehen? Dann wird es höchste Zeit für ein weihnachtliches Motiv. Im folgenden Beitrag haben wir eine ganze Reihe davon zusammengestellt.

Alle Weihnachts-Wallpaper im Überblick

In der folgenden Galerie finden Sie Informationen über den Künstler, die Download-Quelle und den Titel des Werks. Um innerhalb der Galerie von Wallpaper zu Wallpaper navigieren zu können, klicken Sie entweder auf die Bilder oder verwenden Sie die Navigationselemente unterhalb des Beschreibungstextes. Hohoho!

Übrigens: Zu Beginn der Adventszeit haben wir bereits schon einmal 50 Weihnachtswallpaper gesammelt. Die finden Sie hier

(dpe)

Kategorien
Inspiration Showcases

20 nicht alltägliche Wallpaper für iPads mit Retina-Display

Neben Hintergrundbildern für mein iPhone 5 benötigte ich dieser Tage auch einen neuen Satz von Wallpapers für mein iPad 3. Auch hier gibt es eine breite Vielfalt wählbarer Möglichkeiten. Es ist nicht schwierig, irgendwas zu finden. Es ist aber schwierig, Gutes zu finden. Und so suchte ich einige Stunden, die meiste Zeit vergeblich. In diesem Beitrag zeige ich Ihnen die Wallpaper, die mir am besten gefielen. Natürlich kann ich hier bloß meinen eigenen Geschmack repräsentieren, aber vielleicht gefällt dem einen oder anderen von Ihnen meine kleine Auswahl ja auch…

Alle Wallpaper im Überblick:

Nähere Informationen, nebst Links zum Download und zum Entwickler finden Sie auf den jeweiligen Detailseiten zum Wallpaper. Innerhalb der Galerie können Sie bequem von Wallpaper zu Wallpaper navigieren. Dazu klicken Sie entweder schlicht auf die Bilder oder verwenden die Navigationselemente unterhalb des Beschreibungstextes.

Kategorien
Inspiration Showcases

20 schicke Wallpaper für das iPhone 5

Wallpaper – völlig nutzlos, aber heißbegehrt. Von ganz schlicht bis hin zu grafischem Overload reicht die Palette. Für mein neues iPhone 5 begab ich mich auf die Suche nach modernen, nicht zu überladenen Hintergrundgrafiken. Hier ist, was ich fand. Vielleicht gefällt dem einen oder anderen von Ihnen meine kleine Auswahl ja auch…

Alle Wallpaper im Überblick:

Nähere Informationen, nebst Links zum Download und zum Entwickler finden Sie auf den jeweiligen Detailseiten zum Wallpaper. Innerhalb der Galerie können Sie bequem von Wallpaper zu Wallpaper navigieren. Dazu klicken Sie entweder schlicht auf die Bilder oder verwenden die Navigationselemente unterhalb des Beschreibungstextes.

Kategorien
E-Business SEO & Online-Marketing

Unroll.me hilft, nervige Newsletter auf einen Schlag los zu werden

Es geht schon auf die Nerven, wenn man am frühen Morgen seine E-Mails checkt und dort Dutzende von Newslettern findet, zwischen denen man die wichtigen Mails erst suchen muss. Das Problem mit den Newslettern hatte auch Perri Gorman und so entstand das Tool, welches ich Ihnen heute vorstellen möchte: Unroll.Me.


(Bildquelle: pj_vanf auf Flickr | CC-BY-SA)

Ich denke, im Laufe seines Lebens abonniert jeder zahlreiche Newsletter von verschiedenen Anbietern. Oft ist es so, dass ein Thema für uns mal brennend wichtig ist und wir darüber permanent informiert werden wollen. Das führt zu einem Newsletter-Abonnement. Nach einer oft kurzen Zeit allerdings gehört das Thema der Vergangenheit an, die Newsletter bleiben aber. Das macht sie zu einer Art Spam. Manchmal noch nach einigen Jahren gehen sie uns auf den Wecker. Abbestellen ist meistens aufwändig. Ich persönlich hatte keine Zeit und Lust, mich auf einer Anbieterseite zum Abbestell-Formular durch zu klicken, deshalb bevorzugte ich einfaches Löschen. Der neue Web-Service Unroll.Me verspricht Abhilfe.


Startseite von Unroll.Me

Zuerst einige allgemeine Informationen zu Unroll.Me. Das Tool befindet sich noch in der Beta-Version. Aus diesem Grunde funktioniert es leider nur für E-Mail-Accounts bei Google. Das Team arbeitet daran, Unroll.Me für Yahoo, AOL und andere Accountanbieter funktionsfähig zu machen. Derzeit kann nur in englischer Sprache gearbeitet werden. Zukünftig wird das Tool aber für mehrere Sprachen verfügbar sein. Um Unroll.Me nutzen zu können, muss man sich registrieren (natürlich kostenlos). Dann kann es los gehen.

Alle Newsletter auf einen Schlag abbestellen

Als erstes muss man angeben, welcher E-Mail-Anbieter verwendet wird. Will man hier eine andere Antwort als „Google“ geben, geht es nicht weiter. Dann akzeptieren Sie die Nutzerbedingungen und werden nach Ihrer Zustimmung gefragt, da das Tool auf Ihre Kontakte zugreifen will. Wichtig: die Sprache in Ihrem Google-Mail-Account muss auf Englisch eingestellt sein, sonst kommt folgende Fehlermeldung:


Achtung: die Sprache im Google-Konto muss Englisch sein

Im Auftretensfalle folgen Sie den Anleitungen, welche das Tool Ihnen bietet. Aktivieren Sie in Ihrem Google-Konto IMAP und stellen Sie die Sprache Englisch (US) ein. Versuchen Sie danach das Ganze von vorne. Bei mir hat es dann geklappt und ich durfte dieses schöne Bildchen als Willkommensgruß sehen.


Willkommen bei Unroll.me

So, jetzt erhielt ich eine Liste von derzeit bei mir auf dem Google-Konto vorhandenen Abonnements. Zum Glück waren es nicht viele, aber genug, um die Funktionsweise des Tool zu demonstrieren. Ich war etwas verwirrt, was den Unsubscribe-Button anging. Wo war er denn?


Finde den Unsubscribe-Button

Nach einigen Minuten Suche fand ich ihn. Neben jedem Newsletter-Anbieter befindet sich jeweils ein roter Punkt. Um nervige Newsletter abzubestellen, sollten Sie erstmal mit der rechten Maustaste darauf klicken. Rechts erscheint der erwünschte Unsubscribe-Button und beim Klicken darauf wird der Newsletter abbestellt.


Da ist ja der Button!

Puh, endlich. Die bei mir im Google-Briefkasten vorhandenen Abonnements wurden deaktiviert! Jetzt warte ich ungeduldig darauf, dass Unroll.Me auch andere E-Mail-Accounts reinigen kann. Bei mir im Yahoo-Briefkasten haben sich nämlich zahlreiche nervige Newsletter angesammelt…

Fazit

Im Grunde genommen halte ich Unroll.me für eine sehr gute Erfindung. Nun sieht man zurzeit, dass das Tool noch nicht fertig entwickelt ist. Die Tatsache, dass nur Google-Mail akzeptiert wird, ist meiner Meinung nach eine starke Beschränkung des Nutzwertes. Zudem lassen die Spracheinstellungen Besseres wünschen. Nicht jeder will oder kann nur englische Sprache verwenden, auch wenn diese international ist. Auch finde ich, dass es schon etwas schwierig war, den Unsubscribe-Button zu finden. Ich hätte ihn nämlich direkt neben dem Newsletter-Anbieter erwartet. Aber wie schon gesagt, Unroll.me ist vielversprechend. Außerdem ist es kostenlos und sicherlich wird es bald super funktionieren. Vielleicht…

(dpe)

Kategorien
Essentials Icons & Fonts

Turbomilk: Ungewöhnliche Iconsets aus Russland

Icons erfreuten sich schon immer großer Beliebtheit. In den letzten Jahren jedoch hat die Verbreitung der Symbolzeichen siegeszugartige Ausmaße angenommen. Originelle, kreative Icons sind Details, ohne die man nicht auskommt. Völlig unentbehrlich sind die kleinen Bildzeichen im mobilen Webdesign. So können lange Funktionsbezeichnungen kleinen, aussagekräftigen Symbolen weichen, was den zur Verfügung stehenden Bildschirmplatz erweitert. Deshalb und weil es so schön ist, setzen wir bei Dr. Web immer wieder einen Fokus auf die Suche nach herausragenden Iconsets. Im heutigen Post stellen wir ein paar Exoten aus Russland vor: Icons, kreiert von der russischen Designerfirma Turbomilk.

Was verbirgt sich hinter der Bezeichnung Turbomilk?

Turbomilk ist, wie schon oben erwähnt, eine Webdesignfirma aus Russland. Turbomilk legt Tätigkeitsschwerpunkte auf die Erstellung von Icons, Illustrationen und Interface-Designs. Turbomilk hat meiner Meinung nach einen etwas kitschigen Style, aber das ist Geschmackssache und es gibt auch viele schöne und ungewöhnliche Werke. Ich habe für Sie drei empfehlenswerte Iconsets ausgesucht.

Icons zum 10. Geburtstag von LiveJournal

Zum 10. Geburtstag von LiveJournal kreierte Designer Mike Zhiharev sechs Icons als Geschenk an das Magazin. Diese Icons können aber nicht nur von LiveJournal-Usern sondern von jedermann genutzt werden. Sie finden hier drei User-Typen: Männlich, Weiblich und Anonym. Weiterhin gibt es ein Bleistift-Symbol, Markenzeichen des Magazins, eine Ziege (Maskottchen des Magazins) und einen Suppentopf. Alle Icons liegen im PNG-Format vor und sind in einer Zip-Datei verpackt. Sie können diese Icons frei nutzen, allerdings soll auf die entsprechende Webseite verwiesen werden.


LiveJournal-Icons

Zoomed-Eyed Creatures als Icons

In diesem Icon-Set spiegelt sich eine interessante Idee zur Darstellung von Applikationen wider. Hier schauen Sie eine Applikation an und diese Applikation schaut zurück! Und zwar mit grossen niedlichen Augen. Diese Idee hatte Designerin Olesya Kozlova. Sie können diese Icons frei verwenden, aber Sie sollten aufpassen, dass Sie von ihnen nicht hypnotisiert werden. Die Symbole werden im PNG-Format innerhalb eines Zip-Archivs geliefert.


Grosse Augen: Applikations-Icons starren Sie an

Pacman ist zurück

Erinnern Sie sich an dieses Spiel? Jetzt können Sie Pacman auch als Iconset verwenden. Dieser Symbolsatz wurde von den Designern bei Turbomilk zusammen mit den Designern des Smashing Magazine kreiert.


Pacman Returns…

(dpe)

Kategorien
Design HTML/CSS

Ihre Website in 3D mit Meny und CSS 3D Transforms

CSS 3d Transforms sind häufiger Thema bei Dr. Web. Diese Technik erlaubt komplexe, dabei beeindruckende Effekte, die ansonsten nur mit proprietärer Software, etwa Flash, möglich wären. Heute präsentieren wir Ihnen mit dem CSS3-Experiment Meny eine weitere Möglichkeit der Anwendung von CSS 3D Transforms.


3D-Meny: die Startseite

Was ist Meny?

Meny ist ein Experiment. Es demonstriert, wie CSS3 3D-Transforms auch zur Erstellung eines Navigationsmenüs eingesetzt werden können. Das Schöne an Mey ist, dass Sie es nicht erst umständlich implementieren müssen, vielmehr reicht es, diesem Link „lab.hakim.se/meny/?http://“ beispielsweise „drweb.de/magazin“ hinzuzufügen. Der Link wird dann folgendermaßen ausschauen: http://lab.hakim.se/meny/?http://drweb.de/magazin. Klicken Sie mal und bewegen die Maus an den linken Browserrand…

Ein spezieller Falteffekt an der linken Seite wird sichtbar, wenn man den Parameter #fold hinzufügt. Also so: http://lab.hakim.se/meny/?http://drweb.de/magazin#fold

Wie das Ergebnis dann aussehen soll, zeige ich Ihnen an Beispielen einiger meiner Lieblingswebseiten:


Beispiel 1: Smashingmagazine


Beispiel 2: Spiegel


Beispiel 3: DrWeb


Beispiel 4: Planet-Wissen

Hier werden die CSS3-Transforms zur Rotation verwendet. JavaScript reagiert dabei auf die Bewegung des Mauszeigers.

Nicht auf alle Webseiten und nicht in allen Browsern lassen sich diese Transformationen anwenden. Fraglich auch, ob sich 3D-Bedienung je wird durchsetzen können. Auch in der echten Welt sind Elemente, die Aktionen veranlassen sollen, etwa Fernbedienungen, Stromschalter, Zündschlösser etc.  herkömmlicherweise nur an der Front zu bedienen. Kreativ ist es in jedem Falle…

(dpe)

Kategorien
Essentials Icons & Fonts

I Love Typography: Schatzkästchen für Typographie-Liebhaber

Die Bedeutung der Typographie im Webdesign ist enorm hoch und deshalb sind gute typographische Tutorials, Tipps und Tricks sowie Inspirationsquellen sehr wichtig. Ich habe für Sie ein Blog entdeckt, das sich mit dem Thema Typographie befasst. Der Name darf dabei getrost als das gelten, was er ist, nämlich ein Liebesbekenntnis: I Love Typography.


Ein Blog für Typographie-Liebhaber

I Love Typography: eine kurze Vorstellung

I Love Typography ist im Jahre 2007 entstanden. Designer und Schriftsteller John Boardley ist der Betreiber des Blog. Dieser geht zur Zeit von Vietnam aus seiner Passion nach. Das Ziel des Blog ist es, die Kunst der Typographie an die Massen bringen. Es enthält viele sehr nützliche Beiträge zum Thema Typographie und kann sowohl als Inspirations,- als auch als Lernquelle verwendet werden.


I Love Typography: Startseite

Ein kleiner Überblick über die Inhalte

I Love Typography ist eine Schatztruhe für wahre Typographieliebhaber. Auf einer gut strukturierten Webseite finden Sie zahlreiche Beiträge zum Thema. Hier gibt es Tutorials, Terminologie-Erklärungen, aber auch Geschichtliches und vieles mehr. Sie finden hier Interviews mit anderen Webdesignern, Buchrezensionen und sogar Font-Spiele. Alles ist in Rubriken, wie „Fonts“, „Interviews“, „Making Fonts“, „Book Reviews“ zusammengefasst. Im Weiteren stelle ich Ihnen in einer kurzen Übersicht die wesentlichen Inhalte des Blog vor.

Font News

Beiträge zu diversen Font-Themen. Sicherlich findet jeder etwas Interessantes für sich. Hier ist eine kleine Auswahl:

Einige typographische Showcases.


Showcase 1: The Week in Type


Showcase 2: Yes we kern


Showcase 3: Watchmen Wachtype

Interviews

Eine Sammlung von Interviews mit verschiedenen Webdesignern aus aller Welt


Who Shot the Serif? Zahlreiche Informationen über den Font Serif.


Schriftart Serif: Ansammlung von interessanten Fakten

Geschichte der Typographie: humanistische Schriften.


Humanist: keine Lebenseinstellung sondern eine Schrift


Interview mit Fergus Wessel


Interview mit Kunihiko Okano


Interview mit Verena Gerlach

Making Fonts

Eine Sammlung von Beiträgen zum Thema „Fonts selbst kreieren“. Hier finden Sie nicht nur Anleitungen, wie man es machen soll, sondern auch geschichtliche Fakten zum Thema Typerface.


Untold story of the Amsterdamse Kruletter


Making fonts: novel typeface


The design of a signage typeface

Buchbesprechungen

Rezensionen zu diversen Typographie-Büchern finden sich ebenfalls. Meiner Meinung nach eine gute und hilfreiche Idee, ausserdem lernt man eventuell als leidenschaftlicher Typographer ein paar neue Bücher kennen.


Dan Reynolds’ review of Bibliothèque Typographique’s first book, José Mendoza y Almeida


Type Matters: a review by James Puckett


emigre no 70: the look back issue book review

Ausserdem finden Sie auf I Love Typography ein paar nette Spiele zum Thema Fonts, etwa die Aufgabe, verschiedene Fonts zu identifizieren. Ein gutes Training für Typography- und Fontlover!


Ein bisschen Spass muss sein: Font-Spiele für iPhone und iPad

Fazit

Dieses Blog kann ich Ihnen wärmstens empfehlen, besonders, wenn Sie sich in Sachen Typographie intensiver einlesen wollen. Wir sind ständig auf der Suche nach weiteren Quellen und werden sie in lockerer Folge weiterhin auf Dr. Web damit bekannt machen. Vorschläge höre ich natürlich gern in den Kommentaren.

(dpe)

Kategorien
Essentials Freebies, Tools und Templates

Browser automatisieren mit iMacros für Chrome und Firefox

iMacros für Chrome und Firefox eröffnet die Möglichkeit, die aus vielen Office-Programmen bereits bekannten Makros auch in die Browserumgebung zu bringen. Mit iMacros lassen sich wiederkehrende Arbeitsschritte als Makro aufnehmen und so jederzeit auf Knopfdruck reproduzieren. Microsoft-Veteranen werden ihre helle Freude daran haben.


(Bildquelle: Heiko Klingele auf Flickr | CC-BY-SA)

iMacros für Chrome

Begeben Sie sich in den Chrome Web Store und installieren Sie von dort aus iMacros. Nun haben Sie das Add-On-Icon in Ihrer Browserleiste. Klicken Sie darauf. Es erscheint ein Fenster, welches ziemlich leer aussieht, unten befinden sich allerdings einige Knöpfe, welche zum Erstellen eines Makros benötigt werden. Um ein Makro zu erstellen, klicken Sie einfach auf den „Record-Button“. Führen Sie dann eine beliebige Aktionskette aus. Sobald Sie fertig sind, klicken Sie auf „Stop“.


iMacro: Startfenster

Nachdem Sie den „Stopp“-Knopf gedrückt haben, öffnet sich ein Extrafenster. Ihnen ist die Wahl gestellt, ob Sie Ihr Macro unter einem bestimmten Namen speichern möchten. Ich habe mein Macro „Test“ genannt und es unter diesem Namen abgespeichert.


Extra-Fenster nach der Beendigung der Aufnahme

Das Fenster, das am Anfang erschienen ist, ist nun nicht mehr leer. Das von ihnen erstellte Macro ist unter dem gegebenen Namen dort abgespeichert. Um das Macro zu starten, wählen Sie es aus der Liste aus und klicken Sie auf „Play“.

iMacros für Firefox

Mit iMacros für Firefox verläuft alles analog zum eben Beschriebenen. Ihr abgespeichertes Macro befindet sich in einem Fenster. Um die gespeicherten Vorgänge durchzuführen, sollen Sie lediglich das Macro markieren und auf „Play“ klicken. Das war’s auch schon!


iMacros für Firefox

Tutorials für iMacros

Mit iMacros kann man viel mehr anstellen, als man zunächst denken würde.  Ich habe für Sie eine Sammlung von Tutorials ausgesucht, mit deren Hilfe Sie diese Möglichkeiten entdecken können. Viel Spass dabei!

Tutorials für iMacro: mehr Möglichkeiten des Add-On entdecken

(dpe)

Kategorien
Essentials Icons & Fonts

FontFeed liefert neue Fonts und Infos täglich frisch auf den Tisch

Typographie-Fans aufgepasst! Heute stellen wir Ihnen eine Plattform vor, welche täglich neue Fonts, Typographie-Techniken sowie inspirierende Beispiele liefert. Nun bekommen Sie zum Frühstück nicht nur frische Brötchen vom Bäcker, sondern auch eine Portion frischer Fonts von FontFeed.


(Bildquelle: martin_schmidler auf Flickr | CC-BY-SA)

Was findet man auf FontFeed?

Nun, die Webseite von FontFeed hat eine ziemlich klare Struktur. Das Menü oben rechts enthält vier Rubriken: „News“, „Handpicked Typefaces“, „Type Tips“ und „Fonts in Use“. Zudem empfehle ich Ihnen den Mauszeiger auf die Überschrift „FontFeed“ zu führen und das kreative Spektakel zu betrachten. Im Weiteren zeige ich Ihnen einige Beispiele aus jeder Rubrik, damit Sie sich ein Bild von dieser Plattform machen können.

News

In dieser Rubrik finden Sie aktuelle Informationen rund ums Thema Typographie, Artdesign und Lettering. Konferenzen, Talks, Symposiums und weitere Veranstaltungen: alles wird in aktuellster Form für Sie aufbereitet.


Veranstaltung: European Design Awards Helsinki 2012


Workshop:Type Masters Week


Typography Symposium in Dortmund

Handpicked Typefaces

Hier finden Sie ausgewählte, dabei ungewöhnliche Schriftarten, welche Ihnen zur Inspiration dienen können. In dieser Rubrik befinden sich zudem Interviews mit Typedesignern, Beiträge und Showcases.


Interview: Design für olympische Spiele


Interview: Foundry Fonts


Fonts: erler dingbats

Type Tipps

Ein Lernecke für Typographie-Interessierte! Hier befinden sich Tutorials, Tipps und Tricks und Weiteres, was Ihnen dabei helfen kann, Ihr Typographie-Wissen zu bereichern.


Tutorial: Opentype on the web


Tutorial: Bold & Justified


Interview mit Eric Spiekermann

Fonts in Use

Fonts im Alltag, so könnte man den Inhalt dieses Bereichs ganz gut umschreiben. Hier finden Sie zahlreiche Beispiele alltäglicher Fontnutzung.


4-Hand Typography Shows TypeTogether In Action


Wimbledon Champions Explode Into Words


ScreenFonts: Moonrise Kingdom, Rock of Ages, Abraham Lincoln: Vampire Hunter, Magic Mike

(dpe)