1. 选择您的Web设计方法

有几个解决方案可以用来创建一个移动友好的网站。虽然每种web设计方法都有自己的追随者，他们会告诉您这是最好的，但是您应该根据自己对信息的考虑来确定哪种方法适合您的需求。

响应网页设计

响应式web设计(RWD)通过使用基于比例的媒体、扩展和后端网格实现了可适应的布局。这意味着如果浏览器窗口被扩展或收缩，内容将跟随它并根据需要进行调整。结果是一个网站在桌面和移动端看起来都很相似。

这种塑料用户界面经常被比作水。你可以把一杯水倒进玻璃杯、罐子或罐子里，尽管换了容器，水的体积还是一样的。

自适应网页设计

与RWD不同，adaptive web design (AWD)不依赖于单个更改的布局。相反，它对不同的设备和屏幕大小使用不同的布局。这意味着，当您登录到一个网站时，您将看到最适合您当前使用的设备的页面。

2. 使用网站建设者或CMS

一旦你决定了你希望你的网站如何在不同的设备上运行，你就可以开始构建它了!您创建站点的平台对于使用移动设计计划很有帮助。对于基本用户，有两个选项需要考虑。

网站建设者

网站建设者采取所有猜测出的网页设计，并允许您创建一个完全定制和功能丰富的网站在短短几分钟。他们实现了这一点，允许用户选择一个主题或模板，并简单地将他们喜欢的功能拖放到他们的web页面上，并轻松地删除他们不喜欢的功能。

内容管理系统

内容管理系统(CMS)是替代专用网站构建器的最佳选择。 与网站构建器类似，CMS可以利用任何一种移动设计方法，将它们集成到用户可用的多种主题中。这些主题可以和网站建设者的主题一样丰富，但它们更适合那些不介意弄脏自己的双手，学习一点网页设计的人。

设计手机网站

在决定你将建立你的网站在什么平台上，你准备好设计和创建你的网站。无论您是创建博客、作品集、商业站点，还是电子商务商店，您都可以使用任何站点设计所需的标准原则来进行。一旦你完成了你的设计，你要么必须简单地测试你的网站，看看它是否正确响应(RWD)，要么创建另一个移动设计(AWD)。

设计一个移动网站几乎和设计一个桌面网站一样简单，但是有一些事情你可能需要记住。

a.移动用户一般带宽有限

您应该始终记住，大多数移动访问者使用的移动网络限制了他们的带宽。因此，让你的手机网站保持轻便，避免过多的内容侵蚀这些关键字节是非常重要的。

b.移动用户需要快速获取相关信息

通常情况下，手机用户访问一个网站是为了获取有关他们访问的地点的相关信息，比如商店营业时间或电话号码。如果这些相关信息不能迅速而清晰地提供，可能会导致客户的流失。确保你的手机网站有联系方式和其他相关数据的快速链接。

c.移动设备功能较弱

台式机和笔记本电脑是用显卡和处理器构建的，能够处理高负载。虽然移动设备非常强大，但它们的构建方式不同。相反，它们丧失了表单的功能，因此无法像计算机那样处理大量处理器内容。

如果您的桌面站点需要这种资源投入，那么在为移动用户提供这种类型的站点时，您可能需要三思。

4. 组织内容

在创建移动站点时，确保用户能够访问桌面站点上的所有内容，同时仍然能够在较小的屏幕上工作，这一点非常重要。在组织内容时，您应该记住以下几个注意事项。

手机第一

Mobile First是设计界的最新动向之一。它规定，在扩展到桌面和平板电脑页面之前，您需要首先设计您的移动站点。您为移动站点创建的内容也可以加载到桌面版本。

因此，这种方法对于动态服务和响应性网站很有帮助，因为在这些网站上，移动版本上的内容与桌面站点上的内容相同。

移动第二

如果你已经有一个桌面网站，组织内容可能会有点困难，虽然不是完全不可能。首先，找出需要在移动版本上显示的桌面站点元素。

通过标准的分析工具收集用户数据，你会发现:

对访问者来说最重要的内容。

手机用户往往会忽略什么。

你的访客通常选择的路径。

利用你收集到的信息，你可以知道在手机网站上什么应该做，什么不应该做。这将帮助您清理桌面站点。然后，绘制出您的访问者将要访问的内容路径。

当你对你的网站的视觉流程有了一个好的想法后，你可以很容易地为移动屏幕设计出最初的设计，然后直接进入移动网站开发。

导航

手机屏幕很小。这意味着您应该最小化移动导航选项。考虑使用放大镜或三线菜单导航图标。一旦你完成了，在90%的手机用户使用的流行设备上测试你的网站。

触觉设计

由于无法在移动设备上用手指右键单击或悬停，因此需要在移动网站上留出链接空间，以确保用户不会意外地单击错误的链接。