Чат сообщества
   | |
| Модератор форума: Yuri_G |
| Сообщество uCoz Мастерская uCoz Дизайн: управление шаблонами Оптимизация дизайна под разные браузеры |
| Оптимизация дизайна под разные браузеры |
|
Зачем нужен "правильный" HTML-код?
HTML - это специальный язык разметки для веб-страниц. Этот язык стандартизован. Значения каждого тега строго определены. Каждый тег имеет определенные атрибуты. HTML-код страницы интерпретируется браузерами и переводится в изображение веб-страницы, которое видит пользователь. Теперь представьте, что HTML код страницы содержит ошибки (не соответствует стандарту). Что в этом случае делать браузеру? Самый простой вариант - это вывести на экран сообщение об ошибке и все. Однако пользователь вряд ли будет рад увидеть вместо страницы, на которой пропущен закрывающийся тег, сообщение об ошибке. Поэтому создатели браузеров пошли другим путем. Браузеры пытаются (в меру своей интеллектуальности) "исправить" некорректный HTML-код. Вот тут и кроется проблема. Каждый браузер имеет свои правила, по которым он будет исправлять HTML ошибки на веб-страницах. Поэтому, если на странице есть ошибки, то существует большая вероятность, что данная страница в разных браузерах будет выглядеть по-разному. Более того, если даже он сейчас выглядит одинаково во всех браузерах, это не значит, что так будет всегда. С выходом новой версии какого-либо браузера коррекция HTML ошибок может быть изменена. А вот следование стандартам изменено вряд ли будет. Если вы хотите, чтобы ваш сайт выглядел одинаково в самых популярных браузерах, постарайтесь избежать ошибок в HTML коде. В общем, бывает когда есть сайт, есть дизайн, но вот проблема - неизвестно, как он выглядит на других браузерах. Те, кто попроще, просто отписываются, что проверил на таком-то браузере, на других - не знаю.
Эта тема для того, чтобы обнаруживать косяки в разных браузерах. Также и проблема оптимизации и предложения по устранении ошибок (только советы, не просите других делать за вас работу) Проблема с отображением тега HR
Советую вместо Code <hr> который красиво может выглядить только в ИЕ использовать цветную однопиксельную картинку: Code <img src="путь до картинки/hr.gif" class="hr"> и прописать ее в стилях: Code .hr {height: 1px; width: 100%; margin-top: 5px; margin-bottom: 5px;} © Andre Разное понимание CSS браузреами типа IE и Opera (там же Mozilla и прочие)
Проблема в следующем: ИЕ и Опера по разному принимают стили и пересчитывают ее на свой лад. Так расстояние между тегами H1 и P разное и поэтому текст по разному смотрится. Для решения этой проблемы надо использовать дополнительную таблицу стилей под IE, поставить там в ручную padding и margin, или другие атрибуты (в зависиости от ситуации) и прописать ссылку в html, заключив ее в специальные теги.
Code <html> <head> <title>Максим Пелевин - Главная страница</title> <link href="http://maxpelevin.3dn.ru/_st/my.css" rel="StyleSheet" type="text/css"> <!--[if IE]><link rel="stylesheet" type="text/css" href="/img/ie7.css" /><![endif]--> <script type="text/javascript" src="/img/global.js"></script> </head> Надеюсь понятно объяснил. © Русак
Решаем проблему с прозрачностью картинок PNG в ИЕ: http://www.tigir.com/alpha_png.htm |
|
sch779,
Цитата Под IE6, как показывает статистика, остались считанные доли процентов компов |
|
sch779,
Цитата Если Вы нормально сделаете под IE9, то 100% нормально будет идти под IE8 |
|
webanet, Мечтать не вредно .... пока кочевники ослят 10, орден microsoft забудет и о нём ...
|
|
А, когда появятся новые дизайны?
|
|
|
|
Miss_Esq, имеются ввиду новые шаблоны.
 |
|
SilverGold, На вкус и цвет товарищей нет, хотите индивидуальный, уникальный дизайн, это отдельный вопрос ..
|
|
Доброе утро/ден!
Решил протестить сайт , и вот что получилось; Test Может, кто может объяснить - как этим пользоватся? Поскольку, на сколько я понимаю, какая то байда получается, если следовать их советам - как здесь; Утверждают следующее; ----:[32]^Repair: moving <div> element into <link> element. Байда получится, если вставить <div> в <link>? Или, я что-то не так понимаю? Прикрепления:
7024048.png
(44.5 Kb)
Сообщение отредактировал baze - Воскресенье, 30 Дек 2012, 12:40:08
|
|
|
|
Цитата (baze) Решил протестить сайт , и вот что получилось Имхо - слишком уж "строгий" (или недоработанный) у них парсер. Хотя, вполне возможно, что таким образом они (и иже с ними прочие подобные сервисы) завлекают клиентов на платный сервис, типа - у Вас сайт полон ошибок и мы поможем Вам от них избавиться! Цитата (baze) Или, я что-то не так понимаю? Этим (и подобными ошибками) они просто хотели сказать одно - <link> следует включать только в секцию <head>! |
|
Цитата (Miss_Esq) baze, лучше напишите ссылку на оригинал (типа адрес своего сайта ...) ссылкa sch779, Благодарю за объяснение! Цитата Хотя, вполне возможно, что таким образом они (и иже с ними прочие подобные сервисы) завлекают клиентов на платный сервис Об этом был в курсе, но мнение со стороны, и опытного, дорогого стоит. Сообщение отредактировал baze - Воскресенье, 30 Дек 2012, 19:46:07
|
|
Но у меня проблема в следующем, что в Chrome и в Safari криво показывает. И не могу выделить проблему. Но уверен, что из-за баннера "coin-slider";
Прикрепления:
1610381.jpg
(97.9 Kb)
Сообщение отредактировал baze - Воскресенье, 30 Дек 2012, 20:05:21
|
|
Цитата (baze) Но у меня проблема в следующем, что в Chrome и в Safari криво показывает. И не могу выделить проблему. Но уверен, что из-за баннера "coin-slider"; Дай ссылку на страницу с ошибкой Здесь могла быть Ваша реклама! ;-)
Сообщение отредактировал ВладЮриэлтМастер - Воскресенье, 30 Дек 2012, 20:11:32
|
|
ВладЮриэлтМастер,
Cсылкa Иногда, вся середина (в голубом), уходит на право. Прикрепления:
3993010.jpg
(130.8 Kb)
Сообщение отредактировал baze - Воскресенье, 30 Дек 2012, 20:45:05
|
|
Криво верстаем - криво .....
"Мы так "летали" что не заметили "твою мать" и она сказала что "я просто ...." Кроссбраузерность ещё ни ХТО не отменял ... Сообщение отредактировал Miss_Esq - Воскресенье, 30 Дек 2012, 21:04:19
|
| |||
