Как получить готовую сетчатку?

Question

Что мне нужно сделать, чтобы мои веб-приложения / сайты были готовы к работе с сетчаткой (на iPhone4 и iPad3), когда дело доходит до

• видео
• изображений
• шрифты
• цвета?

Я ищу контрольный список здесь.

Answer 1

Если вы используете Rails 3.1+, вы можете использовать мой гем clear_eyes для автоматической обработки изображений сетчатки.

Цвета и шрифты не будут нуждаться в корректировке. Например, кнопка CSS не требует каких-либо настроек, только изображения и, возможно, видео.

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

Answer 2

Smashing Magazine: на пути к сетчатке (в основном о графике)

Answer 3

Для изображения:

<script>if(window.devicePixelRatio>1)document.getElementsByTagName("img")[0].src="retina.png"</script>

для фона:

<style>
  @media screen and (-moz-min-device-pixel-ratio: 2),
    screen and (-o-min-device-pixel-ratio: 2/1), 
    screen and (-webkit-min-device-pixel-ratio: 2), 
    screen and (min-device-pixel-ratio: 2){

      h1{background-image:url(retina.png)}

  }
</style>