Meine Homepage in jedem Browser anders?
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
bau
benutzen
bildschirm
code
display
gefahr
links mitte
meisterwerk
mittelteil
oberen teil
problem
raten
richtige verwendung
struktur
tag
testen
url
vorstellung
webseite
welt
-
Guten Mittag liebe Community
Ich habe ein mehr oder weniger kleines Problem. Ich erstelle meine Homepage in HTML im Firefox-Browser auf einem 24" Bildschirm.
Bei anderen größen oder Browsern sieht die Seite leider ganz anders aus, manchmal ist die Seite zu groß und man muss erst verkleinern, und manchmal sind Buttons in anderen Browsern ganz verschoben. Wie positioniere ich nun richtig?
Freue mich auf hilfreiche Antworten.
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Moin moin,
also ich habe mir mal dein Meisterwerk angesehen. Dabei fällt mir auf das die HTML-Struktur keine Struktur ist. Wenn du dieses Layout verwendest: Oberen Teil, 3-Teiligen Mittelteil, dann baue diesen auch so auf.
<div id="hauptseite"> <div id="Oberteil"> </div> <div id="Mittelteil"> <div id="links" > </div> <div id="mitte" > </div> <div id="rechts" > </div> </div> </div>
baue auch eine feste Breite rein, eine dynamische Größe verbirgt immer die Gefahr das es nicht deinen Vorstellungen entsprechend angezeigt wird. Eine gängige Größe ist ca 1000px. Auch wenn dies auf deiner Seite recht klein aussehen würde, die Hauptanzahl von Usern hat nicht große Displays. Ich habe einen 1600 * 900px Laptop-Display und ich muss sogar horizontal scrollen, sowas geht gar nicht. Also feste Größe und (mehr) [überhaupt eine] Struktur.
mfg Stephan
edit1: Bei den CSS-Tag's "links", "mitte", "rechts" mit "float: left;" arbeiten, falls du das nicht weißt.
Beitrag zuletzt geändert: 23.10.2011 12:46:34 von daswing -
daswing schrieb:
Moin moin,
also ich habe mir mal dein Meisterwerk angesehen. Dabei fällt mir auf das die HTML-Struktur keine Struktur ist. Wenn du dieses Layout verwendest: Oberen Teil, 3-Teiligen Mittelteil, dann baue diesen auch so auf.
<div id="hauptseite"> <div id="Oberteil"> </div> <div id="Mittelteil"> <div id="links" > </div> <div id="mitte" > </div> <div id="rechts" > </div> </div> </div>
baue auch eine feste Breite rein, eine dynamische Größe verbirgt immer die Gefahr das es nicht deinen Vorstellungen entsprechend angezeigt wird. Eine gängige Größe ist ca 1000px. Auch wenn dies auf deiner Seite recht klein aussehen würde, die Hauptanzahl von Usern hat nicht große Displays. Ich habe einen 1600 * 900px Laptop-Display und ich muss sogar horizontal scrollen, sowas geht gar nicht. Also feste Größe und (mehr) [überhaupt eine] Struktur.
mfg Stephan
edit1: Bei den CSS-Tag's "links", "mitte", "rechts" mit "float: left;" arbeiten, falls du das nicht weißt.
Vielen Dank!
Nun ist meine Seite zwar kleiner, allerdings an die linke Seite gequetscht, während auf der rechten Seite ein großer weißer Rand ist. Kann man einstellen, dass die Seite an sich genau in der Mitte liegt, so das links und rechts ein gleichmäßiger Rand ist?
Beitrag zuletzt geändert: 23.10.2011 15:13:17 von schinkenmedia -
Kann man.
Dein Hauptkörper, also alles was man sieht, steht vermutlich unter "body" in deinem Quelltext.
Jetzt brauchst du dem Body nur noch sagen, dass er in der Mitte stehen muss und eine bestimmte Breite haben soll.
Das machst du in den css so:
body {
text-align:center,
max-width: XXXXpx;
}
und schon hast du deine Website zentriert und mit einer Maximalbreite versehen.
-
Lass es dir validieren mit dem W3C HTML Checker.
-
tradingcenter schrieb:
Lass es dir validieren mit dem W3C HTML Checker.
Der Validator überprüft lediglich die richtige Verwendung der HTML-Tags und nicht ob eine Webseite bei unterschiedlichen Browsern und Auflösungen korrekt angezeigt wird
@schinkenmedia: Willkommen in der Welt und den Problemen des Webdesigns
Grundsätzlich rate ich auch dazu feste Breiten für Webseiten zu benutzen. Außerdem solltte darauf geachtet werden, bzw beachtet werden, dass nicht jeder Benutzer einen 24"-Bildschirm besitzt, sonder gerade in der heutigen Zeit auch viele Nutzer mit Netbooks, Smartphones etc online unterwegs sind, deshalb empfiehlt es sich eine nicht zu große Breite für die Webseite zu wählen. -
alfr3d schrieb:
tradingcenter schrieb:
Lass es dir validieren mit dem W3C HTML Checker.
Der Validator überprüft lediglich die richtige Verwendung der HTML-Tags und nicht ob eine Webseite bei unterschiedlichen Browsern und Auflösungen korrekt angezeigt wird
@schinkenmedia: Willkommen in der Welt und den Problemen des Webdesigns
Grundsätzlich rate ich auch dazu feste Breiten für Webseiten zu benutzen. Außerdem solltte darauf geachtet werden, bzw beachtet werden, dass nicht jeder Benutzer einen 24"-Bildschirm besitzt, sonder gerade in der heutigen Zeit auch viele Nutzer mit Netbooks, Smartphones etc online unterwegs sind, deshalb empfiehlt es sich eine nicht zu große Breite für die Webseite zu wählen.
Oft bereiten auch gerade die falschen HTML Tags ein falsches Design. (Bestes Beispiel, den center Tag statt div-align zu benutzen)
Um deine Webseite zu testen empfehle ich dir übrigens browsershots.org
Dort kannst du deine Seite auf über 6 OS und über 100 Browsern testen. :-)
MFG -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage