|
|||
Responsive Webdesign - Pixel oder Prozent?
Hallo,
ich beschäftige mich seit einiger Zeit mit responsive Webdesign. Es heißt ja immer, das man die Breiten von Containern dann in Prozent angibt. Eben habe ich das Skeleton-Framework in einem Tutorial gesehen, und dort wird weiterhin mit Pixeln gearbeitet und je nach verwendeter Bildschirmbreite dann eine andere Pixelangabe gemacht. Sind das beides Ansätze für RWD bzw. was ist denn der bessere Weg? |
Sponsored Links |
|
||||
Zitat:
|
Sponsored Links |
|
|||
Wenn man nach Ethan Marcotte geht, dann definiert sich Responsive Design durch fluides Grid, flexible Bilder und Media Queries.
Oft wird der Begriff viel weiter gefasst, genau genommen müsste man es dann wohl Adaptive Design nennen, siehe z.B. Adaptive vs. Responsive, what’s the difference? Wie auch immer man es nennen mag: Ich halte den Ansatz, den Inhalt über Einheiten entscheiden zu lassen auch bei einem wie auch immer gearteten adaptiven Layout für das sinnvollste. Es kann demnach Pixel, Prozente oder Ems geben -- und das auch noch gemischt. Zusammenpassen muss es und für den Besucher das bestmögliche Layout bieten, egal mit welchem Gerät er gerade unterwegs ist. Noch ein paar Links: Higher Ed Responsive Web Design Trail Blazers say 'Content-First' | Meet Content » The EMs have it: Proportional Media Queries FTW! Cloud Four Blog Stop designing for fixed viewports! | Opinion | .net magazine
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
|
|||
Weblayout flexibel
Ein Weblayout sollte sich an die Fenstergröße flexibel anpassen. Mit Prozentangaben ist es generell gewährleistet. Ein zweispaltiges Layout hat einen Hauptcontainer, darin befindet sich ein Hilfscontainer für die linke Spalte und ein Hilfscontainer für die rechte Spalte. Der eine Hilfscontainer erhält eine Breite von 30% und der andere Hilfscontainer eine Breite von 70%. In beide Hilfscontainer wird jeweils ein Inhaltscontainer platziert. In den Inhaltscontainern befinden sich die Inhalte (Texte, Bilder) und können beliebig formatiert werden. Das Layout (30% Breite und 70% Breite) bleibt erhalten. Natürlich passt ein breites Bild nicht in eine schmale Spalte. Wenn das Layout geändert werden soll, beispielsweise 40% Breite und 60% Breite, muss man nur die Breite der Hilfscontainer ändern und die Formatierungen der Inhalte bleiben erhalten. Oder wenn der Hauptcainer (außen herum) z.B. 90% Breite haben soll, muss man nur die Breite des Hautcontainers ändern und alles andere (die Breite der Hilfscontainer und die Formatierung der Inhalte) bleiben erhalten.
|
|
|||
Zitat:
Das würde ich so generell nicht sagen. Angenommen, ein Layout hätte 90% Breite, dann sieht es bei einem Browserfenster von ca 1200px vielleicht gut aus, bei sehr kleinem Fenster bestünden die Textzeilen in den Spalten vielleicht nur noch aus 3 Wörtern, und bei sehr breitem Fenster wären die Textzeilen so lang, dass man sie nur schwer lesen könnte. Ich bevorzuge eine feste Breite in em, und eine Maximalbreite von ca 95%. LG Netinja |
|
|||
Hallo
Zitat:
Das sind weder Seiten mit starrem Layout noch Seiten, die bei kleinerem Viewpoint einfach prozentual kleiner dargestellt werden. Gruss MrMurphy |
Sponsored Links |
|
|||
Zitat:
Zitat:
Aber jetzt erkläre doch mal bitte, wieso meine Herangehensweise Zitat:
|
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Responsive webdesign: horizontales Menü mit angepasster Schriftgröße | Spencer | Javascript & Ajax | 3 | 19.09.2012 00:16 |
Responsive Webdesign - Smartphone Hintergrundgrafik soll nicht geladen werden | simon1101 | CSS | 5 | 08.03.2012 22:35 |
Dynamische Navigationsleiste horizontal, vertikal | Faven | CSS | 6 | 28.06.2010 16:06 |
DIV-Layout - Prozent und Pixel | Flucker | CSS | 5 | 05.11.2009 14:48 |
pixel und prozent in kombination | hlzmkmlln | CSS | 1 | 17.11.2004 01:03 |