Warum sind die meisten Websites für die Anzeige im Hochformat optimiert? [geschlossen]


24

Ich kann das einfach nicht herausfinden. Fast alle Monitore haben ein Seitenverhältnis, bei dem die Breite viel größer ist als die Höhe, und doch sind fast alle Websites genau umgekehrt gestaltet? Ich bin kein wirklicher Webentwickler und experimentiere gerade, aber dieser Wahnsinn verblüfft mich !!!

Bearbeiten: Der Punkt ist nicht, dass ich die Höhe einer Website begrenzen möchte. Der Punkt ist, dass ich möchte, dass es irgendwie den gesamten verfügbaren Speicherplatz ausfüllt, wenn ich mein 1920x1080 im Querformat habe.

Bearbeiten 2: Sehen Sie dies, um zu verstehen, was ich sage Bildbeschreibung hier eingeben


4
Weißt du noch, dass Monitore früher im Grunde genommen quadratisch waren? Vielleicht ist es nur ein Standard, der übernommen wurde.

1
@mercfh Ihr Kommentar macht eigentlich sehr viel Sinn. Was mich jedoch wundert, ist, warum fast niemand diesen fundamentalen Usability-Mangel in Frage zu stellen scheint, wenn Menschen dazu neigen, über sinnlose Dinge zu diskutieren?
NVM

In diesem Fall wird ein bedruckbarer Bereich ohne obszöne Nebenwirkungen wie teilweise seitliche Ausschnitte gedruckt, um die Seiten zu trennen. Es gibt Alternativen, aber diese sind nicht ohne Komplikationen (CSS-Druckmedientyp).
JustinC

1
Gehört diese Frage nicht zu ui.stackexchange.com ?
David

2
@NVM wie ist das ein "grundlegender Usability-Fehler"? Es ist nur "unbenutzter Raum".
David

Antworten:


36

Es gibt eine Begrenzung, wie weit das Auge scannen kann, ohne den Überblick darüber zu verlieren, welche Zeile als nächstes angezeigt wird, wenn Sie das Ende der aktuellen Zeile erreichen. Es gab eine Reihe von Studien ( einschließlich dieser ) zur optimalen Linienbreite und Lesbarkeit.

Möglicherweise können Sie es auf Grad reduzieren, aber um zu wissen, was an diesem Punkt optimal ist, müssen Sie wissen, wie weit der Benutzer vom Monitor entfernt ist. Aus diesem Grund beziehen sich die meisten Empfehlungen auf Messungen in ems, Zeichen oder Wörtern. Die Größe in Pixeln hängt dann von der Schriftgröße ab, der allgemeine Konsens funktioniert jedoch weiterhin.

Ich persönlich würde es sehr schwer haben, einen Artikel zu lesen, wenn er mit der vollen Breite eines 1080p-Bildschirms formatiert wäre. Das würdest du bestimmt auch. Unsere aktuellen Konventionen leiten sich aus Richtlinien für das Drucklayout ab, und die Richtlinien für das Layout haben sich nicht wesentlich geändert. Der einzige Unterschied besteht darin, dass wir mit der Seite in einem Browser interagieren können.

Zusätzlicher Kommentar : (von der in den Kommentaren gestellten Frage)

Es gibt Einschränkungen, was HTML auf einem Bildschirm für Sie tun kann. Zum einen gibt es keine Seiten. Nur Bildlaufleisten. Es ist sehr schwierig, ein angemessenes Verhalten für die Anzeige von Markups in einem Browser zu entwickeln. Die CSS3-Eigenschaften für das mehrspaltige Layout haben es noch nicht aus der Empfehlungsphase für Kandidaten geschafft. Es gibt Hacks, die in diesem Artikel an einer anderen Stelle beschrieben werden . Auf den meisten Websites ist es jedoch noch nicht so weit.

Solange für Ihren Inhalt kein Bildlauf erforderlich ist, sollten Sie in Ordnung sein. Sobald dies der Fall ist, kann der mehrspaltige Ansatz einige Herausforderungen für die Interaktion des Benutzers mit der Site darstellen.

Kommentar zum aktuellen De-Facto-Standard :

Um die Art und Weise, wie Sie Ihre Frage umformuliert haben, und das von Ihnen bereitgestellte Beispiel zu adressieren, müssen Sie verstehen, dass das Webdesign eine Reihe potenziell widersprüchlicher Anforderungen in Einklang bringen muss - und dass die Website dennoch professionell aussieht. Um die Bedürfnisse der Designer und der Kunden in Einklang zu bringen, entwerfen die meisten Entwicklungshäuser für eine Auflösung. Diese Auflösung basiert auf Daten, die leicht verfügbar sein können . Sie können auch auf historischen Web-Traffic-Aufzeichnungen oder Kenntnissen der Zielumgebung basieren.

Die gängigsten Bildschirmbreiten (1024, 1280, 1366) sind eng genug, sodass das kleinste (1024p) und zentrierte Design auf der Seite auch auf den anderen etwas größeren horizontalen Dimensionen noch gut aussieht . Es ist sehr schwierig , alles in jedem Format richtig auszurichten, und noch weniger, je nach Bildschirmbreite, müssen mehrere Formate unterstützt werden. Die Zahl der 1080p-Benutzer wächst, aber sie machen immer noch einen sehr geringen Prozentsatz aller zu unterstützenden Benutzer aus.

Bei Interesse empfehle ich dringend, einige der Designartikel unter "A List Apart" zu lesen . Sie werden feststellen, dass es schwieriger ist, das zu tun, was Sie wollen, als es aussieht. Als ich eine Frage zum Entwerfen für 1080p stellte , lauteten die ersten Antworten "Alles größer machen". Es ist etwas, das für die meisten Webdesigner noch nicht auf dem Radar war.


Warum also nicht irgendwie Dinge wie zwei Spalten in einem Buch aufteilen, anstatt absurde Leerzeichen links und rechts vom eigentlichen Text zu haben? Sie werden diese Absurdität erkennen, wenn Sie einen Full-HD-Monitor im Querformat verwenden.
NVM

3
Diese Site verwendet ein zweispaltiges Design, und einige Websites enthalten auch drei Spaltendesigns. Was ich beschrieben habe, ist die physikalische Beschränkung auf eine einzelne Spalte. Es gibt technische Gründe, warum Sie in HTML nicht das tun können, was Sie in gedruckter Form tun können. In HTML und CSS können Sie beispielsweise keinen Text von einer Spalte zur nächsten fließen lassen. Es gibt auch kein Konzept von Seiten auf einem Bildschirm. Sie müssen sich die Regeln einfallen lassen, wie die Bildlaufleiste usw. funktioniert, und sie vermittelt einfach nichts.
Berin Loritsch

4
Die Verwendung mehrerer Spalten funktioniert im Druck einwandfrei, da Sie wissen, wie hoch die Seite ist, bei einer unbekannten Bildschirmgröße jedoch nicht so gut. Sie wissen nicht, wie weit der Umbruch zur zweiten Spalte reicht. Vertikales Scrollen ist einfach, funktioniert jedoch am besten mit einer einzelnen Textspalte. Mehrere Spalten eignen sich am besten für einzelne Seiten (anstelle eines kontinuierlichen Bildlaufs).
Stephen C. Steel

Super Erklärung und ich denke die letzte Zeile fasst es ziemlich gut zusammen.
NVM

1
Es ist vielleicht auch erwähnenswert, dass nicht alle Menschen mit ihrem Browser im Vollbildmodus im Internet surfen. Ich verwende einen 1080p-Monitor, habe aber den Browser in einem Fenster geöffnet, das etwas breiter ist als die angezeigte Seite (90% der Websites haben eine ähnliche Breite und passen in dieses Fenster). Dadurch kann ich andere Fenster an der Seite des Browsers geöffnet lassen.
Gavin Coates

27

Die meisten Websites sind größer als breit, da Sie auf natürliche Weise nach unten scrollen können, um mehr Inhalt zu lesen. Ich persönlich hasse horizontale Bildlaufleisten. Sie sollten abgeschafft werden!

Die Website ist immer noch im Hochformat, die Website erstreckt sich über den unteren Bildschirmrand hinaus. Es gibt keine Begrenzung, wie groß eine Site sein kann.

Es gibt jetzt unendlich lange Webseiten (Danke, AJAX). Was würden Sie tun, wenn Sie eine unendlich breite Seite sehen würden? (Ich würde jagen und den Designer töten, weg von der Seite zu klicken ist nicht gut genug, der Designer muss sterben.)

Wenn Sie für jede Zeile einen Bildlauf durchführen, wird eine Zeile zum Selbstmord verurteilt. Dies ist der Grund, warum Leute ausgefallene Bücher wie Apps zum Umblättern von Seiten machen, damit Sie nicht darüber scrollen müssen.


Siehe Änderungen in meiner Frage.
NVM

Nein, der Inhalt muss in Bezug auf die Bildschirmauflösung an derselben Stelle bleiben. Schlagen Sie wirklich vor, dass eine Website codiert werden sollte, um zu überprüfen (um die Bildschirmauflösung zu überprüfen), ob der Inhalt "Über dem Falz" passt, und verschieben Sie ihn dann nach rechts neben den vorhandenen Inhalt, wenn er passt?
Morons

In WPF Silverlight haben Sie heutzutage die Möglichkeit, das Design anzupassen. Die Größe wird basierend auf dem verfügbaren Speicherplatz angepasst. Warum nicht ähnlich? Ich schlage nicht vor, einen Auftrag zum Ausschneiden und Einfügen auszuführen, aber da dies fast alle betrifft, scheint niemand darüber zu diskutieren.
NVM

1
Infact Ich benutze zwei 1920x1080 Monitore im Hochformat und ich liebe es. Es war die Hölle, als ich eine in Landschaft hatte. Und ich bin mir sicher, dass weniger als 1% Monitore im Hochformat verwenden, wenn alles im Web dafür eingerichtet ist (außer Videos, aber außer Youtube, wie viele Leute ernsthafte Videos auf Monitoren ansehen und für Youtube ist das sowieso egal)
NVM

3
Tatsächlich ist eine Website mit unendlich horizontalem Bildlauf möglicherweise nicht so schrecklich (strafbar mit etwas, das nicht so streng wie der Tod ist), wenn anstelle einer einzelnen Zeile, die möglicherweise unendlich breit ist, der Inhalt in Spalten mit einer angemessenen Größe aufgeteilt wird und die Anzahl der Spalten möglicherweise unendlich ist. ..
FrustratedWithFormsDesigner

9

Nachdem ich die vorherigen Antworten gelesen habe, stelle ich fest, dass einige Punkte fehlen, deshalb werde ich versuchen, diese zu beschreiben.

Schwierige Spaltenimplementierung

Wenn Sie über große Seiten sprechen, stelle ich mir vor, dass Sie über Textspalten sprechen, wie Sie es in einer "physischen" Zeitung sehen. Damit sind zwei Probleme verbunden.

Erstens sollen tatsächliches HTML 4 und XHTML 1.0 / 1.1 keinen Text in Spalten anzeigen. Es gibt Hacks für Firefox (und möglicherweise andere normale Browser), aber es funktioniert nicht in Internet Explhorror.

Zweitens müssen Sie in der aktuellen Firefox-Implementierung oder in künftigem HTML 5 die Spaltenbreite und die Anzahl der Spalten angeben, wenn der Text in Spalten angezeigt werden muss. Es ist nicht möglich, die Höhe (zum Beispiel die Höhe der Seite abzüglich der Höhe der Kopfzeile und der Höhe der Fußzeile) anzugeben und die Anzahl der Spalten vom Browser anpassen zu lassen.

Es macht es praktisch unmöglich, ein brauchbares Layout in Spalten mit nur horizontaler Bildlaufleiste zu haben, ohne die vertikale.

Keine 100% Höhe

Tatsächliches HTML / XHTML soll die Größe der Elemente entsprechend der Breite der Seite anpassen. Es ist sehr schwierig, die Seitenhöhe für Metriken zu verwenden.

Dies bedeutet, dass Sie JavaScript-Hacks verwenden müssen, um den Inhalt korrekt anzuzeigen. Mit anderen Worten, für Leute, die JavaScript nicht aktiviert haben, wird Ihre Website völlig unbrauchbar.

Browsen mit halber Bildschirmseite

Bei großen 16: 9/16: 10-Bildschirmen ist es nicht ungewöhnlich, mit zwei Fenstern nebeneinander zu arbeiten ( Win+ / Win+ in Windows Seven). Dies bedeutet, dass das Browserfenster eine kleine Breite und eine große Höhe hat.

Feste vs. dynamische Breite

Ihre Annahme, dass die meisten Websites für die Anzeige im Hochformat optimiert sind, ist möglicherweise falsch.

Erstens sind die meisten Websites überhaupt nicht optimiert und werden von Leuten geschrieben, die im Allgemeinen nichts oder wenig über Webentwicklung wissen.

Zweitens gibt es einen Unterschied zwischen Websites mit fester Breite und Websites mit einer Breite, die einem Prozentsatz der Breite des Browserfensters entspricht.

Im ersten Fall stellen Sie möglicherweise fest, dass die meisten Websites weder für den Hoch- noch für den Querformatmodus optimiert sind. Normalerweise ist die Breite auf 1024, 800 oder weniger festgelegt, was bei der Anzeige auf einem 24-Zoll-Bildschirm mit einer Auflösung von 1920 × 1080 keinen Sinn ergibt.

Im zweiten Fall, wenn Sie die Seite im Vollbildmodus auf einem 24-Zoll-Bildschirm anzeigen, besteht die Möglichkeit, dass diese Website sowohl im Hoch- als auch im Querformat korrekt angezeigt wird.

Beispiel: Stellen Sie sich eine Website mit einer Fotogalerie vor. Auf einer Seite befinden sich Miniaturansichten. Wenn Sie auf eine Miniaturansicht klicken, wird ein Vollbild angezeigt. Wenn die Miniaturansichten linksbündig sind und eine dynamische Seitenbreite aufweisen, wird sie im Querformat angezeigt. Es wird besonders schön sein, die Fotos in Originalgröße zu sehen.


4

Warum sind moderne Monitore im Querformat ausgerichtet?

  1. Videoformat. HD-Video wird für querformatige Displays besser skaliert.
  2. Lesen. Ob von links nach rechts oder von rechts nach links - im Querformat lassen sich große Blöcke mit vollständigen Zeilen leichter lesen, ohne dass ein Bildlauf erforderlich ist.

BEARBEITEN: Nachdem Sie Ihren Kommentar überprüft und die Absicht Ihrer ursprünglichen Frage neu formuliert haben, scheint es, als würden Sie aus irgendeinem Grund das heute am häufigsten verwendete Layout mit zwei und drei Spalten anstreben. Hierzu eine kurze, kleine Zusammenfassung des Website-Verlaufs:

Warum sind Websites für die Anzeige im Hochformat optimiert?

Ich glaube nicht, dass sie dafür optimiert sind. Es ist oft ein Kompromiss zwischen bestimmten Aspekten, die immer verfügbar sind, bestimmten Aspekten, die oft verfügbar sind, und bestimmten Aspekten, die nur in einem bestimmten Kontext verfügbar sind. Bestenfalls könnte man es einen optimalen Kompromiss nennen.

In der Lage zu sein, die wichtigsten, erwarteten Navigations- und Sekundärinhalte auf jeder Seite neben kontextspezifischen Inhalten zu platzieren, ist der Grund dafür, dass Layouts mit zwei und drei Spalten genauso allgegenwärtig sind wie sie. In den früheren Tagen des Webs haben viele Websites mit Layouts experimentiert, die versuchten, als einspaltige Layouts zu erscheinen. Dabei wurden dynamische Navigationslisten (oder Menüs, wie auch immer Sie sie sehen möchten) verwendet, die sich verstecken und den Lesebereich für das erweitern Hauptinhalt. Es war jedoch eine zweiteilige Herausforderung: a) technische Herausforderungen mangels browserübergreifender Kompatibilität; b) Benutzerfreundlichkeit: Sie wurde von den Benutzern häufig als nicht intuitiv oder als unnötiges Spiel der Suche (für die Navigation) und des Zerstörens (für die Zufriedenheit, da einige Lösungen das Standardkontextverhalten von änderten) angesehen, selbst wenn (ein großes Wenn) die technische Herausforderung bewältigt wurde Mausklicks).

Um dies zu überwinden, haben die meisten Standorte einen Defacto-Standard eingeführt und die Konsequenzen akzeptiert. Entweder zwei Spalten, in denen die Navigation in der einen und der Inhalt in der anderen Spalte angezeigt werden, oder eine dritte Spalte wird hinzugefügt, damit sekundärer, nicht zum Kern gehörender Navigationsinhalt immer angezeigt werden kann (unabhängig davon, ob es sich um kontextbezogene Hilfe, Notizen oder Werbung handelt oder neuere Kommunikationsströme, in denen die Person live angezeigt wird Aktivität im Zusammenhang mit der Website oder dem Kontext). Der eigentliche Inhalt des Kontexts steckt in der Mitte.


Entschuldigung, aber ich verstehe das nicht. "Es ist einfacher, große Blöcke mit vollständigen Zeilen ohne Scrollen zu lesen." So viele Websites, die ich gesehen habe, haben links und rechts leere Stellen mit einer definierten maximalen Breite. Im Grunde hindert es Sie daran, die gesamte Bildschirmbreite zu nutzen, und genau deshalb habe ich diese Frage gestellt.
NVM

Vielleicht meinte er, dass sehr, sehr, sehr breite Zeilen schwerer zu lesen sind? Ich bin mir nicht sicher, ob er das meinte, aber ich würde dem zustimmen.
FrustratedWithFormsDesigner

Tatsächlich verstehe ich auch den ersten Punkt nicht. Wie wirkt sich die Monitorausrichtung auf die Videoskalierung aus?
NVM

@NVM HD-Vollbildvideo passt am besten in den Querformatmodus, breiter als höher. Am wenigsten Briefkasten.
JustinC

3

Dies wird als Layout mit fester Breite bezeichnet. Es gibt Layouts in voller Breite oder auch als Fluid bezeichnet. Es gibt einen Grund, warum eine feste Breite verwendet wird. Zum einen wirkt sich die Auflösung Ihres Monitors auf die Benutzerfreundlichkeit aus. Wenn Sie einen riesigen Monitor haben, wie ich es bei 27 "tue, würde die Site schrecklich aussehen. Alle Texte, Bilder und alles wären so verteilt, dass es für mich schwierig wäre, ein Verständnis für das Layout oder die Site zu bekommen. Ein festes Layout Das flüssige Layout wird hauptsächlich für Listings oder Datentypen von Websites verwendet, zum Beispiel verwendet eBay das flüssige Layout in seinen Listings, um eine bessere Benutzererfahrung zu erzielen. Die Foren können auch vom flüssigen Layout profitieren. Aber Blogs, Kreative, Fotos, oder Geschäftsstandorte profitieren viel besser von Standorten mit fester Breite.


2

Ich weiß es nicht genau, aber ich vermute, dass die meisten "Dokumente", die gedruckt werden, so gestaltet sind, dass sie im Hochformat gedruckt werden, und viele Leute gestalten Websites immer noch als "Dokumente" - das könnte eine kulturelle Sache sein? Eine andere mögliche Erklärung ist, dass die Monitorbreite stärker variiert als die Monitorhöhe ...


2

Ich nehme an, dass es im Allgemeinen nicht empfehlenswert ist, eine Antwort in einem Thread zu veröffentlichen, der seit langer Zeit keine Aktivität mehr gesehen hat. Ich habe jedoch das Gefühl, dass es einige relevante Dinge gibt, die noch nicht erwähnt wurden.

Lassen Sie mich zunächst die folgende Firefox-Erweiterung erwähnen, die ich vor einigen Monaten entdeckt habe: Column Reader

https://addons.mozilla.org/en-US/firefox/addon/column-reader/

Warum scrollen wir vertikal?

Zum Vergleich: Betrachten Sie eine Sprache, die in vertikalen Spalten geschrieben ist. Für eine solche Sprache sind die aktuellen Breitbildmonitore ideal. So funktioniert es also: Sie scrollen senkrecht zur Richtung Ihrer Linien. Buchseiten sind im Hochformat, weil unsere Linien horizontal sind.

Wie bereits in früheren Antworten ausgeführt wurde: Die Reflow-Funktionen der Layout-Engines unseres Browsers sind so eingestellt, dass sie vertikal fließen.

Mehrspaltenfähigkeit

Das Entwicklerteam eines Browsers kann die Mehrspaltenfunktion folgendermaßen hinzufügen: Rendern Sie zuerst die gesamte Seite als eine einzelne Spalte, schneiden Sie diese dann in Streifen mit der Pixelhöhe des verfügbaren Fensterplatzes aus und zeigen Sie diese Streifen seitlich an. Seite an Seite. Aber wie breit machen Sie die Spalten? Selbst wenn für tatsächlichen Text nur eine sehr geringe Breite verwendet wird, werden die Seitencodes häufig für eine bestimmte Hintergrundfarbe über die gesamte Breite des verfügbaren Fensterplatzes verwendet.
Dann muss die Rendering-Engine auf Nummer sicher gehen und den gesamten horizontalen Raum einer einzelnen Spalte zuordnen.

Ist es für Webdesigner möglich, ein mehrspaltiges Reflow-Layout zu implementieren?
Das würde zu ernsthaften Schwierigkeiten führen. Sie müssen die Höhe und Breite des verfügbaren Fensterplatzes ermitteln und die Streifen in Javascript in Spalten schneiden und anordnen. Dann müssen Sie entscheiden, was mit Bildern geschehen soll, die in zwei Teile geschnitten werden.

Mit solchen Dingen umzugehen, ist das, was eine Layout-Engine tut. Wenn Sie versuchen, eine Javascript-Bibliothek zu erstellen, die das Reflowing von mehrspaltigen Layouts erleichtert, müssen Sie eine Rendering-Engine in Javascript erstellen . Das schafft eine Plattform-in-Plattform.

Monitorgröße

Ich finde es frustrierend, dass Computermonitore in den letzten Jahren tatsächlich geschrumpft sind . Große Monitore hatten eine Höhe von 1200 Pixel, heutzutage nur 1050. Ja, sie sind breiter, aber für Text kann dieser Platz nicht verwendet werden.

Auch im Hochformat sind diese Monitore zu schmal.
Ich habe ein Dual-Monitor-Setup mit beiden Monitoren im Hochformat, beide Monitore sind 1200x1600px. Für mich sind diese 1200 Pixel ein Minimum.

Eine bedingte Anweisung in CSS

Eine Anmerkung zu Layouts mit fester Breite.

Ich mag den CSS-Befehl, mit dem der Webdesigner einen großen Bereich an Breiten berücksichtigen kann, ohne Bildlaufleisten zu verwenden und die Lesbarkeit zu gewährleisten: "max-width". (Es gibt vier solche Befehle: Min-Breite, Max-Breite, Min-Höhe, Max-Höhe). Geben Sie für ein Div, das Text enthält, eine maximale Breite von beispielsweise 65em an.

Du bekommst ein if / else.
Wenn der verfügbare Speicherplatz kleiner als 65em ist, wird der Text entsprechend umgeleitet: keine horizontale Bildlaufleiste Wenn der verfügbare Speicherplatz größer als 65em ist, wird das enthaltende div auf 65em gesetzt.


1

Widescreen-Monitore haben erst in den letzten 2 Jahren richtig Fahrt aufgenommen - früher waren sie die teureren Optionen.

In Bezug auf das Design wurde immer festgestellt, dass es aus verschiedenen Gründen weitaus besser ist, eine Webseite (Dokument) so lang zu haben, dass ein Benutzer nach unten scrollen musste, als jemanden zum Scrollen zu bewegen. Erstens ist dies die Art und Weise, wie die meisten Computerdokumente funktionieren. Es handelt sich also um ein "normaleres" Muster. Sie haben eine Bild-ab-Taste, aber keine Seiten-über-Taste. Zweitens haben wir heutzutage fast allgegenwärtige Mausräder, so dass das Scrollen nach oben / unten eine sehr einfache Aktivität ist, die viel einfacher ist als das Scrollen.

Wie wählst du schließlich die Widescreen-Auflösung aus, die du erreichen möchtest? Mein Desktop ist 1920 x 1080; Mein Laptop ist 1440x900. Für wen entwirfst du?


Welche Websites können Sie nennen, die seit mehr als zwei Jahren nicht mehr überarbeitet wurden? Sogar die neuen Websites haben das gleiche "Problem". Wenn es mir recht wäre, würde ich die Benutzeroberfläche an die Auflösung des Endbenutzers anpassen. dh es wäre für Querformat optimiert, wenn Sie ein Full HD in Querformat haben und für Hochformat, wenn Sie es im Hochformat verwenden.
NVM

Monitore haben eine Lebensdauer von 3-5 Jahren. Darüber hinaus sind Menschen an porträtorientierte Websites gewöhnt - finden Sie einen Side Scroller, beobachten Sie die Menschen, die ihn benutzen. Sie neigen dazu, nach unten zu scrollen, bevor sie herausfinden, wie sie hinübergehen sollen.
Wyatt Barnett

1

Zwar handelt es sich bei den meisten Monitoren um handelsübliche Querformatmonitore, doch müssen Sie auch berücksichtigen, dass Sie beim Entwerfen einer Website nicht genau wissen können, welche Bildschirmauflösung der Betrachter verwenden wird. Es gibt immer noch 15% der Internetnutzer, die mit einer Bildschirmauflösung von 1024 oder weniger arbeiten. Dies lässt nicht viel Platz für eine horizontale Erweiterung, bevor Sie scrollen müssen, um die Informationen anzuzeigen. Außerdem surfen einige Benutzer nicht in einem vollständig maximierten Fenster im Internet. Die einzige Lösung für dieses Problem besteht darin, ein Design zu entwickeln, das dynamisch ist und auf der Größe des Browserfensters basiert. Wenn Sie jemals versucht haben, dies zu tun, würden Sie sehr zögern, es erneut zu versuchen, es sei denn, dies ist absolut notwendig, da es ein königlicher Schmerz ist. Es gibt viele andere Gründe, eine geringere Breite zu haben, wie bereits erwähnt wurde.


1
+1 für "Einige Benutzer surfen nicht in einem vollständig maximierten Fenster im Internet". Ich denke, dass "einige" es unterschätzen.
Bryan Oakley

0

Es gibt eine Reihe von Gründen:

  • Dokumente, die zumeist aus Text bestehen, sind traditionell hochformatig, so dass das Internet dies beibehält.

  • Es ist einfacher, kürzere Textzeilen zu lesen. Ich habe kein Zitat, aber es ist ein weit verbreiteter Ratschlag für das Design, der mehr als ein Standard als eine Richtlinie ist.

  • Ein schmales Design ist flexibler. Ich möchte mit meinem Browser nur die Hälfte des Vollbildes meines Breitbildmonitors anzeigen und etwas anderes (normalerweise einen Texteditor oder ein anderes Browserfenster) daneben stellen. Nur weil ich kann eine Webseite sein 1920 Pixel haben über bedeutet nicht , ich will es immer sein. Es ist eigentlich ein bisschen anmaßend für einen Webdesigner, irgendwelche Annahmen darüber zu treffen, wie ich ihre Seite sehen werde (oder sollte). Gibt mir schlechte Rückblenden zu "Diese Seite wird am besten in 800x600 auf IE6 angezeigt."

  • Eine bessere Wahl wäre ein flüssiges Design, das auf jede Breite skaliert werden kann. Mit CSS funktioniert dies auch für Text (meistens, vielleicht in den meisten modernen Browsern). Aber Bilder, eingebettetes Video, Flash und andere moderne eingebettete Objekte bringen diese Art von Design immer ohne viel Arbeit durcheinander. Angesichts der Wahl zwischen einem flexiblen Skalierungsdesign, das viel Zeit in Anspruch nimmt, und einem bewährten Design mit schmaler fester Breite, würden sich nicht wenige für den einfacheren (billigeren) Weg entscheiden.

  • Die flexibelste Wahl ist so etwas wie iGoogle, eine vom Nutzer anpassbare Webpart-Zeichenfläche. Dann kann Ihr Text so breit oder schmal sein, wie Sie möchten, mit Textblöcken und Bildern, die nach Ihren Wünschen angeordnet sind. Nun möchte ich Sie bitten, sich den Albtraum jeder Site vorzustellen, die Sie besuchen und die angepasst werden muss, bevor sie lesbar ist.


0

Derzeit soll der Webdesign-Standard für Websites mit einer Breite von 960 Pixel für eine Bildschirmauflösung von 1024 Pixel und mehr (ohne horizontale Bildlaufleiste) entwickelt werden. Dies ist die Mindestanforderung, da nicht jeder einen neuen 24-Zoll-Monitor von Shinny verwendet. (Denken Sie an Tablets und Netbooks, bei denen es sich um neue Hardware mit kleinen Auflösungen handelt.)

Beachten Sie, dass die Auflösung eines Website-Designs von der Zielgruppe beeinflusst wird und entsprechend angepasst werden sollte.

Auch in Bezug auf die Benutzerfreundlichkeit sollten die Textzeilen etwa 11 bis 14 Wörter breit sein (kann mehr sein, wenn Sie die Zeilenhöhe anpassen), damit nicht alle Websites flüssiges Design verarbeiten können.

Am besten, wenn Sie Ihren Besuchern nicht das Gefühl geben möchten, dass die Seite außerhalb des Inhaltsbereichs nicht leer ist, können Sie darüber hinausgehende Textur- / Farbstreifen hinzufügen, die sich an die Größe des Benutzerbildschirms anpassen. (Wie auf http://www.cnn.com/, das nur für die Kopfzeile gilt, aber Sie könnten es für die ganze Seite machen)


0

Warum sind die meisten Websites für die Anzeige im Hochformat optimiert?

Warum drucken wir Papier im Hochformat, wenn auch Querformat eine gute Option ist?

Wie viele Leute gesagt haben, ist es einfacher, eine größere Anzahl von kurzen Zeilen zu lesen als zwei oder drei lange Zeilen.

Abgesehen davon, wenn Sie 1280 * x Pixel mit Inhalten füllen würden, wäre die Webseite überladen und niemand würde wissen, was angesprochen werden muss. Eine Webseite sollte eine bestimmte Aufgabe ausführen, nicht JEDE Aufgabe.

Mit den Web 2.0-Trends lernen wir, weniger Informationen auf einer Seite zu platzieren und die Handlungsaufforderung klar und prägnant zu gestalten. Diese allgemein anerkannte Designphilosophie ist das genaue Gegenteil von dem, was Sie vorschlagen.

Es gibt VIELE Gründe, eine Auflösung von 1024 zu entwickeln, aber ich denke, der Störfaktor ist einer der wichtigsten.


0

Ich habe bemerkt, dass Sie Windows 7 verwenden, also lautet die Antwort: Win+

Im Ernst: Der Hauptgrund für die vertikale Optimierung von Websites ist, dass es einfacher ist, ein Layout mit statischer Breite in CSS zu codieren und es browserübergreifend auf mehreren Plattformen korrekt aussehen zu lassen. Flüssigkeitsbreiten werden gelegentlich verwendet, eignen sich jedoch nicht für die Lesbarkeit.

Wenn Sie einen Film ansehen oder ein Spiel spielen, ist es großartig, den gesamten horizontalen Raum mit Dingen zu belegen, aber beim Lesen möchten Sie wirklich nur eine kleine Textspalte, damit die Augen natürlich scannen können, ohne den Kopf drehen zu müssen. Das Hinzufügen von mehr Mist links und rechts von einer Webseite lenkt in der Regel vom primären Inhalt der Seite ab. Viele Designer lassen es einfach leer, um einen attraktiven Leerraum zu haben.

Nur weil Sie einen schönen Monitor haben, heißt das noch lange nicht, dass die Mehrheit der Menschen einen schönen Breitbildmonitor hat. Eine großartige Ressource zum Überprüfen der Layoutgröße ist die Browsergröße von Google .


-2

Ihr Monitor ist falsch ausgerichtet. Der Monitor eines Programmierers sollte höher als breit sein, eher im Hochformat als im Querformat.


2
-1 weil a) dies eine persönliche Meinung ist, b) es als Tatsache angegeben wird und c) Sie keine Quellen aufstellen. Wenn Sie eine Behauptung aufstellen wollen, belegen Sie diese mit Fakten. Schließlich hatte noch kein Programmierer, den ich kenne (und den ich seit über 20 Jahren als Programmierer kenne), jemals ein Monitor-Setup im Hochformat. Querformat (und / oder mehrere Monitore in einer Zeile) ermöglichen es Ihnen, sowohl einen Editor oder eine IDE zu öffnen, als auch einen Browser oder ein Diff / Merge-Tool mit zwei Fenstern usw.
Bryan Oakley
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.