Firefox против IE против Chrome против Safari
В настоящее время я разрабатываю веб-сайт, и я нахожу его ОЧЕНЬ трудно отображать веб-сайт, совершенный на всех браузерах.
Существуют ли какие-либо правила, предложения и т.д.?
Спасибо
Ответы
Ответ 1
Практически невозможно заставить сайт выглядеть одинаково на всех браузерах и платформах. Причина номер один заключается в том, что шрифты отображаются по-разному в Windows, Mac, Linux, Solaris и т.д.
Есть новая мысль, которую мы придерживаемся: веб-сайтам не обязательно одинаково выглядеть на разных браузерах и платформах. Вы можете легко добираться до 96-98% пути. Остальное потребует от вас чрезмерного усилия для потенциального выигрыша.
Мы начинаем разработку для Firefox. Если мы получим это правильно, остальные браузеры будут очень близки. IE - это очень сложная задача, чтобы получить право большую часть времени. Я рекомендую вам сообщить своему клиенту или вам, что IE 6 больше не является требованием.
Убедитесь, что вы начинаете с правой ноги, используя таблицу стилей CSS reset ", которая выводит на экран общий вывод браузера. Отъезд: http://developer.yahoo.com/yui/reset/
Наконец, сохраните некоторые проблемы и станьте стандартизованными в Javascript-библиотеке, такой как ExtJS или JQuery или Prototype, которые скрывают различия браузера и позволяют сосредоточиться на коде для вашего проекта.
Ответ 2
Разработка стандартов, затем добавление исключений
В настоящее время самым популярным в основном совместимым браузером является Firefox, поэтому разработка Firefox является естественным первым шагом. Используйте W3C, чтобы убедиться, что вы на пути. После того, как ваша страница в основном выполнена, убедитесь, что она по-прежнему выглядит хорошо в Safari и Chrome (также оба высокоуровневых браузера, поэтому вам не должно быть слишком много проблем), а затем закрепите ее для IE (как 6 , так и 7). И поверьте мне, это будет исправлено! Такие сайты, как QuirksMode, могут быть большой помощью, когда приходит время добавлять исключения.
Всегда используйте HTML 4.01 Strict DOCTYPE
Это, вероятно, будет одним из наиболее спорных моментов здесь, поскольку XHTML имеет много сторонников. К сожалению, невозможно хранить файлы XHTML в соответствии с IE-совместимостью и стандартами - IE не распознает типы MIME XHTML, и он нарушает стандарт, который будет служить им как text/html
. Только HTML 4.01 Strict DOCTYPE помещает все браузеры в (почти) режим стандартов, все еще соблюдая стандарты. Для получения дополнительной информации найдите DOCTYPE переключение. Если вы абсолютно не можете обойтись без написания страниц, которые являются хорошо сформированным XML, используйте XSL Transformation, чтобы конвертировать ваши страницы из XML-вкуса ваш выбор в HTML.
Не используйте CSS-хаки
Иногда они могут быть очень заманчивыми, но хаки основаны на побочных эффектах ошибок браузера. Из-за этого может быть трудно-невозможно предсказать, как будущие браузеры будут реагировать на них. Условные комментарии, с другой стороны, являются преднамеренной особенностью браузеров IE и поэтому безопасны в использовании. Фактически, это отличный способ сохранить ваш IE-специфический (и часто не проверяющий) CSS из ваших действительных таблиц стилей.
Не создавать выравниваемые по пикселям макеты
Попытка заставить все браузеры выстраиваться в линию, вплоть до пикселя - это упражнение в расстройстве (и, как правило, бесполезность). Попытайтесь создать макеты, которые по-прежнему выглядят хорошо, когда сбиты, так как легче исправить несоосность между, скажем, двумя левыми границами, чем левое и правое, которые находятся на противоположных сторонах страницы! Использование фонового изображения с встроенными границами должно быть предупреждающим флагом большой!
Не используйте абсолютные размеры для шрифтов
Не каждый использует монитор того же размера, что и вы; вместо установки примечания к font-size: 10px;
, установите его на font-size: smaller;
или font-size: 80%;
. Это большая проблема acessibility.
Не полагайтесь на значения по умолчанию для свойств CSS
Вы никогда не знаете, используют ли все браузеры одинаковые настройки по умолчанию. YUI "reset" таблица стилей - отличное место для начала.
Ответ 3
- Убедитесь, что ваши XHTML и CSS проверены.
- Используйте только стандартный Javascript.
- Тест в одном крупном (не IE) браузере: Firefox или Chrome будут моим предложением.
- Ваш сайт должен выглядеть очень близко в основных (не IE) браузерах
- Испытайте что-нибудь вроде dillo или lynx (или обоих)
- Наконец, начните делать хаки, чтобы сделать работу IE
Ответ 4
Отъезд Browsershots. Он делает скриншоты ваших сайтов с различными браузерами, поэтому вы можете проверить его визуально. Это вроде медленно, но это сработало для меня.
Ответ 5
Вот ответ, который я дал недавно о совершенствовании веб-сайтов в браузерах (от здесь)
Собственно, что вам нужно использовать при разработке веб-приложения:
- FireFox
- IE
- Safari
- (Chrome скоро...)
И я имею в виду, что вы должны тестировать каждый шаг своего веб-сайта на всех 3 основных браузерах класса A... поэтому, если что-то не работает в этом процессе, вы точно будете знать что вызвало перерыв.
Если вы не регулярно проверяете браузеры о том, как ваша страница выходит, будет сложнее решить проблемы позже.
Ответ 6
Многим разработчикам нравится начинать тестирование с FireFox и переходить на IE7. Таким образом, у них есть как самый популярный браузер.
Мне нравится начинать с IE7, чем перейти к FireFox, потому что Firefox имеет этот FireBug, который позволяет мне видеть, что неправильно, и делать коррекцию. Но я должен сказать, что я медленно меняю тест с кулаком FireFox, так как он уважает все правила. (Кстати, FireBug доступен в Javascript для IE, так что отлично).
Конечно, вы должны увидеть, кто является вашей публикой. Если он используется внутри компании, и они используют только IE... выбор прост. Если это больше для разработчика, у вас будет больше пользователей, которые будут использовать FireFox... вы можете протестировать сначала в зависимости от вашей аудитории.
Но, не пытайтесь сделать его идеальным для всех браузеров, вы потратите свое время зря. Просто убедитесь, что все выглядит нормально, и все действия javascript выполнены правильно.
Ответ 7
Я бы предложил определить вашу целевую аудиторию, а затем определить, какой браузер они используют. Как только вы это сделаете, в этом браузере нажмите для достижения совершенства. Теперь вы можете немного поработать и сделать его хорошим для других браузеров.
Ориентация на совершенство во всех браузерах сегодня похожа на просьбу мира во всем мире.
Другой подход, который вы можете предпринять, - использовать инфраструктуру Javascript, такую как jQuery, чтобы облегчить боль.
Ответ 8
Не пытайтесь сделать каждый браузер отображаемым на нем пикселем - это то же самое, что и другие... только вы узнаете! Просто попробуйте сделать это хорошо в каждом браузере.
Ответ 9
-
Вы никогда не получите совершенства, идите
за лучшее, что вы можете получить.
-
Обычно лучше всего использовать
подмножества css, которые работают на всех
браузеров вместо конкретных браузеров
хаки.
-
Для javascript обязательно используйте
javascript framework
(JQuery/Prototype/YUI/Ext/etc), а также
использовать его исключительно для дома
реферирование/манипуляции. Трудно получить это право, и они уже много сделали для вас.
-
Хороший справочный сайт
Ответ 10
Я обнаружил, что использование большего количества CSS вместо таблиц облегчает его получение во всех браузерах. Это все еще немного сложно, но логика табличной компоновки хуже. Используйте таблицы экономно.
О, и получение вещей "растяжимое" всегда является проблемой. Исправлена ширина/высота намного проще.
Ответ 11
Используйте строгий doctype.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Если вы используете ASP.NET, вам следует добавить/изменить это ваш web.config.
<system.web>
<xhtmlConformance mode="Strict"/>
Вы также должны проверить адаптеры, совместимые с css. http://www.asp.net/cssadapters/
Я потратил несколько часов, чтобы мой веб-сайт отображался одинаково во всех браузерах, и это, похоже, работает. Последнее предложение. Часто проверяйте: не делайте слишком много, прежде чем проверять, чтобы все браузер отображал то же самое.
Ответ 12
Разработка для Firefox. Затем примените исправления, специфичные для IE. Надеемся, что это будет сделано в Chrome и Safari.
Причина в том, что существуют исправления, позволяющие IE работать "правильно", но не так много, чтобы заставить Firefox вести себя плохо.
О, и купите копию Transcend CSS.
Ответ 13
Мой подход - это код для браузера Firefox, Opera и других браузеров, отличных от Microsoft. Как только он работает в них, я исправляю функциональность IE в отдельном файле stylesheet/js.
Также я обычно использую JS-библиотеку и CSS-структуру. 9 раз из 10 я использую сетки JQuery и YUI.
Ответ 14
Используйте библиотеку JS, такую как ExtJS. Это абстрагирует специфические для браузера аспекты стилизации.
Неправильно ли это выглядеть по-разному в разных браузерах, если оно четкое и чистое?
Ответ 15
Используйте расширение CSSViewer для Firefox, это может помочь увидеть некоторые исправления, которые вы можете сделать для кода, очень удобного для пользователя.
Используйте CSS-дисплей: блок или отображение: свойства встроенного блока, они полезны для sooo.
Маржа, заполнение, высота и ширина будут вашими друзьями, иногда вам нужно указать эти значения, чтобы увидеть одно и то же на многих браузерах.
Для шрифтов я бы порекомендовал вам читать yahoo yui fonts css stuff.
Ответ 16
Хорошо, лучше всего использовать библиотеки и предварительно написанные коды. Например: никогда не используйте JavaScript, вместо этого используйте JQuery, потому что он совместим со всеми браузерами и вместо того, чтобы писать собственную тему, используйте бесплатные темы css.
Хорошо, он работает для меня и помогает мне сэкономить массу времени. Потому что на профессиональном рынке время означает деньги.
Спасибо.
Ответ 17
Используя строгий doctype, допустимые xhtml/html и действительные CSS - хорошие отправные точки. Кроме того, убедитесь, что вы используете reset/undo.css.
Несмотря на все это, были бы уловы, но очень немногие, хотя
Ответ 18
Сначала я проверяю сайт в FF и т.д., а затем "ремонтирую" сайт, чтобы он выглядел нормально в IE. В основном, если код проверен и чист и прост, IE нуждается только в небольших изменениях. Я использую разные таблицы стилей для IE. Я не рекомендую использовать hacks. Для javascript используйте только одну библиотеку.
И да, браузеры очень помогают.
Ответ 19
IE7 уже не является обязательным требованием. В настоящее время он несет ответственность за свою тревожную безопасность. IE8 должен поддерживать большую часть того, что делают другие браузеры, а биты - нет, не имеет значения. Опыт будет деградирован, но если вы используете IE в первую очередь, у вас все равно нет вкуса.