Entwerfen von Websites mit Rastern

Ich habe viel über Grids gelesen und wie sie die Websites gut aussehen lassen (natürlich stimme ich zu).

obwohl ich nicht in der Lage war, mit ihnen zu arbeiten. Ich konnte den Vorteil bei der Verwendung des Rastersystems nicht "fühlen" (ich spreche immer von der Photoshop-Phase).

Also habe ich mich gefragt, ob es einige Ressourcen gibt, wie man das Grid-System nutzen kann. Vorzugsweise suche ich nach Tutorials (besser noch Video-Tutorials), in denen der Autor sagt: "So verwende ich das jeden Tag" und NICHT "So können Sie es tun". Grundsätzlich weiß ich, wie man das Grid-System benutzt. aber ich suche nach guten Praktiken, etwas (zum Beispiel), das ich bekommen würde, wenn ich einem Experten über die Schulter schaue.

Hoffe ihr könnt helfen, danke

Das Entwerfen nach einem Raster ist ein grundlegendes Konzept des Grafikdesigns. Recherchieren Sie etwas über Grid-basiertes Design im Allgemeinen ... es ist alles auch auf das Web anwendbar. Ressourcen für das Design von Veröffentlichungen wären eine primäre Quelle für Referenzmaterialien.
A, das ist eine gute Idee, ich sammle tatsächlich alle gedruckten Designs, die ich finde, bin aber nie dazu gekommen, sie zu analysieren. Vielleicht wäre es gut, sich das Grid-Design an seiner primären Quelle anzusehen. Ich weiß zwar nicht, wie es bei anderen ist, aber ich arbeite besser, wenn ich zuerst lerne, was ich brauche - und dann tiefer in die Materie einsteige. für mich ist es wie etwas über den Zweiten Weltkrieg zu lernen, zuerst die Grundlagen zu bekommen, dann in ein schweres Buch einzutauchen. aber danke, wenn du irgendwelche Referenzen dafür hast, teile sie bitte

Antworten (4)

Aurel,

Ein Vorteil der Verwendung von Rastern hilft Ihnen, gleichmäßige Abstände von Elementen in Ihrer Komposition anzuwenden. Wenn Sie mit Informations- und Textelementen wie einer Webseite arbeiten, ist es äußerst wichtig, dass Sie Elemente mit einer strukturierten, visuellen Hierarchie im Layout platzieren. Informationen sind natürlich das Rückgrat des Webs, daher ist das Erstellen einer Struktur dieser Informationen genauso wichtig wie jedes andere Informationsdesign-Projekt.

Eines der vielen Dinge, die ich von der Grafikdesignschule gelernt habe, war, dass visuelle Elemente Raum zum Atmen brauchen und Weißraum genauso wichtig ist wie visuelle Elemente im Layout. Versuchen Sie, mit Ihrem Layout zu experimentieren. Erstellen Sie eine Komposition mit willkürlicher Polsterung und dann eine andere, indem Sie den Richtlinien des Rasters folgen. Ich kann Ihnen garantieren, dass das Layout, das in Bezug auf die Platzierung von Informationen strenger geregelt ist, professioneller aussieht. Etwas bizarr, wenn Sie bedenken, dass Sie genau dieselben Elemente verwenden und der einzige Unterschied der Abstand zwischen ihnen ist!

Wie in den vorherigen Beiträgen erwähnt, können Sie das 960-Grid-System verwenden, um Ihnen bei den Web-/Photoshop-Sachen zu helfen. Sie können sich dieses Grid-System-Buch auch in der Bibliothek (ja, einer Bibliothek) ansehen, um mehr darüber zu erfahren. Weitere Ressourcen: The Grid System , Grid System Wiki

Viel Glück!

ironischerweise ist das buch in keiner meiner lokalen bibliotheken, nicht einmal an der uni :) wenn du das meinst, aber ich mag die idee eines buches wirklich, also habe ich es natürlich bei amazon bestellt. Ihr Grid-System-Link, hat das mit dem Buch zu tun? Was denkst du, sollte man darüber nachdenken, ein Grafikdesign-Studium zu belegen, wenn man keine künstlerischen Fähigkeiten hat? Da es viele Artikel zum Thema Webdesign gibt, die (wie Sie) auf den Grafikdesignkurs des Autors verweisen - vielen Dank für den großartigen Beitrag
Eine Frage, wenn Sie glauben, dass rasterbasiertes Webdesign sehr gut ist, würden Sie, sobald Sie die Fähigkeit haben, jemals ohne das Raster arbeiten (ich weiß, dass das Brechen der Regel hier und da das Element hervorhebt, aber ich hauptsächlich, designe einfach das Ganze ohne das Raster (obwohl Sie mit dem Raster GROSSARTIG wären)) - Im Grunde ist es wie ein Tabellenlayout (dh kein Raster) VS. CSS-Layout (zB mit Raster). Also, einmal CSS-Tabellen-Layout zu kennen, ist viel zu schlecht; daher gibt es jetzt, da Sie das Raster kennen, kein Entwerfen mehr ohne es; oder ist das entspannter
Sie müssen kein guter Künstler sein, um gut im Grafikdesign zu sein. Das Erlernen der Grundlagen und der Erwerb einer soliden Grundlage im Grafikdesign ist wesentlich wichtiger als die Fähigkeiten im Zeichnen.
Ich verstehe, dass diese Fragen vielleicht übertrieben werden, aber wissen Sie, wo ich anfangen kann, diese Grundlagen zu lernen? Grafikdesign ist das Thema, über das ich am meisten lernen möchte, und das, zu dem ich noch nichts Solides gefunden habe (indem Sie sagen, dass das Wissen, wie man Photoshop verwendet, nicht bedeutet, dass Sie die Essenz des Grafikdesigns kennen).

Ich schaue mir gerne Websites an, um mich inspirieren zu lassen, und studiere "das Raster". Mir fällt keine 'alltägliche Übung' ein, außer einfach damit zu spielen. Hier ist eine schöne Website mit 50 guten Grid-Websites
. Viel Glück!

Danke, ich wandere, krrpen Sie ein Skizzenbuch für Ihre Gitter-(Netz-)Experimente? Wenn Sie ein Grafikdesigner sind, ist das anders, aber für einen Webdesigner (ohne künstlerische Fähigkeiten) wäre ein Skizzenbuch nützlich? Ich fing an, eines zu verwenden, aber es dauerte nicht lange, bis ich einen extremen Nutzen bemerkte. aber danke
Webdesigner - ja ... Ich betrachte mich als Hybrid aus Web/Grafik/Designer/Entwickler und finde es sehr nützlich, nur zu skizzieren und zu zeichnen (ohne künstlerische Fähigkeiten). Ich kann mir die Skizzen nicht einmal ansehen, wenn ich es herausgefunden habe in meinem Kopf, aber es ist viel einfacher, als nur zu versuchen, in Photoshop geradeaus zu kommen (obwohl ich ein Wacom-Tablet habe). Ich sehe, dass andere es auch tun: leticiasanc.files.wordpress.com/2009/04/site_sketches1.jpg
das ist genau das, was ich tue. Ich auch, es gibt Zeiten, in denen ich nicht sehe, was ich skizziert habe, oder in einem Monat darauf zurückkomme und sie mit einem anderen Geisteszustand sehe. Danke fürs Teilen :) - Ich bin darauf vorbereitet, habe aber nie jemanden danach gefragt

Ich würde mir diese Ressource ansehen: http://www.designinfluences.com/fluid960gs/ & http://960ls.atomidata.com/#usage

Es gibt Ihnen viel besseres Lernmaterial als das Stöbern auf anderen veröffentlichten Websites.

das ist viel besser. Wie steht es mit Ihnen, haben Sie irgendwelche "guten Übungsroutinen", wenn Sie mit dem Designen in Photoshop beginnen? Ich befinde mich in einem Stadium, in dem ich die Grundlagen kenne; und ich versuche jetzt, die guten Praktiken von erfahreneren Leuten zu lernen
Tut mir leid, Aurel, aber ich verwende hauptsächlich CSS, um die meisten meiner Websites zu entwerfen, und ich verwende Adobe Illustrator für Logos, Bilder usw. Es gibt einige großartige Ressourcen für Photoshop. Ich würde mir einfach ein Buch oder so besorgen. ich habe die meisten meiner kenntnisse aus html, css-büchern und üben gelernt

Ich fange auch an, etwas über Grids und ähnliches zu lernen, wenn es um Webdesign geht, ich habe ein Buch gefunden, das ziemlich nützlich und billig ist (wenn Sie es kaufen möchten, ein kurzer Tipp für Studenten mit geringem Budget wie ich, können Sie finden Sie es auch auf Torrents).

Das Buch heißt „Ordering Disorder: Grid Principles for Web Design“ von Khoi Vinh. Hier ist der Link, wenn Sie es bei Amazon kaufen möchten.