Design Shack begann als einfache CSS-Galerie mit gut gestalteten Websites, die auf mich aufmerksam wurden. In den letzten Jahren wurden Zehntausende von Entwürfen eingereicht, und jedes wurde sorgfältig geprüft. Die traurige Tatsache ist, dass sich nur rund 5% der Einsendungen von der Masse abheben.
Dies kann auf eine Reihe von Faktoren zurückzuführen sein. Die Site hat die Grundlagen nicht richtig verstanden, hatte nichts Bemerkenswertes zu zeigen oder wurde (gelegentlich) vom Inhalt heruntergelassen. In diesem Leitfaden erfahren Sie, wie Sie sicherstellen können, dass Sie eine große Chance haben, alle möglichen Fallstricke von Designern zu vermeiden. In jedem Stadium betrachten wir ein tolles Beispiel, und eines, das nicht so gut ist.
Nageln Sie die Grundlagen
Es ist üblich zu sehen, wie ein Standort bei der ersten Hürde herunterfällt und nicht die Grundlagen eines guten Designs festnagelt. Zu den Bereichen, für die es sich lohnt, die richtige Zeit zu finden, gehören Typografie, Abstand und Farben (oder normalerweise eine Kombination aus allen drei!).
Wenn Sie nach einem umfassenden Überblick über die Bausteine des Designs suchen, besuchen Sie Five Simple Steps. Es ist jeden Cent wert und hat mir sehr viel über Designprinzipien gelehrt, die ich bisher vernachlässigt habe.
Typografie
Typografie ist wahrscheinlich das am häufigsten übersehene Element eines Designs. Es ist sehr wichtig und kann eine Website erstellen oder brechen.
Überlegen Sie sich sorgfältig, welche Art Sie in Überschriften verwenden möchten, und den Körper Ihrer Website. Obwohl Sie vor ein paar Jahren stark auf eine Handvoll "Web-Safe" beschränkt waren? Schriften, die ein System wie Cufon oder sIFR verwenden, bedeuten, dass die Schriftenmöglichkeiten endlos sind.
Wichtig ist, dass Sie zwei oder drei Schriftarten auswählen und in einer sinnvollen Hierarchie auf der gesamten Site einhalten. Erstellen Sie einen Beispielbeitrag, der zeigt, wie verschiedene Tags aussehen, um sicherzustellen, dass Sie alles richtig gestylt haben. Dies kann Folgendes umfassen:
- Überschriften (ab h1)
- Listen
- Zitate
- Links (und Überschriften- / Bildlinks)
- Akronyme
- Betonung / Kursiv / Fett / Stark
- Code-Formatierung
Abstand
Es ist wichtig, die Elemente korrekt auf der Seite zu platzieren, damit genügend Platz für die Lesbarkeit aller Elemente besteht. Die Anpassung an eine bestimmte Gitterstruktur ist wichtig, wobei das 960-Rastersystem eine beliebte Wahl ist.
Stellen Sie sicher, dass Leerzeichen ausgiebig genutzt werden, und lenken Sie den Leser auf wichtige Elemente auf der Seite.
Farben
Die Auswahl eines Farbschemas für eine Website ist alles andere als einfach (und wir werden ein paar Hilfsmittel behandeln, die Ihnen in einem bevorstehenden Artikel helfen werden). Es ist schwierig, ein einzigartiges Farbschema zu finden, das die Lesbarkeit der Seite nicht beeinträchtigt.
Wenn Sie nach Inspiration suchen, ist Color Lovers eine großartige Website, um schnell durch verschiedene Farbfelder und Kombinationen zu blättern.
Fügen Sie etwas Kreatives hinzu
Wenn Sie alle Grundlagen kennenlernen, kann dies ausreichen, um eine Website vorzustellen, aber ein neues, innovatives Design kann Ihnen helfen, die Aufmerksamkeit zu erregen. Dies kann ein interessantes Layout, Hintergrund oder möglicherweise nur unglaubliche Detailgenauigkeit jedes letzten Elements der Seite sein.
Webdesign wird oft unglaublich "festgefahren", wobei ein bestimmter Stil für einige Monate vorherrscht, bevor etwas neues an Popularität gewinnt. Websites, die sich von diesem Trend lösen? sind viel wahrscheinlicher, da sie viel mehr Inspirationspotenzial haben.
Grafische Elemente
Der naheliegendste Ort, an dem Innovationen entstehen können, sind die grafischen Elemente auf einer Seite. Allerdings müssen Grafiken das Erscheinungsbild einer Seite kohärent wirken, anstatt sich unzusammenhängend und unübersichtlich zu fühlen. Diese zwei Beispiele sind großartige Illustrationen von Bildern und Illustrationen, die für gute und schlechte Effekte verwendet werden:
Das Hinzufügen einer einzigartigen und interessanten Grafik ist eine großartige Möglichkeit, Ihrer Website Persönlichkeit zu verleihen und den Lesern zu Hause zu machen.
Animation
Mit den Animationsmöglichkeiten, die von Systemen wie jQuery bereitgestellt werden, gibt es keinen Grund, eine Site statisch zu halten. Es ist jetzt auch möglich, dies auf eine nutzbare und semantische Weise zu tun, ohne auf Flash zurückgreifen zu müssen.
Ich spreche nicht von klebrigen Animationen, sondern von Effekten, die eine Seite schlanker erscheinen lassen. und mehr Flüssigkeit. Ein gutes Beispiel dafür ist die persönliche Website von Tim Van Damme, die eine echte Freude macht:
Fügen Sie der Rollover-Eigenschaft Ihrer Links einen einfachen Effekt hinzu, um einen reibungslosen Übergang von einem Status zu einem anderen zu ermöglichen.
Navigation
Der Hauptzweck der Website-Navigation sollte immer darin bestehen, dem Leser einen klaren Zugang zum Inhalt zu ermöglichen. Das bedeutet jedoch nicht, dass Sie sich an eine Standardliste von Links halten müssen. Egal, ob Sie sich für die vertikale oder horizontale Navigation entscheiden, mit ein paar Grafiken können Sie leicht Interesse wecken:
Ich weiß, dass ich hier sehr heuchlerisch bin (schauen Sie sich unsere langweilige Linkliste an!), Aber ich glaube, dass Design Shack besser zu einem einfachen Navigationsstil passt. Unterschiedliche Standorte haben unterschiedliche Anforderungen!
Vielleicht möchten Sie einen Blick auf eine unserer Partnerseiten werfen, 13 Styles für einige interessante Menüs zum kostenlosen Download.
Denken Sie zweimal über den Inhalt nach
Viele Leute denken, dass es möglich sein sollte, das Design und den Inhalt Ihrer Website relativ voneinander zu trennen. Dies ist selten der Fall und der Inhalt einer Seite kann einen großen Einfluss darauf haben, ob sie für die Aufnahme geeignet ist.
Eine schlecht geschriebene Kopie, Schreibfehler und grammatikalische Ungenauigkeiten sind ziemlich unentschuldbar. Wenn Sie mit Ihrer Website ein professionelles Image machen möchten, ist es sehr wichtig, dass Sie sich die Zeit nehmen, um die Kopie zu perfektionieren. Es sagt viel über Ihre Liebe zum Detail aus und die meisten Galerien werden Sie wahrscheinlich nicht finden, wenn eine Seite mit Rechtschreibfehlern übersät ist.
Anzeigen
Viele Websites sind auf Werbung angewiesen, um Einkommen zu generieren und ein Projekt in Gang zu halten (wir eingeschlossen!).Dies bedeutet nicht, dass Anzeigen auf Kosten eines guten Designs gehen und sparsam eingesetzt werden müssen. Wenn Sie genug Nachfrage haben, um jeden freien Platz auf Ihrer Website mit Werbung zu füllen, berechnen Sie einfach nicht genug!
Im Allgemeinen ist es besser (wenn auch nicht unbedingt so rentabel), dass die Leser nicht verwirrt werden. Verkaufen Sie keine Anzeigenlinks innerhalb des Textes Ihrer Seite und versuchen Sie nicht, Anzeigen zu verschleiern. Arbeiten Sie mit Unternehmen zusammen, mit denen Sie sich gerne selbst beschäftigen würden, und präsentieren Sie ihr Produkt mit Stolz. Es ist auch hilfreich, wenn Sie sicherstellen können, dass die Anzeigen gut gestaltet sind (dies ist jedoch selten möglich!).
Ein Beispiel für ein Netzwerk von Websites, die dies gut machen, ist Tuts +. Sie unterscheiden klar zwischen Inhalten und Anzeigen, bieten jedoch immer noch eine prominente Position für ihre Sponsoren:
Menge
Eine generelle Faustregel war, dass der Inhalt nicht über den Rand hinausgehen sollte. In Wirklichkeit ist das? ist nicht so wichtig, wie die Menschen einst gedacht haben. Benutzer sind nun vollständig an das Scrollen gewöhnt und erwarten dies beim Besuch Ihrer Website.
Das Wichtigste ist, die Hauptbotschaft einer Seite so schnell wie möglich zu vermitteln. Seien Sie aus zwei Gründen mit der Anzahl der Beiträge oder der Menge der auf jeder Seite angezeigten Inhalte vernünftig: (1) Die Anzeige der 30 neuesten Beiträge bedeutet, dass Ihre Seite a lange Zeit zu laden, und (2) eine sehr lange Inhaltsspalte ist wahrscheinlich unwahrscheinlich? mit der Länge anderer Spalten auf Ihrer Seite.
Den Aufwand wert?
Eine Frage, die ohne Zweifel in dieser Phase durch den Kopf geht, ist, ob diese Arbeit die Anstrengung wert ist. Warum möchten Sie überhaupt in eine CSS-Galerie aufgenommen werden? Gute Frage.
- Promotion & Bewusstsein: Jeder liebt ein wenig Verkehr für ein neues Design, und wenn man ihn vorstellt, ist es eine sichere Möglichkeit, dass eine Menge Leute Ihre Site besuchen. Es ist Ihre Aufgabe, sie in Abonnenten, treue Fans oder zahlende Kunden umzuwandeln.
- Prestige: In verschiedenen Galerien gezeigt zu werden, ist ein großer Selbstbewusstsein. Das heißt, mach es nicht zu deinem einzigen Ziel (und bitte, Bitte, liste sie nicht alle in deiner Fußzeile auf)
- Zukünftige Arbeit: Ich habe festgestellt, dass potenzielle Kunden häufig Design-Galerien verwenden, um einen Designer zu finden, der einen bestimmten Stil hat, nach dem sie suchen. Dargestellt zu werden, kann eine gute Möglichkeit sein, neue Geschäfte zu tätigen.
Viel Glück!
Als Bonus für das Ende dieses Artikels möchte ich Ihnen die Möglichkeit bieten, eine Website kostenlos bei Design Shack einzureichen (normalerweise 3,50 USD). Sobald Sie die oben genannten Punkte durchdacht haben, senden Sie mir eine E-Mail an [email protected]. Ich werde Ihren Beitrag überprüfen und - hoffentlich - sehen Sie Ihre Website bald auf Design Shack!
Diese E-Mail-Adresse reicht für eine Woche - danach schalten wir sie ab!