→ English Website

 

 

Styleguide Hotel Storch

Folgende Angaben erleichtern  uns alle die Arbeit im Web…

Farbschema

Farbschema

Primär
#660032

 Sekundär
#8f4669

Hell
#f1e8ea

blau
#3c8ee0

call to action
#e09900

grün
#8bab00

Fotos & Grafiken

Dateitypen
Die Anzahl der Dateien, welche wir verwenden, ist übersichtlich. Das Medium Internet und die Browser geben uns quasi den Umfang der eingesetzten Formate vor.

Bildgröße
Die Bildgröße definiert die physischen Abmessungen eines Bildes, gemessen in Breite x Höhe. Sie beschreibt den Platzbedarf in Pixeln. Hiermit arbeiten wir!

Dateigröße
Die Dateigröße definiert den Speicherplatz, den eine Datei (z. B. Dokumente, Bilder, Videos) auf einem Datenträger (Festplatte, USB-Stick) belegt.

Sie wird in Einheiten wie Bytes, Kilobytes (KB), Megabytes (MB), Gigabytes (GB) oder Terabytes (TB) gemessen. Die Größe wird durch den Inhalt, das Format und die Komprimierung der Daten bestimmt.

Wir arbeiten im „KB-Bereich“, als Fausregel gilt um so kleiner die Dateigröße um so besser! Sowohl User als auch vor allem Google mögen optimierte „schlanke“ Dataien.

 

Schriftart und Schriftgrößen

Standartschriftart
Wir verwenden „Verdana“. Diese Schrift ist zum einen frei verwendbar und zum anderen gut lesbar.

Schriftgrößen

Wann welche Überschrift?
Hier gibt es für uns tatsächlich Luft nach oben!

 

Icons

Warum Icons
Perfekte Icons sind einfach, konsistent, funktional und gut erkennbar, auch in kleinen Größen. Sie zeichnen sich durch ein einheitliches Raster, einheitliche Strichstärken (bei Outlines) und hohe Kontraste zum Hintergrund aus. Ziel ist eine intuitive Usability und eine klare Bildsprache, die zur Marke passt.

Die wichtigsten Aspekte für perfekte Icons
Konsistenz: Innerhalb eines Sets sollten alle Icons denselben Stil (z.B. flach, Outline, 3D) und eine einheitliche Linienstärke aufweisen.

Verständlichkeit (Usability): Ein gutes Icon ist selbsterklärend und bildet Funktionen, Ideen oder Produkte eindeutig ab, oft ohne erklärenden Text.

Wichtig

  • Die Icons sollten von Beginn an im Format .svg erstellt werden
  • Von jedem Icon gibt es eine „outline“ und eine „solid“-Version

Übersetzung ins englische

 

Vorgeschlagene Vorgehensweise

  1. Sichtung der bisherigen Icons
  2. Finden eines „styles“ für unsere neuen Icons
  3. Anfertigen von 4 Beispielen
  4. Festlegung welche Icons wir künftig benötigen

https://hotel-storch.de/pauschalangebote-uebersicht/

  • Sparschwein
  • Familie mit Auto
  • Bus
  • Doppeldeckerbus
  • Fußball
  • Tagung und Seminar
  • Messe
  • Motorrad
  • Hochzeit und feiern

https://hotel-storch.de/

  • Restaurant
  • Reservieren
  • Quiz
  • 360° Tour (ohne Kreispfeil aussen)

https://hotel-storch.de/freizeit/

  • Die könnetn wir auch alle neu erstellen, das
    ausstauschen ist aber eine aufwändige Arbeit auf der Karte.
    Entscheidung liegt bei Euch…

https://hotel-storch.de/hotel-ausstattung/

  • Da würde ich nur die wichtigsten erstellen, wie WLAN, Storne, 24-Stundenrezeption,

https://hotel-storch.de/gaeste-guide/

  • WLAN
  • Frühstück
  • Check-in/out Uhren
  • Anfahrt und parken

Diverse

  • E-Ladestation
  • Speisekarte

Für die nächste Websitenavigation in englisch:

  • Home
  • Hotel
  • Restaurant
  • Angebote
  • Freizeit
  • Roomtour
  • Konakt
  • Buchen

 

    Übersetzung ins englische 

    Vorgeschlagene Vorgehensweise

    1. Sichtung der bisherigen Icons
    2. Finden eines „styles“ für unsere neuen Icons
    3. Anfertigen von 4 Beispielen

     

     

    Siehe großes Foto unten…

    Originalgröße
    Abmessungen: 8000 x 4563 Pixel
    Dateigröße: 17 MB

    Hinweis: Größe und Abmessungen
    des ursprünglichen Originalfotos, WordPress hat es von alleine begrenzt.

    Originalgröße als Inhaltselement
    Abmessungen: 8000 x 4563 Pixel
    Dateigröße: 17 MB
    Die Größe Darstellung wurde hier verändert.
    Die Dateigröße und die Abmessung

    Abmessungen geändert
    Bei diesem Foto wurden „nur“ die
    Abmessungen verkleinert.
    Abmessungen: 900 x 513
    Dateigröße:  182 kb

    Abmessungen & Dateigröße verkleinert
    Bei diesem Foto wurden die
    Abmessungen verkleinert und das Foto für Web optimiert
    Abmessungen: 900 x 513 Pixel
    Dateigröße: 68 kb