给网页设计师的移动端网页设计简明指南
网站设计知识：网页设计中手机端的优化与设计技巧
网站设计知识：网页设计中手机端的优化与设计技巧随着移动互联网的发展和普及，越来越多的用户选择使用手机来浏览网页。
因此，对于网页设计师来说，手机端的优化与设计越来越重要。
本文将介绍一些手机端的优化和设计技巧，以帮助设计师更好地设计出适合手机端的网页。
一、页面布局的优化手机端的屏幕较小，因此页面布局的优化至关重要。
设想一下，如果用户需要在一个页面上来回滑动才能找到需要的信息，这样的体验会让人非常不愉快。
因此，设计师需要在布局上尽量简洁明了，避免过度堆砌元素，同时确保信息易于被找到。
常用的布局有单栏、双栏和三栏布局。
单栏布局适用于简单的网站或页面，双栏布局适用于需要区分左右两侧信息的场合，三栏布局适用于需要突出主体内容的设计。
设计师需要根据不同的需求选择合适的布局方案，以达到最佳的设计效果。
二、字体大小和行距的考虑移动设备屏幕的大小不同，因此字体大小的调整应该根据屏幕的大小来进行。
一般来说，16pt左右的字体大小比较适合手机屏幕。
此外，行距也需要适当调整，以保证文字间的距离足够合适，使得用户能够轻松阅读内容。
在选择字体和行距时，设计师需要避免太细的字体和过小的行距，这样会导致用户看起来很困难，对阅读的体验也会产生负面影响。
三、按钮的设计要注意按钮是用户与网站互动的主要接口之一，因此在手机端中的设计尤为关键。
设计师需要注意以下几点：1、大小和间距：按钮的大小不应过大或过小，而是应该根据设计的风格和设备屏幕的大小来进行适当调整。
间距也需要适当调整，保证用户可以轻松的点击按钮。
2、显示状态：在手机端的界面中，按钮可视化的说明了用户在该部分可以执行的操作，因此按钮的状态要十分清晰。
一般来说，按钮通常分为两种状态：可点击状态和不可点击状态。
3、样式：选择合适的按钮样式能够让用户快速了解到该按钮的操作意义。
因此，根据不同的场景和操作需要选择合理的样式。
四、图像素材的设计移动设备的屏幕尺寸有限，因此在设计移动端网站时，图像显示的大小也需要相应地进行适当调整，以保证图像的清晰度和显示效果。
网页设计指南模板
网页设计指南模板I. 引言网页设计是当今互联网时代不可或缺的重要环节。
一个好的网页设计可以提升用户体验、增加用户黏度、提高网站的访问量。
本文将为您提供一份网页设计指南模板，帮助您规划和实施一个用户友好、吸引人的网页设计。
II. 目标用户分析在开始网页设计之前，第一步是进行目标用户分析。
通过了解目标用户的特点、喜好和需求，可以针对性地制定设计方案。
在这一章节中，我们将分析目标用户的关键特征，如：1. 年龄段2. 性别比例3. 教育背景4. 兴趣爱好5. 使用设备和浏览器偏好III. 网页结构规划一个良好的网页结构可以帮助用户快速找到所需信息，并提高网页的可读性和可访问性。
在这一章节中，我们将讨论以下内容：1. 主导航栏的设计，包括位置、样式和功能2. 内容布局规划，如头部、主体和底部设计3. 页面间的导航结构，包括面包屑导航和侧边栏设计IV. 色彩和视觉设计色彩和视觉设计是网页吸引用户的重要因素之一。
在这一章节中，我们将讨论以下内容：1. 色彩搭配的原则和技巧2. 字体选择和排版规范3. 图片、图标和视频的使用建议4. 网页的整体风格和风格指南V. 交互设计交互设计是用户体验的核心，它关注用户与网页的互动方式。
在这一章节中，我们将讨论以下内容：1. 网页导航和链接设计2. 表单设计和输入验证规范3. 页面加载速度的优化建议4. 动画和过渡效果的运用VI. 响应式设计和移动优化在移动设备的普及和多样化需求的背景下，响应式设计和移动优化成为了必不可少的网页设计要素。
在这一章节中，我们将讨论以下内容：1. 响应式设计的原则和方法2. 移动优化的设计策略3. 移动设备上的手势和交互设计VII. 用户测试和优化最后一步是对网页设计进行用户测试并不断进行优化改进。
在这一章节中，我们将讨论以下内容：1. 用户测试的方法和步骤2. 数据分析和用户反馈的利用3. 根据测试结果进行优化和改进的策略VIII. 结论本文为您提供了一个网页设计指南模板，包括目标用户分析、网页结构规划、色彩和视觉设计、交互设计、响应式设计和移动优化以及用户测试和优化等方面的内容。
移动端设计指南
STYLE GUIDE 20146
TGIDEAS移动端页面设计规范
次要按钮
次要按钮一般跟随其相关的主要按钮，让画面轻量化
一些次要的按钮，一般用文字链或者线框的按钮来展示，如果次要按钮在两个以上 采用文字链为佳，如果只有一个则选线框的按钮为佳。 次要按钮弱化可以让注意力集中在其相邻的按钮身上。
正常态： 按压态： 不可用：
STYLE GUIDE 2016
TGIDEAS移动端页面设计规范
适配剩下35%尺寸
让设计稿在178:100的比例中显示最佳状态，在其他尺寸尽量信息完整
保证设计稿在178:100的比例中显示最佳状态，在其他尺寸中通过元素自定义布局的设置，保证 信息可以露出完整。 手游目标用户的机型通常要求较高，大多数属于主流机型。 考虑到目标用户为游戏玩家，对设备要求较高，故而舍弃过去兼容到4s的尺寸，也更加便于设计师的发挥。
TGIDEAS移动端页面设计规范
正文标题与内容
STYLE GUIDE 2016
TGIDEAS移动端页面设计规范
字体的选择
ios 系统
默认中文字体是苹方体 默认英文字体是Helvetica 默认数字字体是HelveticaNeue 无微软雅黑字体
android 系统
默认中文字体是Droidsansfallback 默认英文和数字字体是Droid Sans 无微软雅黑字体 winphone 系统 无微软雅黑字体
有一些案例，以上都比较常见——匹配内、外半径，缩放原始形状的尺寸，并增加在边界和 原来的内半径在一起。后者是迄今为止最好的表现方法， 一致的轮廓让整体视觉更舒服。
STYLE GUIDE 2016
TGIDEAS移动端页面设计规范
按钮指令
移动端网页策划书3篇
移动端网页策划书3篇篇一移动端网页策划书一、引言随着移动互联网的普及，移动端网页的需求越来越大。
为了满足用户的需求，提高用户体验，我们计划开发一款具有特色的移动端网页。
二、目标受众我们的目标受众是使用智能手机和平板电脑浏览网页的用户。
三、主要功能1. 信息展示：展示公司的产品、服务、新闻等信息。
2. 在线购买：提供在线购买产品的功能。
3. 客户服务：提供客户服务的联系方式，如电话、在线客服等。
4. 社交分享：方便用户分享网页内容到社交媒体上。
5. 定位服务：根据用户的地理位置提供周边服务信息。
四、设计原则1. 简洁明了：页面布局要简洁，避免过多的元素和复杂的设计。
2. 易于操作：操作流程要简单，易于用户上手。
4. 视觉美感：注重页面的视觉美感，提高用户的阅读体验。
五、技术实现1. 前端开发：采用 HTML5、CSS3、JavaScript 等前端技术，实现页面的布局和交互效果。
2. 后端开发：采用服务器端语言（如 Python、Java 等）和数据库（如 MySQL、MongoDB 等），实现数据的存储和处理。
3. 接口设计：设计 API，方便前端与后端的数据交互。
4. 优化方案：采用缓存、压缩、异步加载等技术，提高页面的加载速度。
六、项目进度1. 需求分析：[具体时间]2. 设计开发：[具体时间]3. 测试修复：[具体时间]4. 上线发布：[具体时间]七、预算和资源1. 预算：[具体金额]2. 人力资源：[具体人数]3. 设备资源：[具体设备]八、风险评估1. 技术风险：技术实现过程中可能遇到的问题，如兼容性、性能等。
2. 时间风险：项目进度可能延迟，导致无法按时上线。
3. 市场风险：市场需求的变化，可能影响产品的推广。
九、结论篇二移动端网页策划书一、引言随着移动互联网的普及，移动端网页的需求越来越大。
为了满足用户需求，提高用户体验，我们计划开发一款具有创新性和实用性的移动端网页。
本策划书将详细阐述该网页的策划方案，包括目标用户、功能需求、设计风格、技术实现等方面。
网页设计制作全流程指南
网页设计制作全流程指南 第1章 网页设计基础 ..................................................................................................................... 4 1.1 网页设计概述 ................................................................................................................... 4 1.2 设计原则与规范 ............................................................................................................... 4 1.3 设计工具与技术 ............................................................................................................... 5 第2章 需求分析 ............................................................................................................................. 5 2.1 项目背景与目标 ............................................................................................................... 5 2.1.1 项目背景 ....................................................................................................................... 5 2.1.2 项目目标 ....................................................................................................................... 6 2.2 用户研究 ........................................................................................................................... 6 2.2.1 用户群体分析 ............................................................................................................... 6 2.2.2 用户需求分析 ............................................................................................................... 6 2.2.3 用户行为研究 ............................................................................................................... 6 2.3 竞品分析 ........................................................................................................................... 6 2.3.1 竞品选取 ....................................................................................................................... 6 2.3.2 竞品优势分析 ............................................................................................................... 6 2.3.3 竞品不足分析 ............................................................................................................... 7 2.4 功能与内容规划 ............................................................................................................... 7 2.4.1 功能规划 ....................................................................................................................... 7 2.4.2 内容规划 ....................................................................................................................... 7 第3章 网页结构设计 ..................................................................................................................... 7 3.1 网站架构规划 ................................................................................................................... 7 3.1.1 确定网站类型 ............................................................................................................... 7 3.1.2 确定网站规模 ............................................................................................................... 7 3.1.3 确定网站结构 ............................................................................................................... 8 3.1.4 规划网站内容 ............................................................................................................... 8 3.2 导航设计 ........................................................................................................................... 8 3.2.1 导航分类 ....................................................................................................................... 8 3.2.2 导航布局 ....................................................................................................................... 8 3.2.3 导航样式 ....................................................................................................................... 8 3.2.4 导航交互 ....................................................................................................................... 8 3.3 页面布局设计 ................................................................................................................... 8 3.3.1 确定布局类型 ............................................................................................................... 8 3.3.2 分区规划 ....................................................................................................................... 8 3.3.3 间距和边距 ................................................................................................................... 8 3.3.4 响应式设计 ................................................................................................................... 9 3.4 交互设计 ........................................................................................................................... 9 3.4.1 表单交互 ....................................................................................................................... 9 3.4.2 交互 ............................................................................................................................... 9 3.4.3 按钮交互 ....................................................................................................................... 9 3.4.4 动效设计 ....................................................................................................................... 9 第4章 网页视觉设计 ..................................................................................................................... 9
如何使用HTML和CSS设计用于移动设备的网站
如何使用HTML和CSS设计用于移动设备的网站第一章：移动设备的网络使用现状移动设备已经成为人们日常生活中不可或缺的一部分，越来越多的人使用移动设备上网浏览信息、购物，因此设计适用于移动设备的网站也变得非常重要。
本章将介绍移动设备的网络使用现状，以及为何需要设计适用于移动设备的网站。
1.1 移动设备的普及近年来，移动设备的普及率大幅度增加。
根据数据统计，全球移动设备用户数量在不断增长，超过了传统电脑用户数量。
人们使用移动设备进行各种活动，从社交媒体到网上购物，移动设备已经成为其主要工具之一。
1.2 移动设备上网的特点与传统电脑相比，移动设备上网有一些特点，如屏幕尺寸小、网络速度慢、操作方式不同等。
这些特点需要我们在设计网站时进行特殊考虑，以提供更好的用户体验。
第二章：适用于移动设备的网站设计原则在设计适用于移动设备的网站时，需要遵循一些原则以确保用户体验优秀。
本章将介绍适用于移动设备的网站设计原则。
2.1 响应式设计响应式设计是一种可自动适应不同屏幕尺寸和设备的网站设计方法。
通过使用HTML和CSS实现响应式设计，网站可以在不同设备上呈现出最佳的布局和内容显示效果。
2.2 现代化设计移动设备用户对网站设计的要求越来越高，因此采用现代化的设计元素是必不可少的。
通过使用HTML5和CSS3的新特性，如动画效果、过渡效果和阴影效果，可以使网站更加吸引人眼球。
2.3 简化内容和导航由于移动设备屏幕尺寸有限，网站的内容和导航需要进行简化。
减少冗余内容和使用清晰简洁的导航结构，可以提高用户的浏览效率和体验。
2.4 快速加载速度移动设备上网的用户往往对网页加载速度要求高，因此我们需要尽可能减少网页的加载时间。
通过压缩文件大小、优化图片和减少HTTP请求等方法，可以有效提高网页的加载速度。
第三章：使用HTML设计移动设备网站HTML是用于构建网页结构的标记语言，我们可以使用它来设计适用于移动设备的网站。
本章将介绍如何使用HTML设计移动设备网站。
优化移动网站的设计方法
优化移动网站的设计方法 随着移动设备的普及，越来越多的用户选择通过手机或平板电脑浏览网站。因此，移动网站的设计变得越来越重要。如何优化移动网站的设计方法，提升用户体验，是每一个网站设计师和开发者必须思考的问题。
一、响应式设计 响应式设计是移动网站设计的一个重要方法，即根据用户设备的屏幕大小和分辨率，自动调整网站的布局和内容。通过响应式设计，可以使网站在不同设备上的展示效果达到最佳，使用户无论在手机、平板或电脑上浏览网站都能够顺畅地体验。
为了实现响应式设计，可以采用栅格系统。栅格系统是将网页的布局划分成一些等宽的列和行，以达到适应不同设备的屏幕大小和分辨率的目的。通过栅格系统，可以将页面划分成权重更小的区域，以适应不同设备上的显示。同时，栅格系统还可以帮助设计师更好地组织页面，并使页面更加简洁。
二、简化导航结构 在移动设备上浏览网站时，用户往往是用手指滑动屏幕来浏览和点击。因此，在设计移动网站时，必须考虑到导航结构的简洁性和易用性。为此，设计师可以使用折叠式或隐藏式菜单，这样可以让导航菜单更加简洁、清晰。折叠式菜单不仅占用屏幕较少的空间，同时也让用户能够更加专注地观察网站内容。
同样，设计师应该尽可能减少页面的跳转。因为，多次页面的跳转会使用户感觉操作不便，导致用户体验下降。为此，设计师应该尽可能将相关的内容都放在同一个页面上，方便用户查看和操作。
三、优化页面加载速度 对于移动网站来说，页面加载速度是一个非常重要的因素。用户往往没有耐心等待网页长时间的加载。为此，设计师应该尽可能减少页面的内容和代码量，优化页面的性能。可以使用压缩工具来压缩CSS、JavaScript和HTML代码。同时，可以使用图片压缩工具来减小图片的大小。同时，为了减少载入时间，应该尽可能使用较小的图片和少量的颜色。 四、优化字体大小 在设计移动网站时，字体大小也是需要优化的。字体大小不仅影响到用户的阅读体验，还与页面的排版有很大的关系。一些字体太小或太大，都可能会使页面看起来比较杂乱，而用户也往往不愿意阅读。设计师应该在设计页面时，尽可能使用明确而可读的字体，并确保字体大小适中。同时，设计师也应该对不同的页面和不同的内容进行适当的字体调整。
网页设计入门指南
网页设计入门指南在当今数字化的时代，网页设计成为了一门极富挑战性和创造性的职业。
每个人都能通过互联网轻松创建自己的网站，但是要将一个网站设计得优雅、吸引人并具有良好的用户体验就需要一些专业的知识和技巧。
本文将为读者提供一个网页设计的入门指南，帮助他们踏入这个令人着迷且充满机遇的领域。
1. 网页设计的基础网页设计涉及到多个学科领域，其中包括视觉设计、用户体验、编程等等。
对于初学者来说，首先要了解基础的HTML和CSS语言，这是网页设计的基础。
HTML是用于创建网页结构和内容的标记语言，而CSS则用于控制网页的样式和布局。
理解这两种语言的运作原理对于网页设计是至关重要的。
2. 视觉设计的重要性视觉设计是网页设计中不可或缺的一部分。
一个好的网页设计应该具有吸引人的界面、清晰的导航和合适的颜色搭配。
在进行视觉设计时要注意以下几点：- 使用一致的配色方案：选择少量明亮的颜色，并在整个网站中保持一致。
这能够给用户一个整体和谐的感觉。
- 注意排版：合理布局文字和图片，使其易于阅读和理解。
选择合适的字体类型和大小。
- 使用高质量的图像：选择高分辨率、清晰的图像，并进行必要的优化以提高加载速度。
3. 用户体验设计的重要性用户体验是一个成功网页设计的关键因素。
一个好的用户体验能够提高用户留存率和转化率。
以下是一些提高用户体验的建议：- 简化导航：确保用户能够轻松找到他们所需的信息，避免使用太多层级的导航菜单。
- 加快页面加载速度：优化网页的加载速度可以提高用户体验。
压缩图片、减少插件和脚本的使用、使用浏览器缓存等方法都可以提高加载速度。
- 响应式设计：确保网页在不同设备上都能够正确显示和操作，提供满足用户需求的响应式布局。
4. 提升网页的交互性交互性是网页设计中必不可少的一部分。
以下是一些提升网页交互性的方法：- 使用动画效果：合理使用动画效果可以吸引用户的注意力，使网页更具吸引力。
- 添加社交分享功能：添加社交分享按钮可以帮助用户将网页内容分享到各大社交平台，提高网站的曝光度。
移动端网页设计的技巧和挑战
移动端网页设计的技巧和挑战在移动互联网时代，越来越多的用户使用移动端设备进行上网，这使得移动端网页设计变得越来越重要。
然而，移动端网页设计与传统网页设计存在很大的不同，需要我们掌握一些技巧和应对一些挑战。
本文将从以下几个方面来探讨移动端网页设计的技巧和挑战。
一、视觉设计方面移动端网页设计需要考虑不同尺寸和分辨率的屏幕，因此需要灵活地调整布局以适应不同设备。
一方面可以采用自适应布局或响应式设计的方式，根据用户设备的不同，呈现不同的页面布局和设计；另一方面可以采用无限滚动的设计，实现更加流畅的浏览体验。
同时，网页设计要注意配色、字体大小和图标等方面，既要满足美观的要求，又要使得用户易于辨认和操作。
二、用户体验方面用户体验是移动端网页设计中的重要因素，好的用户体验可以提高用户的留存和回流率。
因此，网页设计需要考虑以下几个方面：1.界面简洁：移动端屏幕比较小，因此界面需要简洁、易于理解和操作，让用户能够快速找到他们需要的信息和功能。
2.功能齐全：虽然界面要简洁，但是还需要确保功能齐全，可以满足用户的需要。
3.快速加载：移动端设备的网速比较慢，因此需要确保网页的加载速度足够快，避免用户长时间等待。
4.指引导航：由于屏幕较小，需要通过指引导航告诉用户如何操作和使用。
三、技术实现方面移动端网页设计要采用一些新的技术实现，例如HTML5、CSS3和JavaScript等。
同时，还需要注意以下几个方面：1.优化图片：对图片进行压缩和优化，减少文件大小，加快加载速度。
2.避免使用Flash：移动端设备不支持Flash，在网页设计中需要避免使用。
3.测试兼容性：不同的移动端设备和浏览器存在较大差异，在设计完成后需要进行测试以确保兼容性。
四、广告和隐私方面移动端网页中的广告和隐私问题也需要考虑。
在设计中需要避免过多的广告和跟踪用户隐私的行为。
同时需要严格遵守相关法律法规，保护用户的隐私和个人信息安全。
结语：总体来说，移动端网页设计需要考虑到很多因素，需紧跟移动互联网时代的发展，从视觉设计、用户体验、技术实现、广告和隐私等方面进行全面考虑。
移动端界面设计的原则与技巧解析
移动端界面设计的原则与技巧解析移动端界面设计是指用于手机、平板电脑等移动设备上的应用或网页界面设计。
随着移动互联网的快速发展，越来越多的人开始使用移动设备进行日常生活、工作和娱乐，对移动端界面设计的需求也日益增长。
本文将介绍移动端界面设计的几个原则和技巧，帮助设计师们在设计过程中更好地满足用户需求。
一、简洁一致的布局设计移动设备的屏幕相对较小，因此在设计移动端界面时，要保持简洁、一致的布局设计是非常重要的。
首先，要确保界面元素的大小适中，不要过大或过小，以免影响用户的操作体验。
其次，要避免过多的界面元素，只展示必要的内容，避免界面过于拥挤。
最后，要保持布局的一致性，统一使用相同或相似的风格、颜色和字体，使整个界面看起来更加整洁美观。
二、注重可用性和易用性移动设备的操作方式与传统的电脑不同，用户更多地使用手指触摸屏幕进行操作。
因此，在设计移动端界面时，要注重可用性和易用性，使用户能够轻松地完成目标操作。
首先，要提供清晰简洁的导航菜单，方便用户浏览不同的页面或模块。
其次，要注意按钮的大小和间距，确保用户能够准确地点击到目标按钮。
最后，要合理运用手势操作，如滑动、捏放等，提升用户的交互体验。
三、关注用户体验和视觉引导用户体验是移动端界面设计的核心，要关注用户的需求和期望，为用户提供良好的体验。
首先，要借助视觉引导，引导用户进行操作。
例如，使用明亮的颜色或按钮的强调效果来吸引用户的注意力。
其次，要合理安排界面中的元素顺序，根据用户的操作流程进行布局，使用户能够更加直观地理解界面的功能和操作方式。
最后，要注意反馈和提示，及时告知用户操作的结果或下一步的操作流程，增强用户的参与感和满意度。
四、考虑不同设备和屏幕尺寸的适配性移动设备的屏幕尺寸各异，设计师在进行移动端界面设计时要考虑不同设备和屏幕尺寸的适配性。
首先，要采用响应式设计，使界面能够自适应不同屏幕尺寸，确保在不同设备上显示效果良好。
其次，要注意元素的相对位置和缩放比例，避免因屏幕尺寸不同而导致界面错位或比例失调。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
给网页设计师的移动端网页设计简明指南
早在几年前移动端的数据流量就已经超过桌面端了，手机和平板占据主流，而融合两者优势
的巨屏手机更是大行其道。对于现在的设计师而言，真正的第一屏到底是桌面还是移动端
界面，真的很难说了。也许“移动端优先”的说法并不准确，但是“移动端屏幕为主”的说法和实
际状况已经非常接近了。打造优秀的小屏用户体验，已经是当今设计师深入骨髓的本能了。
那么造就优秀的移动端用户体验，最重要的是什么？精细的图片？雅致的图标？还是细致入微的UI
界面？如果你经常浏览移动端网页，你最期待的应该还是无缝而流畅的导航体验。从一个界面流畅
的切换到另一个界面，没有迟滞，没有错位的视觉元素，完整的内容加载，用户对于这样的浏览体
验是欲罢不能的，转化率的提升是显而易见的。
真正优秀的导航体验往往能更好地帮助用户找到他们想要的内容，而不是在有限的屏幕上塞入更多
的信息，精准地在菜单栏里面加入有用的、易用的、主要的条目，才是最明智的选择。
搜索
许多网页的内容非常多，在界面中引入搜索引擎能够帮用户更快地筛选内容。移动端屏幕尺寸的限
制就已经决定了页面能承载的内容有限，无法像桌面端那样来系统而全面的展现信息。
用户期待网站能够提供一个能快速获取精准信息的渠道，撇开漫无目的的浏览，用户通常会有有目
的地找某类文章甚至某篇文章，希望找到某个产品，而搜索引擎可以很快地缩小浏览的范畴。
最好的方案是将搜索功能置于屏幕顶端，无论是移动端网页还是APP，这种设计好处在于它易于
发现，还符合用户日常的浏览习惯。
维基百科的移动端页面自然而然地将搜索框置于页面顶部，这是网站属性所决定的。但是LinkedIn
则将搜索功能置于底部菜单栏当中，这也是某种意义上的固化于界面，这也符合逻辑——毕竟它的
社交属性高于信息搜索。
首页
作为从桌面端继承过来的最主要的意符，首页的小房子图标称得上是约定俗成的存在。当用户看到
这个这个图标的时候通常会很清晰地知道它所代表的含义。
在移动端上，首页的作用被明显放大的，因为在强交互多界面的移动端，首页图标的存在让用户更
高效、更快捷地明白哪里是首页、哪里包含了最主要的内容，他们知道从哪里开始。与此同时，移
动端首页的存在让更多的内容有了承载的核心。
多任务、强交互的移动端还存在一个常见的状况，就是电话、短信、推送无处不在，用户很容易被
各种弹出信息吸引过去，而一旦用户浏览了其他的信息之后，再回到浏览器的时候，网站首页就成
了信息的重要中转了。
Albertson 的移动端页面将首页的图标隐藏在汉堡图标下的侧边栏当中，即使是转型使用无限滚动
界面的Twitter，在设计客户端的时候也习惯性地将首页按钮固化在底部的菜单栏当中。
分享按钮
事到如今，社会化分享已经随着社交媒体的火热发展而成为了用户生活中不可或缺的一部分。移动
端的用户会将看到的、好玩的、有趣的、有用的各种内容、产品分享到不同的平台，分享按钮，必
不可少。
实际上，移动端的分享比桌面端的分享更多、更快也更加深入人心。移动端设备的易用和普及是一
方面，移动端的常见交互模式中，分享也占据着一席之地。这也是为什么，你应当在你的导航或者
菜当中加入分享按钮。
毕竟，吸引用户的内容并不少，并且作为网站的所有者，也是希望不惜一切代价将自己的内容分享
出去，不是么？
相关类别与推荐
电商类和强内容类的网站，内容庞杂，导航中能够容纳的内容有限，所以相关类别和相关推荐就显
得相当实用了。在关键词系统和分类系统足够完善的时候，相关推荐和类别推荐会让用户流连忘返
。
不论是购物还是消费内容的网站，菜当中通常不太需要加入太多的关于我们、联系我们这类链接，
将分类和推荐做好会更好地留住用户。
在JC Penney 和 EB Games 的移动端网页都将在汉堡菜单当中隐藏了分类目录，用户会更加高效
地从分类目录中浏览商品。
选择不多的菜单选项
设计师总想为用户做更多的事情，然而在移动端导航设计这件事情上，通常少总好过多。过多的选
择通常会让用户忙乱，对于日益增长的选择强迫症用户而言更是灾难性的。
桌面端网页堆积如山的内容已经让用户烦躁无比了，移动端上再沿袭这个思路，用户是难于接受的
。不管你愿不愿意承认，现在的用户可用的时间更加碎片化，信息只有更加快捷直接的呈现，才能
被注意、被关注。深思熟虑和精挑细选是移动端网页的取胜之道。
作者@MARC SCHENKER
译者@陈子木 来源@优设网
文章链接：http://www.uisdc.com/perfecting-navigation-for-mobile-web
原文链接：webdesignerdepot
人人都是产品经理（woshipm.com）中国最大最活跃的产品经理学习、交流、分享平台