《六个修订版》重新设计

6个版本的新网站设计在几个小时前发布(官方命名为6个版本2),这是网站多年来最重要的一次重新设计。

这个新设计的主要目标是提高你在网站上的阅读和整体体验。

突出了

仍然有相当多的设计、网页性能和功能问题需要解决,但总的来说,这次重新设计将极大地提高您在六版上的体验。

我将简要介绍新版本中的一些设计改进。

响应设计

Six Revisions通过移动设备访问该网站的读者将会很高兴地发现,该网站现在为他们提供了更好的阅读体验。

快速检查一下谷歌PageSpeed Insights显示没有问题移动用户体验.(不过,我仍然需要改进整个网站的移动和桌面页面速度,以及PageSpeed Insights建议之外的增强功能。)

谷歌pagespepeinsights六个修订首页的结果

处理嵌入的代码示例(内容包装在< >之前元素)使用较宽的线条长度是比较棘手的设计挑战之一。

我探索了两个解决方案:在代码示例上的水平滚动条比本机设备宽度宽,或者让长行换行到下一行。

最后一刻,我选择了后一种解决方案,因为智能手机上的水平滚动(左右滑动)对阅读流程的破坏太大了。

改善可读性

旧的网页设计在美学上已经过时了。

它很笨重。它在很多方面都被打破了。

最重要的是,它妨碍了你在网站上的阅读体验。新的设计是优化的,以最好的方式呈现六修订版的内容,这样我们的作者的辛勤工作就不再被以前的设计造成的UX、可用性和可读性问题所掩盖。

新的用户界面简洁明了,旨在补充你的阅读体验,而不是成为焦点。

在其他方面,提高可读性需要花费大量的时间和精力来设计、评估和测试设计的字体。

在Six Revisions版本2中使用的主要web字体是Lato,这是一种非常易读且易于阅读的字体卢卡斯Dziedzic

它有18种变体,有3000个字形,使其成为一种灵活而强大的字体,可以处理旧的、当前的和未来的六版内容。

代码示例是面向专业开发人员和web设计人员的出版物的重要组成部分。用于展示嵌入代码示例的字体是我最喜欢的字体之一最喜欢的编程字体源代码专业版

它与主体字体配合得很好,非常漂亮。它非常清晰易读,使阅读代码成为一种更愉快的体验。

源代码专业版预览

该网站的排版仍然需要完善和微调,所以这方面的工作还在进行中。

改进的网站导航

旧UI的一个主要问题是很难导航到您可能感兴趣的内容。

一个旨在改善站点导航的特性是固定导航条在我们的网页顶部。这使您可以轻松地在整个网站移动,而不必回滚到页面顶部。

在旧的设计中,回滚到页面顶部浏览网站特别麻烦,因为Six Revisions发布的是长篇文章。将来,这个导航栏将根据您在网站上的位置显示上下文导航项和信息,以帮助您发现可能感兴趣的其他文章和教程。

我正在构建更多的界面,使我们的内容更容易浏览。

例如,我目前正在开发一个界面,可以在一个网页上查看50到100篇Six Revisions文章,以减少切换到另一个页面所需的时间和精力。

目前的一个关键问题是,网站搜索功能无法显示搜索结果。这是一个高优先级的错误,我将在接下来的几个小时(在我睡了一会儿之后)处理它。

更好的UX讨论

我的主要目标之一是提高你与六修社区其他成员互动的能力。为了实现这一目标,我采取的第一步是启用多级评论,这样我们就可以在评论中进行更好的对话。

我希望Six Revisions能成为一个平台,让世界各地对开发和设计感兴趣的人聚在一起讨论我们所热衷的主题。

我将介绍一个功能,允许你(和Six Revisions网站上的其他人)查看你在网站上的评论历史。

我正在考虑实现的另一个功能是在评论区进行社交投票,这样社区就可以决定其他读者应该关注哪些评论。

此外,我还将开发一种方法,鼓励读者参与讨论,给那些经常分享重要信息并参与有意义对话的人一个特殊的角色,一对一的,等等。

目前,出于对网络性能的考虑,Gravatar支持已被禁用。

我在评论中回顾了我们更好的头像支持的选项。

路线图

我想谈谈从现在起你可以在这个网站上期待的一些事情。关于《Six Revisions》的未来,我有无数的事情想要与你们分享,但我无法在这篇文章中全部讲述,所以我将在后续文章中更详细地讨论它们。

愿景

我的使命是让Six Revisions成为开发和设计方面的领先信息来源,在这里你可以学习和更新与构建网站和应用程序相关的重要主题。

主要议题

以下是我们将以教程、文章、指南和其他形式的内容来涵盖的核心主题:

其他对开发人员和设计人员很重要的主题也会偶尔被提及。其中包括项目和业务管理,内容策略搜索引擎优化,以及通用设计和代码理论。

内容的改进

最需要关注的是网站的内容。

Six Revisions并没有定期发表文章,我需要马上解决这个问题。以下是我想改进的地方:

改进出版进度

现在,Six Revisions每周发表一到三篇文章。第一步是坚持每周发表三篇文章(周一、周三和周五)。

下一个目标是每周发表5篇文章(M-F)。

此后,Six Revisions将开始每天至少发布一篇文章。

改进创作体验

写作过程和对作者的激励需要改进。

必须精简和简化向出版物投稿的任务,以便《六版》能够定期发表高质量的文章。如果您有兴趣在Six Revisions网站上撰写教程和文章,请发邮件给我(电子邮件保护)

内容存档维护

我们已经发表了一千多篇文章。很多都是永恒的。

然而,许多内容也过时了,因为这就是开发和设计的本质,事物变化如此频繁。

我会想办法让我们的内容尽可能保持最新:不再正确的事实必须更正,断开的链接和其他问题将得到解决。

社区参与和透明度

没有你,就没有《六修》我会创造更多参与的机会,无论是在网站上引入新的讨论功能,还是只是在评论区、社交媒体和/或电子邮件中与您进行更定期的对话。

同时,我也会让你随时了解幕后发生的事情。

例如,我将开始发布季度报告,向您提供六个修订的状态更新。

设计

现在,在Six Revisions版本2的设计中仍然存在许多与ui相关的问题。

例如,当你在iOS设备上查看网站时,你会看到一些“jankness”,可能在其他我还没有机会测试的设备上(模拟器之外)。

我会在一周内解决这些问题。如果我可以问你一个忙:请在下面留下评论(或电子邮件给我),如果你发现任何设计问题。

非常感谢。我想做的其他事情与网站的设计:

  • 提高渲染性能:压力测试和基准CSS性能,并改善油漆时间
  • 提升网站导航体验:在版本2中引入了一些关键的站点导航辅助,比如菜单栏和更好的分页。我将创建更多的界面,使六版内容更容易导航。

代码

在前端开发方面,仍然需要做这些事情:

  • Web性能优化:CSS选择器和媒体查询需要优化,JS和CSS文件需要合并并压缩,六个修订的平均网页文件大小必须减少,网页字体必须移动到我们的CDN以减少DNS查询,等等。

    当我解决了“简单”的web性能问题后,我会进行更高级的WPO改进,比如使用内联CSS,这样只有渲染页面所需的样式规则才会包含在请求中。

  • HTTPS无处不在
  • 模块化样式表,使持续的站点开发更容易

WebFX职业

加入我们的使命,为全球各地的企业提供行业领先的数字营销服务-同时建立您的个人知识和个人成长。

我们招聘!
查看30+职位空缺!