Hallo,

ich versuche die Website auf eine Seitenbreite von 780px (mittlerer Bereich 450px) auszulegen. Im Internet fand ich dazu den Artikel http://aktuell.de.selfhtml.org/weblog/aufloesung-viewport . Mein Problem ist der zu geringe Platz beim Eventkalender, Bildergalerie oder Adventskalender, wohl auch bei manchen Spielen. Man könnte zwar auch die Breite jeweils auf 450px einstellen, aber dadurch wird alles sehr klein.

Ich überlege, ob es sinnvoll wäre, die rechte Außenleiste für die betroffenen Seiten unten an die linke Außenspalte anzuhängen und den freien rechten Platz für die Darstellung des Mittelteils zu verwenden oder generell die Seite für eine 980px zu optimieren?

focus.de, spiegel.de oder gmx.de arbeiten mit 780px.

Links zu
neue Website: http://www.kolping-hohenfels.de/demo/index.htm
bestehende Website: http://www.kolping-hohenfels.de

Welcher Weg ist der bessere?

Gruß, Dietmar

Keine feste Maximalbreite ist sinnvoll.

Was machst du denn bei einem Surfer, der nur einen 800×600 Monitor oder kleiner hat?
Der muss dann ja immer seitwärts scrollen.

Wieso magst du keine Breite haben, die sich dem Browserfenster anpasst? Oder geht das wirklich nicht?

Hallo GwenDragon,

ich hatte schon mal die Maße in em angegeben; dies führt dazu, dass bei einer großen Auflösung die Bilder in der obersten Leiste auseinandergerissen werden. Man bräuchte ein Script, das die Auflösung abfragt und die Anzahl der benötigten Bilder -zumindest angepaßt an verschiedene Auflösungen- einfügt.

Aber da doch noch ca. 20 % der User mit mit 800 px- Auflösungen surfen, möchte ich sie auch berücksichtigen. Ich habe auf der Seite Layoutändern erst mal testweise Farbspiele eingebaut.

Ich stelle mir hier vor, die Seite in verschiedenen Auflösungen anzubieten. Bei 800 px bleibt aber mein Problem, dass ich die rechte äußeren Spalte unter die linke äußere Spalte setzen will. Die Testseite befindet sich unter www.dietmar-feuerer.de/demo/index.htm. Sie sieht im IE anders aus als im FF. Der Code für die Seite (alpha= linke Spalte, gamma= Mitte und beta=rechte Spalte) lautet

Code

#alpha { 
float:left; 
width:150px; 
margin-top:0px; 
margin-bottom:0px; 
} 
#beta { 
width:150px; 
background-color:#FF0000; 
margin-top:0px; 
margin-bottom:0px; 
} 
#gamma { 
float:right; 
margin-left:180px; 
margin-right:15px; 
margin-top:5px; 
margin-bottom:5px; 
text-align:justify; 
} 

Gruß,
Dietmar

Hi,

du arbeitest doch mit CSS – leg deine Headergrafik bei <div id="banner"> im Grafikprogramm so an, dass Sie auch bei einer höheren Auflösung funktioniert. Bei meinem letzten Webprojekt bin ich von einer Auflösung von 800 - 1280 Pixel Breite ausgegangen. Dann definierst du die breitere Grafik als Hintergrund für den div-Tag, Ausrichtung horizontal und vertikal zentriert, keine Wiederholung. Dann würde ich diesem div-Tag 100% Breite geben und bei min-width 780 Pixel oder so, bei max-width 1200 Pixel. Dann nur noch die Höhe der Grafik als Höhe dieses div-Tags definieren und fertig ist deine Breitenvariable Headergrafik. Schau dir mal meinen Versuch an - der ist noch nicht perfekt, aber ich bin dran, die Fehler irgendwie zu korrigieren und das ganze noch valide zu kriegen. http://www.hilfdirselbst.ch/...i?post=265529#265529 Blöderweise unterstützt der Internet Explorer bis einschließlich Version 6 kein min & max-width, deshalb habe ich für diese Browser eine fixe Breite von 800 definiert. Vielleicht hilft dir das weiter. Interessant zum Thema Breitenvariable Div-Tags ist auch dieser Link (für Navigationselemente): http://www.thestyleworks.de/tut-art/listnav4.shtml Hoffe, ich konnte ein bisschen weiterhelfen.

Ich optimiere Seiten für eine Auflösung von 1024 mal knappe 800 und gut ist. 15 Zoll Monitore sind am Aussterben. Über 50 % haben oben genannte Auflösung, über 30 Prozent 1280 mal x und nochmal fast 10 % etwas dazwischen, knapp 3 % etwas darüber. Rechnet mal aus, was da fehlt. ;-)