• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Auflösung meiner Webseite !

skype90

Mitglied
Hallo erstmal , unzwar hätte ich das ein problem mit meiner auflösung meiner webseite ..
ich möchte meine Webseite für die jede Auflösung optimieren .. und hab mich da auch bisschen schlau gemacht und habe nun erfahren das ich mit % werten arbeiten muss nun habe ich das getan ich habe meine div boxen mit % angaben versehen aber wenn ich nun mein eigenes fenster verkleinern zieht sich alles in die enge die schrift die tabellen einfach alles...

Nun meine Fragen.

1.Was habe ich falsch gemacht ?
2.Auf was muss man nun letztendlich achten um seine webseite auf andere Bildschirme bzw. Auflösungen anzupassen ?
3.Muss man die schrift ausrichten und Überschriften auch mit % angaben versehen ? oder nur die div boxen in den sie sich befinden ?


mfg

skype90
 
Mit der Auflösung hat das zunächst gar nichts zu tun, sondern mit der Größe des jeweiligen Bilschirmfensters.
Wenn diese z.B. 1000px breit ist, dann sind 20% div-Breite eben 200px und bei 1600px Fensterbreite entsprechend 320px.
Somit passen sich die Breiten zwar in Abhängigkeit vom Fenster an, aber das führt zu sehr unterschiedlichen Darstellungen, insbesondere was die Relation von Text zu Grafiken betrifft.

Kalkulierbar ist deshalb ein Layout mit fixen Werten. Das sieht überall gleich aus; ggf. muss man scrollen.

Alternative:
Verwende prozentuale Werte, aber beschränke diese durch min- und max-width-Angaben mit Pixelwerten.
 
Wie würde man die Alternative relasieren bzw. in meiner logik blicke ich da garnicht durch ... ich bitte um Erlläuterung ist es vllt. so das wenn ich z.b. eine box verschiebe und sie mit der wert width:71%; versehe was bringt max width eventuell um wieviel prozent die div box breit sein dard in % ?
 
Mit width 71% nimmt sie immer 71% der Breite des Viewports ein. Das sind bei 1000px dann 710px und bei 2000px eben 1420px.
Wenn du für max-width einen Wert von 800px nimmst, dann ist sie im ersten Fall 710px und im zweiten 800px breit.
 
Hallo.

Um dir eine gute Antwort zu geben müsste ich dein Design kennen. Hast du einen Link.

Ich persönlich finde % Werte überhaupt nicht gut und arbeite komplette ohne %.
Viele denken ja man braucht % für ein flexibles Layout. Der Ansicht bin ich nicht.

Gruss
Elroy
 
hmm leider habe ich meine webseite nicht on aber mal ganz simples zum design es isz sogesehen ein ganzes bild das ich auf 1px breite verringert habe um es dann zu repeaten dazu habe ich noch boxen... Ich habe anfangs auch mit px gearbeitet jedoch habe ich es mal auf einen Flachbildschirm getestet ... und alles verschob sich aber wenn ich jetzt die schriftausrichtung und boxen in % angebe und ich das fenster verringer zieht sich alles zusammen sogesehen passt sich mein layout an der fenster größe an
 
Hallo.

Also mal ein ganz simples Menü:
Header - Keine feste Grösse, zentriert.
Zweispaltiges Layout - Links Navi, Grösse in em für Besucher mit Sehbehinderungen, rechts Content, keine Grösse oder nur min-width.
Footer - Keine feste Grösse, zentriert.

Man muss eben je nach seinem Design abwägen was man erreichen will und wie man das am besten umsetzt.
Wenn du nicht willst das sich bei verkleinerung des Viewport alles zusammen zieht musst du eben mit festen Grössen arbeiten.

Gruss
Elroy
 
hmmm nicht wirklich wenn ich auf das Anzeigebeispiel angucke und ich da mein fenster verkleiner kommt es zu Zeilenumbrüchen bei den Texten.... und das sollte eben nicht sein aber wieso werden die werter im em angegeben ?
 
Klar kommt es zu Zeilenumbrüchen! Ich glaube du verstehst den Sinn von dem Ganzen noch nicht. Eine Webseite ist kein Bitmap das man einfach groß/klein zoomen kann. Schau dir mal eine beliebige Seite ab und verkleiner das Browserfenster. Die Schrift wird ihre Größe dabei beibehalten.
Theoretisch könntest du die Größe des Browserfensters abfragen und dementsprechend die Schriftgröße und alles so anpassen, das es immer gleich aussieht. Das macht aber keiner und kann ich dir nicht raten.

Du musst dich von der Idee verabschieden das du alles haargenau planst wie die Seite aussieht. Das ist ja das schöne an html. Du legst das allgemeine Layout fest, der Browser kümmert sich um den Rest. Stell dir nur mal vor, jemand besitzt nicht die Schriftart die du angegeben hat. Der Browser überlegt da nicht lang, sondern ersetzt die durch eine ähnliche. Diese erzeugt aber einen etwas kürzeren/längeren Text. Als Webdesigner gibtst du nur vor wo Leerzeilen,Absätze etc. sind.
 
Ok habs verstanden.. aber habe da mal noch ne frage unzwar das beispiel was du mir gegeben hast ... Dreispaltiges Layout mit Kopf- und Fußzeile
da ist mir aufgefallen das du div boxen sich der verkleinerung des browsers anpassen und ebenso die zeilenumbrüche meine frage wäre könnte ich z.b. bestimmen ab wann so gesehen wieviel % oder em ein zeilenumbruch passiert denn ich will nähmlich keinen ich will es so hinbekommen das wenn man das fenster des browsern verkleinert einfach nur scrollen kann und das ebenso bei den div boxen . Die div boxen und der text sollen lediglich auf der selben position stehen egal welche auflösung der besucher hat ist das denn möglich ? achja und nochmal wieso wurde im diesem beispiel mit em gearbeitet ?


mfg

skype20
 
Hallo.

Wenn du keinen Zeilenumbruch willst musst du eben mit festen Weiten wie em oder px arbeiten. Aber auch hier kommt es ganz auf die Schrift an die der Besucher verwendet.

In dem Beispiel wurde em benutzt damit bei einer Schriftvergrösserung die Schrift nicht einfach aus den Boxen rauswandert sondern sich die Boxen mit vergrössern. In dem Beispiel wurde es allerdings etwas unglücklich umgesetzt.

Gruss
Elroy
 
ok verstehe also ist es doch möglich eine webseite mit festen werten(em) zu gestalten .. die sich so ungefähr die sich ungefähr an der bildschrimauflösung anpasst und könnte ich es bei der schriftgröße in px belassen oder müsste ich jetzt alles in em angeben .. danke
 
Zuletzt bearbeitet:
Hallo.

Die Schriftgrösse sollte immer in em angegeben werden.

Die Bildschirmauflösung ist für deine Webseite völlig uninteressant, es geht hier um den Viewport.

Entweder du erstellst eine starre Seite mit festen Werten, das heisst bei zu kleinem Viewport erscheint ein horizontraler Scrollbalken, oder du erstellst eine flexible Seite die sich dem Viewport anpasst.

Da du aber andauernd deine Meinung änderst, einmal soll es keine Zeilenumbrüche geben, dann soll sie sich doch wieder an dem Viewport anpassen, solltest du einfach mal ein bisschen experimentieren um heraus zu finden was für dich das richtige ist.

Gruss
Elroy
 
Sorry das ich mich falsch ausgedrückt habe meine ledigliches ziel ist halt nur das meine homepage so gut wie möglich für alle bildschirme gut erkennbar das heißt das sich keine div boxen verschieben sondern am standpunkt sind wo sie sind. ich kann es nur mit einen beispiel verdeutlichen Android Apps, Tests, News Blog und Forum - AndroidPIT genau wie es bei der seite unzwar passt sie die homepage der seite an bis zu einer bestimmten fenstergröße dann treten die horizontaelen scrollbalken ein . leider ist es bei meiner seite so wenn ich das fenster vekleiner sofort die horizontalen scrollbalken eintreten


mfg

skype90
 
Zurück
Oben