Seite Designs für Quer- und Hochformat
Wenn Sie auf einem iPhone oder iPad drehen, passt die Ausrichtung einer Webseite automatisch entsprechend. Der Web-Browser Safari vergrößert geschickt (oder reduziert) Web-Seiten auf den Bildschirm passen, aber es ist nicht perfekt. Auch wenn Safari können Ihre Seiten passen den Raum insgesamt gut, Ihre Entwürfe machen kann leiden, weil:
Wenn die Seite vergrößert Landscape-Modus auf einem iPad zu passen, können optimierte Bilder unscharf.
Die Reduzierung der Größe der Seiten können Text unmöglich machen, zu lesen.
Seit Jahren haben die meisten Menschen eine Web-Seiten "Breite und Höhe für die am häufigsten verwendeten Computer-Monitore optimiert:
Breite: In den frühen Tagen des Webs, mit dieser Strategie bedeutet, dass Sie Entwürfe geschaffen, die nicht mehr als 780 Pixel breit waren, so dass sie innerhalb einer Bildschirmauflösung auf 800 x 600 Pixel eingestellt passen würde. Die meisten Menschen wählten 780 Pixel, da diese Einstellung auf jeder Seite des Browser-Fensters ein wenig Platz für die Scrollbar links.
In den letzten Jahren, als größere Monitore erschwinglicher und geworden sind weit verbreitet, aktualisiert die meisten Web-Designer die Zielgröße von 960 bis 980 Pixel, die bequem auf Monitore mit einer Auflösung von 1024 x 768 Pixel passt.
Höhe: Obwohl die meisten Designer für diese Bildschirmgrößen optimiert auf die Breite eines Design vereinbaren (geben oder 10 oder 20 Pixel nehmen), eine Debatte tobte darüber, ob Webseiten-Designs innerhalb der Höhe dieser Entwürfe passen sollte.
Die Theorie hinter der Höhe von Webseiten Begrenzung basiert auf Studien, was darauf hindeutet, dass Nutzer nicht, wie eine Seite nach unten scrollen und dass alle Inhalte, die nicht sichtbar ist, wenn die Seite geladen wird ignoriert. Möglicherweise hat Scrollen einen schlechten Ruf im Laufe der Jahre geworden. Es ist Zeit, den Begriff zu verlassen, dass Web-Designs sollte nie mehr als 600 Pixel nach unten eine Seite erstrecken.
Diese Zahl macht deutlich, warum das iPad hat für immer die Debatte über verändert, wie lange eine Webseite sein sollte. Hier können Sie einen Screenshot von der ING Direct Website sehen, wie es auf einem iPad im Hochformat angezeigt. In Fairness zu den Designern bei der ING Direct, passt der Standort bequem innerhalb der Grenzen eines Monitors mit einer Auflösung von 800 x 600 Pixel.
die Inhalte der Seite auf die 600-Pixel-Cutoff, jedoch nimmt das Design nur etwa ein Drittel der iPad-Bildschirm im Portrait-Modus Durch die Begrenzung. Auch im Querformat auf dem iPad, wird das Design nicht nehmen den vertikalen Raum nach oben, anstatt das untere Viertel des Bildschirms mit dem hellen Hintergrund orange Farbe zu füllen.
Wenn Sie nur ein Design für eine Website erstellen möchten, ist Ihre beste Wette ist, seine Seiten zu entwerfen 980 Pixel breit sein und sie dann auf der Bildschirm mindestens 980 Pixel erweitern. Wenn Sie dies tun, sowohl das iPad und das iPhone passen sich automatisch das Design des Bildschirms in Quer- und Hochformat zu füllen, indem die Größe der Anpassung an passen.
Allerdings, wenn Sie wirklich über Design und möchten, dass Ihre Seiten pflegen ihr Bestes auf dem iPad und iPhone zu sehen, die beste Wahl ist, zwei verschiedene Designs zu erstellen.
Die Regeln für Cascading Style Sheets (CSS) umfassen die Möglichkeit, mehrere Stylesheets zu erstellen Vorteil der Größe optimal und die Funktionen der einzelnen Geräte. Zum Beispiel können Sie Stile gezielt an das Quer- oder Hochformat des iPhone oder iPad (wie in dem Entwurf, der hier gezeigt) erstellen.
Auf ähnliche Weise können Sie verschiedene Geräte mit unterschiedlichen Stylesheets Ziel durch eine Reihe von Stilen für eine Seite zu schaffen, wenn es auf einem Desktop-Computer angezeigt ist und eine andere Gruppe von Arten, wenn die Seite an einen Drucker gesendet wird.