Ich hatte eine Diskussion mit jemandem über absolute Positionierung. Er behauptet, dass die beste Methode ist, um sicherzustellen, dass alles in den meisten Browsern gleich aussieht und dass es die einfachste Möglichkeit ist, das Aussehen und Verhalten, das Sie für eine Website beabsichtigt haben, beizubehalten.
Ich war mit seiner Meinung nicht einverstanden, dass eine absolute Positionierung das Mittel und den besten Ansatz für die Gestaltung einer Webseite wäre.
In meinem Fall war ich mehr daran interessiert, den Ansatz von Margin / Weite / vorsichtiger schwebender Anpassungen und manchmal den gelegentlichen Tisch zu verwenden. Das ist eine leichte Verallgemeinerung, wie natürlich, würde ich nicht nur mit absoluter Positionierung aufhören, weil ich dagegen ideologisch sein würde, es ist nur, dass ich die Ansatz der absolute Position einer Regel all-Ansatz paßt zu finden, wie mein Peer befürwortete sei eher zweifelhaft.
Was ist der allgemeine Konsens darüber?
Das Internet ist nicht gedruckt, ich denke nicht, dass es ideal ist, um alles zu positionieren. Ich würde argumentieren, dass Sie mit Ihrer Methode dafür sorgen können, dass die Dinge besser aussehen, vielleicht durch die Verwendung von EMs für einige Breiten, damit die Seite auf verschiedenen Bildschirmgrößen (und DPIs) flüssiger wird. Dadurch können Ihre Inhalte besser skaliert werden, und das mobile Surfen wird immer wichtiger, das ist wichtig.
Nach meiner Erfahrung sehen Seiten insgesamt besser aus, wenn Sie planen, dass Ihre Seite sich ein wenig an verschiedene Geräte anpassen muss, anstatt 100% pixelgenaue Layouts zu erzwingen, wie Sie es im Druck sehen. Das ist einfach nicht die Natur des Internets.
Bearbeiten: Wenn Sie mehr darüber nachdenken, können Sie wirklich alle absoluten Werte verwenden, um Sie mit mobilen Browsern zu erwischen, wenn Sie nicht vorsichtig sind. Was passiert, wenn Ihre Website eine absolute Positionierung auf etwas wie dem iPhone verwendet (vorausgesetzt, dass Sie einige Elemente an Ecken ausrichten)? Die Positionierung würde an den Ecken des iPhones ausgerichtet sein, was ein seltsames Verhältnis (verglichen mit Computern) und eine viel kleinere Auflösung ist; alles aus dem Wahnsinn werfen. Wenn Sie eine Kombination aus Schwimmern / Breiten / etc. Verwendet hätten, würden Sie sicherstellen, dass die Seite ihre ursprüngliche Größe behält und Sie nur scrollen müssen.
Meine allgemeine Ansicht ist die Enden heiligt die Mittel.
Pragmatismus herrscht hier. Das ultimative Ziel ist es, es so schnell wie möglich auf möglichst vielen Browsern zum Laufen zu bringen. Ob absolute Positionierung, ob Tabellen verwendet werden sollen oder nicht, ob reines CSS verwendet wird oder nicht, all diese Fragen sind bestenfalls zweitrangig.Ich finde es eigentlich bizarr, wie viel "Tischhass" da draußen ist, aber, wie es unzählige Male dokumentiert wurde, wenn man etwas machen will (wie vertikales Zentrieren) und es kompatibel zu IE6 gibt, gibt es kein schneller, einfachere und kompatiblere Lösung.
Ich bin nicht für oder gegen Tische, absolute Positionierung oder irgendetwas. Das Einzige, wofür ich bin, ist, dass es funktioniert.
In diesem Sinne finde ich die Argumentation über "radikale" absolute Positionierung als - mangels einer besseren Beschreibung - irrelevante Ablenkungen.
Mit all diesen Dingen (Tabellen, absolute Positionierung, reines CSS, etc.) lösen Sie in den meisten Fällen nicht all Ihre Probleme, sondern handeln nur eine Reihe von Problemen für eine andere. Das ist vielleicht in Ordnung, weil im Zusammenhang mit dem, was Sie tun, eine Reihe von Problemen vorzuziehen ist, aber es gibt keine magische Kugel (sei es absolute Positionierung oder irgendetwas anderes).
Aus Erfahrung habe ich genau so viele Probleme gehabt, absolute Positionierung zu bekommen, um das zu tun, was ich will (cross-browser) wie jeder andere Ansatz.
Absolute Positionierung ist in der Regel ziemlich schlecht. In seltenen Fällen möchten Sie, dass Ihre Website auf dem Bildschirm mit 1024 x 768 Pixeln und Vollbild auf dem 1920 x 1200-Desktop angezeigt wird. Außerdem können Sie Ihre absolute Positionierung mit unterschiedlichen Schriftgrößen für Benutzer abstimmen.
Erinnern Sie Ihren Partner daran, dass die Benutzer lieber das Aussehen und das Gefühl sehen, das sie für eine Website beabsichtigt, nicht das Aussehen und Gefühl er beabsichtigt (im Rahmen des Zumutbaren).
Es ist ein schwieriges Ziel, sicherzustellen, dass alles in allen Browsern gleich aussieht. Hauptsächlich weil Sie immer ein bewegliches Ziel anstreben.
Websites sind ein Übermittlungsmechanismus für Inhalte, die hauptsächlich textueller Natur sind. Wenn Ihr Inhalt auf pixelgenaue Positionierung angewiesen ist, wie z. B. animierte Grafiken und ähnliches, sind HTML und Javascript möglicherweise nicht die beste Lösung für Sie. Sollte es wirklich wichtig sein, ob Ihre Absätze in Firefox einen Pixel niedriger sind als in IE?
Obwohl es ziemlich subjektiv sein kann, bin ich kein Fan von absoluter Positionierung, da Sie sollten durchsehen, wenn CSS deaktiviert ist, um zu sehen, wie sich der Inhalt für nicht CSS-fähige Browser verschlechtert (wie z Suchmaschinen, konsolenbasierte Textbrowser und HTML- & gt; Sprachbrowser für Blinde).
Der andere Hauptvorteil, wenn Sie nicht absolut positionieren, ist, dass Sie generalisierteres CSS haben können, das auf einer ganzen Site geteilt wird, ohne Positionierungsanweisungen über den gesamten Code hinweg zu werfen - es wäre schrecklich, wenn der Client plötzlich sein Logo macht habe ein anderes Seitenverhältnis und muss alles bewegen ...
Er behauptet, dass es die beste Methode sei, sicherzustellen, dass in den meisten Browsern alles gleich aussieht
Sie können nicht sicherstellen, dass in den meisten Browsern alles gleich aussieht. Schriftarten werden je nach Plattform, Einstellungen und Verfügbarkeit immer unterschiedlich gerendert. Wenn Sie absolute absolute Positionierung verwenden - wie bei jedem Element ist die horizontale und vertikale Position in Pixeln festgelegt - kann jede Abweichung bei der Schriftgröße dazu führen, dass die Textzeilen darüber geschrieben werden sich gegenseitig die Seite unlesbar machen.
Es gibt WYSIWYG-Design-Tools, die dies tun (und manche missbrauchen Dreamweaver auf diese Weise), aber es wird allgemein als amüsant schlechter Ansatz betrachtet. Häufiger wird die absolute Positionierung nur auf der horizontalen Achse verwendet, um Kopf- und Fußzeilen mit fester Breite zu erstellen, während der Text auf der Seite so viel vertikalen Platz einnehmen kann, wie benötigt wird. (Dies ist, was SO zum Beispiel unter vielen anderen tut.)
Das Fixed-vs-Liquid-Layout-Argument auf Browserbreite ist ein religiöser Krieg, der ewig wüten wird, aber die offensichtlich korrekte Zusammenfassung ist, dass Flüssigkeit am besten ist. ; -)
(... wenn es schwieriger ist, abzuziehen, natch.)
Es ist der einfachste Weg, das Aussehen und das Gefühl zu erhalten, das Sie für eine Website vorgesehen haben.
Ja! Eine schlechte Art, ein Problem zu lösen, ist oft am einfachsten. Aber "Best Practice"? Kaum.
Die absolute Positionierung wird Sie immer später beißen. Ein Aufstellungsort sollte so weit wie möglich im normalen Fluss sein, so dass Elemente in Beziehung zueinander stehen können (wachsen / schrumpfen, kollabieren, wenn sie verborgen sind, usw.).
Bei einem absolut positionierten Layout müssen Sie das Layout immer anpassen, wenn sich der Inhalt ändert.
Ich verwende die absolute Positionierung nur aus drei Gründen:
1) Ich lege ein Element auf ein anderes Element, wie eine Popup-Box.
2) Es gibt wirklich keinen guten Weg, ein Element dort zu platzieren, wo es im normalen Fluss sein muss
4) Das Element wird dynamisch manipuliert (Javascript) und das muss außerhalb des normalen Ablaufs geschehen.
Die andere Regel, an die ich mich bei absoluter Positionierung halte, ist ein anderes Element als relativ positioniertes Elternelement. Auf diese Weise wird das absolut positionierte Element relativ zu diesem übergeordneten Element und nicht zum Darstellungsfenster gesetzt (das seine Abmessungen je nach Ansicht der Seite ändern wird).
Verwenden Sie die absolute Positionierung nur dann, wenn Sie 100% ig sicher sind, dass die involvierten Elemente niemals ihre Größe skalieren müssen und nicht bewegt werden. Wenn Sie ein Element absolut positioniert haben und dann ein anderes Element wächst, können sie sich überlappen und Ihr Layout ist kaputt. Ich würde die absolute Positionierung sehr vorsichtig anwenden und generell dagegen raten. Das gleiche Layout kann fast immer durch Verwendung von schwebenden Elementen und / oder einer relativen Positionierung erreicht werden.
Cletus hat einen Punkt. Als Entwickler stellt sich letztendlich die Frage: Wie gründlich wollen wir sein? Wenn es am wichtigsten ist, Ihre Website schnell zu erreichen, können zusätzliche Vorsichtsmaßnahmen geopfert werden. Wenn das Erstellen einer Website "kugelsicher" ist, dann wird es eine Menge Zeit und Mühe kosten. Ich persönlich würde niemals die Erweiterbarkeit und / oder Benutzerfreundlichkeit im Namen der Bequemlichkeit opfern. Die Skalierung disqualifiziert unter anderem die absolute Positionierung für das Layout jedes Mal in meinem Buch.
Verwenden Sie absolute Positionierung nur, wenn Sie sind 100% sicher, dass die Beteiligten Elemente müssen nie skalieren ihre Größe und wird nicht bewegt werden. Wenn Sie absolut etwas positioniert haben Element und dann ein anderes wächst Sie können sich überlappen und Ihr Layout ist gebrochen.
Das ist richtig. Ich habe gerade 500 Dollar verdient, indem ich eine Seite für irgendeinen Kerl reparierte und ihm beibrachte, dass seine absolut positionierte Webseite den Moment brach, als er so viel wie ein Komma hinzufügte, weil der Text wieder fließen würde und das Ganze auseinanderfallen würde.
Ich bin überhaupt kein Fan von absoluter Positionierung, aber ich habe gesehen, dass Webentwickler es verwenden, um bessere Suchergebnisse zu erhalten, weil sie einfach den wichtigsten Textteil an den Anfang des HTML setzen und absolute Positionierung zur Positionierung verwenden können wo es eigentlich hingehört.
Ich würde es nicht einmal für dieses Argument verwenden, da es Möglichkeiten gibt, den HTML-Code suchmaschinenfreundlich zu machen, aber trotzdem ein flüssiges Layout zu verwenden, wie das Das perfekte 3-Säulen Liquid Layout oder andere Varianten.
Tags und Links html css css-position web-standards