Wie beim Design vorgehen ?

[Puhmuckel]

Mahlzeit,

wie geht Ihr beim Design einer Webseite vor?
Malt ihr das Design erstmal auf ein Blatt Papier, sprich zeichnen und mit Buntstiften ausfüllen?

Was sollte man beachten, wenn zum Design viele Grafiken gehören?
Es gibt viele Seiten die in 600x800 Auflösung 100% Bildschirmbreite einnehmen, in 768x1024 Auflösung ca. 75 % der Breite einnehmen.

Sollte man ein Design wählen, dass immer 100% der Breite einnimmt?
Bibt es da Barrierefreiheit-Aspekte? Ich stelle mir immer wieder die Frage: Immer 100 % oder runter auf 75 % bei 768x1024 ?

Wenn ich allerdings ein Design wähle, dass immer 100% der Breite ausfüllt, wirkt die Seite wie leer bei höherer Auflösung. Wie kann man das ändern? Mit welchen Designtipps? Außerdem kann man dann auch keine Grafiken z. B. im Header verwenden. Die würden dann ja nur 75 % einnehmen, wogegen die  Boxen drunter 100% einnähmen.

Mann ist das schwierig.

Wer weiß Rat?
Danke

[Danny]

Hi,

üblicherweise zunächst wirklich nur Gedanken zum Thema, bzw. Projekt machen, planen und Papier sowie Stift verwenden.

Mit Buntstift eher weniger, meistens reicht ein einfarbiges, grobes Skribble mit nur angedeuteden Details.

Was sollte man beachten, wenn zum Design viele Grafiken gehören?

Dass man Alernativ-Texte angibt, passende Titel wählt und überlegt, ob die Grafiken zum Inhalt oder nur zum Design-"Rahmen" gehören.

Sollte man ein Design wählen, dass immer 100% der Breite einnimmt?

Kommt darauf an. Ein Problem dabei ist der bei variabler, hoher Breite zunehmend schlecht lesbare Text (Spaltenbreite).

Wenn ich allerdings ein Design wähle, dass immer 100% der Breite ausfüllt, wirkt die Seite wie leer bei höherer Auflösung.

Man kann auch mit Frei-, bzw. Leerraum Wirkung erzielen, wenn passende Farben oder Muster verwendet werden.

Außerdem kann man dann auch keine Grafiken z. B. im Header verwenden.

Das stimmt nicht ganz. Es kann auch eine Mischform verwendet werden, d.h. fixe und variable Größen.

Mann ist das schwierig.

Ja, ist es! ;)

MfG
Danny

[Gerhard]

du solltest dich zuerst entscheiden, für welche auflösung du deine seite optimieren willst
um genug inhalt in die seite reinzubringen ist (meiner meinung nach) erst ab 1024x768 was möglich, allerdings ist das riskant, da dann leute die kleinere auflösung haben auch horizontal scrollen müssen (und das nervt)
am sinnvollsten ist es (meiner meinung nach), mit absoluten angaben zu arbeiten (keine prozentangaben)

mfg gerhard

[Bubax]

Hi,

du solltest dich zuerst entscheiden, für welche auflösung du deine seite optimieren willst

Nein, das ganz sicher nicht. <Zynismus>Entscheide Dich zunächst, für welchen Browser Du optimieren möchtest: Netscape 4.x - oder doch schon IE 5.x...?</Zynismus>

um genug inhalt in die seite reinzubringen ist (meiner meinung nach) erst ab 1024x768 was möglich,

Hä?! Vielleicht denkst Du gerade an komplexes Layout. Inhalt benötigt seltenst viel Platz.

allerdings ist das riskant, da dann leute die kleinere auflösung haben auch horizontal scrollen müssen (und das nervt)

Ja, das nervt. Das nervt aber auch bei einer riesigen Auflösung. Was zählt, sind die Abmessungen des Browserfensters, und die können beliebig und beliebig klein sein. Was hilft Dir bei 1280 oder gar 1600 Pixel Bildschirmbreite ein maximiertes Browserfenster...?

am sinnvollsten ist es (meiner meinung nach), mit absoluten angaben zu arbeiten (keine prozentangaben)

Dann läßt sich (am Ende besonders im IE) gar nichts mehr skalieren.

@ Puhmuckel: Wenn du alles genau so mnachst, wie Gerhard es gerade *nicht* empfiehlt, dann bist Du schon mal auf dem richtigen Weg... ;)

Viele Grüße,
Bubax

[Efchen]

Moin,

hey, das war mein Text ;-)

Gruß,
-Efchen

[Efchen]

Moin,

du solltest dich zuerst entscheiden, für welche auflösung du deine seite optimieren willst

Besser ist es, Seiten für die Menschen, die sie ansehen wollen, zu optimieren, nicht für Teile des Ganzen.

Außerdem ist die Auflösung in diesem Stadium des Designs absolut irrelevant. Du willst ja nicht die Seitenbreite an der Auflösung messen, sondern an dem Dir zur Verfügung stehenden Platz, und der ist nicht nur niemals so groß, wie die Auflösung, sondern oftmals sogar viel kleiner.

da dann leute die kleinere auflösung haben auch horizontal scrollen müssen (und das nervt)

Das hat nichts mit der Auflösung zu tun, ich habe eine Auflösung von 1280x1024 und habe trotzdem oft genug horizontale Scrollbalken.
Das muss wohl an meinem Browser liegen, der nur 772x970px groß ist.

Ob ich eine Ausnahme bin? Keineswegs!

Mit zunehmender Bildschirmgröße werden die Browserfenster immer kleiner.

Gruß,
-Efchen

[schwarze Piste]

Tachchen!

Du hast die entscheidenden Stolpersteine doch schon gesehen - das ist ein guter Anfang!

Jetzt musst du dir für _dein aktuelles Projekt_ eine Lösung überlegen, die alle diese Probleme umschifft. Da kann dir so abstrakt auch niemand wirklich helfen.

Bei den Grafiken kann man sich oftmals mit Hintergrundgrafiken retten oder einer Kombination von "normalen" Grafiken und Hintergrundgrafiken.

In CSS 2 gibt's außerdem min-width und max-width und bisweilen sogar Workarounds um solch sinnvolle Sachen dem Internet Explorer beizubiegen.

All solche Sachen können helfen, müssen sie aber nicht zwangsläufig bei jedem Projekt! ;-)

Gruß

Die schwarze Piste

[Beat]

Mahlzeit,

Mahlzeit

wie geht Ihr beim Design einer Webseite vor?

Ich gehe nicht mit dem Design eienr Website vor, sondern ich suche eine Inhaltsgerechte Form.

Malt ihr das Design erstmal auf ein Blatt Papier, sprich zeichnen und mit Buntstiften ausfüllen?

Nein, Ich strukturiere meine Inhalte logisch, und das nicht auf Papier

Was sollte man beachten, wenn zum Design viele Grafiken gehören?

Brauch ich das?
Ist das Bild ein Inhaltsträger?

Es gibt viele Seiten die in 600x800 Auflösung 100% Bildschirmbreite einnehmen, in 768x1024 Auflösung ca. 75 % der Breite einnehmen.

das interessiert nicht, sondern die Frage ist, welche Breite möchte ein Inhalt gerne haben, und wie kann ich das eventuell steuern.

Sollte man ein Design wählen, dass immer 100% der Breite einnimmt?

Designer gehören auf den Mond geschossen, zu 100%

Bibt es da Barrierefreiheit-Aspekte? Ich stelle mir immer wieder die Frage: Immer 100 % oder runter auf 75 % bei 768x1024 ?

Design bildet oft mehr Barrieren als vorhanden sind. Warum erst Barrieren bauen.

Wenn ich allerdings ein Design wähle, dass immer 100% der Breite ausfüllt, wirkt die Seite wie leer bei höherer Auflösung. Wie kann man das ändern? Mit welchen Designtipps? Außerdem kann man dann auch keine Grafiken z. B. im Header verwenden. Die würden dann ja nur 75 % einnehmen, wogegen die  Boxen drunter 100% einnähmen.

Wenn du einfach einen Bilschirm füllen willst, möglichst unabhängig von Inhalt, empfehle ich einen scharzen Body mit null Inhalt.

Mann ist das schwierig.

Nein

Wer weiß Rat?

Who knows? Vielleicht der Schneider der die Hosen erfunden hat, die den Arsch an den Knien hat.

Danke

Bitte

mfg Beat

[Matzberger Marcus]

Hallo,

Malt ihr das Design erstmal auf ein Blatt Papier, sprich zeichnen und mit Buntstiften ausfüllen?

Nein, Ich strukturiere meine Inhalte logisch, und das nicht auf Papier

Nun gut, du sagst also: Ich brauche ein Menü, eine Überschrift, Text...
Und dann? Klatscht du das alles einfach so hin oder überlegst du auch noch, wo auf dem Bildschirm es erscheinen soll?
Design hat ja nicht nur damit zu tun etwas irgendwie bunt zu machen, sondern den Benutzer durch eine sinnvolle Anordnung der Elemente auch zu zeigen was wofür gut ist. Und genau dafür benutze ich Skizzen - ohne Farbe, nur Bleistift.

Grüße
Marcus

[Efchen]

Moin,

Und dann? Klatscht du das alles einfach so hin

Ich vermute, er klatscht einfach alles so hin, so würde ich es auch machen, aber meine Antwort schreibe ich jetzt erst noch. Sie sieht aber ähnlich aus, wie die von Beat.

Gruß,
-Efchen

[Efchen]

Moin,

wie geht Ihr beim Design einer Webseite vor?

Ich schreibe zuerstmal die Inhalte. Nur die Inhalte. Überschriften, Menüs, und den Content. Der wird strukturiert, d.h. mit semantischem Markup versehen. Die richtigen HTML-Tags sind schon die halbe Miete.

Wenn dann alle Inhalte da sind, dann kommt erst das Layout. Mit CSS. Also externes Stylesheet öffnen und nur noch darin rumbasteln, bis die Seite passt. Wenn man es richtig macht, muss man nur noch ins HTML-File, um hie und da mal ne Klasse oder ID hinzuzufügen, aber muss an der Struktur nichts mehr ändern.

Malt ihr das Design erstmal auf ein Blatt Papier, sprich zeichnen und mit Buntstiften ausfüllen?

Ich brauch kein Blatt Papier, ich hab doch nen Browser.

Was sollte man beachten, wenn zum Design viele Grafiken gehören?

Dass sie klein gehalten werden, damit die Ladezeit nicht zu hoch wird. Gerade bei so Sites wie ebay oder noch schlimmer: Payback, wo jede runde Ecke ein eigenes Image ist, und selbst auf der Startseite erstmal hunderte von Images geladen werden müssen.

Es gibt viele Seiten die in 600x800 Auflösung 100% Bildschirmbreite einnehmen, in 768x1024 Auflösung ca. 75 % der Breite einnehmen.

Die Auflösung hat mit dem Erstellen einer Website rein gar nichts zu tun.

Sollte man ein Design wählen, dass immer 100% der Breite einnimmt?

Ja, 100% der Breite des Browserfensters. Naja, max-width wäre schon ne schöne Sache, wenn das von allen Browsern unterstützt werden würde.

Bibt es da Barrierefreiheit-Aspekte? Ich stelle mir immer wieder die Frage: Immer 100 % oder runter auf 75 % bei 768x1024 ?

Ich verstehe die Frage nicht. Du beziehst Dich doch auf die Auflösung, richtig? Wie gesagt, die hat rein gar nichts zu melden. Du kannst mit HTML oder CSS Dich ohnehin nicht auf die Auflösung beziehen. Größenangaben relativ zur Auflösung kriegst Du nur mit JavaScript hin.

Aber wie wäres ganz ohne Größenangaben. Dann passt sich Deine Site an den Browser Deines Besuchers an. In den meisten Fällen ist das gut.

Wenn ich allerdings ein Design wähle, dass immer 100% der Breite ausfüllt, wirkt die Seite wie leer bei höherer Auflösung.

Nö, weil die Seite dann ja auch 100% ausfüllt. Auch, wenn ich jetzt in Deinem Satz das falsche Wort "Auflösung" durch das richtige Wort "Browsergröße" ersetze.

Außerdem kann man dann auch keine Grafiken z. B. im Header verwenden.

Sie sollten nur nicht zu breit sein. Schriften z.B., die nicht unbedingt einen exotischen Font brauchen, muss man nicht als Hintergrundbild darstellen, sondern besser als Text, genaugenommen als Überschrift (<h1>).

Die würden dann ja nur 75 % einnehmen, wogegen die  Boxen drunter 100% einnähmen.
Mann ist das schwierig.

Ja, diese Logik verstehe ich auch nicht.

Gruß,
-Efchen