| ... | @@ -30,18 +30,29 @@ Die verwendete Schriftart für dieses Projekt war hauptsächlich Roboto, da es d |
... | @@ -30,18 +30,29 @@ Die verwendete Schriftart für dieses Projekt war hauptsächlich Roboto, da es d |
|
|
|
|
|
|
|
_Farbschema_
|
|
_Farbschema_
|
|
|
|
|
|
|
|
Das Farbschema des Accelerator war veraltet und sollte durch eine neue Farbgestaltung optimiert werden. Farben lösen bestimmte Gefühle bei Menschen aus und haben unterschiedliche Wirkungen auf diese. Aufgrund dieser Hypothese wurden die Wirkungen von Farben untersucht. Aus der Untersuchung ergab sich, dass sich die blaue Farbe für Businessseiten gut eignet. Der Grund dafür liegt darin, dass die blaue Farbe durch ihren kühlen Effekt Transparenz und Kontinuität ausstrahlt. Sie wirkt sachlich und vertrauensvoll und wird von vielen größeren Unternehmen verwendet. Zudem wird diese Farbe öfters mit Professionalität und Intelligenz in Verbbindung gesetzt, was in diesem Fall passend wäre. Bei der Optimierung des Farbschemas wurden dunklere Farbtöne gewählt, da sie einen höheren Grad an Konzentration übermitteln. Die Farben Weiß und Grau wurden verwendet, um in die blaue Farbe etwas Neutralität einzubauen. Zudem ist weiß eine beliebte Hintergrundfarbe in Webseiten. Das verwendete Farbschema ist aus der folgenden Abbildung zu entnehmen:
|
|
Das Farbschema des Accelerator war veraltet und sollte durch eine neue Farbgestaltung optimiert werden. Farben lösen bestimmte Gefühle bei Menschen aus und haben unterschiedliche Wirkungen auf diese. Aufgrund dieser Hypothese wurden die [Wirkungen von Farben](https://www.webdesign-journal.de/farbwirkung/) untersucht. Aus der Untersuchung ergab sich, dass sich die blaue Farbe für Businessseiten gut eignet. Der Grund dafür liegt darin, dass die blaue Farbe durch ihren kühlen Effekt Transparenz und Kontinuität ausstrahlt. Sie wirkt sachlich und vertrauensvoll und wird von vielen größeren Unternehmen verwendet. Zudem wird diese Farbe öfters mit Professionalität und Intelligenz in Verbbindung gesetzt, was in diesem Fall passend wäre. Bei der Optimierung des Farbschemas wurden dunklere Farbtöne gewählt, da sie einen höheren Grad an Konzentration übermitteln. Die Farben Weiß und Grau wurden verwendet, um in die blaue Farbe etwas Neutralität einzubauen. Zudem ist weiß eine beliebte Hintergrundfarbe in Webseiten. Das verwendete Farbschema ist aus der folgenden Abbildung zu entnehmen:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Die Farbpalette wurde auf der [coolors](https://coolors.co/053464-0c5c83-fefcfb-d9d7d6-313131) Seite zusammengestellt.
|
|
Die Farbpalette wurde auf der [coolors](https://coolors.co/053464-0c5c83-fefcfb-d9d7d6-313131) Seite zusammengestellt.
|
|
|
|
|
|
|
|
| Farbe | Elemente in Accelerator |
|
|
Die einzelnen Farben aus der Farbpalette wurden für bestimmte Icons und Felder verwendet. Aus der folgenden Tabelle ist ihr Verwendungszweck zu entnehmen:
|
|
|
| ------ | ------ |
|
|
|
|
|
| cell | cell |
|
|
|
|
|
| cell | cell |
|
|
|
|
|
|
|
|
|
|
|
| Farbe | Verwendungszweck |
|
|
|
|
| ------ | ------ |
|
|
|
|
| #313131  | Schrift und nicht klickbare Icons |
|
|
|
|
| #D9D7D6  | Kasten und Felder |
|
|
|
|
| #FEFCFB  | Hintergrund, Schrift auf blauen Buttons, Icons auf blauen Buttons |
|
|
|
|
| #0C5C83  | Anklickbare Icons und Buttons |
|
|
|
|
| #053464  | Buttons von der Farbe #0C5C83, die angeklickt wurden |
|
|
|
|
|
|
|
|
_Barrierefreiheit_
|
|
_Barrierefreiheit_
|
|
|
|
|
|
|
|
|
Die Barrierefreiheit wurde anhand des Barrierefreiheitsinspektor des Browsers Firefox überprüft. Für die Verwendung wurde zuerst unter den DevTools der Barrierefreiheitsinspektor eingeschaltet. Anhand vom Barrierefreiheitsinspektor kann ein Element auf der Webseite ausgewählt werden und auf Barrierefreiheit geprüft werden.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
_Ergebnisse der Umsetzung_ |
|
_Ergebnisse der Umsetzung_ |
|
|
|
\ No newline at end of file |
