Präsentation Webkomm Corporate Identity | Farben | Wording | Themenstrukturen | Index, Ikon, Symbol...

Webkommunikation

Corporate Identity◦ Corporate Branding◦ Corporate Behaviour◦ Corporate Culture◦ Corporate Design◦ Corporate Communication◦ Corporate Language

Indizes, Icons & Symbole Ikonographie Farben Wording Themenstruktur von Webauftritten

Agenda

Corporate Identity

Corporate Identity

Corporate Branding

Unternehmensleitbild | Vision Selbstbild Fremdbild Ganzheitliches Auftreten und Handeln Gefühl der Vertrautheit soll erzeugt werden Aktive Bearbeitung ist wichtig

◦ Wissen wer man ist und das auch kommunizieren Ziel: starke Assoziationen der Kunden

Corporate Branding

Zusammenspiel◦ Kreativität◦ Werbedruck◦ Strategie

Corporate Branding Strategien für KMU

KONDITIONIERUNGSTECHNIK ◦ Bedürfnisse wecken und stillen ◦ Bsp: Zwischenmahlzeit, Frühstückchen

PARABELTECHNIK◦ Leistungsfähigkeit überspitzt darstellen (Pattex Lastwagen)

IDENTIFIKATIONSTECHNIK◦ Der Kunde ist der Held (Wenn ich kaufe, dann…..)

INTEGRATIONSTECHNIK◦ Kunden integrieren (Tupperware)

FEINDBILDTECHNIK◦ Gefahr ist stets vorhanden Produkt ist der Retter

Gefrierbrand Toppits Gefrierbeutel

Corporate Branding Strategien für KMU

Glaubwürdigkeit Erscheinungsbild und Handlungen

abstimmen Bewusstsein der Kunden Ethische Erwartung steigt mit

Unternehmenserfolg Umwelt! Konsumenten werden sensibel

Bsp.: MC Donalds ◦ Verantwortung übernehmen◦ Imagegewinn

Corporate Behaviour

Allgemein die Organisationskommunikation eines Unternehmens

Verschiedene Ansätze (Bruhn, Lies, Zerfaß) PR und Marketing auf gleicher Ebene? Zielgruppen: Mitarbeiter, Stakeholder,

Anrainer, Kunden, Arbeitsuchende, etc. Konsistente Strategie abgeleitet von Vision

sehr wichtig

Corporate Communication

Dt. Unternehmenskultur Werte & Normen Prägt Handeln & Verhalten

Corporate Culture

Corporate Culture

Corporate Culture Beispiele INTERSPORT

◦ sportliche Aktivitäten◦ Veranstaltungen

Fronius◦ Energy Points◦ Kommunikation

3M◦ Innovationen◦ Neue Ideen

Corporate Culture Vorteile Hohe Mitarbeitermotivation Höhere Produktivität Effizienteres Arbeiten Loyalität

Definiert das Erscheinungsbild◦ Kommunikationsdesign◦ Industriedesign◦ Architektur◦ Werbung◦ Visuelles Erscheinungsbild in jeder Form

Corporate Design

Grundelemente◦ Signet bzw. Wortbildmarke◦ Corporate Graphic Design◦ Corporate Typography◦ Corporate Picture◦ Corporate Color◦ Corporate Industrial Design◦ Corporate Architecture◦ Corporate Fashion◦ Materialien◦ Gestaltungsrichtlinien

Corporate Design

Daraus entsteht Markenwert (Brand Equity) Nicht nur materiell sondern auch

wahrgenommener Wert Maßgeblich für Erfolg ausschlaggebend

Corporate Design

B2C Sektor Messgrößen zur Evaluierung

Brand Equity

Brand Equity

Erfassung aller Gestaltungselemente Externe Kommunikation Laufende Weiterentwicklung Beispiel Fronius CD

CD Manual

Corporate Wording Einheitliche Sprachkultur Philosophie Schreibkultur Unternehmenssprache Phrasen

Corporate Language

Icons, Indizes, Symbole & Ikonographie

Sprache nutzt Zeichen für Kommunikation Handbewegung, Gesichtsausdruck,...

Semiotik (griech. „Zeichen“) Analyse von ZeichenKommunikation Mensch & Tier

3 Zeichenarten: Indizes Ikons Symbole

Definition

Lat. „Zeigefinger“ Räumliche Nähe Richtungsweisendes Verkehrsschild,

Fußnoten,...

Index

Griech. „Replik / Abbildung“ Darstellung einer Sache die Realität ähnelt Abstraktes Verkehrsschild

Ikon

Symbol

Weitere Symbole im Bereich der Verkehrsschilder?

Griech. „Wiedererkennungszeichen“ Keine Kontiguität oder Ähnlichkeit nötig

Übereinkunft: Symbol mit best. Bedeutung Verbunden (wurde gelernt)

Eurozeichen, Flaggen,...

Griech. „Wiedererkennungszeichen“ Keine Kontiguität oder Ähnlichkeit nötig

Übereinkunft: Symbol mit best. Bedeutung Verbunden (wurde gelernt)

Eurozeichen, Flaggen,...

Symbol

Indexikalische Zeichen: „Primitivsten“ – Hier & JetztKörpersprache, Richtungsweisend

Ikonische Zeichen:abstrakter als IndizesÄhnlichkeit & Verbindung zw. Form & Bedeutung nötig

Symbole:hoch Abstraktmenschliche Kommunikationerlernen - Gebärdensprache

Unterschied - Abstraktheit

Index – ein Zeichen, das mit seinem Objekt räumlich / zeitl. verbunden ist:

Ikon – ein Zeichen das seinem Objekt ähnlich ist:

Symbol – Ein Zeichen dem Begriffe zugewiesen wurden, die man erlernen muss:

Zusammengefasst

Index – ein Zeichen, das mit seinem Objekt räumlich / zeitl. verbunden ist:

Ikon – ein Zeichen das seinem Objekt ähnlich ist:

Symbol – Ein Zeichen dem Begriffe zugewiesen wurden, die man erlernen muss:

Frage: Auch im Web zu finden?

Web-Link: Hier erfahren Sie mehr Fußnoten bei Seminararbeiten Zurücktaste im Browser Button „zum Seitenanfang hinaufspringen“ ...

Indizes im Web

Smileys / Emoticons Home-Button des Browsers Toolbar-Paint

Ikons im Web

HTML / Programmiersprachen Mauspfeil (Windows)Logo PFD-Symbol, ...

Symbole im Web

Griech. „Bild“ und „schreiben“ Methode aus Kunstgeschichte Bestimmung & Deutung von Motiven der

bildenden Kunst

Nöth: Ikonographie ist Forschungsgebiet innerhalb der Semiotik

2 Bereiche: Ikonografie & Ikonographie

Ikonologie - Ikonographie

Bestandteil von graphischen Benutzeroberflächen

Hoher Wiedererkennungswert Müssen erlernt werden Einfach erkennbar & verständlich Zeitlicher Wandel

Welche Icons kennen Sie aus dem Bereich eCommerce?

Icons im Web

Bestandteil von graphischen Benutzeroberflächen

Hoher Wiedererkennungswert Teils erlernt Einfach erkennbar & verständlich Zeitlicher Wandel-responsive

Welche Icons kennen Sie aus dem Bereich eCommerce?

Icons im Web

Farben, Wording, Themenstruktur

RGB (Rot, Grün, Blau)◦ 0-255 Anteile der Bildpunkte (Dichtestufen)◦ 0 = Keine Farbe, 255 = volle Farbe◦ 255, 255, 255 = Weiß

CMYK (Cyan, Magenta, Yellow, Black)◦ Mischung aus diesen Primärfarben◦ Basisfarbe Weiß◦ Einsatz: Druck◦ Vorsicht: Nicht alle angezeigten Farben sind druckfähig!

Farbmodelle

Farbe Positive Assoziation

Negative Assoziation

Weiß Unschuld, Reinheit Kühle

Gelb Optimismus, Wärme Geiz, Neid

Orange Lebensfreude Aufdringlichkeit

Rot Leidenschaft Gefahr

Grün Frische, Entspannung

Gleichgültigkeit

Schwarz Würde Trauer

Farben - Bedeutung

Farben – Einflussfaktor Kultur

Farbe Bedeutung

Rot • Europa: Gefahr• Asien: Freude, festliche Stimmung

Gelb • Europa: Licht, Sonne, Wärme• Russland: Unglück

Weiß • Europa: Reinheit• China: Tod, Trauer

„To internationalize your website means to adapt its contents and style for the

international audience.“

Essentielles Element der Websitegestaltung

Corporate Identity, Corporate Design

Dienen als Orientierungshilfe

SymbolikWare verfügbar = grünWare nicht verfügbar = rotHyperlink = blau

Online Farbenwahl ≠ Offline Farbenwahl

Bsp.: CSS Zen Garden

Farben im Webdesign

Wording

Hohes Tempo

Lange Texte werden nicht gelesen

User sind ungeduldig

Content soll einfach und komprimiert dargestellt werden

Wie interagiert User?

Wiedererkennungswert generieren Slogans

Der Nutzer muss verstehen was dahinter steckt!

Mit Wording werden Aktionswege vorgegeben

Fehlinterpretationen haben negativen Einfluss◦ Absprungrate◦ Conversion-Rate◦ Anwendungen werden nicht genutzt

„Don‘t make me think“ – Stefan Krug

Wording – Was ist wichtig?

Benennungen von ElementenWebsite

Aktion Präferierte Benennung

Dokumente herunterladen

Echtzeit-Kommunikation mit Nutzern

Suchfunktion

Niederlassungen

Download (63%)Auf Festplatte speichern (10%)

Chat (49%)Life-Chat (20%)

Suche (41%)Suchen (28%)

Filial-Finder (53,7%)Shopfinder (30%)

Benennungen von ElementenOnline Shop

Aktion Präferierte Benennung

Neue Produkte

Preisgünstige Angebote

Am meisten verkaufte Produkte

Konfigurator

Neuheiten (39%)Neu im Shop (20%)

Schnäppchen (29,9%)Sonderangebote (21,4%)

Bestseller (28%)Top Ten (24%)

Produkte zusammenstellen (39%)Produktkonfigurator (21%)

Bewusst auf Wording achten

Webshop – RechercheKonkurrenzanalyse

A/B-TestingBsp: Kaufen Button◦ Zahlungspflichtig bestellen◦ Kaufen◦ Kostenpflichtig bestellen

Vorgehensweise

Vgl. Wünschmann / Schwarz / Müller (2008)Vgl. eResult (2012)

Nach Produktgruppen (Hosen, Kleider,…)

Nach Zielgruppen (Frauen, Männer, Kinder…)

Kategorien (Sportarten)

Themenstruktur von Webauftritten

Primäre Navigation◦ Oberste Ebene der Struktur◦ Bildet die Hauptkategorien ab◦ Kann/Soll von jeder Webseite erreichbar sein

Sekundäre Navigation◦ 2 Ebene der Struktur◦ Ermöglicht die Navigation innerhalb der primären

Navigation Meta Navigation

◦ Orientierungshilfen◦ Bsp.: Sitemaps, Suche, Kontakt, Home,…

Navigationsstruktur

JKU Navigation

Primäre Navigation

Sekundäre Navigation

Metanavigation

Pfadangaben Dropdown Anker-Navigation

Mobile Darstellung◦ Responsive Webdesign

Navigationsstruktur

Nutzeranforderungen◦ Wo bin ich?◦ Wo war ich bereits?◦ Was gibt es hier zu sehen?◦ Wie komme ich zurück?◦ Wohin kann ich gehen?

Eine gute Navigation ist◦ intuitiv gestaltet◦ konsistent

Anforderungen an eine Navigation

Häufigste Kombination◦ Header: Primäre Navigation◦ Links: Sekundäre Navigation

Footer◦ Impressum◦ Kontakt

Sonderfall der Navigation

Wie teste ich meine Navigation?◦ www.optimalworkshop.com/chalkmark.htm

Positionierung der Navigation