如果你目前还没有注意到，我可以小声的告诉你，网站设计正逐步走向高清。从图像到背景图再到用户界面的任何一种元素，高分辨率是新的硬性指标。
它因为一些类视网膜的高清晰度屏幕而兴起以及发展，但连接速度促使访问更快也强调这一现象，高清的网页设计可以从任何设备提供更高的访问以及用户体验。你现在可能会思考什么程度的清晰度在网站设计上算是高清晰呢？这里有几个点你需要考虑一下。
1.什么是真正的高清
HD最常见的专业术语是视网膜显示技术。苹果设备的普及是这个技术为人所知，这个术语已经成为高分辨率屏幕的代名词。这涉及到一些比较特殊的设备技术。
Paula Borowska for Designmodo有一个最容易理解的描述：
· 设备像素是显示的最小物理单位；
· 像素密度是给定空间中显示的像素数；
· 分辨率是可视空间的整个宽度或高度上的像素数；
· 每英寸像素，称为ppi或dpi，是指将显示器的物理宽度除以显示的水平像素数时获得的像素数；
· 高DPI是每英寸或更大的200像素的显示密度。
今天你从手机到平板电脑再到笔记本电脑等大部分的数码设备都可能具有高清晰度的显示（事实是，即使你的设备没有高清显示，拥有高清晰度的网站也不会因此而受到任何影响）。
2.图片
当提到高清晰度的时候，你可能首先想到的是图片。600像素72ppi的图像时代已经过去了。
高清的基本标准现在是200 ppi。这可能是你以前保存的图像的两倍多。事实上，目前我们普遍使用的在1920至1080之间的分辨率，屏幕也越来越大。根据W3Schools.com的统计数据，最常见的屏幕是1024×768像素或更高，超过30％的用户在高分辨率屏幕上工作。
小屏幕也是如此。iPhone 6（401 ppi）和三星Galaxy S5（577 ppi）等受欢迎的设备也拥有高清的屏幕显示功能。
所以当涉及到图像时，它们必须足够的清晰。你不会想使用模糊或过于像素化的图像。不过，使用高清图像的缺点就是速度，更高的质量需要更长的加载时间，这就意味着你可能需要更多的在质量和速度之间选择。
教你一个有趣的窍门：如果你担心加载时间过长，那么你可以在那些大的图片上使用模糊处理的流行趋势，这样可以使大图的数据读取更快，以此来节约一些加载的时间。虽然牺牲了大图的清晰度，但是你可以通过网页设计中的其他较小的高分辨率元素中获得所需的清晰度。
3.视频
视频是2016年网页设计中必备的视觉趋势。它几乎无处不在。不过，就像图像一样，它需要高品质。
对于大多数设计师和网站设计来说，这意味着你需要坚持一个相当短的循环视频，以防止加载过慢。其他人选择使用更长的视频，但他们会通过使用加载动画来分散用户等待过程的注意力。高质量的视频需要高质量的录制，压缩和保存。
当涉及视频播放和查看网站设计时，还需要进行大量的规划。例如，全屏主视觉视频需要水平拍摄，以便使它更适合屏幕的宽高比。为了方便使用，简单的视频编辑器将帮助你根据纵横比调整帧。选择16：9的宽屏幕感觉或4：3更方形的外观。
教你一个有趣的窍门：使用“静止视频”来实现高戏剧效果。这是一个想法：画面中的大多元素是静态的，只是在其中一小部分添加一点点的运动，将得到一个很酷的用户体验。
4.矢量插图和背景
当涉及到矢量插图或背景时，细节就显得很重要了。专注于制作几何像素的完美网页设计，并且在放大或缩小时都不至于分崩离析。最简单的方法就是关注简单性。
请记住，每个细节（或缺乏）在高清晰度空间都是可见的，所以你需要确保设计的每个部分都有助于整体的审美。
虽然很容易被陷入创作一个复杂的插图或纹理的背景，但其实简单可能是最好的选择。如果你想添加更多的兴趣点，可以考虑将小型动画元素作为设计的一部分，或者使用比通常使用的更大的颜色选项来调整它。
教你一个有趣的窍门：在一个循环的背景上添加一些动画。快速浏览的用户可能会错过它，但是对于那些有意的客户来说，肯定会让它们感到惊喜。
5.图标和元素
当涉及到你网站设计中的所有图标和用户界面元素时，你需要知道六个字母：SVG和CSS。所有这些元素都可能被归类为这两种类型之一。
SVG，或称之为可扩展矢量图形是网络的基本。你可以使用SVG来保存形状，图标和大量其他用户界面元素。图像由浏览器读取（不过在那些低版本的浏览器中可能不工作），作为文本和HTML以非常相似的方式呈现。
CSS元素是纯代码元素，并且能够自由缩放，完全按照设计稿上面的要求和样式（你可能不需要在Photoshop中绘制按钮并将它们粘贴到你的网站中）。
这是关于SVG和CSS的共同的特性：元素与你的网站一起变化。这是你在响应框架中需要的。没有什么比一堆像素化的按钮更能毁灭你的高清网页设计了。
总结
高分辨率会将你的网页设计与所有不是高分辨率的设计分开。用户开始期望从电视、电脑或手机的每个屏幕上都有高清体验。你的网站设计需要符合这些期望。
好消息是，你可以在实现这个目标的道路上做一些小小的改动。注意你的图像，视频和其他用户界面元素，以确保你网站设计的视觉都是无缝和高品质的。
----图文来自：design shack