[51CTO.com 快译] 您是否还记得让自己倍感兴奋的网站第一次上线的场景呢? 整个团队努力设计出了令人耳目一新的用户界面和引人入胜的内容, 大家都迫不及待地想要交付并投放给目标客户. 但是, 人们往往就是迫于项目的需求, 而急功近利地上线了某个新建的网站, 到头来, 却由于忽略了某些基本因素, 而适得其反地 "收获" 了用户的负面反馈. 可见, 在启用网站新的功能, 或是新网站上线之前, 我们需要根据一份终极测试清单, 通过针对用户界面, 以及浏览器兼容性 ( ) 等方面的测试, 来避免事后可能发生的错误.
1. 找出细微的错误
不要在网页上出现拼写错误之类的低级失误. 请花些时间去全面浏览与校对自己网站上的各项文字与图片内容. 一旦发现在主要页面或是联系人列表处, 存在任何逻辑或输入错误, 请立即与页面设计团队联系, 并及时予以修复. 当然, 您也应该注意页面上的各种其他类型的流媒体内容, 包括视频, 音频文件和形式文本(dummy text). 其中, 值得特别注意与校验的内容包括如下方面:
内容不但需要引人入胜, 而且能够以准确的字体大小和加粗方式, 以方便来访者的阅读.
鉴于网页的加载速度, 应适当对网页上的图片, 以及大量的文本文字进行优化或压缩.
确保各种音频和视频文件能够正常运行.
2. 清除恶意链接
在网站试运行一段时间之后, 您应该定期检查页面上的程序代码, 及时清除掉被攻击者植入的恶意链接以及病毒代码. 毕竟, 用户在访问您的网站时, 一旦本地电脑上弹出了病毒警告, 甚至是不幸中招的话, 他们非但会将该网站 "拉黑", 甚至还会警告周围人不要再访问于此. 您可以在自己的网页上通过安插反恶意软件的插件, 来自动清理恶意链接. 如果您启动的是 WordPress 类型的网站的话, 可以使用 iThemes Security 以及 Antispam Bee 之类的免费安全管理插件.
3. 检查网站的可用性
网站的可用性可谓 web 应用中最关键的元素之一, 它不但有助于提高用户的转化率并优化 SEO(Search Engine Optimization), 而且能够确保网站的所有功能会按照预期运行下去. 业界常有七秒钟定律的说法, 也就是说: 如果您的网站超过七秒钟都无法给予用户需要的内容, 他们将视为该网站可用性的缺失. 因此, 我们需要考虑如下方面:
各种图片必须得到适当的压缩与优化.
检查用户行为召唤 (call-to-action) 和联系表的正确性.
从用户的角度, 亲测网站的整体浏览与使用体验.
如果是一个多用户站点的话, 请检查登录认证, 信任凭据, 以及角色授权等过程.
另外, 如果涉及到带有付款选项的卡密交易的话, 请从支付验证, 页面重定向, 以及合规方面予以测试.
4. 验证导航功能
每一个 Web 应用程序都应该配备有导航功能, 以方便网站访问者获悉当前所处的网站位置, 并能通过某个按钮快速地跳转到目标页面. 因此, 我们应当测试从网站的其他页面或区域跳转回主页, 并且检查从首页到用户签出页面的每一个导航步骤. 注意, 应当以最终用户的身份进行逐步检查, 而不是以后台管理员的角色, 来想当然地浏览.
5. 检查浏览器的兼容性
网站访客可能会从任何一种浏览器, 设备或操作系统上连接进来. 因此, 您应该检查自己的网站与各种常见与不常见浏览器的兼容性问题. 如果您无法真实地在每一个浏览器上去测试自己的网站, 那么最好请在 Chrome,Firefox 和 Safari 之类比较流行的浏览器上进行检查.
鉴于手动测试每个浏览器不但复杂而且耗时, 您可以使用诸如: LambdaTest( https://www.lambdatest.com/ ),Testingbot( https://testingbot.com/ )和 Crossbrowsertesting( https://crossbrowsertesting.com/ )之类的跨浏览器测试工具. 其中, LambdaTest 可以模拟 2000 多种浏览器, 操作系统和设备予以测试. 它甚至可以在执行 Web 应用测试的同时, 提供屏幕截图, 视频录制, 以及错误跟踪等功能.
6. 确保所有 URL 均能够被正常访问
作为一名开发人员, 您应该清楚地知道: 当自己的站点从测试环境转移到生产环境中时, 应当通过更改所有涉及到的 URL, 以保证整个过程的平稳. 对于某个小型企业网站而言, 由于页面数量不多, 层次并不复杂, 因此您可以手动进行 URL 的检查. 但是, 如果您要上线一个大型网站, 那么我建议您使用高效快捷的自动检测工具.
7. 检查针对移动访问的响应能力
除了测试目标网站的浏览器兼容性, 检查它对于移动设备的响应能力也是至关重要的. 当前, 非但 Google 之类的互联网公司会注重移动设备的优先索引, 其实有超过 70% 的用户更愿意通过移动设备去浏览各类网站. 因此, 这就要求您的 Web 应用能够在移动设备上具有与台式机同等出色的性能.
有关此类检查的主要方面包括: 验证页面上的文本是否易于在移动设备上阅读, 内容的显示格式是否与桌面端相同, 按钮的间距是否能保持一致, 以及导航栏是否能够运行正常等方面. 在此, 您可以使用 Google 所提供的移动友好测试工具, 以及各种在线响应测试工具( ).
8. 检查网站加载速度
彼时, Google 因为页面加载速度延迟了 0.5 秒, 而导致流量下降了 20%. 如今, 我们可以毫不夸张地说: 如果您的页面加载速度出现 0.1 秒的延迟, 那么您可能会损失多达 40% 的网站流量. 此外, 页面的加载速度也已经成为了 Google 的排名因素之一. 这就意味着如果您的网站能够实时被加载的话, 那么它在搜索引擎中的排名就比较靠前.
您可以通过 Google 的 PageSpeed Insights( )来检查每个页面的加载速度. 通过勾选 "内容分析" 模块 ->"页面", 您可以执行详细的分析, 进而获悉影响某个页面速度的技术因素. 当然, 您也可以考虑如下方面的原因:
使用各种响应媒体类 (responsive media) 文件, 然后将其存储在内容传输网络 (content delivery network) 上, 以减少服务器的负载.
通过 htmlMinifier( https://github.com/kangax/html-minifier ),CSSNano,Closure Compiler( https://developers.google.com/closure/compiler )之类的 Google 推荐工具, 来缩少 JavaScript,HTML 和 CSS 代码的数量.
通过在多个供应商平台上进行测试, 以及浏览各大论坛, 社区里的评论, 选择响应速度最快的托管服务提供商.
最好能够通过诸如 Gzip 之类的工具, 来压缩较大体积的页面.
9. 确认 Web 内容已针对 SEO 进行了优化
为了确保您网站不至于在搜索引擎中排名靠后, 您应当对每个页面上的内容都进行适当地优化, 检查页面上有唯一的标题标签和元描述信息, 以保持对 SEO 的友好.
除了检查和优化页面标题, 正文内容, URL, 图像以及备选文本之外, 您还可以检查是否使用了正确的关键字, 并将其放置在了页面的适当位置.
10. 使用 SSL 证书来检查网站的安全性
保护网站免受黑客攻击的首要措施就是启用 SSL 认证证书. 它能够确保对于 Web 应用进行加密, 以拦截黑客的各类控制命令与数据截获. 由于 Google 在其搜索排名算法中已经包含了 SSL 部分, 因此此举不仅可以帮助您保护网站上的业务数据, 并为用户提供便利, 而且可以提高 SEO 的整体性能. 不过, 购买, 安装与配置新的 SSL 证书, 是需要花费时间的, 您最好让安全部门来参与并配合. 当然, 如果您已经有了网站 SSL 证书, 那么请确保将其迁移到新的服务主机上并启动之.
11. 验证 HTML 和 CSS
按照 Google 的说法, 较小的 HTML/CSS 错误, 并不会影响网站的显示效果. 但是我仍然建议您仔细验证代码正确性. 通常, 我们可以使用诸如 W3C Markup Validator( https://validator.w3.org/ )和 W3C CSS Validator( http://www.css-validator.org/ )之类的免费工具, 来扫描并查找页面上的潜在错误. 虽然 HTML/CSS 中的次要错误并不会影响到网站的整体 SEO, 但是它们确实会影响到网站的运行性能与响应速度, 进而会给访客带来不佳的浏览体验.
12. 拥有灾难备份方案
没有人愿意在辛苦搭建并启动了网站之后, 去承受数据的丢失与破坏. 因此, 我们需要通过分析网站的使用量和数据量, 设计并准备一套备份方案, 以保证在出现紧急情况时, 能够通过定位备份数据和有条不紊地恢复, 来从容应对.
结论
如今, 我们虽然可以使用 WordPress,Wix 等平台, 来轻松地创建和启动新的网站, 但是要真正确保能够符合 Google 制定的业界标准, 并在搜索引擎上获得靠前的排名, 可不是一件容易的事. 这就是为什么我们需要在启用网站之前, 分头检查各方面性能的原因. 希望我们上述为您罗列的十二项检查条目, 能够帮助您打造出稳定且会给用户带来良好体验的网站.
原文标题: The Ultimate Website Testing Checklist Before Going Live, 作者: Veethee Dixit
来源: http://www.tuicool.com/articles/b6JjauY