Есть ли бизнес причина стремления к чистому макету CSS?

голоса
21

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

Мой вопрос:

Кто эти несколько столов будет больно?

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

Задан 07/08/2008 в 22:14
источник пользователем
На других языках...                            


21 ответов

голоса
25

Так как это стек переполнения , я дам вам мой ответ программиста

семантика 101

Во-первых, посмотрите на этот код и думать о том, что здесь не так ...

class car {
    int wheels = 4;
    string engine;
}

car mybike = new car();
mybike.wheels = 2;
mybike.engine = null;

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

семантика 102

Теперь примените это к документу разметки. Если документ необходимо представить табличные данные, то соответствующий тэг будет <table>. Если поместить навигацию в таблицу , однако, то вы злоупотребляя предполагаемую цель <table>элемента. Во втором случае, вы не представление данных табличных - вы (MIS) , используя <table>элемент для достижения цели презентационной.

вывод

Кому же это больно? Никто. Кто выигрывает при использовании семантической разметки? Вы - и ваша профессиональная репутация. Теперь иди и делать правильные вещи.

Ответил 16/09/2008 в 19:31
источник пользователем

голоса
16

Как много вещей, это хорошая идея, что часто получает слишком далеко. Мне нравится расположение Div + CSS инициативе, потому что, как правило, довольно легко изменить внешний вид, даже резко, только через таблицу стилей. Это также хорошо, чтобы быть дружественным к браузерам более низкого уровня, для чтения с экрана и т.д. Но, как и большинство решений в области программирования, цель сайта и стоимость разработки следует учитывать при принятии решения. Ни одна из сторон являются правильным путем 100% времени.

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

Ответил 07/08/2008 в 22:20
источник пользователем

голоса
9

В реальном мире, ваши шансы принимать один дизайн и полностью reskinning его, не касаясь разметки довольно отдаленным. Это хорошо для блог и состряпали демоса как csszengarden, но это фиктивное преимущество на любом участке с умеренно сложным дизайном, на самом деле. Использование CMS является гораздо более важным.

DIVs плюс CSS! = Семантические, либо. Хорошо HTML хорошо стоит для SEO и доступности всегда, независимо от того, используются таблицы или CSS для разметки. Вы получаете действительно эффективный, быстрый веб-дизайн, сочетая очень простые таблицы с хорошей CSS.

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

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

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

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

Ответил 07/08/2008 в 23:25
источник пользователем

голоса
8

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

Рестайлинг сайтов очень общий запрос, то, что я заметил более теперь, когда я могу сказать «да» вместо того, чтобы попытаться поговорить мой выход.

И не после того, как вы научились работать с системой макета страницы, это обычно не сложнее, чем расположение на основе таблицы.

Ответил 07/08/2008 в 22:26
источник пользователем

голоса
7

Основная причина, почему мы изменили наши веб-страницы DIV / макета на основе CSS была задержка в предоставлении страниц на основе таблиц.

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

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

Ответил 16/10/2008 в 14:16
источник пользователем

голоса
7

Если у вас есть общедоступный веб-сайт, обращенный, реальный бизнес-кейс SEO.

Доступность является важной и поддержанием семантического (X) HTML является гораздо проще , чем сохранение макетов таблиц, но # 1 место на Google принесет домой бекон.

Например: Ежемесячный веб - отчет: 127 миллионов просмотров страниц за июль

Ежемесячный веб-отчет: 127 миллионов просмотров страниц в июле

...

Latimes.com продолжает совершенствоваться в SEO (поисковая оптимизация), а это значит, наши рассказы более высокий рейтинг в Google и других поисковых системах. Мы также работаем лучше на таких сайтах, как Digg.com. Все, что добавляет к более экспозиции и больше читателей, чем когда-либо прежде.

Если вы посмотрите на их сайте, у них есть довольно приличный макет CSS собирается.

Как правило, вы найдете относительно несколько макетов таблиц хорошо работает в поисковой выдаче в эти дни.

Ответил 08/08/2008 в 00:22
источник пользователем

голоса
7

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

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

Я обнаружил, что это очень эффективный способ для уменьшения различий кросса-браузера в рендеринге CSS, чтобы использовать «строгий» доктайп в верхней части страницы:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Кроме того, для страшных проблем IE6 CSS, вы можете использовать этот хак:

.someClass {
    background-color:black; /*this is for most browsers*/
    _background-color:white; /*this is for IE6 only - all others will ignore it*/
}
Ответил 07/08/2008 в 22:18
источник пользователем

голоса
6

делает полный обновляют веб-сайт на 15 странице, просто обновляя 1 файл является небо.

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

CSS является обоюдоострым мечом на больших сайтах, как у нас.

Ответил 07/08/2008 в 23:31
источник пользователем

голоса
6

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

В дополнение к обычному определению стилей, вы можете добавить следующий тег

<link rel="stylesheet" type="text/css" media="print" href="PrintStyle.css" />

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

Ответил 07/08/2008 в 23:29
источник пользователем

голоса
6

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

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

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

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

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

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

Ура!

[EDIT - добавил зачеркивания к неправильным или вводящим в заблуждение части этого ответа - см комментарии]

Ответил 07/08/2008 в 23:16
источник пользователем

голоса
6

Держите макет и контент отдельно позволяет переделать или сделать щипки и изменения в свой сайт легко. Это может занять немного больше времени фронт, но самый длинный этап разработки программного обеспечения является обеспечение . КАС дружественный сайт с четким разделением между содержанием и дизайном лучше всего в течение эксплуатации.

Ответил 07/08/2008 в 22:25
источник пользователем

голоса
4

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

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

Это, как говорится: Как разработчик, я отказался от CSS Layout в основном потому, что мой дизайн отстой в любом случае, так по крайней мере, он может сосать правильно :-) Но если бы я когда-либо нанять дизайнера, я позволил бы ему использовать все его WYSIWYG редактор выплевывает.

Ответил 07/08/2008 в 22:23
источник пользователем

голоса
1

Помимо того, что легко обновляемыми и соответствует ...

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

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

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

Кроме того, обязательно встраивать / включить все многоразовые части вашего сайта: заголовок, подзаголовок, колонтитул.

Как только вы получите на горб, это будет все вниз холм оттуда. Удачи!

Ответил 16/10/2008 в 13:20
источник пользователем

голоса
1

* Я позволил бы ему использовать все его WYSIWYG редактор выплевывает
я просто бросил вверх немного ...
* ааа привет? Вы не думаете , что графический дизайнер писать CSS вручную делать вы?

Как ни странно , я работал с несколькими дизайнерами и лучшим среди них делать ручной настройки их CSS. Парень , которого я имею в виду на самом деле делает все его проектные работы в формате XHTML с парой CSS - файлов и создает графические элементы на лету , как он нуждается в них. Он использует Dreamweaver , но только на самом деле , как средство навигации. (Я узнал многое из того парня)

После того, как вы сделали инвестицию, чтобы узнать чисто CSS на основе дизайна и имели небольшой опыт (узнал, где IE отстой [быть справедливым это становится лучше]) он заканчивает тем быстрее я нашел. Я работал над системами управления контентом и применение редко приходилось менять для дизайнеров, чтобы придумать совершенно другой вид.

Ответил 08/08/2008 в 02:09
источник пользователем

голоса
1

Бизнес причина для разметки CSS: Вы можете сдуть клиент, говоря «наш портал полностью настраиваемый / скин без написания кода!»

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

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

Ответил 07/08/2008 в 22:22
источник пользователем

голоса
0

Там, безусловно, есть. Если вы по-прежнему стремится к этому, вы не получаете это право.

DIV + CSS макет на самом деле гораздо проще, чем сервировки стола с точки зрения ремонтопригодности и производительности. Просто продолжайте практиковать его, прежде чем это слишком рано говорить о том, что.

Сервировка стола тоже хорошо, это просто не предназначено для макетов и имеет исключительные недостатки, когда речь идет о незначительной настройке.

Ответил 27/12/2008 в 13:34
источник пользователем

голоса
0

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

Он даже имеет кучу встроенных стилей ...

Ответил 16/10/2008 в 02:39
источник пользователем

голоса
0

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

Ответил 08/08/2008 в 01:25
источник пользователем

голоса
0

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

Это на самом деле не так; чтения с экрана, как JAWS, Window Eyes и HAL игнорировать макет таблицы. Они работают очень хорошо при работе с реальной сетью.

Ответил 07/08/2008 в 23:28
источник пользователем

голоса
0

Некоторые дополнительные причины, почему это хорошая практика:

  • Доступность - веб идеале должен быть доступен всем
  • Производительность - сохранить пропускную способность и загружается быстрее на мобильных устройствах (они не имеют пропускную способность до некоторой степени и не могут макет сложных таблиц быстро). Помимо загрузки быстро это всегда хорошо ...
Ответил 07/08/2008 в 23:09
источник пользователем

голоса
0

:: кивает palmsey и Jon Galloway ::

Я согласен с коэффициентом ремонтопригодности. Это займет меня немного больше времени, чтобы получить мои первоначальные макеты сделали (так как я все еще джедай подмастерье в CSS искусстве), но делает полный обновляет веб-сайт на 15 странице, просто обновляя 1 файл является небом.

Ответил 07/08/2008 в 22:39
источник пользователем

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more