设计相关 -m6米乐app登录

我保证这是一篇对你有启发的文章，就像标题一样，我会教会你今后应该怎样设计来讨好你的用户。 大家都知道人与人之间是有眼缘的，也就是所谓的第一印象，而对于我们设计的网站也是如此，用户对我们网站的第一印象可以说是旷日持久的，在最初的几秒钟里，用户就会决定在我们网站是去是留，他们会迅速判断网站是否符合他的胃口。 所以设计的第一印象就显得格外重要，当然有一个细节可能大家都忽视了，那就是访问者的性别，用户有两类：男人和女人，而男人和女人的第一感官是不尽相同的。 男性用户和女性用户经常依据不同的经验来浏览网站，你的站点的外观可以立刻吸引两性之一或两者都被吸引。那么如何有效的吸引不同性别的用户呢? 其实业界早就有了很深层次的研究，并公布了他们的看法，今天在这篇文章里，我们将向您分享这些原则及设计理论。 我将会反复向你灌输：设计是有性别的! bagigia everlovinpress papercutart eclectiquedesigns 一、图像的性别用户在以上网站时看到的第一个设计元素是图像，尤其喜欢看包含人的图像。 为什么这么说呢?(亲切，有归属) 举个最简单的例子，我这篇文章里，banner 图放一张美女，肯定要比放一张小孩或者男人或者老人要更吸引点击。 那么有些情况，我们在设计中不能出现人物的时候，如何来吸引男性女性呢? 别急，我们来试想一下包含更多的无生命物体图像的网站，譬如风景植物神马的。这些图像在性别趋向上其实早被造物主赋予了，你不信? 请看我下面的例子。 配图元素其实也是有性别属性的，我大体分类如下，您可以感受一下是不是如此： * 婴儿，小狗和总体看上去可爱的东西——女性 * 运动和活动——男性 * 绚丽的风景和树木——女性 * 崎岖的风景和地形——男性 * 食品——女性(吃货菇凉们看到这里肯定会心一笑了) * 衣服和鞋子——女性 * 设备和电子——男性 呃，在这方面最经典的案例就是那些情色网站了，图片都是衣着暴露的菇凉和小伙子们，网站也正是靠这些有吸引力的女性或男性图像来吸引着你的访问。 —————————裸露的分割线——————————– 二、字体的性别 khailiew barcampomaha souppeddler cakesweetcake 嗨，同学们，通过第一段的简要介绍，我现在再跟你灌输字体也是有性别的，你会不会觉得容易接收了呢? 的确，字体类型的选择上，同样也可以暗示男性气质或女性气质。 当涉及到性别趋向时，字体性别的辨识怎么来判断呢? 最重要的考虑因素是字体的倾斜度、笔画和细节。 大多数人会迅速地把含有各种曲线和斜线的字体同女性关联起来，包括草书字体和手绘类别。 一个字母的笔画也暗示了性别趋向。相对于粗体，细薄的笔画通常被认为是更轻、更女性化的字形。使用这种技巧，设计师可以分别开发适用于男性和女性的系统字体。 最后，设计师应该看看字体中最细微的部分。衬线字往往有一个男性优势，尤其是那些非常广阔的边缘。另一方面，圆形和弧形边缘的衬线，意味着女性化。 同样的原则也适用于其他笔画和装饰，更多的镶褶边的线条和尾巴、充满泡沫的字体更吸引女性。大家平时注意下不难发现女性的字体风格，尤其是那些出现在网站上的用于婚礼、婴儿用品、工艺品，都倾向于繁重的装饰。块状的风格和鲜明或尖的类型反映了男性格调。 举几个栗子大家感受下 * 陈旧的英文——男性 * 手迹——女性 * 草书——女性 *…

@mr-koki 关于登陆估计大家每天使用的都很频繁了，每次上网都会习惯性登陆下微博，淘宝，邮箱，空间等，在每天进进出出无数门户的时候有谁又曾在密码不错误的情况下停留在 web 登陆页面看一眼呢？下面就谈谈这道不起眼的门。   推荐阅读： 《巧夺天工！20 个「联系m6米乐app登录」的创意页面》 《留住访客！超有趣网站进度条设计》 《站上巨人的肩膀，让我们一起聊聊网页上的微创新》   从公共平台的角度看 用户活跃度是检验产品成功与否的重要指标之一，传统行业的商家极为重视门面的装潢，因为一个好的门面可以聚集人气，招揽更多的顾客。古时候的大户人家院子门口的石狮子或其他的摆件的摆放极为讲究，有一定的风水学说道理，更能彰显主人家的身份地位. 由此可见，“门面’就如人的脸面之于人的形象一样重要，而 web 的登录页面就相当传统的“门面”。 从个人博客的角度看 个人登陆页面一般只有自己会用到，所以别人基本是看不到的，但也不排除像我一样无聊什么都好奇的人存在，什么都想看看，什么都想改改的。那么个人登陆页面的设计就完全是抒发个人情感，体现自身个性的一个地方，你完全不需要在乎它的交互是否友好等问题。你的地盘你做主。 各大网站的 web 登陆 现在越来越多的大型网站把登录和m6米乐app登录首页放在一起设计，由此可见登录页面的重要性，一个出彩的登录界面，将提升产品的品质，赋予产品独特的气质，登录界面也是一个发挥情感化设计，提升用户体验，拉近与用户之间距离的兵家必争之地，本文不谈趋势，不讲交互大道理，不涉及技术，就侃侃用户登录页面的一些设计表现形式。希望这些设计表现手法能给大家带来一些启发和灵感。 优雅大方 如果说 ipad 是介于传统电脑和手机之间的产品，那么 tumblr 则是介于 blog 和 twitter 之间的服务。相比 twitter，它的功能更复杂、内容展示性更强、更加重视多媒体的应用。tumblr 做为轻博客的鼻祖，带来一种全新的视觉体验，安东尼·德·圣 – 埃克苏佩里曾说过，“完美就是多一点则太多，少一点则太少。”tumblr 的登录页面没有过多的视觉干扰，优雅大方，一切元素的存在都是为了用户更好的登录，登录过程非常流畅。 精致的质感表现 icloud 是苹果公司所提供的云端同步服务，用户有 5gb 的免费存储空间。负责 macintosh 用户界面设计的柯戴尔·瑞茨拉夫回忆说：“乔布斯会一个像素一个像素地检查屏幕上的每个细节，确保相关的图像准确对齐。他非常重视细节，细致程度居然达到了像素的层面。如果发现问题，乔布斯就会立即冲着某个工程师大吼起来。”icloud 登录页面的设计继承了苹果公司对细节的苛求, 细致的纹理，微妙的阴影，精致的质感，完美的细节，金属光泽可以随着鼠标指针移动，底部的图标可以随着分辨率的大小自适应，改变排列方式，确保用户的浏览体验。 icloud 给我们上了很好的一课，有句大家都听过却未必做到的话——细节决定成败，丰富的细节可以提升设计的价值，也是判断一个设计高下的一条很重要的标准之一，精致舒适的质感纹理，给用户一种沉浸式，充满惊喜的登录体验，是一种很棒的表现方式。 小清新的插图 在网页设计中，插图非常具有表现力，它与绘画艺术关系密切。所以大部分设计职位，对手绘能力出众者格外青睐，许多表现技法都是借鉴了绘画艺术的表现技法。插画艺术与网页设计的的结合，具有独特的艺术魅力，从而更具表现力。越来越多的设计师，将插画运用到网页设计中来，生动有趣温情的清新插图，能迅速的抓住用户的眼球，让登录界面的更加具有亲和力， 163 邮箱的登录页面就采用了大幅的插图, 小邮差很快唤醒了 80 后等待来信的记忆，有故事的插图与用户建立情感的联系，唤起用户的心灵共鸣，让用户更有归属感。 vimeo…

在之前的文章里，我描述了创新思维过程，有时候这个过程不像你想得那么容易，在各个阶段都可能出现问题。例如，可能很难确切描述客户的愿望，或者你 只是达不到那个灵感闪现的时刻。你的灵感消失了，你不知道该做什么。幸运的是，你完全可能明白为什么遭遇创造力的障碍，并直面它。 首先，这是一个创造思维过程的示意图： 到底什么是创造力的障碍？ 创造力的障碍可以用一个例子来比喻：一条路，通往创造力答案的路艰难并且布满绊脚石。这些绊脚石就是你要达到目标需要躲开的创造力的障碍。你熟悉这些绊脚石并且可以很容易的识别它们，这是跨越它们的关键。 很多高手都经历过创造力的障碍，我们的工作卡壳了，我们撞墙上了。没什么，因为我们在一个错误的时间尝试。——lukas foss 开始，这听起来有点勉强。你需要有意识地学习去理解这些理论并且应用我们讨论的知识。无论如何，经过练习你会无意识地应用我们讨论的知识，从而你的大脑会很自然地预见到创造力的障碍。 四个障碍 一般而言，有四类主要问题可能引起创造力的障碍。 1. 观察的障碍：这些障碍妨碍你看到问题，或理解解决问题需要的信息。 2. 环境障碍：由你的文化或所处环境所引起的问题。（例如：当事人） 3. 感情障碍：这些障碍阻碍你自由地形成或表达你的思想。 4. 智力障碍：政策、信仰或表达造成的问题。 让我们详细讨论下每个障碍。 观察的障碍 我们可能一直在看，但并不总是能看到一切。有时我们遭遇创造力的障碍的一个原因是我们不知道问题到底在哪里，或者不能得到足够的信息以解决问题。 dribbble 上的双筒望远镜 下面的情况可能很熟悉： 1. 难以确定问题 “好的问题定位等于解决了一半问题。”——约翰•杜威 正如创造思维过程“第一眼”所解释的，恰当的界定问题对促进创造力方案的发展很关键。为了避免这种创造力的障碍： 获得大量的建议。了解你的客户想要什么，为什么想要以及他们的目标是谁。了解你的客户，了解他们的产业，了解你的客户的客户。 当心误导性的信息。你的客户可能不是很专业，所以有时难以解释你期望从他们那里得到什么，或他们应该期望从你那里得到什么。交流是避免误导性的信息的关键。 检查再检查。一种不好的倾向是用最少的时间确定客户期望从你那里得到什么以及你有什么可能的m6米乐安卓版下载的解决方案。很多设计师想直接完成想到的第一个m6米乐安卓版下载的解决方案，却在不久后失败了。合理分配时间。这会让你和你的客户都更开心。 注意不要拖延确定问题。如果你考虑的比要求的多，顾客也许会觉得你强加于人。忠于自己的任务，但是必要时要做决定，并敢于尽可能透明地与顾客交流。 换句话说，问题绝不会是“我的客户想要一个新网站”。 一个人想要一个网站是有原因的。要眼光放远，超过最初的问题并构想出一个让你和你的客户都满意的正确完备的概要。 2. 无法从不同视角看问题 很多问题并不只和解决者有关，而是和更多人有关。例如，当你为客户开发一个网站，结果如何不仅事关你和客户，而且事关网站的使用者。好的m6米乐安卓版下载的解决方案符合更多人的利益。 作为设计师或开发者，有时难以从另一个角度看自己的创造。所以在发展过程中，可用性测试极为重要。扩大你的视野很难，而且不是每个人都能做到的。 因此，和别的产业的人一起工作是明智的，或者只是和一个潜在使用者一起，为你的问题想一个可能的m6米乐安卓版下载的解决方案，甚至测试你设计的潜在m6米乐安卓版下载的解决方案。他们给你的是无价之宝。通过共同工作，增加你的视角，提高你的m6米乐安卓版下载的解决方案的质量。 3. 常规知觉 创造力的关键字之一是意外的。我们喜欢符合预期，所以我们看到我们想看到的。常规知觉的问题是它限制你的创造力，所以要尝试摆脱它。 “常规的意义是简化，而不是解决所有多样性的问题——这样或那样的问题——你只有一个大的观点——那就是它。”——奇奴雅•阿齐比 这样说来，常规是很强大的工具。它们简单易懂，普遍适用而且包含一些真理。因此，即使有常规知觉，你也可以有创造力！ 4. 浸润 先把本文放在一边。首先，拿一张纸，并尝试画下你的汽车的仪表。不要借助任何帮助，只靠记忆。画完后离开电脑，过五分钟再回来。 board de dash on dribbble 欢迎回来！现在把你画的和你真正的仪表相比较，或和在谷歌上搜索到的仪表图片相比较。你也许会惊讶于它们是多么的不同，或者说你画的和真正的仪表是多么的不同。这怎么可能呢？ 饱和是这样一种现象：在创造思维过程中，我们收集尽可能多的有用的信息以找到问题的m6米乐安卓版下载的解决方案。但是，饱和自身是个障碍。我们很快获得过量信息，这种情况可能导致难以清晰思考。 这是一种危险的障碍，而且具有两面性。有时我们认为自己有足够的信息，但需要的时候却无法使用它。另一方面，有时我们忽略了太多的信息而无法创造设…

扁平化风格潮流浩浩荡荡，童鞋们周末有时间也来撸一发，学习一下扁平化风格 icon 的设计思路吧。今天分享的教程是教你创建一枚 ios 7 风格的图标，教程不难，熟练的童鞋 30 分钟就可以完成咯。好嘞，教程开始！ 先上效果图： 挺干净的，兴趣大增有没有？那就开始咯。 part 1：打好地基 cttrl n 创建画布，大小为 1024px * 1024px，填充背景色为 #fcf2da。 然后 → 编辑 → 首选项 → 参考线、网格和切片，设置如下： 武器已准备，接下来踏上征程吧！ 先创建一个圆角矩形，大小为 512px*512px，半径 120px，记住左上角是形状哦。 搞定后填充颜色 #c47420，命名“icon base” 添加内阴影，参数如下： 为它做一个长投影效果，创建一个矩形，填充黑色，大小可以自己调整，我是宽 718.22px 和高 732.74px，ctrl t 变换角度。 添加图层样式—— 渐变叠加，参数如图，顺便把不透明度调整为 30%，填充 0% 好了，现在的效果是这样的： part 2：创建笔记本 同样创建圆角矩形，参数如下： 然后复制一层，快捷键“a”来到选择工具，减少 16px，调整高度为 432px。 完成后继续复制一层，依上高度改为 416px，填充颜色改为 #…

步骤 1——尺寸，出血，色彩模式以及分辨率 打开 ps, 然后需要了解一点名片设计的知识，最重要的毫无疑问是尺寸，可参考本国名片设计规则，确定名片尺寸，国内一般是 90mm*54mm（文中说英美国家一般是 3.5 * 2 英寸)。 色彩模式为 cmyk，8 位 16 位 32 位都可以，推荐使用 16 位，但是出于示范目的，本教程使用了 8 位，因为文件大小能小一点。分辨率 300dpi。这样就能使名片清晰可见，符合业内标准。 “出血”科普： 出血也是一种印刷业的术语。纸质印刷品所谓的“出血”是指，超出版心部分印刷。版心是在排版过程中统一确定的文图所在的区域，上下左右都会留白（如 word 的四方页边距就是留白），但是在纸质印刷品中，有时为了取得较好的视觉效果，会把文字或图片（大部分是图片）超出版心范围，覆盖到页面边缘，称为“出血图”。——百度百科 虽然名片的尺寸已经讨论过是 3.5* 2 英寸，但是为了做一些出血延伸，需要多流出一些边距。上下左右各 0.125 英寸，因此尺寸设置为 3.75*2.25 英寸。（国内标准是上下左右各加 2mm，因此也就是 94*58mm) 现在需要加入参考线，以便规范布局。 为了简化设计，推荐下载这个带有参考线的 psd 模板 步骤 2——设计 设计之前，心中对名片的模样要有个大概。有些设计师使用草图。不过在设计这款名片时，我理念已经有了，因此略过草图设计流程。 如果你在设计名片时毫无灵感，那么给你推荐一些名牌设计站点：the design inspiration, card nerd, card gala, cardonizer, cards observer,creattica, cardview. 不妨借鉴一下，有助于你快速开始。 这次设计使用了扁平化风格。这将让名片看起来简约、富有现代感。 我将正面和反面单独设计。正面只有一个 logo，反面整合了很多商业信息。   正面…

利用栅格系统进行对齐，这是很常见的事情。本文谈论的对齐可不是简简单单的左对齐和右对齐，我们谈论的是整体角度上对齐的一些方法。合理的对齐能让你的设计更诱人，也能更方便用户浏览，提供极佳的阅读体验。几乎页面上所有的元素都需要对齐，无论是文本，还是图像，抑或一组组视频，以及一堆堆按钮和链接。栅格能够帮助你进行对齐，但是不同的元素对齐方法也不尽相同，各自有各自的奥妙。不要为了对齐而对齐，要为了用户体验而对齐，这才是本文宣讲的目的。 对齐决定了元素的摆放位置以及和其他元素之间的空间关系。好的对齐能够让元素与元素之间的间隔更流畅，让元素彼此的搭配更协调。   为什么所有的元素都需要对齐？   很多人不喜欢栅格系统，因为有所限制，他们不希望自己的创意受到妨碍。 通俗上讲，栅格就是一大堆能够帮助我们创造区块的栏；而 css 中，排版的核心是盒模型，想要打破栅格很难。   为设计加入对齐 当然，并不是每一次都需要全部对齐。对不对齐，取决于你的设计作品或者工作方式。或者，可以在设计时不管对齐，大致创意完成后，再给设计加入对齐。 要注意：不要因为对齐，而使设计过于死板，让网站丧失了趣味性和探索性。对齐意味着你需要开始钻研布局技巧和栅格了——不过这次不用 6 栏栅格，用的是 4 栏。 全屏覆盖的栅格——6 4。使用软件为 gridset app. 当你的设计很适合使用栅格布局时，那么请用之。让元素对齐栅栏，布局可选项非常丰富，即便是最简单的 4 6。 主要元素的对齐   文本 和 css 对齐相同：左、右、中，调整。十分的简单   www.awwwards.com 对齐和可读性，需要好好权衡。不能光顾着对齐，而忽略了整体设计和可读性。 例如，少量的文本可以尝试居中对齐，而大量的文本居中对齐会影响可读性。 标题居中对齐效果很棒，但是标题的效果还取决于和正文的对照。如果标题居中对齐，而下文大量文本如果采用左对齐，效果就不佳。 wearemovingthings.com 不同寻常的对齐方式还要考虑到文化差异，有部分文化从右到左阅读，大部分文化都是从上到下，从左到右。因为大部分文化都是从左到右阅读，所以尽量不要采用右对齐，可读性很糟糕。右对齐一般在页底呈现，展示联系地址、联系信息，或者在顶部出现，展示导航链接   图像 图像的对齐很麻烦，因为每一张图的尺寸都不一样。小尺寸的图像易于放置，而且不影响内容。大的图像会打破阅读节奏，因此最好不要用过大的图像。一般有两种方法：第一种是把图像放在内容之外（开头或者结尾），另一种方法是文本内穿插图片。第一种方法很简单，可以采用全尺寸的大图，看起啦效果也不错，方便响应式设计。   第二种方法稍稍复杂，图像的位置要把握好。图像首先要和文本区域合理对齐（左或右），这是一种方法。另一种方法是图像稍稍超出文本区域。 在文本区域内嵌入图像，如果做得巧妙，文图结合的够好，会提高可读性、趣味性。   背景图像 背景图像是个限制，尺寸、图像选择都很困难。当背景图像和文本对齐结合时，背景图像需要符合 css 规则：绝对定位，上还是下？左还是右？这时候就需要根据自身设计来考虑背景图像的设置了。如果你的背景图像是重复的图案，便需要考虑图案与内容的对齐关系，如何利用背景图像来更好展现前景元素？     元素组 无论是设计还是开发，当谈到“模块”这个词的时候，广义讲，含义差不多，都是一组彼此联系的元素。比如说一组链接便是一个链接模块，图像 覆盖其上的标题大文本也可以是标题模块。   有两点需要考虑：模块内部元素的对齐？模块与模块之间的对齐？…

在 logo 设计中使用渐变，似乎是个两极分化的问题：有人把它用的很复杂，让设计看起来很花哨；有人却能运用非常简单的渐变，让设计更好看。 微软和百事 logo 进化史 logo 设计中的扁平化正当时，扁平化不等于抛弃渐变。无论你喜欢还是不喜欢，认为渐变是好还是坏，在这里，我们进行了一系列对比，试图陈述 logo 设计中使用渐变的种种问题。     应该 ：在创建渐变版本前，先设计出一款出色的纯色版 logo 作为基础 不应该 : 不要上来就给整体设计加入渐变，一点一点来比较好。 看看左边，纯色版本非常适合在纸媒、标识上呈递，简洁大方。而右边的渐变显得过度繁杂，装饰过度，看起来不如左面的大方，其实简单就好。     应该 : 不要单纯的为了渐变而渐变，要让渐变充满创意 不应该 : 渐变之后的视觉效果抽象繁杂，和品牌无关。 airbnb 的 logo 很不错，和航空相关的品牌，深蓝到浅蓝渐变让人感觉非常的清爽，而且和航空相关，给 logo 加入了一种深度和对照感。   而 technology company 的这个 logo 看起来非常抽象，和品牌联系性不大。要注重品牌的联系性，渐变只是一种手段，为的是提高 logo 的表现力、联系性等等，如果达不到这几点，那么再寻求其他m6米乐安卓版下载的解决方案。   应该 ：如果要渐变，那么设计的精致一点 不应该 ：在紧凑的图像中，尽量避免使用渐变 尽管 google 的新 logo 颇有扁平化风味，但是依然有点精致的线性渐变的味道。实现了深度感、经典感。然而右面的 logo，形状太小，渐变运用的太紧密了，感觉非常不专业，很粗糙的渐变。  …

要想学好 ps 首先就要记住 ps 的常用的快捷键，这样一来在作图的时候才能快速调用各种命令，节约我们的作图时间。可是这么多的快捷键要怎么记住呢？现在在网上就有一组很有趣的图，在轻松一笑的同时还能记住它们的功能。 这对于初学者来说是非常形象的，比一堆堆字符是不是好很多。如果有的教程也能采用这样的方式，或许会有越来越多的编程高手出现呢 …

网站设计过程中非常重要的一步就是设计网站信息布局，这是决定网站总体样貌与体验的关键，以下笔者将从信息导航架构、网站信息组织模型、自运营与信息生态圈三点来阐述相关话题。 信息导航架构 网站设计过程中，产品经理需要优先确立网站信息导航架构。这就像画一个人，一定是先画出骨架轮廓，然后再去细化每一个局部。如果开始就局限在细部，欠缺整体上的思考，等你画完会发现各部分风格不一、比例不协调等等的问题。俗语云“画虎先画骨”，放在产品原型设计里，就是首先要放眼于整体信息（信息导航架构），然后再在骨架上添加具体的细节。那么，如何合理地设计网站信息导航架构呢？ 我觉得是需要考虑以下三点：价值 、 逻辑 、 用户习惯与个性化。 需求分析阶段会把需求按重要程度分类，满足用户核心需求的内容要优先显示。其次，导航设计需要讲究层次与逻辑。如果只是强调价值，把截然不同的功能点放在一起，那么呈现结果一定是混乱的，这会增加用户的使用成本，并严重影响用户体验。因此我们在凸显核心卖点与重要价值的同时，必须有逻辑的组织各个模块——功能点分门别类，把重要的“类”优先展示，把次要的功能点用适当的方式弱化展示。弱化方法可以根据实际情况选择页面次要位置、二级菜单展示、非默认选中、折叠等等。更高级的，网站可以尝试满足用户按自己的喜好定制导航的需求，或者根据用户习惯自动调整导航结构，实现自定义与个性化的目标。 网站信息组织模型 在设计网站原型的时候，会先确定网站的信息导航架构。不过，网站的信息组织设计还会先于信息导航，因为信息组织决定了网站的基本要素，而信息导航架构就是把这些要素放在适当的位置呈现。 下面主要讨论网站信息组织方式，最常见的是采用类别的组织方式。抽象地，我们可以把这种组织结构看成一个树状结构，树形类别信息组织结构能够很好的按照逐步细分的方式把信息归类展示。 采用类别组织方式的弊端：类别个数有限，而且不能灵活变化，网站信息不能被很好的归类和检索。如果网站呈现的信息比较庞杂，那么用户就会花去很大的代价去通过粗糙的类别发现他们所感兴趣的东西。采用类别组织就像在马路上听收音机，那么如果此时马路非常嘈杂，我们应该在这个场景下可以选择别的方式听歌——比如带上“耳机”，标签模式就是所谓的“耳机”。从广义上来说标签也属于一种类别模式，只不过标签是一种更加个性，更加灵活，更加细致的分类方式。标签不会被限制数量（简单类别的结构是一棵“树”，那么标签就是大海），简单分类总有尽头，而标签理论上来说可以无边无际，因此标签模式可以比类别模式走的更深，对类别模式不能触及的细分领域进行信息标记，而且我们可以给内容添加多个标签（种类对于内容的映射：one2many，标签对于内容的影射: many2many），对于内容涉及面庞大，或者用户体验要求高的网站而言，标签的重要性不言而喻。 另外标签是灵活与高效的。举一个例子：“xx”这个词汇在网站中开始变得时髦起来，如果采用信息简单分类的方式并不能对这一点做出即时反应（如果能做出反应，那必须依赖于很消耗资源的深度运营），而采用标签，用户会把自己产生的相关内容标记上“xx”，如果“xx”很热门，用户内容将会大量关联“xx”标签，“xx”就会被系统标识成活跃“标签”而优先展示，自动为这些活跃内容提供一个醒目的入口，这就体现了标签的灵活性（flexibility）与实时性（real time）。深入思考上面的这个例子，我们还能发现标签好像把让用户参与了运营（用户行为、偏好决定了导航中每个标签摆放的优先级），笔者把这种产品本身自带的优良运营基因称为产品的“自运营”属性，“自运营”属性极大的解放了产品运营的难度，而且它能比人工运营做的更好。当然类别模式与标签模式并不矛盾，可以联合使用，例如网易轻博客（lofter）就采用“分类”与“标签”两种信息浏览方式。 自运营与信息生态圈 前面我们探讨网站需要组织信息，那么事实上网站的用户也要组织他们自己从网站上获取的信息（收藏夹就是一个最直接的例子）。用户既然对其从网站获取的信息有整理的需求，那么我们能否利用这个特性来实现网站又一个层面的自运营呢（即允许用户分享“自己的整理成果”，从而借用户的手来整理网站信息）？ 答案是，当然可以。且看网易云音乐的“歌单”功能，歌单可以理解成存放歌曲的文件夹。用户可以直接查找歌曲也可以通过歌单寻找自己喜欢的歌曲，然后把它们归类收藏起来，这些“收藏”就是用户自己生成的歌单。而且这些歌单可以分享出来，供更多的人查看。显然，这样就形成了一个信息归类“自运营”的生态循环系统。 歌单是音乐产品对歌曲信息的一种组织方法，当音乐产品支持用户制作、共享歌单的时候，也就是把歌曲信息组织的权力交给了用户，海量用户参与歌单管理将会生成更多更优质的歌单，而这些数量众多、个性化极高的歌单又会吸引更多的不同口味的用户使用该音乐产品，从而将带来更多更好的歌单，这已经是一个“良性循环生态系统”了。类似的，我们也能联想到知乎模式，知乎的问题之于收藏夹，就是云音乐的歌曲之于歌单，其中知乎的问题、云音乐的歌曲分别是它们各自的内容，而收藏夹、歌单则是它们各自对内容的一种支持共享的组织方法。 总结 网站在原型设计阶段可以引入一些更高效的信息组织方式，并采用“自运营”来释放自身信息导流方面的运营压力，而且这样一个“自运营”的“循环信息系统”带来的是更丰富、更灵活的内容分类，借“用户的手”整理自己的网站的信息流不得不说是一招借力打力的妙棋。 最后我们会把这些信息组织元素镶嵌到导航架构里，这样整个网站的信息流设计就完成了。

导航菜单可能是网页设计中最重要的部分了。每个用户浏览网站时一定有所需，因此导航菜单能够帮助用户寻找信息。好的导航菜单像是导游，告诉用户网站是干什么的，内容分类有哪些，在哪里可以找到什么信息。 而且导航栏也是整体布局的重要组成。 总结一下，导航栏的重要性。   1. 浏览完 logo 后，导航栏是用户第一个看到的组件。 2. 导航栏的作用是引导用户。 3. 导航栏的作用也类似于索引，快速帮助用户找到所需信息。   想让导航栏更加优雅、美丽、响应式么？看看导航栏设计的三大要点吧！ 1) 别再让导航胖下去了，给导航减个肥 导航菜单重要性不言而喻。一些设计师往往使用一些繁杂的装饰来做突出。其实大可不必，通过字体、悬停效果、留白可以设计出简约、优雅的极简主义风格导航栏，看看下面的案例。 design instruct     sugar rush     mmminimal     ad60     rhythm     2) 如果有能力，为什么不试试来做 响应式设计 设备种类越来越多，如何满足大部分用户的阅读需求? 这就必须要使用 响应式设计 了。根据屏幕尺寸来合理缩放页面，达到更好的阅读效果，这里是一些案例。 inspire conference     forefathers group     these are things     ryan…