CSS Validator

Вид для печати

08.02.2007, 13:07
garA

Проблема вот в чем:
решил проверить цсску на валидность (хттп://jigsaw.w3.org) со следующими настройками:

Warnings : All
Profile : CSS 2.1
Medium : All

валидатор выдает следующие предупреждения:

1) Same colors for color and background-color in two contexts #h3_usl and #popular a
2) You have no background-color set (or background-color is set to transparent) but you have set a color. Make sure that cascading of colors keeps the text reasonably legible.
3) You have some absolute and relative lengths in margin. This is not a robust style sheet.
4) You have no color set (or color is set to transparent) but you have set a background-color. Make sure that cascading of colors keeps the text reasonably legible.
5) Redefinition of display
6) You have no background-color set (or background-color is set to transparent) but you have set a color. Make sure that cascading of colors keeps the text reasonably legible.
7) Same colors for background-color and color

------------------------------------------------------
прокомментируйте, плиз, эти предупреждения..
08.02.2007, 13:29
garA

итак, я попробую разобраться, а вы, если что, подправьте меня.. [Only registered and activated users can see links. Click Here To Register...]
1) тут я так и не понял, #h3_usl и #popular a на странице вообще никак не пересекаются..
#h3_usl{
background:#B19B8E;
color:#fff;
font-weight:bold;
padding:4px 18px;
font-size:.9em;
}
#popular a{
color:#B19B8E;
text-decoration:none;
}
2) если указать background:inherit, то все тип-топ.. но я не понимаю, зачем? разве бэки не наследуются?
#popular a{
color:#B19B8E;
text-decoration:none;
}
3) у меня в коде написано так:
#left{
float:left;
width:174px;
margin:70px 0 0 -100%;
}
в чем ошибка не понял..
4) то же самое, что и пункт 2
#nav a{
text-decoration:none;
background:inherit;
}
хотя в самом начале цсс-файла написано:
a{
color:#006;
}
5) написано так:
#form .label{
float: left;
width: 130px;
display: block;
margin-right: 10px;
display: inline;
}

хотя, честно говоря, не знаю откуда это взялось.. )
но все равно, интересно, что за ошибка..
6) та же ошибка, что и пункт 2
7) hr{
background:#ccc;
border:0;
color:#ccc;
height:1px;
margin:10px 0 10px 0;
padding:0;
}
тут надо стили для ие вынести в отдельный файл..

---------------------------------
жду ваши рекомендации.. )
08.02.2007, 13:40
garA

кстати, если поменять настройку с Warnings : All на Warnings : Normal Report, то остаются следующие ошибки:
1) Same colors for color and background-color in two contexts #h3_usl and #popular a
2) Same colors for color and background-color in two contexts #h3_usl and #popular a
3) Same colors for color and background-color in two contexts #h3_usl and #popular a
4) Same colors for background-color and color

у меня возник еще один вопрос:
почему когда исправляешь одни ошибки появляются другие?
08.02.2007, 14:11
Aykroyd

Простите, я, конечно, могу Вам дать определенные рекомендации, но перед этим не могу не задать Вам один встречный вопрос:

Вы англо-русский словарь в руки брать не пробовали?
08.02.2007, 15:29
garA

Цитата:

Вы англо-русский словарь в руки брать не пробовали?

Aykroyd, Вы меня извините, но причем тут дословный перевод? Мне не понятен смысл всей этой байды, которую выдает валидатор..
Возьмем пункт 1 (опция: warnings: All): Same colors for color and background-color in two contexts #h3_usl and #popular a

вот трывок из цсс:
#h3_usl{
background:#B19B8E;
color:#fff;
font-weight:bold;
padding:4px 18px;
font-size:.9em;
}

#popular a{
color:#B19B8E;
text-decoration:none;
}

да, у них совпадают цвета (color и background).. но в html они никак друг с другом не связаны..

надеюсь, Вы поняли, что меня интересует и подскажете, как сделать, чтобы все было по стандартам.. :hi:

я прикрепи скриншот, там все показано..

и еще, если не трудно, можно комментарии по поводу остальных пунктов..

спасибо..
08.02.2007, 17:22
Aykroyd

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

Если смысл Вам понятен, могу сказать Вам следующее:

Warnings (предупреждения) не имеют никакого отношения к валидации, как к таковой. Если Ваш CSS валиден, валидатор [Only registered and activated users can see links. Click Here To Register...] должен сообщить Вам: "Congratulations! No Error Found." Это – заголовок на зеленом фоне. При этом нет никакой разницы – есть ли при этом Warnings (предупреждения) или их нет.

А вот если валидатор сообщает Вам "Sorry! We found the following errors" (заголовок на красном фоне) – значит CSS у Вас НЕ валиден.

Что касается Warnings (предупреждений) – это не ошибки. Это что-то типа "замечаний". В частности, в Вашем случае совпадают цвета текста и фона, хоть и в разных местах. При определенных условиях это может вызвать проблему доступности документа. Но "может" – это же не "должно", ведь верно?

Более того, зачастую приходится не только закрывать глаза на Warnings (предупреждения), но и на саму валидацию CSS (ошибки). Почему так – очень хорошо это объясняется вот здесь (параграф "Бонус: валидация CSS".):
[Only registered and activated users can see links. Click Here To Register...]

Пример из практики:
Лично мне довольно часто приходится пользоваться разнообразными хаками в CSS для поддержки кроссбраузерности. И эти хаки не проходят валидацию. [Only registered and activated users can see links. Click Here To Register...] Но зато, например, поля форм в документах отображаются во всех браузерах одинаково. С попиксельной точностью. [Only registered and activated users can see links. Click Here To Register...] В таких случаях я не задумываясь жертвую валидностью CSS. При этом точно знаю сам, что ничего "страшного" или "недопустимого" в код я не привнес. Просто эти мои ухищрения не соответствуют стандартам, на которые полагается валидатор.
08.02.2007, 17:41
garA

Aykroyd, спасибо Вам за подробный ответ.. [Only registered and activated users can see links. Click Here To Register...]
В моем случае у меня не показывает "Sorry! We found the following errors", что раадует [Only registered and activated users can see links. Click Here To Register...]
Но и не показывает "Congratulations! No Error Found." [Only registered and activated users can see links. Click Here To Register...] .. Ну, ничего, раз это не главное..
А что касается хаков (использую в основном для ослика).. они у меня в отдельном файле, который проверять на валидность не имеет смысл, что в общем то Вы и написали..

А по поводу Warnings (предупреждения) теперь не буду заморачиваться..

Цитата:

Что касается Warnings (предупреждений) – это не ошибки. Это что-то типа "замечаний". В частности, в Вашем случае совпадают цвета текста и фона, хоть и в разных местах. При определенных условиях это может вызвать проблему доступности документа. Но "может" – это же не "должно", ведь верно?

такой вот ответ я и хотел услышать с самого начала..

еще раз thanks [Only registered and activated users can see links. Click Here To Register...]
08.02.2007, 17:51
Aykroyd

Цитата:

Originally posted by garA@Feb 8 2007, 17:41
Aykroyd, спасибо Вам за подробный ответ..* [Only registered and activated users can see links. Click Here To Register...]
В моем случае у меня не показывает "Sorry! We found the following errors", что раадует* [Only registered and activated users can see links. Click Here To Register...]
Но и не показывает "Congratulations! No Error Found."* [Only registered and activated users can see links. Click Here To Register...] .. Ну, ничего, раз это не главное..
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]

[/quote]
Не за что. [Only registered and activated users can see links. Click Here To Register...]
Но что-то одно – либо "Sorry! We found the following errors", либо "Congratulations! No Error Found." – должно показываться. И одно их этих сообщений я настоятельно рекомендую Вам увидеть. Потому как у Вас в CSS могут быть настоящие ошибки (а не предупреждения), которые действительно могут требовать исправления.
08.02.2007, 17:52
Zigzag

почитайте Джеффри Зельдмана, это многое для вас прояснит
08.02.2007, 18:03
garA

Цитата:

Originally posted by Zigzag@Feb 8 2007, 14:52
почитайте Джеффри Зельдмана, это многое для вас прояснит
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]

[/quote]

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

а Джеффри Зельдмана теперь обязательно прочитаю.. :hi:
08.02.2007, 18:10
Aykroyd

Цитата:

Originally posted by garA@Feb 8 2007, 18:03
...книга Дэна Седерхольма "Пуленепробиваемый Web-дизайн"...
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]

[/quote]
Тоже очень большой "гуд". [Only registered and activated users can see links. Click Here To Register...]
08.02.2007, 20:06
garA

Цитата:

хттп://softwaremaniacs.org/blog/2005/10/02...lid-conformant/

действительно не плохая статья..
особенно мне понравился этот фрагмент:

Цитата:

... но если вы сами не считаете то, что он (валидатор CSS) показал, ошибками, а так сами и задумали - смело выкладывайте стиль на веб.

[Only registered and activated users can see links. Click Here To Register...]
08.02.2007, 20:27
Aykroyd

Цитата:

Originally posted by garA@Feb 8 2007, 20:06
особенно мне понравился этот фрагмент:
[Only registered and activated users can see links. Click Here To Register...]
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]

[/quote]
Правильно подчеркнули. [Only registered and activated users can see links. Click Here To Register...] Это и есть главная суть...
09.02.2007, 00:07
Zigzag

Цитата:

Originally posted by garA@Feb 8 2007, 16:03
книжка имеется, но до конца так и не осилил.. мне она покалась скучноватой.. мне больше понравилась книга Дэна Седерхольма "Пуленепробиваемый Web-дизайн", она как раз для новичков, все очень грамотно расписано..

а Джеффри Зельдмана теперь обязательно прочитаю..* :hi:
<div align='right'>[Only registered and activated users can see links. Click Here To Register...]

[/quote]

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