Модератор форума: Yuri_G  
Сообщество uCoz » Мастерская uCoz » Дизайн: управление шаблонами » Оптимизация дизайна под разные браузеры
Оптимизация дизайна под разные браузеры
Модератор форума
Сообщение # 1 | 22:12:11
Зачем нужен "правильный" 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
jardnepr
Сообщений: 43
Репутация: 19
Уровень замечаний:

Сообщение # 856 | 20:07:04
Miss_Esq, я в шапку вроде бы ничего не ставил, какой скрипт?

Добавлено (21 Сен 2013, 19:58:37)
---------------------------------------------
NZT,

Цитата (NZT)
iframe{height:auto!important;}
Для чего это? И куда вставлять?

Добавлено (21 Сен 2013, 20:07:04)
---------------------------------------------
Заметил, что удаляя скрипты новостей всё становится нормально, опять вопрос - почему так?


http://hot-kot.at.ua/
Ljubasha
Сообщений: 834
Репутация: 157

Сообщение # 857 | 20:22:24
Цитата (jardnepr)
Для чего это? И куда вставлять?
В ксс...
Цитата (jardnepr)
Заметил, что удаляя скрипты новостей всё становится нормально, опять вопрос - почему так?
Что за скрипты? скрипт работает сам по себе... иногда даже беря стили совсем с другого ресурса...
jardnepr
Сообщений: 43
Репутация: 19
Уровень замечаний:

Сообщение # 858 | 20:31:23
Ljubasha, Я Вас вообще не понял...

http://hot-kot.at.ua/
Ljubasha
Сообщений: 834
Репутация: 157

Сообщение # 859 | 20:51:10
jardnepr, Читайте 57стр. со своими вопросами... А на 58стр. вы увидете ответы и встречные вопросы, что не понятно...?
Miss_Esq
Сообщений: 13859
Репутация: 4159
Уровень замечаний:

Сообщение # 860 | 22:56:58
jardnepr,

Цитата
я в шапку вроде бы ничего не ставил, какой скрипт?


jardnepr
Сообщений: 43
Репутация: 19
Уровень замечаний:

Сообщение # 861 | 23:52:30
Miss_Esq, Вы меня извините, но я не могу это найти не в верхней части сайта, не в страницах сайта ПУ, где это? sad

Добавлено (21 Сен 2013, 23:47:31)
---------------------------------------------
А если восстановить стандартный шаблон, по идее всё станет как надо?

Добавлено (21 Сен 2013, 23:52:30)
---------------------------------------------
Восстановил стандартный шаблон - в хроме стало как нужно, эксплоер всё равно не показывает главную страницу.


http://hot-kot.at.ua/
Miss_Esq
Сообщений: 13859
Репутация: 4159
Уровень замечаний:

Сообщение # 862 | 14:24:27
jardnepr, не знаю что ьвы там в каком обозревателе не видите в IE 9 всё нормально ... а скрипт, это ваша агррессивная реклама выносила вашу главную страницу ..

jardnepr
Сообщений: 43
Репутация: 19
Уровень замечаний:

Сообщение # 863 | 19:07:03
Miss_Esq, Но скрипт в шапке так и не нашел, где он был?

http://hot-kot.at.ua/
NZT
Сообщений: 369
Репутация: 483

Сообщение # 864 | 21:39:17
Цитата (jardnepr)
Miss_Esq, Но скрипт в шапке так и не нашел, где он был?

Да не было его там!) Это Вам просто пошутили так.
Miss_Esq
Сообщений: 13859
Репутация: 4159
Уровень замечаний:

Сообщение # 865 | 00:31:21
jardnepr,
Цитата
Но скрипт в шапке так и не нашел, где он был
Этот скрипт это то что оставалось после выноса содержания страницы блоком рекламы что стояла ..

jardnepr
Сообщений: 43
Репутация: 19
Уровень замечаний:

Сообщение # 866 | 08:03:38
Всем спасибо. Ещё вопрос: есть рекламный код: <link rel="stylesheet" type="text/css" href="p/style.css"><script type="text/javascript" src="//yandex.st/jquery/1.3.2/js"></script><script type="text/javascript" src="p/index.js"></script><div class="content"><div id="api"><div id="id_mid"></div><div id="id_bot"></div><div id="id_cost"></div><div id="id_comment"></div><br><div id="id_next" class="center"></div></div></div>который вставил на два разных сайта. На первом сайте всё отображается нормально - http://ycnex-viv.at.ua А на втором: http://uslugi-online.at.ua/index/prodvizhenie_sajtov/0-13, не показывается. Что сделано не так?

http://hot-kot.at.ua/
Сообщение отредактировал jardnepr - Понедельник, 23 Сен 2013, 08:04:14
Miss_Esq
Сообщений: 13859
Репутация: 4159
Уровень замечаний:

Сообщение # 867 | 08:23:42
jardnepr, Собственно есть на обоих сайтах, на одном в левой колонке, на втором в основной ..

jardnepr
Сообщений: 43
Репутация: 19
Уровень замечаний:

Сообщение # 868 | 23:10:40
Miss_Esq, объясните пожалуйста о какой колонке идет речь. На обоих сайтах захожу через значек в правом нижнем углу "редактировать html код" и вставляю код. Ну а результат видели...Точнее здесь: http://uslugi-online.at.ua/index/0-13 его не видно

http://hot-kot.at.ua/
Сообщение отредактировал jardnepr - Понедельник, 23 Сен 2013, 23:44:13
Miss_Esq
Сообщений: 13859
Репутация: 4159
Уровень замечаний:

Сообщение # 869 | 00:11:03
jardnepr, Зелёным обведено под красной стрелкой ... это то или нет ???

Прикрепления: 2157646.jpg (30.0 Kb)

jardnepr
Сообщений: 43
Репутация: 19
Уровень замечаний:

Сообщение # 870 | 00:19:50
Miss_Esq, нет, должно быть вот это:
Ваш сайт — это уникальное информационное явление в Интернете и о нём обязательно должно узнать как можно больше людей.
Раньше с подобной задачей неплохо справлялась телевизионная реклама, но
времена меняются, а новые технологии позволяют сейчас творить «чудеса» в
плане большей эффективности и на порядки меньшей её стоимости.Вместо дорогостоящих телевидеороликов мы покажем лучшие страницы Вашего сайта,
а на других сайтах вручную разместим прямые и контекстные ссылки на
Ваш. Весь комплекс мероприятий направлен на увеличение популярности
сайта, узнаваемости брэнда, товара или услуги, которые предлагает сайт, и
улучшение его видимости в поисковых машинах. Рекламная кампания
рассчитывается на 3 месяца для достижения стабильных результатов.Вам достаточно ввести адрес сайта или rss-ленты, а наш сервис
проанализирует его и предложит оптимальные варианты рекламы. Далее, Вы
сможете пошагово и быстро настроить любую по сложности рекламную
кампанию для своего сайта. Регистрация не требуется вперед
* не принимаем adult-ресурсы

Добавлено (24 Сен 2013, 00:15:26)
---------------------------------------------
нормально видно здесь http://ycnex-viv.at.ua/

Добавлено (24 Сен 2013, 00:19:50)
---------------------------------------------
Есть подозрение, что связано с этим, <script type="text/javascript" src="//yandex.st/jquery/1.3.2/js"> , но я неуверен


http://hot-kot.at.ua/
Сообщество uCoz » Мастерская uCoz » Дизайн: управление шаблонами » Оптимизация дизайна под разные браузеры
Поиск: