Als Infografiken werden Bilder bezeichnet, die einen Gesamtzusammenhang erklären. Sie bestehen in der Regel aus unterschiedlichen kleinen Bildern und Textelementen, die sich aufeinander beziehen, ein bestimmtes Thema aufgreifen und dieses dem Betrachter näherbringen. Häufig stehen dabei Fakten und Zahlen im Fokus, die hervorgehoben werden, beispielsweise in Statistiken oder Diagrammen. Beliebt sind außerdem auch sogenannte Icons, also kleine Symbole und Figuren, die die Infografik auflockern und gleichzeitig zur Repräsentation des Themas beitragen.
Nicht in eine Infografik gehören hingegen persönliche Meinungen, Bewertungen und Einordnungen. Auch Gefühlsbeschreibungen und ähnliches finden in ihr keinen Platz. Infografiken werden dementsprechend nur in visuellen Medien genutzt, etwa in Zeitungen, Magazinen oder dem Fernsehen. Sehr beliebt sind sie mittlerweile auch im Internet.
Da die visuelle Wahrnehmung bei einer Infografik sehr wichtig ist, wird meist großer Wert auf die Optik gelegt. Die richtige Farbwahl, transparente Elemente oder ein klarer und leicht verständlicher Aufbau sind bei der Erstellung wichtig und sorgen dafür, dass das Interesse des Lesers überhaupt erst geweckt wird. Ferner wird somit außerdem das Ziel angestrebt, dass eine Infografik – zumindest im Internet – geteilt und verbreitet wird. Sie dient damit auch als effektives Mittel des Online-Marketings und kann viele Besucher auf eine Seite locken.
Heutzutage gibt es zahlreiche Möglichkeiten, selbst Infografiken zu erstellen, um etwas zu erklären, ein bestimmtes Thema darzustellen oder sogar um ein Produkt zu bewerben und positiv hervorzuheben. Wer eine gute Infografik erstellen möchte, muss dabei jedoch einiges beachten, damit sie den Nerv der Zeit trifft und von den potenziellen Betrachtern gewürdigt wird. Unter anderem gehören dazu eine gute Typographie, die Berücksichtigung verschiedener SEO-Trends, die Farbenlehre und nicht zuletzt die Zuhilfenahme verschiedenster Software.
Mehr wissen
Es klingt so einfach: Du trägst Daten zusammen, erstellst eine schicke Infografik und setzt sie auf die Website, um den Traffic zu erhöhen, Verkäufe anzukurbeln oder Leads zu generieren. Dabei bedenkst du zu selten, dass es bereits jede Menge Infografiken gibt, die in irgendeiner Ecke des weltweiten Netzes nur darauf warten, entdeckt zu werden – häufig erfolglos.
Webdesigner müssen immer am Puls der Zeit bleiben, um den neuesten Design-Trends folgen zu können. Niemand kann es sich leisten, veraltete Layouts an den Mann zu bringen. Damit du auch in diesem Jahr weißt, welche Trends gerade aktuell sind oder sein werden, stellen wir dir eine Infografik zur Verfügung. Die Grafik wagt einen Blick in die Zukunft und erklärt, welche Trends im Jahr 2016 bestimmend sein werden.
Flat-Design ist minimalistisch und auf das Nötigste reduziert. Der Sinn und Zweck ist rein funktional, was nicht bedeutet, dass es nicht gut aussehen kann. Ganz im Gegenteil, gut gemachtes Flat-Design überzeugt auch visuell und bietet ein ansprechendes Äußeres.
Allerdings fehlen die Eigenschaften, die für eine dreidimensionale Illusion sorgen würden. Flat-Design ist rein eindimensional gedacht und funktioniert auch so hervorragend.
Material-Design hingegen geht einen Schritt weiter und integriert realistische Effekte von Licht, Schatten und Bewegung. Zudem erzeugt es in kleinen Teilen einen leicht dreidimensionalen Effekt, gerade auch im Bereich der Navigations-Menüs. Beide Design-Trends stammen ursprünglich nicht aus dem Desktop-Bereich, sondern kommen aus dem Bereich der mobilen Geräte, wie Smartphones und Tablets.
Das minimalistische Flat-Design und das durch seine Schattenwürfe präsente Material-Design werden wir in diesem Jahr noch oft bewundern dürfen.
Durch die beständig schneller werdenden DSL-Verbindungen der Menschen kann erstmals ein Trend realisiert werden, der durchaus seine Berechtigung hat. Denn durch den Einsatz von Hintergrund- oder vollflächigen Videos kann eine bestimmte Message schneller zum Besucher einer Website transportiert werden, als dies mit Texten und Grafiken der Fall ist.
Videos sind ein wertvolles Werkzeug, solange ihr Einsatz nicht übertrieben wird. Nur weil man heute Videos einbinden kann, heißt es noch lange nicht, dass man es auch tun sollte. Diese Werkzeuge sollten nur verwendet werden, um eine ganz klare Nachricht an den Besucher der Website zu senden. Vielleicht um die Marke hervorzuheben und zu stärken, oder um eine ganz bestimmte Nachricht visuell zu unterstützen.
Bei einem Einsatz von Videos gerade im Hintergrund-Bereich einer Website gilt es zudem, sie auf Geschwindigkeit zu optimieren, damit die Ladezeit nicht unnötig verlängert wird.
Die Nutzung von Smartphones und mobilen Endgeräten nimmt weltweit immer mehr zu. Gerade die Designer müssen sich auf diesen Trend einstellen, denn die nötigen Apps für alle denkbaren Einsatzbereiche müssen nicht nur funktional sein, sondern auch einfach gut aussehen. Man könnte sagen: Das Auge klickt mit.
Der Trend zu mobilen Apps wird nicht abflauen, er wird eher noch zunehmen. Das hat auch für die Betreiber von Websites Folgen. Während man bislang mit einer gut gemachten responsiven Ansicht seiner Website vorne mit dabei war, werden die User immer mehr nach schnell ladenden, speziellen Apps für ihre Smartphones verlangen.
Eindeutig: Der Trend wird in Richtung App anstatt Responsive gehen.
Responsives Design ermöglicht die optimale Nutzung einer Website auf allen erdenklichen Ausgabegeräten mit einer Vielzahl von Bildschirmauflösungen. Inzwischen ist es völlig normal, dass ein User eine Website nicht nur in der Desktop-Ansicht nutzt, sondern auch mobil mit seinem Smartphone oder Tablet.
Dieser Vorgehensweise müssen die Designer und Entwickler Rechnung tragen. Während es bislang genügte, einfach nur eine passende Responsivität bereitzustellen, müssen die Entwickler heute bereits einen Schritt weiter denken.
Denn je mehr Inhalte mobil genutzt werden, desto mehr kommt ein wichtiger Aspekt zum Tragen: die Geschwindigkeit der Website auf dem mobilen Gerät. Zu wenig Entwickler optimieren die Ansicht auf kleinen Bildschirmen auf Geschwindigkeit. Doch darauf kommt es an.
Das Geheimnis heißt »Mobile first«. Dabei werden zuerst die responsiven Ansichten einer Website entwickelt und diese dann auf Ladegeschwindigkeit optimiert. Erst wenn der Bereich Mobil stimmt, wird die Desktop-Ansicht entwickelt.
Typografie war schon in 2015 wichtig, und in diesem Jahr werden typografisch ansprechende Websites noch wichtiger werden. Typografie ist die Grundlage einer jeden Website und auch eine Form von Kunst, wenn sie in Vollendung gesetzt wird.
Gute Typografie kann eine Nachricht transportieren und eine Marke stärken. Viele Logos großer Marken bestehen nur aus einem Schriftzug und haben trotzdem die Welt erobert. Man denke da an das berühmte Coca-Cola Logo.
Im Bereich Webdesign wird es immer wichtiger werden, sich eingehend mit guter Typografie zu beschäftigen, denn Typografie kann eine Website zu einer sehr guten machen, oder ein Design vollends zerstören.
Minimalismus wird wieder neu entdeckt. Kombiniert mit Flat-Design oder einem Design im Material-Stil kann er dafür sorgen, dass der Fokus des Besuchers auf die Funktionalität und den Inhalt ausgerichtet wird. Nichts sollte mehr ablenken von der eigentlichen Aussage des Inhalts.
Ein Design hat dafür Sorge zu tragen, dass die eigentliche Funktionalität der Website (oder der App) unterstützt wird. Der Trend geht in Richtung perfekte Benutzerführung. Ein minimalistisches Design kann hier sehr unterstützend wirken und den Besucher auf dem vorgesehenen Weg leiten.
Die Besucher von Websites werden zunehmend durch das Volumen der Inhalte überwältigt. Eine ständig wachsende Liste von Quellen kommt hinzu, wenn etwas im Netz gesucht wird. Diese immense Flut von Informationen macht es eklatant wichtig, Websites mit Charakter und Persönlichkeit zu entwerfen.
Dem Besucher muss direkt bei einem Erstbesuch klar sein, worum es geht und was die Marke transportieren möchte. Um das Sicherstellen zu können, muss die Phantasie der User mit einbezogen werden. Im Idealfall erzählt die Website eine Geschichte, eine persönliche Geschichte.
Kaum ein Designer wird in der Zukunft noch damit durchkommen, Websites ohne sofort erkennbaren persönlichen Charakter zu entwerfen. Dieser Trend kommt der gewünschten Markenbildung der Klienten entgegen.
Desktop-Design, wie wir es kennen, wird es voraussichtlich nicht mehr lange geben. Bereits jetzt ist eine Verschiebung vom bekannten Seiten-Design in den Bereich Karten zu beobachten. Ein kartenbasiertes Interface-Design ist mehr intuitiv und letztendlich wohl auch praktischer, denn die Inhalte werden in einzelne Komponenten zerlegt.
Diese einzelnen Komponenten sind bereits eingehend aus der Nutzung der mobilen Geräte bekannt, fast jeder Mensch mit Smartphone kann mit dieser Benutzerführung intuitiv umgehen. Auch für Desktop-Websites wird sich diese Art der Bedienung durchsetzen, denn man kann dem Besucher mehr Informationen auf eine übersichtlichere Art anbieten, als es herkömmlich der Fall wäre.
Trends kommen und gehen – gerade im Webdesign oft im fliegenden Wechsel. Daher darf man als Webdesigner und -entwickler nicht jedem Trend blind folgen. Aber mit folgenden zehn Designtrends hast du gute Chancen, dass sie die Konversionsrate deiner Website verbessern. Gerade wer einen Online-Shop betreibt, sollte dem ein oder anderen Trend Beachtung schenken.
Bilder sind an sich immer gut geeignet, die Aufmerksamkeit deiner Website-Besucher zu wecken. Daher haben vor allem großformatige Bilder, welche die gesamte Breite des Browsers beziehungsweise des Displays einnehmen, eine große Wirkung.
Sind auf den Bildern zudem noch Gesichter zu sehen, steigert es die Aufmerksamkeit noch einmal. Alternativ zu Bildern sind auch seitenfüllende Videos ein erfolgversprechender Faktor im Webdesign.
Eine erfolgreiche Website bringt seine Besucher möglichst schnell dort hin, wo sie finden, was sie suchen. Hier helfen zweigeteilte Layouts, um unterschiedliche Produkte, Dienstleistungen oder Informationen vorzuschlagen, aus denen deine Besucher das Passende aussuchen können.
So erleichterst du es deinen Besuchern und potenziellen Kunden, sich schnell und einfach zwischen verschiedenen Seiten zu entscheiden, die sie schnell ans Ziel bringen.
Bunt fällt zwar immer auf, führt aber auch schnell dazu, dass deine Besucher die Orientierung auf einer Website verlieren. Beschränke dich beim Layout deiner Website auf monochromatische Farben – also auf eine Farbe in unterschiedlichen Schattierungen. Gestalte deinen Call-to-Action in einem auffälligen Kontrast zum monochromatisch gehaltenen Rest der Seite.
So hebst du den entscheidenden Button oder Link besonders hervor und gibst deinen Besuchern eine eindeutige Orientierungshilfe. Außerdem sorgst du für ein stilvolles Aussehen, wenn deine Farben reduziert, dafür kontrastreich und harmonisch ausgewählt sind.
Umfangreiche Websites bringen in der Regel eine entsprechend umfangreiche Navigation mit sich. Hier ist es sinnvoll, einen oder wenige Navigationspunkte – vor allem ein Call-to-Action – priorisiert darzustellen, während alle übrigen Punkte weniger auffallend dargestellt werden.
So kannst du beispielsweise die weniger wichtigen Links in ein Hamburger-Menü unterbringen oder ans Seitenende stellen. So erreichst du, dass deine Besucher sich bei der Navigation auf die „wichtigen“ Dinge konzentrieren.
Gestaltest du deinen Call-to-Action zudem als Button, steigt die Wahrscheinlichkeit, dass dieser tatsächlich ausgewählt wird.
Beschränke dich auf das Wesentliche und verzichte auf allzu viele Worte. Gerade auf Landing-Pages sind ausschweifende Lobgesänge auf das eigene Produkt oder Unternehmen fehl am Platz.
Stelle deinen Besuchern eine einfache Frage, die sie im Idealfall bejahen, und beschränke dich darauf, einige Vorteile deines Produktes oder deiner Dienstleistung kurz und prägnant vorzustellen.
Gerade wenn du etwas über deine Website verkaufen möchtest, ist eine Sache von entscheidender Bedeutung: Vertrauen. Dieses baust du am einfachsten über ein Video auf.
Wende dich über ein Video direkt an deine potenziellen Kunden und gib deiner Marke so eine persönliche Note und vor allem ein Gesicht.
Wichtiges Anliegen deiner Website ist es, deine Benutzer zu einer Aktion zu bewegen. Platziere Call-to-Actions daher so, dass sie immer sichtbar sind.
Gerade im mobilen Webdesign ist es sinnvoll, diese so zu platzieren, dass sie etwa als Sticker am oberen oder unteren Seitenrand immer sichtbar sind – auch wenn gescrollt wird. So erhöhst du die Chance, dass deine Call-to-Actions beachtet und genutzt werden.
Präsentiere deine unterschiedlichen Produkte in Form schicker Karten im Pinterest-Stil. So bringst du Ordnung auf deine Seite und hast dennoch eine ansprechende Form, eine Vielzahl unterschiedlicher Inhalte ansprechend darzustellen.
Platziere deinen Call-to-Action so, dass er möglichst alleine steht. Auch wenn deine Website mehrspaltig angelegt ist, sollte dieser immer möglichst viel Aufmerksamkeit erzeugen.
Daher ist es sinnvoll, ein mehrspaltiges Layout für die Platzierung einer Call-to-Action aufzubrechen. So wird dein Button oder dein Link zu einem echten Hingucker.
Je besser du deine Zielgruppe kennst, desto detaillierter kannst du auf sie eingehen. Das solltest du auch tun. Nutze Informationen wie den Ort (je genauer du ihn kennst, desto besser) und bereits gekaufte oder angesehene Produkte und berücksichtige sie.
So entsteht für jeden Besucher eine personalisierte Seite, die dabei hilft, ihn zu einer Handlung zu motivieren.
Die komplette Infografik, die das Team von „The Deep End“ gestaltet hat, fasst alle zehn Designtrends, die sich natürlich auch prima kombinieren lassen, in übersichtlich gestalteter Form zusammen.
(dpe)
Häufig höre ich von Website-Betreibern, dass ihnen die Geschwindigkeit ihres Angebots nicht von primärer Wichtigkeit ist. Sicherlich, es muss schon alles akzeptabel reagieren, aber dass man jetzt direkt auf Speed optimieren würde, hält man nicht für nötig. Wenn ich dann die Auswirkungen auf die Bounce-Rate oder – noch beeindruckender – die Zahl der verwaisten Warenkörbe ins Feld führe, ändert sich diese Einstellung meist fundamental. Man kann ziemlich sauber einen Zusammenhang zwischen der Geschwindigkeit einer Website und rückläufigen Umsätzen aus Konversionen und Werbung erkennen.
Unterschätze deshalb niemals diesen Einfluss, der schlussendlich dein Geschäft insgesamt betreffen kann. Denk daran, dass, wenn große Unternehmen schon negative Auswirkungen spüren, kleine Unternehmen im ungünstigsten Falle sogar in der Insolvenz landen könnten.
Während eben jene großen Unternehmen sich des Problems in der Regel durchaus bewusst sind und entsprechende Dienstleister und Services, wie Audits und andere, am Start haben, sind die daraus resultierenden, nicht unerheblichen externen Kosten für kleine Unternehmen häufig nicht zu stemmen.
Wenn man das Geld für externe Prüfungen nicht aufbringen kann oder will, sollte man in jedem Falle für technisch saubere Grundlagen sorgen. Der Wahl des Providers kommt hier entscheidende Bedeutung zu. Nimm das Problem jedenfalls nicht auf die leichte Schulter, denn zu Beginn wirst du die Auswirkungen schlechter Performance nur am Rande bemerken. Die Zahl der Konversionen sinkt langsam. Die Zahl der Besucher stagniert bestenfalls. Du glaubst an eine Menge guter Gründe, dabei kann die Überprüfung der Geschwindigkeit tatsächlich die zündende Idee sein.
Achte darauf, dass der Kontakt zu deinen Besuchern nicht abreißt. Deren Feedback kann dich sehr schnell auf Problemfelder stoßen, die du selber noch nicht erkannt hast. Wir haben einen ganzen Haufen verschiedener Umfragen gesichtet und sind dabei zu immer wieder ähnlichen Ergebnissen gelangt. Ich habe mir dann die Mühe gemacht, sie in in einer Infografik zu kumulieren.
Anhand dieser Infografik siehst du, worin die Probleme liegen. Manche Aspekte hattest du möglicherweise noch gar nicht auf dem Schirm. So erhälst du jedenfalls Ansatzpunkte für positive Veränderungen. Unterschätze den Einfluss schlechter Performance nicht und sorge dafür, dass du einen Provider auswählst, der so angebunden ist, dass von dieser Seite jedenfalls keine Probleme zu erwarten sind. Fehler kannst du selber dennoch noch genügend machen:
Ein Klick auf die Infografik bringt dich zu einer größeren Version drüben bei Hostingfacts.com.
(Quelle: Hostingfacts.com)
Es handelt sich um einen Gastbeitrag von John Stevens. John ist ein Riesenfan von WordPress und Design im allgemeinen. Er baut leidenschaftlich gerne Websites, die nicht nur gut aussehen, sondern auch gut funktionieren.
(dpe)
Manchmal bringen kleine Änderungen große Ergebnisse hervor. Nicht immer ist ein vollständiges Redesign deiner Website nötig. Schon kleine Details, wie ein neues Logo, können für eine frischere Wirkung deiner Internet-Präsenz sorgen. Daher wagen wir einmal einen Ausblick auf die Logo-Design-Trends für das Jahr 2016. So hast du schon heute die Chance, mit deinem neuen Logo dem Trend zu folgen und der coolste Hipster des neuen Jahres zu sein.
Wenn es um die Gestaltung einer neuen Markenidentität geht, dann wird dir jeder Designer sagen, dass es nicht das eine Rezept für ein perfektes Logo gibt. Die Gestaltung wird auf der einen Seite durch die betreffende Firma und ihrer bereits existenten Identität beeinflusst, und auf der anderen Seite durch die Design-Trends, die sich durchaus von Jahr zu Jahr unterscheiden können. In diesem Jahr haben bereits einige große Firmen ihr Logo neu gestaltet, doch wo wird der Trend im nächsten Jahr hingehen?
Die Logo-Designs für das Jahr 2016 stammen aus Design-Studien, die die Trends für das kommende Jahr abbilden. Damit soll Grafik-Designern geholfen werden, auch weiterhin im Spiel der Erschaffung von Markenidentitäten ganz vorne mit dabei zu sein. So können im Logo-Design unverwechselbare Design-Elemente geschaffen werden.
Der Minimalismus dominiert. Hier wird der Fokus auf einfache und klare Strukturen gelegt. Die Logo-Grafiken werden in einer einfachen Kombination aus schwarzen Linien auf weißen Grund gestaltet. Dazu kommen noch simple Fonts in verschiedenen Stärken. Gerade die Konzentration auf das Wesentliche macht den Effekt aus. Als Beispiel dient uns das Logo der Queensland Government Website.
Ein echter Trend in 2016 wird das Experimentieren mit Weißraum sein. Immer mehr Logos werden, ähnlich wie das von FedEx, auf Weißraum zwischen den Buchstaben verzichten. Die einzelnen Buchstaben werden sozusagen aneinander kleben. Das erzeugt ein unverwechselbare Design und bleibt – wenn es gut umgesetzt ist – im Gedächtnis haften.
Sehr im Trend werden Logos sein, die mit einem Handschrift-Font erstellt worden sind. Das verschafft einen frischen und ansprechenden Eindruck und vermittelt eine seit Jahren existierende Markenidentität. South Beach Swimsuits dient uns hier als gutes Beispiel.
Logos im Retro-Design werden sehr beliebt werden in 2016. Auf alt getrimmte Logos sind, genau wie handschriftliche Logos, sehr dekorativ und funktionieren für Bars, Restaurants, Musik-Clubs und andere, eher nostalgische Werte vermittelnde Branchen hervorragend.
Schattierte Logos rufen ebenfalls nostalgische Emotionen hervor und können von modern bis minimalistisch gestaltet werden. Sie funktionieren für Unternehmen, die einen gewissen Stil vermitteln und als besonders modern gelten möchten.
Egal, ob klein oder groß, Logos werden immer mehr dazu verwendet, eine gewisse Dramatik zu erzeugen. Viele Marken vereinfachen dazu ihr Logo nur auf den Namenszug, doch auch mit der Unterstützung einer Grafik kann dieses Konzept sehr gut funktionieren.
7 – Focus on Wordmarks
Die Designer werden ihren Fokus im kommenden Jahr besonders auf die sogenannten Wortmarken legen. Bei den Wortmarken geht es darum, dass der Name des Unternehmens so minimalistisch und unverkennbar gestaltet wird, dass die Marke sofort einen sehr hohen Wiedererkennungswert besitzt. Als Beispiel kann hier CNN dienen, da das Unternehmen ein wirklich ansprechend gestaltetes Wortmarken-Logo besitzt.
Quelle Infografik: ThinkDesign
(dpe)
Infografiken hatten einen gewissen Höhepunkt in den vergangenen Jahren, dabei immer aber auch eine Berechtigung, wenn sie zum Thema beitrugen und ansonsten komplexe Inhalte vereinfacht präsentierten. Der Gratisdienst Infogram bietet uns die Fortführung dieser guten Tradition mit einfachen Mitteln. Auf Basis eines Templates könnt ihr damit Daten, wie etwa Diagramme, Karten, Videos, Bilder und Icons, ansprechend aufbereiten.
Nach der Anmeldung startest du mit einem der drei Beispiele und passt dieses an deine Bedürfnisse an. Alternativ baust du eine Infografik komplett neu auf. Nach einem Klick auf Create new werden dir dazu zahlreiche Vorlagen geboten. Die ersten acht Templates sind gratis, die weiteren verlangen ein Update auf die Pro-Version, die zwischen 15,- und 166,- Dollar pro Monat kostet, je nach Ausstattung.
Elemente können neu positioniert werden (Drag & Drop). Leicht ist ein Editieren (Doppelklick) oder Löschen (einzelner Klick auf das entsprechende Icon) möglich und eigene Inhalte, wie etwa Bildmaterial oder Logos, landen per Upload von der Festplatte in der Infografik.
Auch Diagramme lassen sich über einen Doppelklick editieren. Dann erhältst du in einem Extra-Fenster eine Tabelle, in der du die Daten numerisch anpassen kannst. Auch die Darstellung kann verändert werden, etwa in Bezug auf die verwendeten Farben, der Anzeige einer Legende oder des Rasters oder der Höhe.
Leere Bereiche können schnell dank einer eigenen Toolbar mit weiteren Inhalten gefüllt werden. So wird das Template schnell um eine Karte, ein Video oder Google Analytics ergänzt. Bist du mit dem Ergebnis zufrieden, veröffentlichst du die Infografik. Natürlich kannst du sie auch mitnehmen und per iframe anderswo einbinden, so wie du es etwa von YouTube-Videos gewohnt bist.
Fazit: Schnell und einfach mal eine Infografik einstreuen, ist sehr einfach mit Infogram. Für den kleinen Hunger zwischendurch reicht dabei die kostenlose Version. Viel Spaß beim Ausprobieren.
Übrigens: Wenn du jetzt auf den Geschmack gekommen bist, schau dir doch noch mal diesen Beitrag aus unserem Magazin an. Darin haben wir zehn Infografik-Tools für dich zusammengestellt.
(dpe)
Korrekte Typografie ist das vernachlässigte Stiefkind eines manchen Webdesigners. Man könnte mit diesem Thema Jahre verbringen und hätte immer noch nicht alles Wissenswerte darüber erlernt – so scheint es. Doch für Webentwickler bedeutet Zeit immer auch Geld und stundenlange Lektüre von Büchern, Whitepapers und Aufsätzen zum Thema sind einfach nicht drin. Dennoch müssen Webdesigner genug darüber wissen, um fundierte Entscheidungen bezüglich der Typografie in einem Projekt treffen zu können. Natürlich ist das alles leichter gesagt als getan. Genau deswegen haben wir uns im Web einmal für Sie umgesehen und 12 gute Infografiken zum Thema Typografie gefunden.
Die von uns vorgestellten Infografiken verschaffen Ihnen die Grundlagen, um eine gute Entscheidung bei der Auswahl und Kombination von Fonts im Webdesign treffen zu können. Jede Website wird durch eine weise Auswahl und Nutzung von Font-Kombinationen gewinnen und einen wesentlich besseren Eindruck hinterlassen.
Ein Klick auf die Grafik öffnet die volle Auflösung
Die 10 Gebote der Typografie von DesignMatic.com ist eine Referenz, die sich jeder Webdesigner und Webentwickler in die Lesezeichen speichern sollte. Es wird klar verständlich erklärt, was man auf keinen Fall tun sollte und auch, welche Kombinationen empfehlenswert sind. Vor jedem Projekt angesehen, bringt diese Infografik viel Wissen und typografische Schönheit in ein Projekt.
Ein Klick auf die Grafik öffnet die volle Auflösung
Google Fonts ist eine hervorrage Ressource für Webdesigner und Entwickler. Doch bei mittlerweile über 600 gelisteten Fonts kann die Suche schon mal Zeit in Anspruch nehmen. Wie man die einzelnen Fonts miteinander kombinieren kann, bleibt eine offene Frage und erschwert die Suche zusätzlich ungemein. Die Infografik von FastPrint.co.uk hat sich dieser Thematik angenommen und 20 gut zu kombinierende Fonts herausgesucht. Diese können anhand der Infografik einfach miteinander kombiniert werden, so dass ein ansprechendes Ergebnis erzielt wird.
Ein Klick auf die Grafik öffnet die volle Auflösung
Obwohl wir alle täglich mit vielen verschiedenen Fonts arbeiten, so wissen wir doch sehr wenig über sie. Die Infografik von UberSuper.com möchte uns – grafisch schön aufbereitet – darüber aufklären, wo die einzelnen Schriftarten Ihren Ursprung haben. Die Infografik bietet einen Überblick über die weltweit beliebtesten Schriftarten und Ihre Herkunft.
Ein Klick auf die Grafik öffnet die volle Auflösung
Mashable.com behauptet, wir würden jeden Tag 490.000 Wörter nur im Internet sehen. Nehmen Sie nun noch Printmedien dazu, dürfte die Zahl wohl bedeutend höher liegen. Jedes Wort, welches wir lesen, ist mit einem bestimmten Font „gesetzt“. Die meisten Schriftarten sind gut gelungen und schön anzusehen und zu lesen. Doch das war nicht immer so. Diese Infografik dokumentiert die Geschichte der westlichen Typografie von seinen bescheidenen Anfängen bis hin bis zum heutigen Tag.
Ein Klick auf die Grafik öffnet die volle Auflösung
Diese Infografik von Crazyegg.com hat das Potential, uns im guten Sinne zu beeinflussen und zum richtigen Punkt zu führen. Die Grafik erklärt anschaulich die Psychologie hinter einer Font-Wahl und geht ins Detail über die verschiedenen Arten der Typografie (Serif, Sans-Serif, Skript etc.). Zudem gibt sie uns Hinweise auf die Emotionen, die wir mit der Wahl eines Fonts hervorrufen können.
Ein Klick auf die Grafik öffnet die volle Auflösung
Schöne Schriftarten zu finden ist niemals leicht. Diese Infografik von Plato Web Design verspricht, die Dinge wesentlich einfacher als zuvor zu machen. Es werden grundsätzlich einige der besten typografischen Möglichkeiten für eine Menge Anwendungsbereiche vorgestellt. Zum Beispiel die Wahl der Fonts für Tech-Projekte und vieles mehr. Wenn Sie dazu tendieren, immer die gleichen Fonts für Ihre Projekte zu nutzen, dann ist die Infografik genau richtig für Sie.
Ein Klick auf die Grafik öffnet die volle Auflösung
Sollten Sie sich ein bisschen mit Chemie auskennen, dann ist Ihnen das Periodensystem nicht gänzlich unbekannt. Das Periodensystem stellt alle chemischen Elemente mit steigender Kernladung (Ordnungszahl) und entsprechend ihren chemischen Eigenschaften, eingeteilt in Perioden sowie Haupt- und Nebengruppen dar (Wikipedia).
Diese Infografik – erstellt von Cam Wilde – macht das gleiche für Typografie. Es listet alle Schriftbilder zusammen mit ihren Attributen. Beispielsweise zeigt es die Klassifizierung der einzelnen Schriftbilder (dh Grotesk, serif, Skript, Humanist, Slab-serif, etc.) und ordnet sie in eine bestimmte Reihenfolge.
Ein Klick auf die Grafik öffnet die volle Auflösung
Die Infografik von Thelogocompany.net bereitet sehr schön Grundwissen über Fonts und Typografie auf. Es zeigt Ihnen ein Diagramm von jedem Attribut einer Schriftart. Die Attribute werden im einzelnen vorgestellt und benannt, zum Beispiel die Querlatte, das Kerning, das Bein, die Spur und die Schulter und vieles mehr. Sollten Sie sich mit diesen Dingen nicht auskennen, dann ist diese Infografik genau das Richtige für Sie.
Ein Klick auf die Grafik öffnet die volle Auflösung
Diese schön gemachte Infografik von Designtaxi.com möchte darauf hinweisen, dass Schriftarten nicht nur schön aussehen, sondern auch Emotionen bei einem Leser hervorrufen sollen. Jede Schriftart wird hierbei anders wahrgenommen. Viele Designer missverstehen diese Tatsache, doch ausgerüstet mit dieser Infografik vermag ein Designer das Konzept der Typografie und der verbundenen Emotionen schneller umzusetzen.
Es werden Beispiele für viele verschiedene Arten von Schriften (zum Beispiel Serif, Sans Serif, etc.) gezeigt und man bekommt eine Anleitung an die Hand, wie die Schriften höchstwahrscheinlich wahrgenommen werden. Die Infografik geht sehr ins Details und gibt Ihnen ein paar Schriften an die Hand, die Sie verwenden können, um bestimmte Wahrnehmungen zu erreichen.
Ein Klick auf die Grafik öffnet die volle Auflösung
Es gibt so vieles über Typografie zu lernen und zu verstehen. Sollten Sie sich mit dem ganzen nötigen Input etwas „überfordert“ fühlen, dann ist diese Infografik von Fastcodesign.com vielleicht genau das Richtige für Sie. Diese Infografik bietet Ihnen eine schnelle und relativ umfassende Anleitung für die Basics, die man als Designer wissen sollte. Die Grundlagen der Typografie können Sie auf diese Art innerhalb von nur wenigen Minuten erlernen.
Ein Klick auf die Grafik öffnet die volle Auflösung
Sie benötigen eine Schriftart? Dann kann Ihnen diese einfache Infografik von Julian Hansen bei der Auswahl einer Schriftart für Ihr nächstes Projekt helfen. Beginnen Sie mit der Auswahl einer Projektart (zum Beispiel Logo, Flyer, Einladung, Infografik). Danach folgen Sie den Fragestellungen (Ja oder Nein) und die Grafik führt Sie zu der perfekten Wahl der Schriftart(en) für Ihr Projekt.
Vielleicht erscheint die Grafik etwas umfangreich und kompliziert beim ersten Mal, allerdings führt sie relativ schnell zum Ziel, namentlich den passenden Fonts.
Ein Klick auf die Grafik öffnet die volle Auflösung
Diese Infografik – erstellt von Buscando Trazos – bietet eine elegante Einführung in die Typografie. Es beginnt mit einer Liste der hundert besten Schriften (die wunderschön in einem Kreisdiagramm angeordnet sind), gefolgt von mehr Details über die Top-10 Schriftarten. Danach bietet eine Zeitleiste einen kurzen Einblick in die Geschichte der Schriften.
Im Anschluss werden einige Informationen zu den verschiedenen Klassifizierungen gegeben, und schließlich wird die Anatomie der Schriftarten und deren Eigenschaften gezeigt.
Die Infografiken in diesem Artikel bieten einen guten Einstieg in die Welt der Typografie. Sie eignen sich sehr gut dazu, sich das nötige Grundwissen zu beschaffen und anzuwenden. Habe ich ein oder mehrere gute Exemplare vergessen? Welche ist Ihr Favorit!
(dpe)
In diesem Beitrag werden wir Ihnen die neuesten Infografiken vorstellen. Wir zeigen auf, wohin die neuesten Trends in 2015 gehen werden und das nicht nur im Bereich Webdesign. Digital Branding und Social Marketing sind wichtige Bereiche, die nicht in Vergessenheit geraten dürfen, wenn man für die Zukunft gerüstet sein möchte. Eine der Infografiken stellt Ihnen Tipps vor, wie Sie sich gegen Hacker schützen können – auch wenn diese Tipps nur die absolut rudimentäre Basis darstellen. Erfreuen Sie sich an den nun folgenden 5 Infografiken, es dürfte für jeden was dabei sein.
Mobile Zahlungsarten (E-Payment) werden immer interessanter, gerade auch durch das neue Apple Pay, von dem wir in diesem Jahr noch viel hören dürften. Doch auch PayPal ist rührig und will oben mitspielen. Mobile first. Auch in 2015 wird diese Aussage immer wichtiger werden. Wer seine Webseite noch nicht für mobile Nutzung optimiert hat, sollte dies in diesem Jahr nachholen. Wenn Ihre Webseite jedoch bereits Geld verdient, investieren sie lieber gleich in eine mobile App, anstatt in responsives Design. Ohne die Nutzung der digitalen Medien werden Firmen es immer schwerer haben, noch auf der ersten Seite der Suchergebnisse bei Google zu landen.
[Ein Klick auf die Grafik öffnet die komplette Infografik.]
Je mehr sich WordPress im Internet verbreitet, desto wichtiger wird es, sich vor Hackern zu schützen. Ein wirklich sicheres Passwort ist die erste Voraussetzung, damit die eigene Webseite nicht gehackt wird. Wichtig ist es außerdem, WordPress und die Plugins immer auf dem neuesten Stand zu halten, denn ältere Versionen haben Sicherheitslücken, die schnell bekannt werden. Auf Erweiterungen wie das beliebte TimThumb.php zum Zuschneiden von Bildern sollte gänzlich verzichtet werden, es wird nicht mehr weiter entwickelt und stellt daher ein großes Sicherheitsrisiko dar. Hier haben wir einen Grundlagenbeitrag für Sie vorbereitet.
[Ein Klick auf die Grafik öffnet die komplette Infografik.]
Infinite Scrolling meint das Nachladen von Inhalten, wenn man am unteren Seitenende angekommen ist. Man muss keine weitere Seite anklicken um neue Inhalte lesen zu können. Grundsätzlich ist dieses Konzept richtig gut. Es erscheint auf den ersten Blick richtig komfortabel und benutzerfreundlich zu sein. Doch es gibt auch Nachteile. Browser können zum Beispiel einen gigantischen Arbeitsspeicher nutzen müssen und einfrieren / crashen, weil sie mit der Datenflut nicht mehr zurecht kommen. Problematisch in dieser Hinsicht sind Webseiten mit sehr vielen Bildern. Zudem ist nicht jede Art von Inhalt für das Infinite Scrolling geeignet. Außerdem muss dann auf die Nutzung eines Footers verzichtet werden, denn durch das ständige Nachladen wird er ja kaum erreicht werden.
Auch wenn es ein großer Trend ist, den immer mehr Designer umsetzen werden, so sollte man sich doch im Vorfeld fragen, ob das Projekt wirklich für Infinite Scrolling geeignet ist.
[Ein Klick auf die Grafik öffnet die komplette Infografik.]
Über die kommenden Trends für dieses Jahr haben wir ja bereits einen eingehenden Artikel veröffentlicht. In der Infografik sind noch 2 Punkte hinzugekommen. Infinite Scrolling behandeln wir bereits in einer Infografik weiter oben im Artikel. Ein weiterer Trend wird die Single Page sein, dass heisst, dass sich alle Inhalte auf einer Seite befinden und mittels JavaScript weich zu den einzelnen Menübereichen gescrollt werden kann. Selbstverständlich gibt es diese Technik schon etwas länger, wie die Webseite unserer Mutterfirma commindo media GmbH & Co. KG zeigt, die diese Technik nutzt.
Wer in 2014 noch keinen Fokus auf die mobile Ansicht seiner Webseite gelegt hat, sollte das in 2015 schnellstens nachholen. Denn immer mehr und mehr Menschen nutzen das Internet mobil über Ihre Smartphones und Tablets. Eine mobil schlecht lesbare Webseite könnte schnell den Eindruck erwecken, dass sich die betreffende Firma nicht genug für Ihr Geschäft interessiert. Legen Sie daher Ihr Augenmerk auf die Optimierung Ihrer Webseite für mobile Geräte. Oder besser: Lassen Sie eine gute App für die beiden großen App-Stores Google Play und iTunes programmieren oder setzen mittels WordPress-Plugin selbst eine auf.
[Ein Klick auf die Grafik öffnet die komplette Infografik.]
2015 wird das Marketing in den Sozialen Netzwerken noch wichtiger werden. Interessanter, auf sozialen Netzwerken geteilter Inhalt ist einer der wichtigsten Gründe, warum Menschen großen Marken und Firmen folgen. Was keinesfalls vernachlässigt werden sollte, ist Video-Marketing. Die Nutzung von Video-Inhalten nahm im letzten Jahr um ungefähr 73% zu. Menschen schauen lieber Videos, als dass sie lesen. Dieser Trend ist gerade auch bei jungen Menschen zu verfolgen. Der mit Sicherheit wichtigste Trend in 2015 wird Engagement sein. Es reicht nicht mehr nur, sein Produkt zu präsentieren. Der Kunde will umworben sein und spüren, dass er nicht nur eine Nummer im Kaufprozess ist.
Nicht immer tritt ein Blick in die Zukunft auch so ein, wie wir es uns vorstellen. Änderungen sind demzufolge jederzeit möglich. Aber der Blick in die Zukunft, was die Webdesign- und Marketing-Trends anbelangt, ist nicht wirklich schwer. Schliesslich zeichnet sich ein Trend bereits im Vorfeld ab. Wer allerdings nicht ständig am Ball bleibt, wird von der Entwicklung bisweilen leicht überrollt.
(dpe)
Infografik-Mittwoch bei Dr. Web. Eben stoßen wir bei der Design-Agentur Implode Media aus dem kanadischen Toronto auf eine recht frische Infografik, die sich mit den wichtigsten SEO-Trends des Jahres 2014 befasst. Natürlich spiegelt die Grafik vor allem die Meinung der Kanadier wider. Ich persönlich finde allerdings, dass sie das Thema, natürlich stark vereinfacht, aber dennoch schon ganz gut auf den Punkt gebracht haben…
Im Grunde könnte man sagen, dass eine aktive Teilnahme an der Netzgemeinschaft eine hinreichende Strategie für zuverlässiges Gefundenwerden bei entsprechendem Ranking ist. So einfach wie es klingt, ist es aber nur theoretisch, denn die aktive Teilnahme ist nicht mit Taktiken im Vorbeigehen zu erreichen.
Zu Recht weisen daher die Kollegen von Implode Media darauf hin, dass eine Strategie erforderlich ist, die mehrgleisig angelegt ist. Wichtig sind natürlich zunächst einmal gute Inhalte, die noch dazu eine gewisse Einzigartigkeit entfalten.
Weiterhin wichtig ist eine gute Backlink-Struktur, aber nicht von irgendwem im Sinne von "viel hilft viel". Sondern wichtig sind Backlinks von Seiten mit hoher Reputation und aus dem eigenen Bereich. Möglichst gute Präsenzen auf den großen Social Media Plattformen, nicht im Sinne von bloßer Linkschleuderei eigener Beiträge, sondern gepaart mit echtem Engagement und Gesprächsbereitschaft, zeigen Google, dass es eine Marke hier ernst meint. Die Optimierung der eigenen Webpräsenz auf die Anforderungen mobiler Clients ist ein weiterer wichtiger Punkt, da mit der steigenden Nutzung über mobile Clients die Relevanz der Seite im Wert steigt.
Alles in allem zeigt uns die folgende Infografik keine bahnbrechenden, neuen Erkenntnisse, sondern weist zu Recht auf das Erfordernis mühsamer Arbeit im Sinne des alten Sprichworts "Steter Tropfen höhlt den Stein" hin. So deutlich vor Augen geführt, ist auch klar, dass Strategiewechsel, auch in die richtige Richtung, niemals zu schnellen Erfolgen führen können. SEO-Maßnahmen sind eine aufwändige Fleißarbeit, in der man nie nachlassen darf. Selbst und erst recht dann nicht, wenn man die positiven Auswirkungen spürt.
Ein Klick auf die verkleinerte Infografik öffnet die größere Originalversion drüben bei Implode Media:
(Quelle: Implode Media | Toronto SEO 2014 Trends)
Das Leben als Designer ist nicht einfach. Obschon das Wörtchen "Designer" nur eine überschaubare Länge aufweist und auch ansonsten beim Zuhörer einigermaßen klare Vorstellungen der dahinter zu vermutenden Tätigkeiten weckt, ist die Realität doch viel komplexer. Massenhaft Literatur steht im Schrank, Fortbildung ist nicht nur auf Dauer, sondern andauernd erforderlich. Da tut es gut, wenn man manche Eckpunkte kurz und knackig serviert bekommen kann, ohne dass man in den tiefen Keller des theoretischen Wissens hinabsteigen muss. Unsere beiden 10 Gebote-Tafeln aus dem Hause DesignMantic sind solche Häppchen. Ich habe sie mir gar ausgedruckt und unter die Schreibtischunterlage gelegt…
Farbenlehre ist so eine Sache. Kaum jemand lernt sie wirklich oder hält sie auch nur für erforderlich. Der Kunde ist ohnehin vollkommen skrupellos und verlangt Kombinationen, die man selbst ohne Fachkenntnis schon weit von sich weisen würde. Es ist schwierig.
Die 10 Gebote der Farbenlehre von DesignMantic können bei so manch hitziger Diskussion über die Attraktivität eines grün-rosa Logos mit roten Streifen eventuell behilflich sein. Die Geboteliste fängt an mit der emotionalen Wirkung der jeweiligen Farbe und bewegt sich durch das Themenspektrum hin zu der Darstellung der verschiedenen Farbräume. Die durchweg gelungene Gestaltung der einzelnen Designbeispiele wird mir im Kundengespräch ganz sicher helfen. Da freue ich mich schon drauf.
Hier ein kleiner Ausschnitt aus der Infografik. Ein Klick darauf öffnet das größere Original direkt bei DesignMantic:
(Quelle: DesignMantic)
Schriftenwahl ist auch so ein Thema. Wer schon mal eine Powerpoint-Präsentation erleiden musste, weiß haargenau, wovon ich spreche. Selbst hochbezahlte Topmanager sind vor üblem Geschmack nicht gefeit und leben diesen bisweilen kompromisslos aus. Kennen Sie so jemanden? Dann legen Sie ihm einen Ausdruck der 10 Gebote der Typografie hin. Ich wette, es wird unverzüglich Besserung eintreten. Denn an sich ist es gar nicht so schwierig, die dicksten Klopper zu vermeiden.
Entsprechend befassen sich die 10 Gebote der Typografie mit der korrekten Einordnung und Erkennung von Schriftfamilien, zeigen Serifen und Serifenlose, raten von unterschiedlichen, dabei ähnlichen Fonts ab und gehen am Ende gar so weit, die gute alte Comic Sans in einen Topf mit Papyrus und Kristen zu werfen, um gänzlich von deren Verwendung abzuraten. Richtig so…
Hier ein kleiner Ausschnitt aus der Infografik. Ein Klick darauf öffnet das größere Original direkt bei DesignMantic:
(Quelle: DesignMantic)
Das wichtige Thema der Absicherung von WordPress gegen Angriffe von außen haben wir hier bei Dr. Web über die Jahre immer wieder behandelt. Dennoch bleibt das Thema aktuell und gewinnt mit der zunehmenden Verbreitung von WordPress als Antrieb weiter Teile des heutigen Internet weiterhin an Bedeutung. In den letzten vier Jahren hat sich die Zahl erfolgreicher Hacks von WordPress-Sites mehr als verdoppelt. Mit der neuen Infografik aus dem Hause WPTemplate bekommen Seitenbetreiber und WordPress-Admins eine Übersicht an die Hand, die auf einen Blick die wesentlichen Problemstellungen erfasst und Hinweise zur Behebung gibt.
Zwei Hände voll grundlegender Tipps helfen schon einmal, um die schlimmsten Sicherheitsmängel einer jeden WordPress-Installation weniger schlimm zu gestalten. Darunter finden sich augenscheinliche Selbstverständlichkeiten, wie das zeitnahe Update bei neuen WordPress-Versionen oder das regelmäßige Backup, um im Fall der Fälle wenigstens nicht alles zu verlieren. Aber auch weniger naheliegende, im Sinne von sich selbst aufdrängenden Tipps, wie etwa der Schutz des Verzeichnisses wp-admin oder die Nichtverwendung des Benutzernamens admin gehören dazu.
Die folgende Infografik stellt die wesentlichen Hinweise noch einmal übersichtlich zusammen. Was mir besonders gut gefällt, ist die farbkodierte Darstellung der Tipps und Hinweise, die Aufschluss darüber gibt, in welcher Einflusssphäre die meisten Sicherheitslecks genutzt werden.
Sofort wird augenfällig, dass nicht etwa schwache Passwörter das Hauptproblem beim Betrieb einer WordPress-Seite sind – nur 8 Prozent aller Hacks begründen sich daraus. Wesentlich relevanter sind Plugins und Themes mit über 50 Prozent aller Hacks, wobei die Themes mit 29 Prozent noch einmal ein Stück vor den Plugins liegen.
Die größte einzelne Schwachstelle jedoch ist mit 41 Prozent das Thema Hosting. Hier geht es um Themen, wie Datenbank-Sicherheit, das vorsichtige Setzen von Dateiberechtigungen, das Verstecken von Dateien und Verzeichnissen, die Absicherung des Netzwerks auf Protokollebene und einiges mehr. Bei diesen Themen wird der durchschnittliche Seitenbetreiber regelmäßig professionelle Hilfe in Anspruch nehmen müssen und sollte das auch tun.
Einige Infos von eher statistischer Natur runden die Infografik ab. So wird etwa der gezielte Angriff auf WordPress-Sites durch ein 90.000 Server starkes Botnet im April 2013 noch einmal in Erinnerung gerufen. Das WordPress mittlerweile fast 17% aller Websites antreibt, dürfte den meisten Webworkern nicht fremd sein. Mittlerweile nähert sich das System der fantastischen Zahl von 70 Millionen Websites.
Die folgende Infografik ist runterskaliert, um in Dr. Webs Artikelbreite zu passen. Eine größere Variante können Sie sich anschauen, wenn Sie auf die Grafik klicken. Sie werden dann zu WPTemplate geleitet, die die Originalgrafik in ansprechender Größe vorhalten:
(Quelle: WPTemplate.com)
Der Slogan der Website The Maple Kind lautet „Where infographics meet comics and bullshit!“ Der einzige Antrieb hinter der Website ist es nach eigenen Angaben, deren Besucher zum Kichern zu bringen. Unter diesen Vorzeichen ist die folgende Infografik zu betrachten. The Maple Kind trägt darin durchaus überzeugend vor, warum Facebook dringend einen zusätzlichen Button mit der Aufschrift „I Don’t Care“ („Interessiert mich nicht“) benötigt. Ehrlich gesagt, so bullshitty finde ich die Argumentationsführung nicht. Zumal ich Facebook ohnehin für eine der schlechtesten Erfindungen halte, die die zivilisierte Gesellschaft erdulden muss…
Was waren wir doch zunächst alle erfreut, als Facebook sich durchsetzte. Man konnte sich mit längst vergessenen Freunden und Bekannten erneut vernetzen, die ganze Bekanntschaftshistorie quasi resetten und ganz von vorn beginnen. Brieffreundschaft 2.0.
Zu Beginn mag das ja auch noch ganz gut funktioniert haben, dann jedoch wurden die Freunde immer mehr und die Grenzen wurden fließend. Nur Leute mit eiserner Disziplin haben heute bei Facebook nur noch wirkliche Freunde in ihren Listen, wobei Freunde ohnehin vom Start weg der falsche Begriff war. Die allermeisten Facebook-Kontakte würde man wohl, selbst wenn man sie aus dem echten Leben kennt, was ja beileibe nicht mehr unbedingt die Regel ist, nicht als Freunde bezeichnen. Bekannte, Kollegen, Kommilitonen, okay – aber Freunde?
„Ist doch egal, wie man das nennt“, mögen Sie jetzt einwenden. Das allerdings finde ich nicht. Ich sehe an meinen Kindern ganz deutlich, wie die Bedeutung des Wortes erodiert. Hinz und Kunz ist plötzlich „Freund“. Ungefähr einmal im Monat erläutere ich meinen Kids wie ein Oberlehrer, was eigentlich eine Person ausmacht, die man wirklich als Freund bezeichnen sollte. Es geht ihnen inzwischen schon auf die Nerven. Mir wurscht, ich ziehe das durch…
Ich schweife ab. The Maple Kind bringt es auf den Punkt, auf mehrere Punkte eigentlich, aber sei’s drum. Wie geht es Ihnen, wenn Sie Ihre Facebook Wall durchscrollen?
Die Chancen stehen gut, dass es Ihnen ähnlich geht, wie dem Ersteller der folgenden Infografik. Der nämlich behauptet, dass Facebook-Inhalte zu 75% völlig irrelevantes Zeug darstellen, für dass sich niemand interessiert, vom Inhalte-Ersteller mal abgesehen. Wie oft haben Sie schon einen Button gesucht, auf dem nicht „Gefällt mir“ steht?
The Maple Kind hat eine ganze Menge von Beispielen zusammen gestellt, bei denen mindestens ein „Interessiert mich nicht!“-Button angemessen wäre. Ich wette, Sie finden sich in so manchem Beispiel wieder.
Ich persönlich nutze Facebook inzwischen so gut wie gar nicht mehr. Ich kann wegen der Administration einiger Brand-Pages nicht ganz aussteigen. Für mich jedoch stellt der Dienst das genaue Gegenteil dessen dar, was er irgendwann einmal vorgab zu sein. Er ist kein Netzwerk, dass die Menschen näher aneinander bringt, sondern er ist ein Dienst, der soziale Nähe durch digitale Distanz ersetzt. Sowohl der Begriff „sozial“, wie auch der Begriff „Nähe“ werden dabei auf der Strecke bleiben. Der Begriff „Freund“ ist ja jetzt schon tot.
Dennoch, viel Spaß mit der Infografik…
(Quelle: The Maple Kind)
Buddy Media, mittlerweile Teil von Salesforce, ist aktiv in der statistischen Betrachtung moderner Kommunikationsmethoden unterwegs. Im letzten Jahr untersuchte man 320 der größten Marken hinsichtlich ihres Tweet-Verhaltens und den daraus zu ziehenden Schlüssen. Die Ergebnisse dieser Studie griff nun die Agentur LinchpinSEO auf und baute daraus eine Infografik, die die wesentlichen Erkenntnisse übersichtlich darstellt.
Wenn ich mir das Cheat Sheet so anschaue, dann mache ich persönlich so ziemlich alles falsch, was man auf Twitter falsch machen kann. Aber was soll’s? Twitter ist nicht Teil einer wie auch immer gearteten Strategie in meinem persönlichen Kommunikationsmix. Wäre das anders, so würden mich die folgenden Erkenntnisse sicherlich zu Verhaltensänderungen motivieren.
Wie bereits erwähnt, ist die folgende Infografik zwar ganz frisch, die Erkenntnisse daraus wurden indes bereits im letzten Jahr publiziert. Ich habe daher unten bei den Links zum Beitrag auch die ursprünglichen Veröffentlichungen von Buddy Media, nebst kompletter Studie hinterlegt. Wer sich professionell mit Twitter-Strategien herumschlagen muss, der sollte auf jeden Fall einen näheren Blick darauf riskieren.
All jene, die Twitter nebenbei mitbetreuen oder ein paar Tipps zur Selbstbestätigung suchen oder einfach die wichtigsten Eckpunkte in ihrem Infografik-Werkzeugkasten mitführen wollen, können sich mit den Erkenntnissen aus der Infografik im Alltag sicherlich begnügen. Bei der Gelegenheit will ich gern noch einmal dafür werben, sich einen Infografik-Werkzeugkasten anzulegen. Meiner besteht aus mehreren Evernote-Notizbüchern, thematisch sortiert und steht mir auf diese Weise überall, wo Netzzugang besteht zur Verfügung. Damit bin ich bislang sehr gut gefahren. Zwar sind Infografiken nie außerordentlich tief gehend, können jedoch als eine Art Spickzettel gute Dienste leisten und sehen, wenn man sie dem Kunden mal zeigen will, dabei zumeist noch ausgesprochen professionell aus.
Zurück zum Twitter Tweet Cheat Sheet: LinchpinSEO konzentrierte sich in der grafischen Umsetzung des Datenmaterials auf Eckpunkte der Studie und stellte vor allem plakative, schnell erfassbare Erkenntnisse zusammen.
Danach sieht die ideale Twitterstrategie in etwa so aus:
Einen eigenen kleinen Empfehlungskomplex gibt das Thema Retweets her. Immerhin 78% aller Interaktionen sind Retweets. Das ist gut für die Verbreitung der Marke. Buddy Media fand Muster, die Annahmen darüber zulassen, wie sich die Retweet-Rate steigern lässt.
RT bitten, werden zehn Mal öfter retweetet.Retweet bitten, werden sogar 23 x häufiger retweetet.Folgend nun also die Infografik, ein Klick darauf führt zur Website von LinchpinSEO:
(Quelle: LinchpinSEO)
Infografiken bilden häufig komplexe Zusammenhänge stark vereinfacht in Illustrationen ab. Informationen werden visualisiert, wobei der Textanteil deutlich kleiner ist, als die fast schon selbst erklärenden Grafiken. So kann der Betrachter Fakten schneller erfassen.
Bildquelle: Lauren Manning via photopin cc
Wir haben in dieser Kollektion 40 unterhaltsame Infografiken gesammelt. Diese stammen aus unterschiedlichen Bereichen des Weltennetzes. Die Themen sprechen zumeist Grafiker, Programmierer und Nerds an (und das sind wir doch alle hier, oder?). Tauchen Sie ein in die Welt der Diagramme, Abläufe und Abbildungen von Größenverhältnissen, Schichten und Funktionsweisen.
Und wenn Sie dann selbst tätig werden wollen, haben wir was für Sie: Zwischen den Infografiken finden Sie Tipps und Tricks zur eigenen Gestaltung.
Website: smashingmagazine.com
Thema: Geschichte der Programmiersprachen
Website: dailyinfographic.com
Thema: Wirkung von Farben
Website: dailyinfographic.com
Thema: Die eigene Marke schützen
Website: mashable.com
Thema: Die Geschichte des iPhones
01 Erster Balken
Aktuelle Infografiken beeindrucken nicht nur mit harten Fakten, sondern auch mit ansprechend gestalteten Grafiken, welche diese Fakten transportieren. Für unser kleines Mini-Tutorial setzen wir den Grafik-Klassiker Photoshop ein. Mit genügend Abstraktionsfähigkeit können Sie die Anweisungen sicherlich auch mit der Software Ihrer Wahl umsetzen.
Um Prozente in Form einiger Balken darzustellen, könnten Sie etwa eine leichte 3D-Variante umsetzen. Ziehen Sie dazu mit dem Rechteck-Werkzeug einen kurzen Balken in einer Farbe Ihrer Wahl auf. In der Optionsleiste sollte Form aktiviert sein.
02 Zweiter Balken
Strg+J kopiert den Balken. Positionieren Sie ihn mit dem Verschieben-Werkzeug etwas nach unten und zur rechten Seite. Beide Balken sollten sich noch etwas überschneiden. Über einen Doppelklick auf die Ebenenminiatur können Sie die Farbe neu definieren. Wählen Sie einfach einen helleren Ton der gleichen Farbe aus. Wählen Sie auf der rechten Seite die zwei Ecken mit dem Direktauswahl-Werkzeug aus und ziehen Sie die Ecken nach rechts.
03 Übergang gestalten
Über Strg+J kopieren Sie noch einmal einen Balken und setzen bei diesem mit dem Direktauswahl-Werkzeug den rechten, oberen Punkt an den rechten, oberen Punkt des ersten Balkens. Den unteren, rechten Punkt ziehen Sie auf gleicher Höhe nach. Dunkeln Sie die Farbe dieses Balkens stärker ab, als die Grundfarbe der anderen zwei Balken und ändern Sie die Ebenenreihenfolge so, dass dieser kleine Balken in der Mitte der anderen beiden Balken liegt.
04 Kopieren und beschriften
Sehr leicht können Sie nun die drei Teilstücke in der Ebenenpalette auswählen, etwa mit gedrückter Umschalttaste, kopieren, neu positionieren und eine andere Farbe auswählen. Um die Prozente mit unterschiedlichen Balkenlängen abzubilden, nutzen Sie wieder das Direktauswahl-Werkzeug. Auch eine Beschriftung darf nicht fehlen, vielleicht in den Farben der Balken.
Website: visual.ly
Thema: Die Evolution der Geeks
Website: coolinfographics.com
Thema: Ungesundes Sitzen
Website: dailyinfographic.com
Thema: Tierhaltung
Website: datadial.net
Thema: Suchmaschinenoptimierung
Website: visual.ly
Thema: Elektromüll
01 Illustration freistellen
Um Infografiken schnell aufzuwerten, bieten sich fertige Illustrationen von Stockagenturen an. Zumeist liegen diese als Vektorgrafik vor und können so leicht in der Größe angepasst werden, ohne Qualitätsverluste befürchten zu müssen. Spielen wir etwa mit dem Thema „Verteilung der Haustierarten auf Haushalte“, so brauchen wir Illustrationen eben jener Tiere. Hier kommt die Grafik Origami animals logo templates | #89604826 | sellingpix von Shutterstock.com zum Einsatz.
Falls die Grafik noch nicht freigestellt vorliegt, klicken Sie die Ebene doppelt an, um eine Ebene 0 zu erhalten. Jetzt können Sie den Button Ebenenmaske hinzufügen unten in der Ebenenpalette anklicken und zunächst mit dem Buntstift-Werkzeug und schwarzer Vordergrundfarbe das Bildelement grob freistellen, dann immer feiner, etwa mit dem Polygon-Lasso.
02 Illustrationen einfügen
Liegen die Illustrationen auf eigenen Ebenen vor, so lassen sich diese leicht mit der weiter oben gestalteten Abbildung einiger Prozente kombinieren. Da wir mit Formen gearbeitet haben, können Sie die Farben schnell an die der Illustrationen angleichen. Dieser Teil der Infografik wurde aufgewertet, aber natürlich sollte eine Infografik noch weitaus mehr Elemente zeigen und diese in Verhältnis setzen.
Website: karenkavett.blogspot.de
Thema: Was schaue ich auf YouTube?
Website: blog.kissmetrics.com
Thema: Website-Optimierung für mobile Endgeräte
Website: css-tricks.com
Thema: Schöner HTML-Code
Website: coolinfographics.com
Thema: Mitglieder-Vergleich
Website: blog.kissmetrics.com
Thema: Warum es zu Absprüngen nach einem Website-Besuch kommt
Website: blog.templatemonster.com
Thema: CSS-Fakten
Website: evolutionofweb.appspot.com
Thema: Die Entwicklung des Netzs
Website: dailyinfographic.com
Thema: So einfach ist es, einen Social Media Job zu ergattern
Website: dailyinfographic.com
Thema: Was machen IT-Leute?
Website: coolinfographics.com
Thema: Online-Marketing
Website: blog.kissmetrics.com
Thema: Online-Testing
Website: webdesignledger.com
Thema: Effektives Webdesign
Website: dailyinfographic.com
Thema: Das Internet, eine Dekade später
Website: formstack.com
Thema: Die perfekte Landingpage
.jpg
Website: dailyinfographic.com
Thema: Wie Facebook unsere Beziehungen beeinflusst
Website: vitamintalent.com
Thema: Tolle Idee für ein Webprojekt?
Website: coolinfographics.com
Thema: Geschichte von Apple
01 Kopf und Beine
Stellen Sie die Vordergrundfarbe ein und und ziehen Sie mit dem Ellipse-Werkzeug bei gedrückter Umschalttaste einen Kreis als Kopf auf. Die Beine entstehen mit dem Abgerundeten-Rechteck-Werkzeug, bei dem in der Optionsleiste ein Radius von 20 Pixel eingestellt wurde.
Für das Icon der Frau können Sie die Formen kopieren, mit dem Verschieben-Werkzeug positionieren, um dann die Farben über einen Doppelklick auf die Ebenenminiatur anzupassen. Das Kleid der Frau habe ich auf einer eigenen Ebene mit dem Zeichenstift-Werkzeug gestaltet, bei dem in der Optionsleiste Form ausgewählt war.
02 Arme und Körper
Erstellen Sie den Körper des Mannes mit dem Rechteck-Werkzeug. Ziehen Sie die Schultern mit dem Abgerundeten-Rechteck-Werkzeug auf. Damit diese nur halb zu sehen sind, wählen Sie das Rechteck-Werkzeug an und in der Optionsleiste Vordere Form subtrahieren aus. Jetzt können Sie innerhalb der Form Bereiche auf transparent setzen, einfach indem Sie eine weitere Form darüber aufziehen. Die Arme enstehen wie die Beine mit dem Abgerundeten-Rechteck-Werkzeug.
03 Prozente
Die Arme der Frau werden über Bearbeiten > Pfad transformieren > Drehen positioniert. Zeichnen Sie die Balken für die Prozente mit dem Rechteck-Werkzeug ein und schreiben Sie die Prozente mit dem Text-Werkzeug in weißer Farbe.
Website: flickr.com/photos/bryce
Thema: Flickr-Anwender
Website: infographicsshowcase.com
Thema: Typische Twitter-Nutzer
Website: flickr.com/photos/36343059@N08
Thema: Speicherplatz
Website: informationisbeautiful.net
Thema: Aufmerksamkeitspyramide
Website: static.colourlovers.com.s3.amazonaws.com
Thema: Die Farben des Internets
Website: visual.ly
Thema: Das Social-Media-Jahrbuch
Website: sixrevisions.com
Thema: Was dein Webdesign über dich aussagt
Website: dailyinfographic.com
Thema: Die Geschichte des Internets
Website: coolinfographics.com
Thema: Funktionsweise Affiliate Marketing
Website: sixrevisions.com
Thema: Unterschied Webdesigner und Webdeveloper
Website: blog.kissmetrics.com
Thema: Wie die Ladezeit die Absprungrate beeinflusst
Website: dailyinfographic.com
Thema: Gamer und Partnerschaften
Website: shouldiworkforfree.com
Thema: Sollte man für lau arbeiten?
Website: dailyinfographic.com
Thema: Eigenschaften von Schriftarten
(dpe)
Soll ich Ihnen glauben, dass Sie wirklich noch nie von Urban Fonts gehört haben? Gut, bedenkt man die Schnelllebigkeit des Web und den Informationsüberfluss, der damit einhergeht, ist das durchaus denkbar. Dann lernen Sie Urban Fonts eben jetzt kennen. Dort findet sich neben einer ganz aktuellen Infografik zum Unterschied zwischen Schriften mit Serifen und Schriften ohne, immer noch ein weiter wachsender Bestand von rund 8.000 freien Schriftarten. Es lohnt sich also aus mehreren Gründen der Besuch dort…
Ich persönlich kenne Urban Fonts seit Anbeginn der Zeit. Damals durchschwammen wir gemeinsam die Ursuppe. Aus mir wurde ein Mensch, aus Urban Fonts ein Schriftarten-Portal. Wie das Schicksal so spielt.
Im Ernst. Urban Fonts begegnete mir das erste Mal vor gut sechs Jahren. Immer noch ist der Dienst vorhanden, was in diesen Zeiten zumindest bedeutet, dass sie nicht ganz unpopulär sind und nicht durchweg alles falsch machen. Nach wie vor sind die weitaus meisten verfügbaren Schriftarten kostenlos als Freeware verfügbar. Es überwiegen True Type Fonts, auch das OTF-Format findet sich. Die Installation für Windows und Mac wird, so das denn jemand benötigt, auf der Website erläutert. Webfonts als solche werden nicht angeboten. Hier ist dann etwas Handarbeit erforderlich. Das erklärt sich sicherlich aus der Historie des Dienstes. Wer hat vor sechs Jahren Webfonts nachgefragt, geschweige denn eingesetzt?
Jeder Schriftarten-Download findet einzeln als ZIP-Datei statt. Im Archiv findet sich neben dem eigentlichen Font stets auch die zugehörige Lizenzinformation. Prüfen Sie jeweils die Lizenz auf Übereinstimmung mit dem von Ihnen intendierten Einsatzzweck…
Neben Freeware-Schriften bietet Urban Fonts auch kostenpflichtiges Material an. Des weiteren finden sich Schriftarten mit Lizenzen, die Backlinks, Spenden oder sonstige Akte der Wertschätzung erfordern. Der Fantasie der Schriftentwickler ist kaum beizukommen… Da ist nochmal der Hinweis auf die stets beigefügte Lizenz wichtig. Immer schön prüfen, ob der Font zu dem gesuchten Zweck eingesetzt werden darf und wenn ja, unter welchen Voraussetzungen.
Jeder Font wird auf einer Detailseite einzeln vorgestellt. Ist man auf der Suche nach einem Zeichenumfang, der den der englischen Sprache übersteigt, etwa – tada – deutsch, so wird man es als sehr nützlich empfinden, dass die Eingabe eigener Testtexte möglich ist. So ist die Verfügbarkeit von Umlauten und Sonderzeichen schnell gecheckt. Manch Font bietet nicht einmal Punkte, ts. Kleine Kritik am Rande: Wenn die Detailseite bereits die Lizenz nennen würde. Das wäre schon eine schöne Sache.
Neben der Vielfalt an freien und weniger freien Schriftarten, findet sich bei Urban Fonts auch ein ausgesprochen aktiv gepflegter Blog zu allen Themen rund um die Typografie. Da lohnt es sich, den RSS-Feed zu abonnieren, wenn man eine Affinität zu Typografie hat.
Im Verlaufe der letzten Woche veröffentlichte das UF Team eine elegante Infografik, die sich mit dem Thema Serifen gegen Nicht-Serifen beschäftigt. Unter anderem werden die optischen Unterschiede dargestellt, die allerdings den meisten Leserinnen und Lesern wohl bekannt sein dürften.
Allerdings beschränkt sich das UF Team nicht auf diese Information. Stattdessen wird auch auf die Entstehungsgeschichte der Schriften eingegangen. Als professioneller Designer wird einem nicht neu sein, dass Serifen-Schriften immer noch für Printdesign vorgeschlagen werden, während Schriften ohne Serifen vornehmlich im Web zum Einsatz kommen sollten. Daran hält sich die Masse der heutigen Inhaltsersteller dann auch recht eng. Überschriften im Web werden zu 60%, in Fließtext sogar zu 66% mit Schriften ohne Serifen dargestellt.
Schuld ist immer noch, trotz der kommenden hiDPI-Screens, die geringe Auflösung von Bildschirmen im Vergleich zu Papier. Schriftdarstellung auf Papier lässt nicht einzelnen Pixel erkennen, aus denen sich auch in der analogen Welt die Schriften zusammensetzen. Mit 1.000 Punkten pro Zoll liegt das Papier immer noch deutlich selbst über den besten derzeit erhältlichen Smartphone-Screens, die es immerhin schon über die 400 ppi schaffen.
Ich habe die folgende Infografik in meine Infografik-Sammlung – ja, ich habe eine. Sie doch auch, oder? – integriert. Sie gehört zu den kleinen Helferlein, die man beim Kunden gern mal nonchalant zücken kann, wenn wieder ulkige Vorstellungen geäußert werden. Klicken Sie auf die Infografik, wenn Sie zur Quelle springen wollen:
(Quelle: Urban Fonts Blog)
Ob man sich ganz klassisch um eine Festanstellung bewirbt oder potenzielle Kunden davon überzeugen möchte, man sei schlicht der Beste für den Job: eine eindrucksvolle Bewerbung kann den Unterschied machen. Die Infografiker aus dem Hause NowSourcing trugen im Auftrag des Beratungsdienstleisters TopCounselingSchool.org einige Basisdaten und daraus resultierende Erkenntnisse zusammen. Heraus kam eine solide Infografik, die zeigt, worauf man bei der eigene Bewerbung inhaltlich achten sollte. Ganz unabhängig von Design und Aufmachung…
Steigen wir ohne Umschweife direkt in die Fakten. Ein Viertel aller Personalverantwortlichen gibt zu Protokoll, pro offener Stelle mindestens 50 Bewerbungen zu erhalten. Zehn Prozent der Personalchefs werden mit 100 Bewerbungen pro Stelle konfrontiert. Mir persönlich sind Stellenbesetzungen bekannt, bei denen es sogar noch ein Vielfaches des letztgenannten Wertes hagelte. Dann wiederum habe ich erst kürzlich in einem Stellenbesetzungsverfahren händeringend nach Bewerbern suchen müssen. Es ging um die Besetzung einer Akademikerstelle mit psychologischem Hintergrund. Grundsätzlich kann man nach meiner Erfahrung wohl sagen: je geringer die objektiven Qualifikationsanforderungen, desto höher die Zahl der Bewerbungen.
Auf der anderen Seite sagt das Erreichen eines bestimmten Qualifikationslevels nichts über die tatsächlichen Fähigkeiten der betreffenden Person aus. Gerade im Bereich Webentwicklung kenne ich verschiedene Personen, deren Fähigkeiten absolut State of the Art sind, deren formale Qualifikation jedoch nicht existiert. Hier ist es besonders wichtig, auf ein solides Portfolio erbrachter Leistungen verweisen zu können. Das allerdings ist zu Beginn der Karriere alles andere als einfach…
Zurück zur Infografik: Wenn eine Vielzahl von Bewerbungen auf eine einzelne Stelle kommt, dann muss man sich als Personalverantwortlicher Techniken zulegen, die einem helfen, möglichst schnell und zuverlässig die Spreu vom Weizen zu trennen. Die einfachste Methode ist, die Bewerbungen zu scannen, wie man das mit Googles Suchergebnislisten ebenfalls tun würde. Auf der Suche nach relevanten Keywords reduziert sich der Leseaufwand enorm.
Besonders wichtig ist Personalchefs laut NowSourcing die Problemlösungskompetenz des Bewerbers. Fast 60% scannen nach diesem Schlüsselbegriff, Führungsqualitäten, sowie die Fähigkeit, mündlich wie schriftlich fehlerfrei zu kommunizieren, folgt auf den weiteren Plätzen. Weniger wichtig als noch vor zehn Jahren, aber mit einem runden Drittel aller Nennungen immer noch bedeutend, ist die Kompetenz, Teams zu schaffen und zu erhalten, sowie kooperativ zu arbeiten.
Ganz grundsätzlich, unabhängig von verwendeten Schlüsselbegriffen, ist es Personalchefs wichtig, erkennen zu können, dass der Bewerber über einschlägige Erfahrungen verfügt, die sich im besten Falle mit erfolgreich abgeschlossenen Projekten belegen lassen. Gar nicht gut kommen Bewerbungen an, die erkennbar gar nicht auf die ausgeschriebene Stelle zugeschnitten sind.
Generell sollten Bewerbungen, vor allem deren Begleitschreiben, so kurz wie möglich sein. Eine hohe Keyworddichte erhöht die Wahrscheinlichkeit, wahrgenommen zu werden. Listenartige Darstellungen, ohne überflüssiges Wortbeiwerk sind chancenreicher als lange Fließtexte mit geringer Faktendichte.
Zu guter Letzt gilt es noch, die häufigsten Fehler zu vermeiden. Ganz vorne mit dabei in der Liste der No-Gos ist fehlerhafte Rechtschreibung. Aber auch überflüssige Fakten zählen zu den Elementen, die die Chancen einer Bewerbung eher schmälern, denn sie zu erhöhen. Gewonnene Furzwettbewerbe oder Auszeiten aufgrund akuter Lustlosigkeit sollten im Lebenslauf keine Erwähnung finden. Dass die Bewerbung nicht von einer pseudo-lustigen E-Mail-Addresse, wie etwa hengst69@dauerspitz.de versandt werden sollte, versteht sich dann wieder von selber, oder?
Ein Klick auf die folgende Infografik führt zum entsprechenden Blog-Post bei NowSourcing:
(Quelle: NowSourcing / TopCounselingSchools.org)