如何从错误中学习网页设计

Web 不是由一个单一的整体框架构成的。 由于其模块化，要学习构成我们在互联网上看到的一切的所有部分要困难得多。

任何人都必然会犯下会减慢开发时间、减慢程序或将错误引入程序的错误。 不仅如此，当你找工作时，有些错误会让你处于劣势。

存在最佳实践以确保在设计网站或将其投入生产时尽可能少地出现问题。 以下是初级 Web 开发人员最常犯的五个错误以及如何避免这些错误。

过度依赖 jQuery

jQuery 是迄今为止世界上最流行的 JavaScript 框架。 一旦你创建它就在你的项目中采用它可能看起来很诱人，但不要这么着急。

虽然 jQuery 确实提供了许多方便的方法来加速您的 Web 开发，但重要的是不要过多地使用它。 新的 Web 开发人员几乎总是会错误地理解 jQuery 的 API 方法，而不是它们在底层的工作方式。

许多雇主认为 jQuery 是一种负担，而不是一种很好的工具，因为一些开发人员无法完全理解JavaScript 是如何工作的。

使用 jQuery 没有任何问题。 如果可以，请习惯于自己使用 JavaScript 方法。 仅依靠 jQuery 来实现那些需要一段时间才能实现的便捷方法。

过度依赖 CSS 框架

Semantic UI 和 Bootstrap 等 CSS 框架可以节省大量时间。 它们消除了对手动样式的需求，并在您的应用程序中加入了响应式设计。

然而，就像 jQuery 一样，很容易陷入从不编写自己的 CSS 代码的循环中。 归根结底，您的网站看起来很一般，而且只完成了一半。 在极端情况下，它甚至可能看起来像十几个与您有相同想法的其他网站。

如果您不是编写 CSS 代码的专家，您将有能力阅读手册，找到一位导师，他会为您提供所需的信息，就像研究指南会为我写一篇研究论文并提供为您提供良好和定性的帮助。 有不同的框架可以更直观地编写代码。

像 Bootstrap 这样的框架可以让您的生活更轻松。 为了避免过度依赖，自学 CSS 样式，学习如何使用预处理器来加速开发，学习色彩理论来了解哪些颜色可以搭配，哪些不可以搭配。 一旦你正确理解了这些概念，你可能会意识到你甚至不再需要这些框架了。

没有恢复工具

在您最需要的时候没有恢复工具可能会导致您的网站崩溃并可能消亡。 每当您对您的网站进行更改时，您都冒着不好的风险。 为确保您有一个可以落入的安全网，请考虑使用恢复工具，例如 WP Reset。

当您的网站出现问题时，WP Reset 是您的最佳解决方案。 也许问题是无法访问您的 WP 管理员或遇到死机白屏。 无论是什么，WP Reset 都会为您提供支持。 它配备了有用的清洁工具，可让您快速轻松地恢复您的网站。

此外，您可以使用它来快速安装任何插件和主题，或者在它们出现故障时禁用它们。 此外，WP Reset 的快照功能会在您对其进行任何更改之前自动拍摄您网站的快照，如果事情没有按计划进行，您可以恢复该快照。

这个插件提供的最强大的选项是核重置选项，它允许您完全清除您的安装，删除所有插件、主题和数据库条目。 但是，仅在您真正需要时才使用它。

忘记优化您的网站以提高速度

过度依赖 jQuery 的一个影响是倾向于养成反模式的习惯。 首次加载浏览器时，需要在加载页面之前执行 JavaScript 和 CSS 代码，具体取决于您放置脚本的位置。

正如您可以想象的那样，拥有太多脚本会降低您的网站速度。 使用未使用的 CSS 类会增加您网站的包大小并同样减慢它的速度。

速度优化有很多内容。 仅举几个因素：字体、图像、附加的 JavaScript 和 CSS 文件以及文件压缩都发挥着作用。 一旦你掌握了这些，看看像 Webpack 和 Rollup 这样的包捆绑器，它们可以从你的文件中删除未使用的 CSS 类和 JavaScript 方法。

输入验证不完整

您构建的任何网站的一些最重要的部分是表单。 由于这是一个人可以将信息传递到您的服务器的唯一方式，因此始终需要对它们进行一些健全性检查。

互联网上一些最常见的攻击媒介仍然是 XSS 攻击和 SQL 注入。 初级开发人员容易犯的错误是只在前端进行输入验证。

所有输入验证都是通过 JavaScript 完成的，这很容易禁用。 也就是说，Sytian Web Developer Philippines 的 Kenneth Sytian 建议始终在后端和前端执行输入验证。 此外，所有非字母数字字符都应该转义以使注入攻击不可能。

忽略SEO的重要性

仅仅建立漂亮的网站并发布它们是不够的。 人们看到并欣赏您提供的内容同样重要。 最好的方法是提高您的 SEO 知识和实施。

搜索引擎优化是一个漫长而复杂的过程，需要不断研究以保持在不断变化的游戏规则循环中。 凭借其拱形覆盖范围，不应忽视在开发过程结束时完成它。

需要积极处理某些做法，例如始终在图像上使用描述性“alt”标签。 想象一下，当您已经完成项目时，扫描所有文件以查找 alt 和元标记。

没有网站图标

由于设置起来非常琐碎，因此很容易将 favicon 视为不必要的，但它的存在非常重要。 在现代网络上，用户通常会打开多个选项卡，以便他们以后可以再次访问它们。 网站图标充当一种书签，因此您的网站一目了然。 缺少一个可能意味着用户在此过程中失去兴趣。

屡获殊荣的 UX 设计师 Michelle Dipp 建议您使用可以在网上找到的免费图形设计工具，而不是自己在 Photoshop 中生成。 您甚至可以找到一个提供网站图标模板的模板，这样您就可以轻松制作自己的模板。

忽略响应式设计

响应式设计是网站应该具备的最重要的东西之一。 互联网上的大部分流量来自移动设备。 没有一个根据屏幕尺寸显示不同内容的网站会使您处于不利地位。 如果您的竞争对手提供相同的服务，则尤其如此。

改善用户体验的一种方法是在您的网站上实施粘性元素。 粘性元素是那些在用户浏览时保持固定在页面上的元素。 当元素固定后，访问它们就更容易了，而且你知道它们总是在一个地方，这在手机上是必不可少的。

话虽如此，WP Sticky 是您可以用来制作粘性元素的完美插件。 WP Sticky 让您无需编写任何代码即可将任意数量的元素设置为粘性； 你只需要从屏幕上选择你的元素。

使用 WP Sticky，您可以使您的菜单、页眉、页脚等具有粘性。 此外，您可以调整元素的位置、不透明度，并在特定帖子中添加或删除它。

此外，这是谷歌在对页面进行排名时考虑的因素之一。 如果您的网页在移动设备上没有响应，您可能会收到来自网站管理员控制台的几封电子邮件，警告您更新您的网站。

结论

正确的网页设计需要时间。 有时间研究，有时间工作，甚至有更多时间习惯推荐的做法。 在开发期间犯错并不是世界末日。 相反，把你遇到的任何挫折当作一种学习经历。 使用它们提高您对正确网页设计的知识和应用。

–

关于作者

Becky Holton 是 Bestdissertation.com 的一名记者和博主，该网站是最佳论文写作服务。 她对教育技术、专家写作感兴趣，并随时准备在澳大利亚写作中支持信息丰富的演讲。 在推特上关注她。