Я разработчик Winforms и бизнес-движка, который впервые использует asp.net за более чем два года, и за это время я заметил несколько изменений в конвенциях.
Какова логика движений anti -tables for layout?
Можно ли использовать классы css для обработки макета, и если да, то действительно ли это будет проблемой на страницах, которые вы, наверняка, останетесь статичными, или это просто считается "уродливым"?
Несколько дополнительных точек:
Не будь фанатиком. CSS не идеален, и есть некоторые вещи, которые можно сделать гораздо проще с таблицами. Поэтому, если вам нужно, поставьте там небольшой стол. Он не убьет вас.
Основным "злом" табличных макетов был вид глубоко вложенного беспорядка, который раньше был единственным способом получить точный контроль над страницей. У вас будут таблицы в таблицах в таблицах и прозрачные изображения, стратегически размещенные для управления интервалом. Я думаю, что это довольно редко в наши дни, и CSS позволит вам очистить 90% этого беспорядка.
"Семантическая сеть", где теги здесь, чтобы придать смысл странице, а не описывать макет, - хорошая цель. Тем не менее, текущая версия HTML не идет очень далеко к ее достижению. В результате вы всегда будете иметь множество тегов на своих страницах, которые есть только для макета, без другого смысла. Это не означает, что вы не должны пытаться максимально разделить контент и макет; это просто означает, что вы не получите 100%.
Это облегчает доступность. Представьте, что вы текстовый браузер, и вы хотите прочитать вслух содержание веб-сайта для слепых. Большинство табличных макетов, как правило, очень сложно очистить и "понять" для машины.
В этих обсуждениях таблиц и CSS существует много элитарности/политики/фанатизма, но в больших масштабах макеты CSS более чистые, чем табличные макеты.
Теоретически, их также легче поддерживать. Скажем, вы хотите переместить навигацию слева направо? Конечно, просто измените один файл CSS, и вы в порядке. Но опять же, это обычно падает на более сложные веб-сайты, где CSS часто глубоко вложен и настолько сложны, что изменения нелегки, тогда как системы шаблонов делают макеты на основе таблиц не полностью недостижимыми.
Стоит отметить, что <table> теги по-прежнему законно используются при отображении табличных данных. Эмпирическое правило, которое я использую, - это если я показываю что-то, что может легко жить в специальной таблице, тогда тег таблицы - путь.
Существует ряд причин. Одна из причин - доступность... Таблицы макетов не добавляют семантики в контент, поэтому у читателей экрана есть проблемы с ними. Поэтому используйте только таблицы для табличных данных.
Вот несколько пунктов, которые более подробно отвечают на вопрос
Там довольно хорошая статья на сайте, которая ставит проектирование страницы в таблицах vs css с головы до головы. Это довольно интересное чтение и подчеркивает некоторые основные проблемы дизайнера/разработчика при использовании таблиц, таких как искаженный исходный код с таблицами, часто требуется дополнительный исходный код, и будущие изменения неизбежно осложняются.
Одним из основных моментов критики табличных макетов является то, что они жесткие. Они использовались для создания идеальных страниц в пикселях во всех браузерах. Цена для этого - жесткость, которая наносит ущерб доступности. Дизайн макета для экрана с разрешением 800x600 пикселей может привести к тому, что кто-то с широкоэкранным дисплеем высокой четкости будет очень коситься, чтобы читать все. Когда посетитель заставляет увеличивать размер шрифта в браузере, он разбивает макет, иногда довольно плохо.
Макет, ориентированный на CSS, является гибким и может использоваться для создания макета, который будет выглядеть красиво (и схожим, но не одинаковым) при любом размере экрана/шрифта. Улучшенная внутренняя структура также помогает читателям экрана и другим инструментам доступности, а также мобильным платформам/устройствам.
Тег таблицы не устарел и все еще должен играть роль в макетах с поддержкой CSS: он должен использоваться при отображении табличных данных (например, в электронной таблице). Для этого он идеально подходит, но он больше не должен использоваться для макета страницы.
Я настоятельно рекомендую прочитать книгу Разработка с использованием веб-стандартов. Это подходит дизайнерам, разработчикам и людям с более ориентированной на бизнес роль.
Идея состоит в том, что лучше всего добавить содержание/смысл страницы, а не только потому, что она делает ее легко изменяемой и удобной, но также (возможно, что более важно), потому что она улучшает доступность, для тех, кто использует прошивки, и т.д. (и для поисковых систем!). Прочитайте "Погрузитесь в доступность" . [И если у вас есть табличные данные, вы должны использовать таблицу, конечно.]
Хотя "попробуйте использовать CSS, а не таблицы для макета", это очень важное правило, по которому вы должны стараться следовать как можно больше, в конечном итоге "делать правильные вещи" имеет определенную стоимость, а когда оно становится слишком высоким, вы должны пересмотреть свои приоритеты. См. http://giveupandusetables.com/
Это может быть не так по теме, но самая частая проблема, с которой я сталкиваюсь с макетами CSS, заключается в том, что их сложно настроить так, чтобы они всегда растягивали родительский node, а не просто переполняли его. Это становится еще больнее, когда вы попадаете в один из не очень редких случаев IE, делающий что-то совершенно иное, чем FF. Устранение этого беспорядка таблицей обычно проще и более совместимо, чем различные обходные пути JS, которые вы в противном случае могли бы использовать.
Честно говоря, толпа против стола часто виновата просто в том, чтобы быть стандартными нацистами. Дело в том, что люди использовали таблицы для компоновки, поскольку "ведущие" задействованы с использованием фактического свинца.
Основной аргумент против таблиц - accessiblity; и это важная тема. Тем не менее, CSS - это всего лишь средство групповой помощи для реального преступника: HTML - это ужасный язык разметки!
Если HTML не должен был быть для макета, тогда почему мы имеем <center> , <b> , <u> , или < я > ? Почему у нас нет <story> тег для семантических групповых абзацев с? Почему у нас есть 6 заголовков?
Нам нужно прекратить притворяться, что HTML строго семантический, когда это явно не так. В то время как CSS хорошо реализует презентацию, он не так хорош в ее определении. Если бы это было так, нам не понадобился бы суп-суп, чтобы сделать трехколоночный макет. Что действительно должно происходить с HTML5 (но, разумеется, нет), это иметь теги макета с четкими ролями и использовать CSS, чтобы уточнить, что делают те теги.
Честно говоря, не беспокойтесь об использовании таблиц. Даже некоторые из лучших, наиболее семантически правильных людей советуют использовать таблицы, если это легче для потока документа. Просто используйте то, что работает. Недостаток использования таблиц не так уж и хорош.
С поддержкой новых свойств отображения CSS в IE8 эта дискуссия о таблицах и CSS может скоро закончиться. Поскольку проще и разумно думать о макетах в формате grid/table, доступность таблицы, таблицы-строки, таблицы-таблицы, заголовка таблицы, таблицы-столбца, таблицы-строки-группы, и т.д., поскольку свойства CSS значительно облегчат реализацию макета.
Этот статья содержит подробный обзор.
Большинство преимуществ (быстрее, без прошивки, доступности, контента и разметки и т.д.) уже упоминаются, но меня удивляет, что никто не упоминает, что css может делать таблицы, которые просто не могут или, по крайней мере, проще.
Кроме того, это просто использование правильного инструмента для правильной работы. Таблицы предназначены для табличных данных, а css используется для стилизации вашего контента. То, что люди обычно забывают, вы также можете стиль ваших таблиц...
Проблема в том, что поддержка браузера отсутствует. Поэтому люди используют хаки. Поэтому браузеры интерпретируют css по-разному, чтобы разместить эти хаки. Это бесконечный круг.