Абсолютно позиционирует все на веб-сайте?

Question

У меня была дискуссия с кем-то об абсолютном позиционировании. Он утверждает, что наилучшей практикой является обеспечение того, чтобы в большинстве браузеров все выглядело одинаково, и что это самый простой способ поддерживать внешний вид и ощущение, что вы предназначались для веб-сайта.

Я не согласился с его мнением о том, что абсолютное позиционирование будет средством правовой защиты и наилучшим подходом к созданию веб-страницы.

В моем случае я был более заинтересован в том, чтобы использовать подход/ширину/осторожные плавающие настройки, а иногда и случайную таблицу. Это небольшое обобщение, поскольку я, конечно, не перестану использовать абсолютное позиционирование только потому, что я был бы идеологически против него, просто я нахожу подход абсолютного положения. Одно правило подходит ко всем подходам, которые поддерживают мой партнер быть довольно сомнительным.

Каково общее мнение об этом?

Answer 1

Мой общий вид - это цели, оправдывающие средства.

Прагматизм царит здесь. Конечной целью является заставить его работать как можно быстрее в самом широком диапазоне браузеров, насколько это возможно. Использовать или нет абсолютное позиционирование, использовать или не использовать таблицы, использовать или не использовать чистый CSS ... все эти вопросы в лучшем случае вторичны.

Я нахожу причудливым, насколько «настольная ненависть» есть, но, как было документировано бесчисленное количество раз, если вы хотите сделать что-то (например, вертикальное центрирование) и совместите его с IE6, нет более быстрого , более простое и совместимое решение.

Я не за или против таблиц, абсолютного позиционирования или чего-либо еще. Единственное, за что я «за», это то, что он работает.

Итак, в этом ключе я считаю аргумент о «радикальном» абсолютном позиционировании - из-за отсутствия лучшего описания - нерелевантных отвлекающих факторов.

Со всеми этими вещами (таблицы, абсолютное позиционирование, чистый CSS и т. Д.) В большинстве случаев вы не решаете все свои проблемы, вы просто торгуете одним набором проблем для другого. Это может быть хорошо, потому что в контексте того, что вы делаете, один набор проблем может быть предпочтительным, но нет волшебной пули (будь то абсолютное позиционирование или что-то еще).

Из опыта у меня было столько же проблем с абсолютным позиционированием, чтобы делать то, что я хочу (кросс-браузер), как и любой другой подход.

Answer 2

Используйте абсолютное позиционирование только тогда, когда вы на 100% уверены, что задействованным элементам никогда не придется масштабировать их размер и не перемещаться. Если вы абсолютно позиционируете какой-то элемент, а затем еще один, они могут перекрываться, а ваш макет разбит. Я бы очень тщательно использовал абсолютное позиционирование и обычно советовал ему. Та же самая компоновка почти всегда может быть достигнута за счет использования плавающих элементов и/или относительного позиционирования.

Answer 3

Гарантия того, что все выглядит одинаково во всех браузерах, является трудной задачей, прежде всего потому, что вы всегда нацелены на движущуюся цель.

Веб-сайты - это механизм доставки контента, который в основном носит текстовый характер. Если ваш контент зависит от идеального позиционирования пикселей, такого как анимированная графика и т. П., HTML и Javascript могут оказаться не лучшим решением для вас. Должно ли действительно иметь значение, если ваши абзацы на пиксели ниже на странице в Firefox, чем в IE?

Answer 4

Хотя это может быть весьма субъективно, я не являюсь поклонником абсолютного позиционирования, так как вы должны проверить с отключенным CSS, чтобы узнать, как ухудшается контент для браузеров, не поддерживающих CSS (например, поисковые системы, консоль текстовые браузеры и HTML-> Речевые браузеры для слепых).

Главное преимущество, заключающееся в том, что вы не позиционируете абсолютно, состоит в том, что у вас может быть более обобщенный CSS, общий для всего сайта, без необходимости помещать позиционирующие заявления по всему коду - было бы ужасно, если клиент вдруг сделает свои логотип имеют разные пропорции и нужно переместить все вокруг ...

Answer 5

Интернет не печатает, я не думаю, что это идеальное решение для абсолютно всего положения. Я бы сказал, что вы можете убедиться, что все выглядит лучше, используя ваш метод, возможно, дополненный использованием EM для некоторой ширины, чтобы страница была немного более жидкой на разных размерах экрана (и DPI). Это позволяет вашему контенту масштабироваться лучше, а мобильная версия становится более популярной, что важно.

На моем опыте страницы, как правило, выглядят лучше всего, когда вы планируете, чтобы ваша страница немного адаптировалась к разным устройствам, в отличие от попыток создания 100% -ых пиксельных макетов, как вы видели в печати. Это просто не характер интернета.

Редактировать: Думая об этом больше, использование всех абсолютов может действительно вернуться, чтобы укусить вас с помощью мобильных браузеров, если вы не будете осторожны. Что происходит, когда ваш сайт использует абсолютное позиционирование на чем-то вроде iPhone (предполагая, что вы привязываете некоторые элементы к углам)? Позиционирование будет выровнено по углам iPhone, что является нечетным соотношением (по сравнению с компьютерами) и гораздо меньшим разрешением; выкидывая все из нечистоты. Если вы использовали комбинацию float/widths/etc, вы должны убедиться, что сайт сохранил свой первоначальный размер, и вам просто нужно прокрутить список.

Answer 6

Абсолютное позиционирование, как правило, довольно плохое. Редко вы хотите, чтобы ваш веб-сайт выглядел так же, как на рабочем столе 1024x768 и полноэкранном режиме на рабочем столе 1920x1200. Кроме того, удача согласовывает ваше абсолютное позиционирование с разными размерами пользовательских шрифтов.

Напомните пэром, что предпочел бы видеть пользователи выглядеть и чувствовать себя они предназначаются для веб-сайта, а не внешний вид и он намерен (в разумных пределах).

Answer 7

Клетуса имеет точку. Как разработчики, вопрос в конечном счете - насколько мы должны быть тщательными? Если вы быстро получаете свой сайт, это может быть принесено в жертву дополнительным мерам предосторожности. Если создание сайта «bullet proof» является приоритетом, то для этого потребуется много времени и усилий. Я лично никогда не буду жертвовать расширяемостью и удобством использования во имя удобства. Масштабирование, среди прочего, дисквалифицирует абсолютное позиционирование для макета каждый раз в моей книге.

Answer 8

Я не поклонник абсолютно абсолютного позиционирования, но я видел, как веб-разработчики используют его для получения лучшего результата поиска, потому что они могут легко разместить самую важную текстовую часть в начале HTML и использовать абсолютное позиционирование для расположите его там, где он действительно принадлежит.

Я бы не использовал его даже для этого аргумента, потому что есть способы заставить HTML быть дружественным к поисковой системе, но по-прежнему использовать жидкую компоновку, такую ​​как The Perfect 3 Column Liquid Layout или другие варианты.

Answer 9

Он утверждает, что лучшая практика, чтобы обеспечить, что все выглядит все-таки в большинстве браузеров

Вы не обеспечить, что все выглядит все-таки в большинстве браузеров. Шрифты всегда отображаются по-разному в зависимости от платформы, настроек и доступности. Если вы используете полное абсолютное позиционирование - как и в, каждый элемент имеет горизонтальные и вертикальное положение, заданное в пикселях, то любое отклонение от размера шрифта может привести к тому, что строки текста будут написаны друг над другом, страница нечитабельная.

Есть инструменты проектирования WYSIWYG, которые делают это (и некоторые люди злоупотребляют Dreamweaver таким образом), но это обычно считается забавно низким. Чаще всего абсолютное позиционирование используется только по горизонтальной оси, чтобы сделать верхние и нижние колонтитулы фиксированной ширины, позволяя тексту на странице занимать столько вертикального пространства, сколько необходимо. (Это то, что SO делает, например, среди многих других.)

Аргумент макета фиксированного vs-liquid в ширине браузера - это религиозная война, которая будет навеки навсегда, но, очевидно, правильное резюме заключается в том, что жидкость лучше. ;-)

(... если труднее стащить, спичечного.)

это самый простой способ, чтобы сохранить внешний вид и чувствовать, что вы предназначены для веб-сайта.

Да! Плохой способ решения проблемы довольно часто бывает самым простым. Но «лучшая практика»? Едва. только

Answer 10

Используйте абсолютное позиционирование, когда вы на 100% уверены, что участвующие элементы никогда не придется масштабировать их размер и не будут перемещены. Если у вас есть абсолютно какой-то элемент , а затем еще один , они могут перекрываться, а ваш макет сломан.

Это право. Я только что заработал 500 баксов, фиксирующих сайт для какого-то парня, и научил его, что его веб-сайт с абсолютным расположением сломался, как только он добавил столько, сколько запятая, потому что текст будет перетекать, и все это развалится.

Answer 11

Использование абсолютного позиционирования всегда будет укусить вас позже. Сайт должен быть как можно больше в нормальном потоке, чтобы элементы могли сидеть по отношению друг к другу (расти/сжиматься, коллапс при скрытии и т. Д.).

С абсолютно позиционированной компоновкой вы всегда будете нуждаться в настройке макета при каждом изменении содержимого.

я только когда-либо действительно использовать абсолютное позиционирование по трем причинам:

1) Я размещая элемент поверх другого элемента, как во всплывающем окне.

2) Там действительно нет хорошего способа поместить элемент, где он должен находиться в нормальном потоке

4) Элемент будет манипулировать динамически (JavaScript), и что должно произойти за пределами нормального потока.

Другое правило, которое я придерживаюсь при использовании абсолютного позиционирования, использует другой элемент в качестве относительно позиционированного родителя. Таким образом, абсолютно позиционированный элемент будет сидеть относительно этого родителя, а не видового экрана (который часто меняет свои размеры в зависимости от того, как просматривается страница).