电脑显示器有很多种尺寸，常见的有：1366px(宽度)、1980px(宽度)，高级点，还有 2k 屏、4k 屏、5k 屏。如果再考虑平板和手机的话，就更多了。

远古时期，大多数网站是不会考虑这个问题的，一般只会对特别流行的一个尺寸进行设计。这时候，屏幕特别小，或者特别大时，看着就很不舒服。为了照顾小屏幕、高分屏(高分辨率屏)，就有人提出来“响应式”这种概念。笼统来讲，使不同尺寸、分辨率的屏幕，都能呈现出较好的效果，就是响应式布局。

今天我们来介绍一些需要重点关注的内容，减少企业在后期制作响应式网站的试错成本。

1、注重实践性 

在竞争日趋激烈的今天，企业对网络市场地位的争夺越来越重视，他们可以通过网站推广自己的品牌，一些品牌通过网站在全球推广，公司的声望会大大提高。

一个响应式的网站也必须包括许多内容。从网站上来说，必须丰富公司的内容，包括公司的历史、品牌力量和产品，当然还有售后服务渠道。

2、采用响应式图片或视频

为了使网站兼容不同大小的屏幕，做响应式图片或视频是重中之重。固定宽度的图片在不同大小的屏幕中会出现显示不全或者两边留白的问题，以及模糊或失真的情况。响应式图片可以自适应不同屏幕大小的设备，我们可以给图片设置相关属性，或使用支持响应式的框架（如Bootstrap、CSS Sprites等等），用响应式图片的class名称来进行控制（如class=”image-responsive”）。在网站中也可以使用SVG矢量图，它可以在不降低清晰度的情况下进行任意缩放。对于响应式视频，可以插入FitVids或jQuery插件实现视频的自动缩放。

3、私密信息维护 

在一般情况下，对于一些网站，如果我们登录了网站，就必须登记个人信息，在这个时候，公司将负有很大的责任，必须负责维护客户的隐私。尤其对于一些网上购物平台，在购买时，一定要确保交易的安全性，所以要做好网站的安全防护。

响应式网站建设应该以用户体验为基础，所以一定要在网站开发前做一个市场调研，根据人们的需要建立网站。为了避免对顾客产生误解，在各方面都造成不便，必须在网站上公布一些极好的信息，从而使网站在业务流程中更加受欢迎。

4、设置关键断点

为了让响应式外贸网站在不同的尺寸下改变整体布局，需要设置断点或响应点。由于响应式网站需要适应各种不同大小的设备屏幕，因此需要结合站点内容设置关键点，注意网站内容的有效传递。一般来说，可以设置320 – 720 – 1024这三个关键断点，但断点设置没有确定的规则，还是要结合自身的需求以及用户群体的情况因地制宜来规划和实现。

5、优先进行手机端设计

在确定好网站整体框架、元素信息以及设计风格之后，可以先对手机端进行设计。这是由于手机端屏幕小，更能帮助你筛选出重要的元素。对于响应式网站，如果你先做PC端的设计，那么再转向手机端时，对于网站元素的选择就会比较困难。在网站设计的过程中，尽量避免使用大图，图片的大小需要在手机端进行良好的显示，并可以进行缩放；做垂直滚动，并把网页的主目录放在较为显眼的位置；把搜索栏、主操作按钮放在较为醒目的位置，图标的大小要适中，方便用户点击。