Модератор форума: Yuri_G  
Оптимизация дизайна под разные браузеры
Модератор форума
Сообщение # 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
Amati5210
Сообщений: 125
Репутация: 16

Сообщение # 796 | 12:36:40
Цитата (Monstar_1)
на моем компьютере отображается нормально, а вот у заказчика сайта почему то криво
Тему читать нужно. Установи у себя все основные браузеры и подгоняй дизайн по них.

Мой сайт РемДомТех
brodyaga30
Сообщений: 491
Репутация: 146

Сообщение # 797 | 14:24:25
Monstar_1, Вы так и не пописали доктайп ... и что Вы хотите в итоге ... так у Вас с заказчиком не будет одинакового отображения 100% ...

Добавлено (09 Фев 2013, 14:24:25)
---------------------------------------------

Цитата (Monstar_1)
Проблема в том что, сайт у меня на моем компьютере отображается нормально, а вот у заказчика сайта почему то криво, помогите разобраться

Понял тебя, тридцатый ...
Capetr
Сообщений: 4
Репутация: 83

Сообщение # 798 | 15:43:53
Привет всем! Требуется помощь в установке не стандартных шрифтов (отображаются не во всех версиях IE). Кто-нибудь может подсказать? Не бесплатно. Со всеми вопросами вэлкам в личку))
Miss_Esq
Сообщений: 13859
Репутация: 4159
Уровень замечаний:

Сообщение # 799 | 17:45:07
Capetr, Потребуется унификация стандарта шрифта на специальном сервисе ..

Capetr
Сообщений: 4
Репутация: 83

Сообщение # 800 | 18:01:49
Miss_Esq, я использовал такой код в CSS:

Отображается во всех браузерах, в т.ч. и IE 9 и 10, а в 7 и 8 нет. Как мне сделать чтобы и в них отображался шрифт?
З.Ы. Чё-то я подумываю забить на 7 и 8, только вот не люблю когда что-то не доделано)))
Сообщение отредактировал Capetr - Воскресенье, 10 Фев 2013, 18:02:32
Miss_Esq
Сообщений: 13859
Репутация: 4159
Уровень замечаний:

Сообщение # 801 | 19:50:43
Capetr,
Цитата
подумываю забить на 7 и 8,
На 7 то можно, вот только не настолько крив что бы не отображать загружаемые шрифты, пробовали с ним должно работать, проблема может быть только в формате шрифта .. А 8 просто должен отображать без проблем ..

defenz-
Сообщений: 5
Репутация: 0

Сообщение # 802 | 21:26:17
Всем привет.Кто может подсказать почему именно только в бразере "Opera" под гостем фон белых,а в профиле фон стоит нормально.В других браузерах проверял все нормально. Если что сайт http://www.codghk.ru/

Russian Call of Duty Community http://codghk.ru/
KaiLee
Сообщений: 5463
Репутация: 1135

Сообщение # 803 | 22:49:18
defenz-,
Добавте св-во overflow:hidden в стили body.

В ЛС - только адреса и пароли. Все остальное - на форуме.
Студия | Шаблоны | Статьи
defenz-
Сообщений: 5
Репутация: 0

Сообщение # 804 | 10:20:29
KaiLee, прокрутка вниз исчезла

Russian Call of Duty Community http://codghk.ru/
Miss_Esq
Сообщений: 13859
Репутация: 4159
Уровень замечаний:

Сообщение # 805 | 11:24:43
defenz-, Doctype попробуйте прописать ...

defenz-
Сообщений: 5
Репутация: 0

Сообщение # 806 | 20:57:09
Miss_Esq, куда именно? (Я точно незнаю)

Russian Call of Duty Community http://codghk.ru/
Miss_Esq
Сообщений: 13859
Репутация: 4159
Уровень замечаний:

Сообщение # 807 | 08:03:44
defenz-, в НАСТРОЙКАХ САЙТА ЕСТЬ ПОЛЕ ДЛЯ ЗНАЧЕНИЯ Doctype, вот туда и вставляйте ..

webmanya
Сообщений: 176
Репутация: 17

Сообщение # 808 | 20:00:55
У меня тоже проблема с IE.
Доктайп прописан, но открывается только шапка.
http://soyuz-pisatelei.ru/
Сообщение отредактировал webmanya - Суббота, 16 Фев 2013, 20:01:55
simkana
Сообщений: 14
Репутация: 0

Сообщение # 809 | 20:34:33
Не подскажите почему у меня неправильно отображается вид материала например этот: http://terabit-10tb.ucoz.ru/load/1-1-0-6,
Белый блок (который снизу) должен быть справа, помогите как это исправить.)
makc33
Сообщений: 3
Репутация: 0

Сообщение # 810 | 22:04:23
[size=11] [size=10]Доброго вечера знатоки и начинающие!

[/size]

[size=10]Подскажите плиз почему не могу войти на сайт как пользователь через кнопку "входа" либо через uID в браузере Mozilla
В остальных браузерах (IE, Opera, Chrome) все норм. http://forexpost.ucoz.ru/
[/size]

[/size]
[/size]

Добавлено (28 Фев 2013, 22:04:23)
---------------------------------------------
мда, в IE вообще невозможно работать wacko еще и ругается, что страница просрочена.

Поиск:
Telegram
Будьте в курсе всех обновлений: подпишитесь на наш официальный Telegram-канал uCoz и задавайте вопросы в чате сообщества!