Кросс-браузерная разработка

Ответ 1

Кросс-браузерная разработка

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

Тем не менее, вы действительно должны создать рабочий процесс, который позволит вам оптимизировать кросс-браузерную совместимость при минимальных затратах труда. Если это означает маленькие итеративные или большие монолитные шаги для вас, то это ваше дело. Но в целом работа с несколькими браузерами во время разработки экономит ваше время, если не время, по крайней мере, серьезную головную боль в день.

Список инструментов/ресурсов, которые я считаю полезными

• Selenium - инструмент для тестирования интерфейса
• IETester позволяет просматривать страницу в разных версиях IE
• Browsershots позволяет просматривать страницы на разных платформах
• Google позволяет вам искать известные и скрытые извращения IE
• IE 6 No More избавляет вас от головной боли, не беспокоясь о доисторическом дерьме, которое называется IE 6
• YUI Graded Browser Support - убедитесь, что вы знаете, на каких браузерах сосредоточиться
• jQuery - кросс-браузерная библиотека JavaScript
• YUI 3: сброс CSS - сброс CSS (ссылка содержит полезную информацию, а также CSS)
• 9 Наиболее распространенных ошибок IE и как их исправить - очень полезные советы о том, как получить максимальную отдачу от бакса, сначала исправив распространенные проблемы.
• Кросс-браузерная разработка содержит множество полезных руководств по кросс-браузерной разработке.

Рекомендации

Альтернативы Selenium/Кросс-браузерное тестирование/Лакмус

Ответ 2

Это не ответит на ваш вопрос, а просто совет, основанный на моем личном опыте.

Когда вы разрабатываете для многих браузеров, лучше всего протестировать одновременно на всех, пока вы кодируете.

Таким образом вам просто придется исправлять небольшие ошибки каждый раз, а не подавлять сложные проблемы с компоновкой.

Ответ 3

Я не знаю ни одного программного обеспечения, которое активно проверяет наличие проблем, но недавно Adobe выпустила BrowserLab, что действительно ускоряет тестирование кросс-браузера.

Ответ 4

Я также рекомендовал бы использовать CSS reset. Таким образом, вы с самого начала получаете множество несоответствий.

Ответ 5

Я занимаюсь кросс-браузерной разработкой, и я действительно не использую никаких предписанных шаблонов, таких как кросс-браузерное тестирование. Вместо этого я использую декоративный узор. Иногда это работает чудесно, иногда это головная боль, но это можно сказать для любого шаблона разработки.

Большая часть моего развития имеет место, в котором браузер я считаю большинством стандартов. Я предпочитаю WebKit для Presto, но оба они обычно являются шеей и шеей для соответствия стандартам. С этими браузерами правильное использование HTML и CSS почти всегда приводит к желаемым результатам. Моим браузером WebKit является Google Chrome. Safari тоже работает, но имейте в виду, что в Mac OS X сглаживание шрифтов имеет тенденцию увеличивать текст. Для обеспечения совместимости с сайтами, разработанными для Safari Mac, Safari Win ободряет шрифты, поэтому это не всегда идеальное изображение вашего сайта.

Blueprint CSS может стать огромной помощью, если вы пытаетесь быстро прототипировать дизайн сайта с несколькими браузерами. Я не уверен, что такая структура всегда необходима, и они также могут влиять на то, как вы структурируете разметку XHTML, а искажение вашей разметки в соответствии с ранее существовавшей иерархией классов не всегда является отличной идеей.

Как только у меня есть дизайн, которым я доволен своим браузером, совместимым со стандартами, я затем украшаю его исправлениями ошибок в других, менее совместимых с стандартами браузерах, используя условные стили или таблицы стилей. Firefox, по крайней мере с версии 3.0, почти никогда не является большой проблемой, но есть способы специально настроить Firefox и даже дифференцировать между Gecko 1.9 и 1.8, используя только CSS. Это хак, технически, поэтому пуристы CSS могут издеваться над кощунством кода, но это надежное, удобное решение. Для ясности и простоты обслуживания я обычно поддерживаю свои исправления Firefox/IE в отдельных таблицах стилей и компилирую их с какой-то серверной стороной script, которую я считаю предпочтительным для условных include-операторов и JavaScript-хаков. Если вы используете кеширование с PHP, это не является существенным узким местом или тратой времени процессора.

IETester является незаменимым инструментом для проверки дизайна во всех разных версиях IE и даже использует надлежащий движок JScript для каждого выпуска, в котором ранее отсутствовали менее надежные решения, такие как MultipleIEs.

В наши дни самая большая проблема с кросс-браузерной разработкой - JavaScript, и jQuery в основном спасет вашу жизнь здесь. Как кто-то, кто поддерживал значительную платформу JavaScript для корпоративного веб-сайта за несколько дней до интерфейса AJAX и JavaScript, поэтому нет ограничений на количество похвалы, которые я могу дать для jQuery/Prototype/ Dojo.

Ответ 6

Когда вы говорите только об использовании div и CSS, я надеюсь, вы не совсем позиционируете все. Это верный способ повредить проекты во многих браузерах. (Как правило, лучше всего использовать поплавки.)

Вы также можете попробовать IE7.js, чтобы исправить кучу проблем с IE 6-7.

В общем, я предлагаю разрабатывать в IE и один из совместимых со стандартами браузеров бок о бок (Firefox/Chrome/Safari/Opera). И постарайтесь как можно упростить как HTML, так и CSS.

Ответ 7

Еще несколько инструментов включают

• Browsera - автоматическое обнаружение проблем с расположением кросс-браузера.
• LitmusApp - скриншоты с тегами пропуска/отказа
• SuperPreview - расширение для Microsoft Expression Web (в настоящее время доступная автономная загрузка), где вы можете просмотреть наложение скриншотов другого браузера.
• Browserlab - расширение для Adobe Dreamweaver (доступно в настоящее время автономно в Интернете), где вы можете просмотреть наложение скриншотов другого браузера.

Я также настоятельно рекомендую использовать CSS reset для запуска, например http://meyerweb.com/eric/tools/css/reset/

Почему? Поскольку многие кросс-браузерные несоответствия связаны с тем, что стиль по умолчанию в браузере отличается. Например, маржа по умолчанию может корректно создавать макет элемента в одном браузере, но не в других.

Может показаться странным всегда быть переопределяющим поведение по умолчанию, потому что это кажется пустой тратой, но абсолютно необходимо для того, чтобы иметь базовый уровень для работы.

Ответ 8

Я бы рекомендовал посмотреть на фреймворк CSS, например BluePrint. Он имеет общий способ создания страниц с использованием сеток, а также имеет некоторые значения по умолчанию для css для форм и т.д.

В ходе их разработки Frameworks рассмотрит многие из этих кросс-браузерных причуд, поэтому это может сэкономить вам много времени.