现代网页设计过程
了解一个定义良好的过程如何转化为高效的网站。
简介
设计良好的网站提供的不仅仅是美学。它们通过各种各样的指标，包括视觉、文本和交互，吸引访问者并帮助人们了解产品、公司和品牌。欧宝体育在线首页这意味着你网站的每个元素都需要朝着一个明确的目标努力。
但你如何实现元素的和谐合成呢?通过一个综合考虑形式和功能的网页设计过程。
对我来说，网页设计过程需要7个阶段:
- 目标识别:我与客户一起确定网站需要实现的目标。也就是说，它的目的是什么。
- 范围定义一旦我们知道了网站的目标，我们就可以定义项目的范围。也就是说，网站需要哪些页面和功能来实现目标，以及构建这些内容的时间表。
- 站点地图和线框创建:有了定义好的范围，我们就可以开始深入研究站点地图，定义我们在范围定义中定义的内容和功能如何相互关联。
- 内容创作:现在我们对网站有了一个更大的概念，我们可以开始为单个页面创建内容，始终牢记搜索引擎优化，以帮助页面专注于单个主题。你必须为下一阶段准备真正的内容:
- 视觉元素有了网站架构和一些内容之后，我们就可以开始做视觉品牌了。根据客户机的不同，这可能已经定义好了，但您也可能从头定义视觉样式。像样式贴片、模式板和元素拼贴等工具可以帮助完成这个过程。
- 测试到目前为止，您已经有了所有的页面，并定义了它们如何显示给站点访问者，所以是时候确保它们都能正常工作了。将在各种设备上手动浏览站点与自动站点爬虫程序结合起来，以识别从用户体验问题到简单的坏链接的所有内容。
- 发射!一旦一切工作顺利，就该计划和执行你的网站发布了!这应该包括计划发布时间和沟通策略——例如，你什么时候发布，你将如何让世界知道?之后，是时候开香槟了。
现在我们已经概述了这个过程，让我们更深入地挖掘每一步。
1.目标识别
在这个初始阶段，设计师需要确定网站的最终目标，通常与客户或其他利益相关者密切合作。在这一阶段需要探索和回答的问题包括:
- 这个网站是为谁服务的?
- 他们希望在那里找到什么或做什么?
- 这个网站的主要目的是告知，销售，还是娱乐?
- 网站需要清楚地传达品牌的核心信息吗，还是它是一个更广泛的品牌战略的一部分，有自己独特的焦点?
- 有哪些竞争对手网站，如果有的话，这个网站应该如何从这些竞争对手那里得到启发/不同于这些竞争对手?
这是任何网页设计过程中最重要的部分。如果这些问题都没有在简报中得到明确的回答，整个项目就会朝着错误的方向发展。
写下一个或多个明确的目标，或用一段话总结预期的目标，可能会很有用。这将有助于将设计放在正确的道路上。确保你了解网站的目标受众，并发展竞争的工作知识。
欲了解更多信息，请点击“现代网页设计过程:设定目标．"
网站目标识别阶段的工具
- 观众的角色
- 创意简报
- 竞争对手分析
- 品牌属性
2.范围定义
困扰网页设计项目的最常见和最困难的问题之一是范围渐变。客户心中只有一个目标，但这个目标在设计过程中逐渐扩展、发展或完全改变——接下来你知道的，你不仅是在设计和创建一个网站，而且还在设计和创建一个web应用程序、电子邮件和推送通知。
这不是一定这对于设计师来说是个问题，因为这通常会导致更多的工作。但如果增加的期望与预算或时间表的增加不相匹配，项目就会迅速变得完全不现实。
甘特图详细描述了项目的实际时间线，包括任何主要的里程碑，可以帮助设定边界和可实现的截止日期。这为设计师和客户提供了宝贵的参考，并帮助每个人专注于手头的任务和目标。
范围定义工具
- 一份合同
- 甘特图(或其他时间轴可视化)
3.站点地图和线框创建
网站地图为任何精心设计的网站提供了基础。它帮助设计者对网站的信息架构有一个清晰的概念，并解释了不同页面和内容元素之间的关系。
建立一个网站没有网站地图就像建造没有蓝图的房子。结果很少有好结果。
下一步是构建线框。线框图为存储网站的视觉设计和内容元素提供了一个框架，可以帮助识别网站地图的潜在挑战和差距。
虽然线框不包含任何最终的设计元素，但它确实是网站最终外观的指南。有些设计师会使用Balsamiq或Webflow等工具来创建线框。我个人喜欢回到最基本的东西，使用可靠的旧纸和铅笔。
用于站点映射和线框图的工具
- 钢笔/铅笔和纸
- Balsamiq
- Moqups
- 草图
- Axure
- Webflow
- Slickplan
- Writemaps
- Mindnode
4.内容创作
一旦你的网站框架到位，你可以从网站最重要的方面开始:的文字内容．
内容有两个基本目的:
目的1。内容驱动用户粘性和行动
首先，内容吸引读者，促使他们采取必要的行动来实现网站的目标。这受到内容本身(写作)和呈现方式(排版和结构元素)的影响。
枯燥、无生气和冗长的散文很难长时间吸引游客的注意力。短小精悍、引人入胜的内容吸引着他们，让他们点击进入其他页面。即使你的页面需要大量的内容——通常情况下，他们确实需要——适当地“分块”这些内容，通过将其分解成简短的段落，辅以视觉效果，可以帮助它保持轻松、吸引人的感觉。
目的2:搜索引擎优化
内容还能提高网站在搜索引擎中的可见性。创造和改进内容的做法，以在搜索中排名靠前被称为搜索引擎优化，简称SEO．
正确把握关键词和关键短语对于任何网站的成功都是至关重要的。我总是使用谷歌关键字计划。这个工具显示潜在目标关键词和短语的搜索量，因此您可以了解实际的人们在网络上搜索什么。搜索引擎变得越来越聪明，你的内容策略也应该如此。谷歌Trends还可以方便地识别人们在搜索时实际使用的词汇。
我的设计过程主要围绕SEO设计网站。你想要排名的关键字需要放在标题标签-越接近开始，越好。关键字也应该出现在H1标签、元描述和正文内容中。
写得好、信息量大、关键词丰富的内容更容易被搜索引擎搜索到，所有这些都有助于使网站更容易被找到。
通常情况下，你的客户将产生大量的内容，但重要的是，你为他们提供指导，告诉他们应该在文本中包含什么关键字和短语。
很棒的内容创建工具
- 谷歌文档
- Dropbox纸
- 妙语
- 收集的内容
方便的搜索引擎优化工具
- 谷歌关键字规划师
- 谷歌趋势
- 尖叫青蛙的SEO蜘蛛
5.视觉元素
最后，是时候创建网站的视觉风格了。设计过程的这一部分通常会根据客户规定的现有品牌元素、颜色选择和标识进行塑造。但这也是网页设计过程中的一个阶段，一个好的网页设计师可以真正发光发热。
图片在网页设计中扮演着比以往更重要的角色。高质量的图片不仅能给网站带来专业的观感，还能传达信息，便于移动，有助于建立信任。
视觉内容可以增加点击率、用户粘性和收益．但更重要的是，人们想要在网站上看图片。图片不仅使页面感觉不那么麻烦，更容易理解，而且它们还增强了文本中的信息，甚至可以在人们甚至不需要阅读的情况下传递重要信息。
我建议使用专业摄影师来获得正确的图像。只是要记住，大量、漂亮的图片会严重减慢网站的速度。我使用Optimizilla压缩图像而不损失质量，节省页面加载时间。你也会想这么做的确保你的图片和你的网站一样有响应性．
视觉设计是一种沟通和吸引网站用户的方式。把它做好，就能决定网站的成功。如果搞错了，你就只是另一个网址。
视觉元素的工具
- 常用工具(Sketch, Illustrator, Photoshop等)
- 情绪板，风格瓷砖，元素拼贴
- 视觉风格指南
6.测试
一旦站点拥有了所有的视觉效果和内容，就可以进行测试了。
彻底测试每一页以确保所有链接都在工作网站在所有设备和浏览器上都能正常加载。错误可能是小的编码错误的结果，虽然发现和修复它们通常是一件痛苦的事情，但最好现在就做，而不是向公众展示一个损坏的网站。
编者注:我强烈推荐尖叫青蛙餐厅搜索引擎蜘蛛这一阶段。它可以让您在一个工具中完成许多标准的审计任务，并且对于最多500个url是免费的。
最后看一下页面的标题和描述。甚至元标题中单词的顺序也会影响搜索引擎中页面的性能。
Webflow上有一篇很好的文章试生产过程中．
网站测试工具
7.发射
现在是网站设计过程中每个人最喜欢的部分:当所有的东西都经过了彻底的测试，并且你对网站感到满意时，就是发布的时候了。
不要期望这一切会完美无缺。可能还有一些元素需要修复。网页设计是一个流动和持续的过程，需要不断维护。
网页设计——实际上，一般的设计——都是关于在形式和功能之间找到正确的平衡。你需要使用正确的字体、颜色和设计主题。但人们浏览和体验网站的方式也同样重要。
熟练的设计师应该深谙这一概念，并能够创建一个在这两者之间走微妙钢丝的网站。
关于启动阶段，需要记住的一件关键事情是，它远没有接近工作的结束。网络的美妙之处在于它永远不会结束。一旦站点上线，您可以持续地对新内容和功能进行用户测试，监控分析，并改进您的消息。
这是高层次的观点
现在让我们更详细地研究每一步。
但由于输入太多，很容易忽略什么是重要的。模糊的期望会导致挫败感，并减慢过程。这就是为什么你需要尽早明确项目目标的原因。以及为什么每个人都需要有共同的愿景才能成功。
了解网站的目的
当然，一个全新的、引人注目的网站总是积极的。但是，如果没有更深层的理由，投入时间和金钱来建造一个可能会变成短期投资。
无论你是从头开始，还是做一个完全的重新设计，你都需要知道你想让用户从你的新网站学到什么。你想通过内容传达什么?需要加入哪些行动号召?了解这些焦点是什么，这样你就可以创造一个放大它们的设计。
一个网站不应该是数字前沿的一个孤立的前哨，而应该融入一个品牌更广泛的战略。它需要补充这一战略，并增加自身的价值。如果这个网站只是提供了一点无聊的娱乐，那也没什么如果那是你的意图。但最终，一个网站应该帮助填补客户所知道的和客户希望客户知道的之间的空白。
发现问题并找到正确的解决方案
要确定需要解决的问题，并找到这些问题的正确解决方案，您首先需要与您的客户和其他涉众进行沟通。
你必须有一个开放的对话，找出在他们目前的网站上什么工作，什么不工作，他们认为不喜欢。内容是可靠的，但可用性是一个噩梦吗?结账过程是否如此痛苦以至于客户失去了销售?你需要了解你的客户认为网站的主要问题是什么，同时收集他们从使用过网站的人那里得到的反馈。
你还需要自己做调查。深入挖掘他们当前的网站，记下所有需要升级的地方。不要只关注哪里出了问题，也要考虑一下哪些是有效的。你可以将当前网站的积极方面融入到你的新设计中。
我们很容易被细微的细节分心。但现在不是谈细节的时候。你和客户都需要把注意力集中在网站要实现什么以及你要如何实现这个目标上。
通常客户会认为他们完全了解问题，并有一个可靠的解决方案。有时候，他们没有方向，只有一种需要改进的直觉。作为设计专家，我们的工作是探索各种选项并推荐一个最佳解决方案(如果不能做到这一点，就推荐一个体面的解决方案)。
当我在零售公司工作时，我是一个团队的一员，负责整理公司的环境可持续发展报告。他们有我一直在打印一份50页的综合报告，结果是一堆白纸黑字的纸。
我们的解决方案?将这份50页的报告裁剪成包含重点内容的小册子，用再生纸和大豆油墨打印，并附上网站链接以获取更多信息。从而解决了一个他们自己都不知道的问题。
作为设计师，我们有能力为项目中已知和未知的问题提出解决方案。
了解你的听众
了解你的目标用户将指导你完成整个设计过程，并通过迫使你回答一个简单的问题而简化决策:
这对我们的观众有用吗?
你的客户应该有人口统计信息，如收入、性别和年龄(在他们的Facebook页面分析中)。你还需要了解他们的消费习惯:
- 他们还购买什么其他商品和服务?
- 他们访问什么网站?
- 他们沉迷于什么形式的媒体?
了解所有这些将帮助你创造出与他们的其他消费者体验一致的设计。
如果说所有网站都有一个共同的目标，那就是与受众建立联系。通过更多地了解你的谈话对象，你就能更好地有效地与他们取得联系。
写一份有创意的简报
不管你的简报有多啰嗦，你都必须编写一份有创意的简报，这样你、客户和项目中的所有人都能理解它的具体内容。一份有创意的简报需要定义项目的人员、内容和地点，列出范围和完成每个目标需要做什么。
定义成功
如果不定义成功是什么样子的，你就永远不知道自己是否成功了。
有些衡量成功的标准比其他的更明显。人们理解数字。当他们看到流量和销量上升时，他们知道自己已经取得了某种程度的成功。
有些客户已经知道他们将如何决定成功。我曾经有一个客户，他帮助运营一个非营利组织，想要重新设计一个完整的网站。她的成功标准:
- 搜索排名提升
- 增加了他们手工制品的销量
事先知道这两个目标使我的工作容易得多。我花了巨大的大量的时间在研究和编写seo优化的内容。我还找到了一个更好的电子商务平台，让他们为自己的库存拍摄新的高分辨率照片。
销售增加了，她的组织成为了大量搜索词条的首页。她很高兴，我也很高兴。这个项目成功了。
当你定义项目成功时，不要做出不切实际的承诺。对于这项非营利性的努力，我解释了他们目前网站上的内容是如何无效的。我从不夸大我要做的事情，但我确实解释了它将如何比他们现有的更好。这是。
当然，“成功”也可以不那么具体。提升一个品牌的声誉并将其与竞争对手区分开来是很难衡量的。但是如果你恰当地设定了客户的期望，他们就能在成品中看到这一点。欧宝体育在线首页(如果做不到这一点，你总是可以对现有客户进行NPS调查，以评估他们对新设计的反应。)
参与项目的每个人都需要知道他们将如何决定项目的成功。当每个人都对成功有一个共同的理解时，你们将能够评估和认识到你们所有努力工作的效果。
设定你的目标
您可以根据可交付成果和创建它们的人员来定义任何项目。但如果目标受众没有明确的目标，就没有人会知道为什么他们正在构建这些可交付成果。
当人们理解为什么，他们也能更好地理解如何来实现他们的目标。在项目开始时找到这些目标，这样你就能在项目结束时获得成功。
