Optimale Größe der Website?

  • Hallo Leute, bin am tüffteln wie ich meine Website an der Bildschirmgröße anpassen soll.
    Hier mal mein Vorschlag, was sagt Ihr dazu?


    Code
    1. min-width:1024px;
    2. max-width:8000px;
    3. min-height:1024px;
    4. max-height:8000px;
  • Öhm.. ich benutze derzeit width: 960px; und eine min-height des Contents von 400-600px.


    Wobei derzeit der Trend eher in Richtung 100%-Webseiten geht (also das die Webseite den Kompletten Bildschirm ausfüllt)

  • Zitat

    Öhm.. ich benutze derzeit width: 960px; und eine min-height des Contents von 400-600px.


    Wobei derzeit der Trend eher in Richtung 100%-Webseiten geht (also das die Webseite den Kompletten Bildschirm ausfüllt)


    Und bis jetzt noch keine Probleme gehabt oder? :) Mit den 100 % Websiten gibt es hierfür nicht einen Befehl für:
    min-width, max-width, min-height, max-height dass es sich entsprechend des Bildschirms anpasst?

  • Ne, bisher noch keine Probleme mit meinen 960er gehabt.
    Ist halt für 1024-Bildschirme^^


    einen Befehl? O.o
    Sehen wir mal davon ab, dass wir es in CSS nicht mit Befehlen, sondern Eigenschaften zu tun haben, wüsste ich nicht, was sich da anpassen soll? O.o
    Wenn ich einem Element eine Prozentuale Breite gebe, dann passt sich das automatisch an.. ? O.o

  • Zitat

    Wenn ich einem Element eine Prozentuale Breite gebe, dann passt sich das automatisch an.. ? O.o


    Ich habe den Auto Wert gemeint ;)

  • "hume" schrieb:

    Ich habe den Auto Wert gemeint ;)


    Der ist meines Wissens nach eben bei Blockelementen 100% und sonst 0 (ohne Inhalt) / so breit wie der Inhalt oder liege ich da falsch?

  • Ist es denn möglich die Website an jeden Bildschirm anzupassen oder kann man es nicht allen Bildschirmen recht machen? :wink:

  • "hume" schrieb:

    Ist es denn möglich die Website an jeden Bildschirm anzupassen oder kann man es nicht allen Bildschirmen recht machen? :wink:


    Mit %-Angaben passt sich die Seite automatisch an.

  • Wichtig wenn du eine solche Seite haben willst: Nicht jedes Element darf eine Variable breite haben!
    den Inhalt kannst du z.B. Dynamisch groß machen, die Navigation sollte eine feste Größe haben,..

  • hab jetzt keinen bock gehabt alles durchzulesen und daher wess ich net was hier an werten schon steht:


    also ich würde

    Code
    1. min-width: 860px;

    und

    Code
    1. max-width:1000px;

    machen -->


    so wird seite auch auf 13" (= Zoll) Bildschirmen ordentlich aussehen und auf breiteren is es nicht zubreit.
    TIPP: nimm niemals 100% weil wenn die seite zB auf nem 27" MAC angezeigt wird ..... sieht hatl blöd aus und man sucht lange nach infos


    min-height so 600px




    hoffe ich konnte helfen

  • Ich muss leider widersprechen:


    1. Ist es dann keine relative Angabe mehr sondern einfach ein Bereich der festlegt wie groß oder eben klein die Seite sein soll, da wird sich beim Ändern der Größe des Browserfensters nichts vergrößern/verkleinern. >.<


    2. Ist das mit den 100% Ansichtssache, es kommt darauf an ob du kleine Texte verteilst oder große informative Bilder.


    3. Die Größe in Zoll/Kilometern/Lichtjahren des Monitors hat nichts mit der Auflösung zu tun, du wirst also auf einem 21" Monitor bei einer 1920x1080 Auflösung genau das Ergebnis erhalten was du bei einem 32" fernseher mit der selben Auflösung erhälst, es wird nur größer und da bist du dann selber Schuld. :wink:

  • Falls jemand auf deine Seite geht der eine Auflösung von 640x480px hat. :roll:


    Okay Spaß beiseite, ich denke mal das die Auflösung für Handhelds tatsächlich nicht Kugelsicher ist aber für solche Dinger bietet man ja normal auch eine extra Seite mit entsprechender Auflösung/Aufteilung an oder sehe ich das falsch?

  • Handhelds haben spezielle Browser, die die Seite entsprechend skalieren (:
    Dafür wäre es unteranderem nicht verkehrt den viewport-meta zu verwenden :D

    Code
    1. <meta name="viewport" content="width=1024" />

    reicht da als Basis.


    Weitere Parameter für den Meta-Tag (weitere würden einfach nach dem Semikolon in dem Content-Attribut angehängt):
    width, Für welche Breite wurde die Seite konzipiert? Erlaubt ist ein Wert zwischen 200 bis 10000. [Default: 980px]
    height, für welche Höhe wurde die Seite konzipiert? Erlaubt ist ein Wert zwischen 233 und 10000. [Default: automatisch berechnet]
    initial-scale, Soll automatisch ein Zoom eingestellt sein? Erlaubt ist ein Wert zwischen 1 und 10, wobei 1 kein Zoom ist. [Default: automatisch berechnet]
    user-scalable, Darf der Benutzer Zoomen? Erlaubt ist entweder yes (er darf) oder no (er darf nicht). [Defualt: yes]
    minimum-scale, Wie sehr darf der Benutzer die Seite verkleinern? Erlaubt ist ein Wert zwischen 1 und 10. [Default: 0.25 (was eigentlich gegen die Regeln ist xD)]
    maximum-scale, Wie sehr darf der Benutzer auf der Seite zoomen? Erlaubt ist ein Wert zwischen 1 und 10. [Default: 1.6]
    Beispiel:

    Code
    1. <meta name="viewport" content="width=1024, initial-scale=2.3, user-scalable=no">