Ich mache gerade eine Website und versuche zu entscheiden, ob ich sie flüssig machen soll oder nicht. Websites mit fester Breite sind viel einfacher zu erstellen und auch viel einfacher, sie konsistent erscheinen zu lassen.
Um ehrlich zu sein, schaue ich mir persönlich lieber flüssige Websites an, die sich über die gesamte Breite meines Monitors erstrecken. Meine Frage kommt von der Tatsache, dass Sie in den meisten modernen Browsern die Kontrolle behalten und mit dem Mausrad scrollen können, um die Größe jeder Website zu ändern.
Lohnt es sich also, eine flüssige Website zu erstellen?
Antworten:
Es hängt von Ihrem Publikum und Ihren Inhalten ab.
Das Folgende sind Websites, die ich respektiere und die ich als Beispiel für die Nachahmung betrachte.
Flüssigkeitsbeispiele:
Amazonas
Wikipedia
Statische Beispiele:
Apfel
Ebay
MSN
Paketüberfluss
MSDN
Einige mischen es durch!
CNN
Ich glaube, ich bevorzuge die meiste Zeit statische Aufladung. Es ist einfacher, es in mehr Browsern gut aussehen zu lassen. Es ist auch leichter zu lesen.
quelle
Eine Website flüssig zu machen, aber ein Attribut für die minimale / maximale Breite hinzuzufügen, scheint für mich das Beste aus beiden Welten zu sein. Sie unterstützen die Fluidität, begrenzen sie jedoch auf eine bestimmte Breite (z. B. 800px und 1200px).
Es liegt an Ihnen - hier sind einige Dinge zu beachten:
quelle
Absolut. Es ist eine große Unannehmlichkeit für Leute mit riesigen Monitoren, die Größe der Seite ändern zu müssen. Bei einigen Layouts kann es auch etwas zwielichtig sein. Kleine Unannehmlichkeiten, egal wie trivial sie auch sein mögen, können die Meinung der Menschen zu Ihrer Website beeinflussen.
Außerdem haben Netbooks ungerade Auflösungen, die das Entwerfen von Websites erschweren. Zum Beispiel schreibe ich dies bei 1024x600.
Heutzutage ist es auch nicht besonders schwierig (in modernen Browsern), insbesondere mit
min-
undmax-height
in CSS und den neuen Verläufen usw. in CSS3, sodass die Bildskalierung in naher Zukunft kein so großes Problem darstellen wird.Als Antwort auf den folgenden Kommentar denke ich, dass die Vorteile in diesem speziellen Fall die Nachteile überwiegen - IE6 ist überall ein Problem. Wir müssen uns nur darum kümmern.
quelle
Sie müssen feststellen, dass die meisten Computerbenutzer nicht einmal wissen, wie man den Browser vergrößert! Die meisten Benutzer sind so weit vom Verständnis der Computer entfernt, die wir haben. Wir müssen uns immer an diese Tatsache erinnern.
quelle
Textbasierte Apps: Nein . Tabellenbasierte Apps: Ja .
Vorteile von flüssigen Layouts
Nachteile von Flüssigkeitslayouts:
Wenn Sie tabellarische Daten anzeigen (iTunes, DB Manager, ...), ist die Flüssigkeitsbreite gut. Wenn Sie Text (Artikel, Wiki-Seiten, ...) anzeigen, ist die Flüssigkeitsbreite schlecht.
quelle
Aus der Sicht meines iPhones ist das Layout mit fester Breite bei der Verwendung von Codeblöcken problematisch. Die Bildlaufleiste für breite Codeblöcke wird nicht angezeigt, sodass ich die rechte Seite des Blocks nicht lesen kann.
Ansonsten ist es meiner Meinung nach ganz einfach, welche Art von Website Sie entwerfen und wie sie auf Bildschirmen und Fenstern unterschiedlicher Größe aussieht. Wie bereits erwähnt, besteht die Möglichkeit, eine maximale Breite festzulegen. Dies gilt jedoch auch für Codeblöcke und iPhones. Ich habe beides entworfen und bevorzuge keines gegenüber dem anderen.
Es macht zwar Spaß zu beobachten, wie sich die Boxen bewegen, während ich mit der Browsergröße mit einem fließenden Layout spiele, aber ich kann mich leicht amüsieren.
quelle
Das Wichtigste ist, dominante Anwendungsfälle Ihrer Website oder Anwendung zu berücksichtigen. Erwarten Sie, dass die Benutzer es ausschließlich auf Mobilgeräten verwenden? Handys, Netbooks, Desktops?
Schauen Sie sich "Responsive Web Design" von Ethan Marcotte an: http://www.alistapart.com/articles/responsive-web-design/
Großartiger Artikel, der die Verwendung wirklich flüssiger Layouts mithilfe von Medienabfragen demonstriert. Manchmal müssen Sie ein separates Front-End für verschiedene Benutzeragenten erstellen, aber manchmal sind Medienabfragen das perfekte Tool, um mehrere Auflösungen für verschiedene Benutzeragenten bereitzustellen.
quelle
Es hängt davon ab, was Sie versuchen zu tun. Schauen Sie sich SO an. Es hat eine feste Breite und ist großartig. In der Tat, wenn es flüssig wäre, wäre es ein bisschen wie eine PITA. Einige Websites sehen mit flüssigen Layouts besser aus, aber ich persönlich würde mit fix gehen, es sei denn, Sie haben einen guten Grund, flüssig zu werden.
quelle
Viele gute Punkte in den Kommentaren, aber aus Ihrer Frage geht hervor, dass Sie flüssige Designs wirklich mögen und eines erstellen möchten. Probieren Sie es aus, es ist Ihre Website, es muss nicht wie jede andere Website im Web sein.
Seien Sie sich nur der Vor- und Nachteile jeder Lösung bewusst.
quelle
Bis zu einem gewissen Punkt - ja.
Es gibt eine bestimmte Breite, in der das Lesen von Text nervt, wenn er zu breit ist. Einfach zu testen, wenn Sie einen großen Monitor haben. Nehmen Sie einfach den Notizblock und fügen Sie Text ohne Zeilenumbrüche ein.
Bei kleineren Größen kann es jedoch eine gute Idee sein, flüssig zu sein. Handy-Browser sind immer mehr in der Lage, "normale" Websites einwandfrei anzuzeigen, sind jedoch manchmal in der Breite eingeschränkt und profitieren daher davon, wenn Ihre Website auf etwas kleinerem Raum Platz findet.
Persönlich mag ich es auch, den Browser auf meinem Monitor zu behalten, aber nur auf der Hälfte der Breite des Monitors (24 "). Websites, die sich gut darauf skalieren lassen, sind sehr gut.
Ich denke, es ist meistens ein Benutzer-Convenience-Fall. Nicht alle Websites werden davon profitieren, flüssig zu sein, aber ich denke, Websites mit viel Textinhalt sind diejenigen, die am meisten davon profitieren, zumindest wenn sie bis zu einer maximalen Breite (z. B. 800 Pixel oder was auch immer) flüssig sind.
quelle
Ja. Das Zoomen von Seiten ist großartig, wird jedoch hauptsächlich verwendet, um Text zu vergrößern und nicht um das Ansichtsfenster mit Text zu füllen. Wenn der Textkörper bereits zu breit ist, wird er durch Verkleinern normalerweise nicht lesbar.
Sie benötigen ein flüssiges Layout, wenn Sie den Text an das Ansichtsfenster anpassen möchten, unabhängig davon, ob er gezoomt ist oder nicht.
Der Punkt, dass „lange Zeilen schwer zu lesen sind“, wird oft von Designern überbewertet, die versuchen, Designs mit fester Breite zu rechtfertigen (*), aber in Wirklichkeit scheint er auf dem Bildschirm nicht ganz so stark zu sein wie auf Papier. Natürlich ist es wichtig, eine gute Leit- / Zeilenhöhe einzustellen, und die maximale Breite kann verwendet werden, um die schlimmsten Überschüsse langer Zeilen zu verhindern. (Stellen Sie es in font-relativen em-Einheiten ein.) In IE6 erhalten Sie keine maximale Breite, aber das ist nicht die Katastrophe, die es einmal war. (Sie können es mit ein wenig JavaScript beheben, wenn Sie sich wirklich für diese Typen interessieren. Ich nicht.)
(*, die für hochgrafische Layouts in der Tat weniger Arbeit bedeuten. Für ein einfacheres Layout wie StackOverflow gibt es jedoch keinen Grund, nicht flüssig zu werden. Tsk @SO, wie!)
quelle
Vorwort: Kein professioneller Webkünstler.
Ich habe festgestellt, dass es viel zu viele fummelige Dinge gibt, um die Dinge bei Handy- und Über-Widescreen-Größen zum Laufen zu bringen, insbesondere bei etwas von einigermaßen interessanter Komplexität.
Normalerweise entwerfe ich in gewisser Weise eine Site mit fester Breite. normalerweise begrenzt auf [600,1200].
Ich finde auch, dass sehr breite Inhaltsspalten mühsam zu lesen sind. Ich scheine mich zu erinnern, dass es einige Untersuchungen gibt, die eine optimale Anzahl von Wörtern pro Spaltenzeile vorschlagen.
quelle
Sie können es so machen.
# Machen Sie das Hauptlayout flüssig und wenden Sie die maximale Breite an: 1140px ' darauf an und Sie es.
Auf diese Weise wird es auf größeren Bildschirmen keine langen Textzeilen und auf kleineren Bildschirmen keine ordnungsgemäße Abwicklung der Webseite geben (ausgenommen 800x *** und niedrigere).
Ich habe diese Methode in meinen neuen Projekten implementiert und sie funktioniert wie ein Zauber.
atb .. :)
quelle
Ich denke, die Entscheidungsflüssigkeit sollte auch auf dem Inhalt der Website basieren :
Verwenden Sie für Websites mit großen Mengen an einfachen Informationen (wie Nachrichtenportale) besser das flüssige Layout.
Web-Services sehen besser aus und funktionieren in festen Dimensionen, sodass Sie immer wissen, wo sich Schnittstellenelemente an ihren Positionen befinden und sich nicht ständig bewegen.
quelle
Ja, flüssige Websites sind es wert, erstellt zu werden
Wie Sie sagten, sieht es gut und vernünftig aus, wenn Sie in der Entwurfsphase richtig planen.
Ihr Zweifel an den Auswirkungen von Strg + Bildlaufleiste ist keine große Sache. Diese Funktion dient in erster Linie der Barrierefreiheit, um die Lesbarkeit von Text durch Erhöhen der Größe zu verbessern.
Wenn Sie jedoch alle Ihre Größen in Pixel (px) angeben, wird dies nicht passieren. Die richtige Anpassung erfolgt nur, wenn Sie "em" verwenden, um die Größe anzugeben. Sie haben also die Möglichkeit, es ein- und auszuschalten
quelle
Ich bin ein großer Fan von Fixed bei <800px ... es ist einfacher, schmalere Spalten zu lesen, und es wird überall funktionieren. Das heißt, wenn Sie versuchen, eine Website zu erstellen, die Hypertext enthält ... Websites, die Anwendungs-Frontends darstellen, ist meiner Meinung nach eine weitere Dose Würmer vollständig ...
quelle
Fluid Design - wirklich flüssig - ist schwer. Sehr schwer. Es ist nicht nur eine Frage der Seitenbreite - skalieren Ihre Schriftarten und skaliert alles mit ihnen? Im Idealfall:
em
eher in als definiert werdenpx
Unser Hauptprodukt ist flüssig und aus meiner Sicht als Designer ein Schmerz, insbesondere weil es viele benutzergenerierte Inhalte enthält.
Zum einen Bilder - auf einer Site mit fester Breite können Sie ein Bild haben, das die Hälfte der Breite ausfüllt und gut aussieht. An einem fließenden Ort ist es genauso wahrscheinlich, dass dieses Bild in einem Meer von Leerzeichen verloren geht und ziemlich einsam aussieht.
Das Leben sollte einmal einfacher sein
border-radius
und andere CSS3-Eigenschaften kommen mehr ins Spiel, aber leider sind Regierungsmitarbeiter unser Kernpublikum, die alle immer noch IE F @! * ING 6!Um die Frage zu beantworten: "Lohnt es sich?" Ja , wenn du es richtig machst.
Hier ist ein Szenario: Wählen Sie eine Site mit fester Breite: Ihr Chef zeigt sie einem Kunden auf seinem brandneuen 1920 x 1600-Laptop an und beschwert sich dann bei Ihnen darüber, "wie alles auf dem Bildschirm dieses Typen klein aussieht!"
quelle
Ich finde es schön, auf dem Bildschirm eines Benutzers gut skalieren zu können, anstatt die Benutzer zum Schwenken und Zoomen zu bringen. In einer Zeit, in der Benutzer von einer Vielzahl von Geräten im Internet surfen, von Smartphones bis hin zu ultra-mobilen PCs, von denen jeder seine eigene, möglicherweise nicht standardmäßige Auflösung hat, ist es meiner Meinung nach wichtig, die Benutzererfahrung auf einem hohen Niveau zu halten, wenn Ihre Website wird auf solchen Bildschirmen angezeigt. In Bezug auf die Textlänge könnte sie durch ein bestimmtes Verhältnis begrenzt sein, sodass sie gut in das Layout passt. Ich denke, es gibt auch Frameworks, die beim flüssigen Schreiben einer Site und bei der Codierbarkeit helfen können.
quelle
Ich werde gegen die Mehrheit gehen und NEIN sagen. Begründung: Fließende Websites wie Wikipedia sind aufgrund ihrer langen Zeilenlänge ein Albtraum, den man auf großen Bildschirmen lesen kann (obwohl ihre Zitate das Lesen im besten Fall erschweren).
Das Problem tritt tatsächlich auf, weil es keinen Mechanismus gibt, um die Größe von Text in Bezug auf die Bildschirmauflösung zu ändern. Wenn Sie Text bei größeren Auflösungen automatisch vergrößern könnten, könnten Sie näher an den ungeraden 80 Zeichen pro Zeile bleiben, die allgemein als die beste Lesbarkeit angesehen werden.
Es gibt auch das Problem von Bildern und anderen Elementen mit fester Größe. Sie können große Bilder haben und sie bei Bedarf vom Browser verkleinern lassen. Dann treten jedoch andere Probleme auf, z. B. viel längere Downloadzeiten und Probleme mit der Bildqualität in vielen Browsern.
quelle
Ich bin ein Fan von Websites, die eine feste maximale Breite zwischen 800 und 1000 Pixel haben, aber auch verkleinert werden können, damit ich den Inhalt lesen kann, ohne von einer Seite zur anderen zu scrollen und auch nicht herauszuzoomen, da der Text häufig zu groß wird klein zu lesen und es tut meinen Augen weh. Das ist normalerweise der Wunsch, den ich anstrebe, weil ich Websites erstellen möchte, auf die ich stolz sein kann.
quelle