自从iOS设备上的Retina显示器首次发布以来已经有一段时间了，但仍然有很多网站没有Retina准备就绪，即使设计师和开发人员已经熟悉完全响应的移动设备的事实友好的世界。
以下是您需要了解的有关使您的工作在日益普遍的Retina显示屏上看起来最佳的选项。好消息是，尽管看起来令人生畏，但实际上并没有那么复杂。
$config[code] not found为Retina-Ready图像准备您的网站
加倍你的乐趣
实际上，你可以通过多种方式为这只猫提供皮肤。首先，你需要稍微提高你的CSS，并将你的图像版本加到正常分辨率的两倍。 CSS将根据您的网站正在查看的设备确定要显示的图像。
您需要的CSS更新将根据您的目标浏览器而有所不同，但好消息是它现在并不是非常复杂，并且变得越来越容易。我们将实际编码留到另一天。
要记住的一件事是：您可能希望为视网膜图像开发命名约定，以便您可以轻松关联图像的两个版本，以备日后需要编辑时使用。
SVG
另一种方法是SVG或可缩放矢量图形。顾名思义，这些仅限于矢量图形，不适用于摄影图像，但SVG图形无需为您网站上的每个图形提供两个图像文件。同样，浏览器与浏览器之间存在差异，因此您需要根据需要进行其他研究。
如上所述，除非网站不包含照片类型的图像，否则SVG可能无法作为大多数网站上的唯一解决方案。
蛮力
当然，您也可以简单地转储低分辨率文件，然后只提供Retina-ready图像。我们只推荐用于定义非常严格的用户。如果您知道带宽不是问题，这可能是正确的路线，但它肯定不是最佳做法
其他编码解决方案
在努力和优雅频谱的另一端是依赖于一些服务器端更改（如.htaccess文件条目）以及PHP和Javascript编码的编码方法。
这可能是您最好的方法，尽管所涉及的工作可能不适合小型项目。
总的来说，您采取的方法取决于您的受众，您网站的视觉效果以及您的开发团队的技术专业水平。对于几乎所有情况都有一个很好的解决方案。唯一不好的解决方案是完全忽略Retina显示器。
纳斯达克照片来自Shutterstock
