Share
Die Anzahl der Icons, die wir täglich sehen, ist erstaunlich. Sie sind überall um uns herum, sowohl online als auch offline. Wir benutzen sie gerne. Sie verbessern die Ästhetik unserer Websites und können eine bessere Benutzererfahrung bieten. Manchmal vergessen wir jedoch den Grund für die Verwendung eines Symbols. In diesem Fall kann es leicht werden, dass Symbole ihre Wirksamkeit verlieren.
Das Hauptattribut für Icons ist a gemeinsame visuelle Sprache was effektiv Sprachlücken überbrückt. Sie sind sofort erkennbar und entfernen offene Interpretation. Dies macht sie perfekt für einen digitalen Kontext, da das Internet von vielen Menschen und ihren entsprechenden Kulturen gemeinsam genutzt wird.
Screenshot des Noun-Projekts Ein universell lesbares Symbol zu entwerfen, ist immer noch eine große Herausforderung. Alle unsere Kulturen haben grafische Konventionen, die zu Verwirrung über die Bedeutung hinter einigen benutzerdefinierten Symbolen führen können.
Das Erkunden einer neuen Oberfläche mit vielen Symbolen kann auf den ersten Blick eine Herausforderung darstellen. Es dauert eine Weile, bis wir wissen, wo alles ist, und uns an die Bedeutung der einzelnen Ikonen gewöhnen. Beschriftungssymbole (mit der Titel (oder benutzerdefinierte Tooltips) verbessern die Effektivität beim Erlernen einer neuen Schnittstelle und gelten als bewährte Methode. Tatsächlich ist es allgemein anerkannt, dass Symbole in Kombination mit Beschriftungen von Benutzern schneller verarbeitet werden.
Einer der häufigsten Fehler, den wir machen, ist, dass wir ihn verwenden zu viele Symbole in einer bestimmten Einstellung. Symbole sind am effektivsten, wenn sie das visuelle Interesse verbessern und die Aufmerksamkeit des Benutzers auf sich ziehen. Sie helfen Benutzern beim Navigieren auf einer Seite. Verwenden Sie zu viele Symbole und sie werden nur noch zur Dekoration. Ihre Verwendung für die Navigation auf einer Webseite kann oft zu einer Verwässerung führen.
Facebook verwendet so viele Icons, dass sie nicht mehr als visuelles Interesse dienen, sondern eher als Dekoration dienen. 
Bestimmte Windows-Benutzeroberflächen verwenden komplizierte Symbole, die keine saubere Benutzeroberfläche bieten und dadurch die Benutzerfreundlichkeit beeinträchtigen. Durch die Begrenzung der Anzahl der verwendeten Symbole werden Sie die Aufmerksamkeit des Benutzers schneller erlangen und die Navigation erleichtern.
Die Fußzeile von The Verge verwendet Symbole geschickt. Hier haben die Icons einen klaren Mehrwert und das Layout wirkt nicht überladen. 
In diesem Screenshot von Behance sind die Symbole sorgfältig aufeinander abgestimmt, um das Verständnis der Seite zu erleichtern. 
Obwohl diese Artwork-Seite auf Artsy viele Icons enthält, funktionieren die Icons aufgrund des einfachen Brandings der Website perfekt, um den Benutzer bei der Auswahl der Navigation zu unterstützen. Icon-Kits sind großartig, aber manchmal ist es besser, eigene Icons zu entwerfen oder vorhandene Icons (mit Erlaubnis) an Ihre Bedürfnisse anzupassen. Das Erscheinungsbild einer Website sollte sich in den von Ihnen verwendeten Symbolen widerspiegeln. Wie Sie in den Beispielen sehen können, sollte dies nicht unbedingt eine sehr schwierige Aufgabe sein, und es ist definitiv etwas, das Sie berücksichtigen können, um das Branding Ihrer Website zu verbessern. Es sind die kleinen Details, die den Unterschied zwischen einer großartigen Website und einer außergewöhnlichen Website ausmachen.
Andererseits kann die Schaffung eines Kontrasts vom regulären Branding das visuelle Interesse noch einfacher machen. Hier ist ein Beispiel von Twitter. Sehen Sie, wie der Button zum Schreiben eines Tweets hervorsticht?
In Bezug auf die visuelle Darstellung sollten Schnittstellensymbole so unterschiedlich sein, dass sie unterscheidbar sind, während sie konsistent genug sind, um als zusammenhängendes Ganzes zu arbeiten.
Die größte Gefahr besteht in der Verwendung von Symbolen, weil sie eine Ästhetik bieten, nicht weil sie kommunizieren. Große Icons sind sowohl optisch ansprechend als auch kommunizieren mit den Benutzern.
Ohne Symbole wären wir verpflichtet, Text zu verwenden, um unseren Benutzern bestimmte Funktionen zu beschreiben. Können Sie sich einen Videoplayer nur mit Text besagen, der "play", "pause", "like", "fullscreen" lautet? Symbole bieten bekannte Metaphern zur Kommunikation schnell.
Die Leistungsfähigkeit der Icons wird genutzt, um zu verstehen, wie dieser Videoplayer schnell und effizient funktioniert. 
Die Kombination aus Farbe und einem erkennbaren Symbol gibt Rückmeldung: Etwas stimmt nicht. Es ist auch möglich, Benutzern zu geben Feedback durch Symbole, normalerweise in Kombination mit Farbe. Ein grünes Häkchen zeigt Benutzern beispielsweise an, dass ein Benutzername verfügbar ist. Ein Kreuz in einem roten Kästchen zeigt dem Benutzer an, dass er ein neues Passwort nicht erneut korrekt eingegeben hat. Icons können eine wunderbare Unterstützung bieten, besonders wenn sie in Echtzeit angewendet werden. Im obigen Beispiel werde ich benachrichtigt, wenn ich etwas eingebe, das keine URL ist Echtzeit. Das dahinter stehende Konzept hat viele potenzielle Zwecke, die alle die Benutzererfahrung verbessern.
Wir leben jetzt in einer Zeit mit verschiedenen Bildschirmgrößen, flüssigen Layouts und unterschiedlichen Pixeldichten. Dies hat einen großen Einfluss auf den Umgang mit Bildern und daher macht es nur Sinn, dass es auch den Umgang mit Symbolen beeinflusst.
Wir haben uns immer mehr zur Angewohnheit gemacht, Bilder für verschiedene Geräte zu optimieren, aber wir können unsere Icons auch so anpassen, dass sie ein makelloses Erlebnis schaffen. Ein bestimmtes Symbol kann bei 200px extrem gut funktionieren, aber wird seine Botschaft bei 12px immer noch klar vermittelt oder verschwimmen die Details? Kürzlich haben wir einen Artikel veröffentlicht, der sich mit responsiver Ikonographie befasst und dieses Konzept näher erläutert.
Symbole werden missachtet, indem gängige Praktiken ignoriert werden. Wenn Benutzer daran gewöhnt sind, ein Symbol als etwas zu erkennen, ist es äußerst verwirrend, die Aktion hinter diesem Symbol zu ändern.
Aus diesem Grund werden laufend Standards vorgeschlagen und die vorhandene Ikonografie verfeinert. Sehen Sie sich an, was Andy Clarke zu einem Symbolstandard für responsive Navigation zu sagen hat .
Die wichtigste Regel bleibt jedoch: Treten Sie nicht von vorhandenen Benutzermustern ab. Ein ausgefallenes neues Menüsymbol klingt zwar nach einer großartigen Möglichkeit, Ihre Gestaltungsfähigkeiten herauszufordern und ein einzigartiges Design zu entwickeln, gleichzeitig kann es jedoch eine Katastrophe für die Benutzerfreundlichkeit sein.
Vor kurzem kritisierte ein auf Medium veröffentlichter Blogbeitrag die Verwendung von hohlen Symbolen nach der kürzlich erfolgten Veröffentlichung von iOS 7. Er behauptete, dass die Verwendung von hohlen Symbolen mehr "Arbeit" von Benutzern erfordert. Dieser Blogeintrag wurde in der Webdesign-Community ausführlich diskutiert. Es gibt unterschiedliche, interessante Gesichtspunkte. Wir sind uns jedoch alle einig, dass die Ikonografie für den Benutzer sinnvoll sein sollte. Bei dem geht es natürlich um Konventionen.
Beim Schreiben dieses Artikels hatte ich ein Ziel vor Augen: uns alle daran zu erinnern, uns selbst zu fragen Warum Wir verwenden Icons auf Websites, die wir erstellen. Für viele von uns ist es eine Automatisierung geworden, sie selbstverständlich in unsere Projekte aufzunehmen. Fragen Sie sich das nächste Mal, was der zusätzliche Wert dieses zusätzlichen Symbols ist und wie es mit den anderen Symbolen auf der Website verglichen wird.
Accentsconagua