Einige wichtige Punkte des visuellen Website-Designs
|
Vom Kunsthandwerksdesign über Grafikdesign bis hin zum Webdesign bleiben die Designprinzipien zwar gleich, aber meiner Erfahrung nach bringt der Wechsel des Designmediums viele Besonderheiten des Mediums selbst mit sich. Hier sind einige wichtige Punkte des visuellen Designs von Websites, basierend auf den Erfahrungen anderer und meiner eigenen Erfahrung: 1 – Logo: Grundlegende Logomerkmale, im Einklang mit den Grundlagen des Logodesigns (üblich für Grafikdesign). Anzeigeeffekt: Klarheit, Mindestgröße (aufgrund der Anzeigeauflösung entspricht der Druckwirkung des Offline-Grafikdesigns). 2 – Text: Die Inhaltsebene bestimmt die Schriftart, -größe und -stärke; der Status bestimmt die Farbe (Standard oder einheitlich, je nach Website). 3 – Anzeigen und Inhaltsbilder: Positionierung von Größe und Stil, Harmonie auf derselben Seite, Bildoptimierung, Positionsrhythmus und Größenvergleich. 4 – Symbol: Marke, genauer und angemessener Ausdruck, Designtechnik (basierend auf der Marke), Konsistenz, Funktion: attraktiv, auffällig, leicht zu erkennen, zu verstehen, zu bedienen und zu merken. 5 – Anklickbar (Schaltfläche): Unterschied (nicht anklickbar), basierend auf der Lebenserfahrung der Menschen: Dicke, Anklickbarkeit, Textur (physische Assoziation), Farbe (Marke, Einheit, Kontrast); einheitliche Stilgröße (basierend auf dem einheitlichen inneren Rand des Textes) 6— Hintergrundbild: Schaffung einer Atmosphäre, Übereinstimmung mit dem Produkt, Optimierung (Qualität, Größe, Farbinformationen, Implementierungsplan), 7— Grafik- und Textlayout: Hauptbild und Nebentext, Grafik- und Textrhythmus, Lücken und Modularisierung. 8 – Aktueller Status: Vergrößern (Form), Farbe ändern (invertieren, Kontrast, Helligkeit und Reinheit), Inhaltsaufforderungen nach dem Ein- und Auslinken angeben. 9 – Interaktive Steuerung: angemessener und genauer Stil (Standardwahrnehmung des Systems und der täglichen Routine der Benutzer), Zustand (Optimierung des visuellen Ausdrucksstils und des Aktionsprozesses) und Kreativität. 10 – Laden: Inhaltsrelevanz (Inhaltsrelevanz vor und nach dem Laden), Spaß am langweiligen Warten, Volumen- und Flächenoptimierung, Kreativität. 11 – Benutzerfeedback_Erfolg, Fehler, Eingabeaufforderung, kein Ergebnis: Texterstellung (klar, vernünftig, humanisiert, kreativ), Grafik (klar, auffällig, psychologisch-kognitive Farbgenauigkeit). 12 – Animationseffekt: vernünftiger Prozess (Rationalisierung der Simulation einer realen Umgebung), Kontinuität, Rhythmusgefühl, Ausführung der täglichen Aktionen des Benutzers, Koordination von Soundeffekten und Kreativität. 13 – Anfangs- und Enddesign: Anfang (Markenwerbung, eigene Merkmale, klarer Inhalt, Ausdruck der Atmosphäre, Kreativität. Ende: Echo, Rhythmus (mit dem Anfang), Kreativität. 14 – Adaptives Screendesign (Fullscreendesign): Berücksichtigung der größten und kleinsten Bildschirme (Position von Texten und Bildern, Zeilenumbrucheffekte) 15 – Rasterdesign mit fester Größe: sinnvolle Zellen (unter Berücksichtigung des Goldenen Schnitts), Zellflächenrhythmus und gleichmäßige Ränder 16 – Demo-Designentwurf: die größte und die geringste Berücksichtigung des Inhalts. 17 – Seite: Marke, Konsistenz der Hauptelemente, Wiederverwendbarkeit, Sinn für Rhythmus und Fläche, visuelle Attraktivität, Anleitung beim Browsen, Beziehung zwischen Punkten, Linien und Flächen, Skizzierprinzipien (Verwenden der Grundregeln des Skizzierens zum Erstellen von Seiten). 18 – Lesen: Der Komfort des Hintergrunds zum Lesen (Sehen), der Kontrastkomfort zwischen Inhalt und Hintergrund. Tatsächlich gibt es noch viele weitere Designpunkte, wie Interaktionsdesign und Codedesign. Diese können wir den Benutzern zeigen. Zusammengefasst bilden sie einen großen Prozess des User Experience Designs. Oft können wir dabei nicht jeden Punkt einschätzen, also fassen wir sie zusammen, damit sie jederzeit überprüft werden können! |
<<: Detaillierte Analyse der Kompilierung und Installation von vsFTP 3.0.3
>>: Detaillierte Erläuterung der MySQL-Datenbank mit zig Millionen Datenabfragen und -speicherungen
Artikel empfehlen
js, um die vollständigen Schritte der Konvertierung von Chinesisch nach Pinyin durchzuführen
Ich habe js verwendet, um ein Paket zur Konvertie...
jQuery implementiert das Klicken auf die linke und rechte Schaltfläche zum Wechseln von Bildern
In diesem Artikelbeispiel wird der spezifische Co...
So gehen Sie mit dem vom Linux-System gemeldeten Warnproblem xfs_vm_releasepage um
Problembeschreibung Auf mehreren Rechnern wurden ...
So installieren und konfigurieren Sie den SSH-Dienst in Ubuntu 18.04
Installieren Sie das SSH-Tool 1. Öffnen Sie das T...
Erfahren Sie, wie Sie saubere und standardmäßige HTML-Tags schreiben
Guter HTML-Code ist die Grundlage einer schönen W...
Diskussion zu den Themen Bildschaltflächenübermittlung und wiederholte Formularübermittlung
In vielen Fällen wird die Schaltfläche „Senden“ du...
Lösen Sie das Problem, dass IN-Unterabfragen in MySQL dazu führen, dass der Index unbrauchbar wird
Heute habe ich eine Fallstudie zur MySQL IN-Unter...
Lösung für das Problem, dass die virtuelle Virtualbox-Maschine im NAT-Modus keine Verbindung zum externen Netzwerk herstellen kann
Hintergrund Für die virtuelle VirtualBox-Maschine...
So erstellen Sie eine Liste in CocosCreator
CocosCreator-Version: 2.3.4 Cocos hat keine Liste...
Umfassendes Verständnis des MySQL-Protokolls für langsame Abfragen
Inhaltsverzeichnis Was ist das Protokoll langsame...
Analyse der Verwendung von MySQL-Abfragesortierung und Abfrageaggregationsfunktionen
In diesem Artikel wird die Verwendung von MySQL-A...
Beitrag zur Übermittlung von HTML-Daten_PowerNode Java Academy
Zu den vom HTTP/1.1-Protokoll angegebenen HTTP-An...
HTML-Tabellen-Tag-Tutorial (19): Zeilen-Tag
Die Attribute des <TR>-Tags werden verwende...
Verwenden von CSS zum Implementieren einer Ladeanimation des Android-Systems
Im Web gibt es zwei gängige Ladesymbole: eines is...
Detaillierte Erklärung dynamisch generierter Tabellen mit Javascript
*Seite erstellen: zwei Eingabefelder und ein Butt...