HTML5网页设计流程与标准

  当企业需要一个新网站或想要替换其现有网站时，通常会将项目交由推荐的网站设计和开发机构处理。明智的举动。毕竟，大多数公司没有内部专家来解决如此复杂的项目，而最终结果对于吸引新的潜在客户和产生产品销售至关重要。

  每个网站的创建均遵循清晰的网页设计过程。了解此过程基础知识的客户将欣赏在每个阶段发生的事情，并清楚该过程何时可以轻松地改变方向并可以与Web代理进行更深入的交流。同样，他们知道的越多，网页设计团队在其更新中提供的信息就越有意义，并被证明更有用。

  因此，我们创建了一个信息图来显示我们对Web设计过程的看法。它涵盖了从项目简介到了解客户需求到启动最终版本并提供维护的每个步骤。如果您想了解更多有关该过程的信息，想要与设计人员和开发人员保持轻松的关系，并且想要建立一个符合您的需求和期望的网站，请继续阅读。

  为什么Web开发需要这么长时间?

  一个新的网站不会在一夜之间发生。当网络开发公司估计创建新网站的时间表时，某些客户可能会怀疑。

  “我只想要一些漂亮的页面，上面有漂亮的照片，以及一些在内部和内部的点击。哦，点击“注册我们的新闻通讯”按钮，然后点击“联系我们”表格。但是它们很容易做到，不是吗?当然，不会超过一个星期。哦–我提到我需要的定制购物车和在线支付系统了吗?”

  如果您希望获得一个全新的，全跳舞的网站，这就是为什么可能很容易需要3个月的时间才能让您的客户看到它的原因：

  步骤1：简介

  网站设计过程的步骤-图片。 1个网站设计过程的步骤-图片。 2个网站设计过程的步骤-图片。 3网站设计过程的步骤-图片。 4网站设计过程的步骤-图片。 5网站设计过程的步骤-图片。 6网站设计过程的步骤-图片。 7网站设计过程的步骤-图片。 8

  从Web设计机构的角度来看，简介通常是他们与项目甚至与客户本身的第一次接触。对于双方而言，这通常也是最重要的步骤，因为此处讨论的所有内容都会影响最终结果。这就是为什么客户必须确保提供最清晰，最详细的摘要的原因。

  简介的目的是向Web代理传达准确的项目定义。客户需要说明他们的业务，目标受众和网站的目标-是否要用令人兴奋的图像和现代视频来吸引年轻的访问者?还是它的功能允许普通父母免费进行网上购物?

  在代理商的帮助下，他们需要定义技术规格-是否应针对特定分辨率或浏览器优化网站?样的什么手机版做他们需要什么?响应式设计就足够了吗?

  同样在简介中，客户可以介绍在其余过程中可供代理商使用的内容和资源。资源可以包括字体，图像，而内容可以包括从产品描述到文章，视频等任何内容。

  基于所有这些信息，Web公司可以得出有关项目时间表的结论，包括任何里程碑和截止日期，以及实现所有客户需求所需的估计预算。

  我们再次强调，这是至关重要的一步，因为它构成了所有后续设计和开发工作所基于的基础。简短的摘要或不完整的摘要可能会导致结果不令人满意，进而导致进一步的网页设计成本和延迟。

  步骤2：规划

  网页设计开发过程图片。 1个网页设计开发过程图片。 2个网页设计开发过程图片。 3网页设计开发过程图片。 4网页设计开发过程图片。 5网页设计开发过程图片。 6

  有了摘要中的信息，Web开发公司可以继续进行项目的计划阶段。

  在此步骤中，团队将通过研究和集思广益会议，概述适合客户要求的网站的初步构想。

  其中一个重要的部分通常是信息体系结构，该体系结构基本上定义了整个网站的内容结构以及访问者如何访问它。这在很大程度上还取决于简短的数据-客户是否喜欢无限滚动(想想Pinterest)还是网页内容很少的网页设计?该机构需要找到一种方法来平滑地使访问者在网站上移动以采取所需的操作-所谓的“渠道方法”。

  创建页面组织层次结构后，必须考虑每个页面上内容的布局。连同规划任何功能的位置和操作(例如在线预订表格和在线支付系统)一起，将确保站点用户的适当可用性。

  Web开发公司必须负责向客户清楚地解释建议的导航和布局背后的逻辑。另一方面，客户必须负责仔细审查建议的概念。如果此时通讯薄弱，则整个Web开发过程将引出错误的道路。如果需要更改，则可以在此阶段轻松进行更改，但是如果需要进一步更改，则将需要更多时间，并且成本会增加。

  在此步骤中完成所有步骤后，就可以创建第一个线框和模型，这将进一步帮助设计和开发过程。

  步骤3：设计

  信息图表-pic的网页设计过程。 1个信息图表-pic的网页设计过程。 2个信息图表-pic的网页设计过程。 3信息图表-pic的网页设计过程。 4信息图表-pic的网页设计过程。 5信息图表-pic的网页设计过程。 6信息图表-pic的网页设计过程。 7信息图表-pic的网页设计过程。 8信息图表-pic的网页设计过程。 9

  这是网站开始形成的步骤。现在，Web设计人员将拥有开始研究该项目实际外观所需的所有数据。

  在第一批设计任务中，就是选择合适的配色方案。调色板非常重要，因为它会立即向网站访问者传达信息-鲜艳的彩色设计对于儿童组织而言效果很好，但是金融机构如果希望灌输对观众的信任，就应该选择更细微的颜色。

  徽标和配色方案的结合构成了公司视觉形象的基础，并影响了访客对品牌的看法。同样，无论图像出现在标题，滑块还是作为背景，最佳的网页设计都使用精心选择的图形设计和 艺术品图像来增强公司的主要信息。

  需要设计视觉元素，例如按钮，信息框和菜单框，以补充网站的语调-从最适合成熟受众的正式，锋利边缘框(使用最适合传统受众的传统字体)到包含时髦字体的城市风格仿旧框以吸引青少年。

  网页设计中越来越流行的功能是视频和其他富媒体的存在-这是访问者无需阅读大量文字即可了解更多有关公司或其产品和服务的最简单方法。富媒体还可以引用动画，动态色样，产品的3D旋转模型以及许多其他视觉效果。

  在整个过程中，设计人员必须确保布局提供最佳的用户体验，以使页面不仅美观，而且使访问者能够快速找到所需内容。这也扩展到了跨设备兼容性，例如，它们的模板建议可以进行调整，以适应从智能手机到台式机的各种设备。

  最后，必须准备满足上述标准的各种原型模板变体，并与客户一起进行分析，以定义继续前进的最佳选择。

  步骤4：开发

  发展1发展2发展3发展4发展5发展6发展7发展8

  这是我们在幕后提供实际网站“感觉”的地方。Web开发公司现在必须开发一个网站，以满足计划阶段确定的所有要求。

  开发团队主要关注的问题之一是确保网站的构建符合所有相关的可访问性和Web标准，例如HTML，CSS，XML和XSL的标准。在安大略省，所有网站都必须遵守AODA(《安大略省残疾人无障碍法》)，该法律允许每个人都可以访问该网站。

  开发网站的基础是选择正确的框架。框架类似于用于创建自定义网站的预构建模板，该模板通过编写其他代码来获得最终外观和功能。它们以多种计算机语言提供，包括PHP和JavaScript。

  另一种方法是使用内容管理系统(CMS)，这在几乎不需要自定义的情况下是最好的。CMS是提供用户界面的更高级的框架类型。示例包括适用于演示文稿网站的WordPress，以及适用于电子商务企业的PrestaShop或Magento。

  无论选择哪种方式，开发人员都将专注于配置数据库。这构成了网站的骨干，并根据内容和结构要求进行构建。

  下一步是确保网站正常运行-确保所有按钮，滑块，过滤器，购物车等都能正常工作，并使访问者能够在页面之间移动并进行在线购买。之后，客户的内容将被整合到网站中。这涵盖了服务信息，类别和产品标题，描述和功能，文章，视频以及其他类型的内容。

  开发团队还将不断注意站点的性能。根据功能的数量及其复杂性，有时可能会对速度和性能产生负面影响，从而对潜在的潜在客户或销售产生负面影响，必须予以缓解。

  开发过程的另一个重要因素是安全性。网站的私人数据(例如密码，用户信息和私人内容)必须确保安全。这是通过确保基础代码不允许任何漏洞或弱点(例如XSS)来完成的。

  开发人员的最终任务之一是在网站页面上添加某些标记。这通常不会直接影响用户，但对于搜索引擎优化(SEO)(例如使用schema.org结构化数据)或社交媒体目的(例如头条链接共享描述和图像标签)非常重要。

  步骤5：启动

  发射1发射2发射3发射4发射5发射6

  该网站已进入测试的最后阶段，这基本上意味着它几乎可以上线了。随着网络公司准备交付最终产品，最终测试通常侧重于功能，性能和安全性。

  完成此操作后，代理机构会将项目转移到客户的实时服务器上，在该服务器上将使用客户的域名访问该网站。

  在启动阶段，客户也有非常重要的工作–帮助网站设计公司进行网站的质量保证测试，并查看网站提供什么样的用户体验。客户经常要求他们的员工使用该网站，查看他们是否发现缺少或不正确的内容，链接断开(链接无处可见)，并检查在线表格是否在正确的电子邮件收件箱中。

  网站上线后，客户通常会提供用于集成其网络分析服务(例如某度 Analytics(分析)或网站站长工具)的必要代码段。在大多数情况下，这只能在实时服务器上完成，以便将服务与域关联并进行必要的检查。

  随着一切正常运行，Web设计公司将为客户提供项目开始时商定的所有可交付成果。这通常是指网站的源代码文件，徽标以及在规划，设计和开发阶段中使用的其他材料。

  根据项目的复杂性，客户还将获得有关正确使用站点某些功能(例如管理面板，客户管理等)的培训和文档。

  步骤6：维护

  网站设计过程-图片。 1个网站设计过程-图片。 2个网站设计过程-图片。 3网站设计过程-图片。 4网站设计过程-图片。 5

  Web设计过程的最后一步并不是每个人都熟悉。不幸的是，许多客户认为启动网站应该终止与他们的网络代理商的合作。事实是，如果您真正投入到在线业务中，那么网页设计过程将永远不会结束。

  那么在维护阶段会发生什么呢?首先，网络代理商将提供支持并解决您或您的任何用户在访问期间遇到的任何问题，以保持满意的听众。

  对于CMS，技术支持还扩展到定期的性能和安全性测试，更新或附加安装。

  其次，虽然该网站确实可以运行，并且甚至超出了您的所有期望，但这并不意味着没有更多的优化空间。随着时间的流逝和新趋势的出现，情况更是如此。代理商通常会使用A / B测试来确定哪些变化最能影响点击率和转化次数等指标，以最大程度地提高您网站的价值。

  除了首先将您的网站放在一起的团队之外，还有谁可以实施所产生的修改或任何其他更新，而无论它们是与设计，功能还是与内容有关的?即使是很小的更改，使用其他代理商频繁地修改您的网站也会导致更高的成本和更长的实施时间。