Рубрики
CSS переводы

Нужно ли использовать вендорные префиксы для border-radius или box-shadow?

Если коротко:

Относительно border-radius и box-shadow скорее нет, чем да.

Когда префиксы могут понадобиться:

  1. В редких ситуациях когда квадратные углы или отсутствие теней сильно вредит UX (User Experience).
  2. Если значительная доля трафика на вашем сайте — это пользователи, использующие Firefox версии ниже 3.6, Safari версии ниже 4, iOS версии ниже 3.2 или Android ниже 2.3.

А теперь развернутый ответ:

Рассмотрим вопрос получше. Во-первых, вы можете посмотреть какие браузеры какие правила поддерживают используя сервис Can I use….

Во-вторых, единственным весомым аргументом за или против использование вендорных префиксов должна быть статистика посещений сайта, относительно которого принимается решение. Если большая доля посещений вашего сайта происходит через старые браузеры — используйте префиксы.

border-radius

Для Firefox версий ниже 3.6 нужно использовать префикс -moz-. Версии 4 и старше в префиксе не нуждаются.

Для Safari версий ниже 4 нужно использовать префикс -webkit-.

iOS 3.x тоже нуждается в префиксе -webkit-. iOS 3.x используется в устройствах iPhone 3GS или iPad 1, которые не обновлялись.

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

box-shadow

Ситуация с box-shadow похожа на ситуацию с border-radius, но имеет некоторые отличия. Те же правила в отношении Firefox и iOS. Но Safari нужен префикс -webkit- вплоть до версии 5. В версии 5.1 (идущей в комплекте с OS X 10.7) префикс не нужен. Основное отличие от border-radius в том, что для устройств с Android 2.3 нужен префикс -webkit-.

Хотя, в большинстве случаев, отсутствие тени не критично, ситуация на вашем сайте может кардинально отличаться.

Ссылка на оригинальную статью