优化首页样式 #624
优化首页样式 #624
Conversation
|
这个真叫人纠结。我有点倾向于反对……但我有主观判断的嫌疑。 我觉得这些图标占了位置但传达的新信息量非常有限，换句话说，没有图标，读者应该不会疑惑，比如 2017/07/15 必须是日期呀，后面必须是作者呀，一定得画个钟才能确定是时间、画个人像才知道是人么。 分类名称前面的标签图标，我觉得让文字不能统一靠左对齐，也不太美观，另一方面，分类信息也可以不必强调，标题和摘要才是整个页面中最重要的元素，我不倾向于让满篇元素全都是重点，读者来了被各种元素吸引注意力。 至于分页导航处，我觉得挺好看，但边际收益有限。 所以我个人没有异议的只有行距的调整了…… |
|
对，这些都是我预期会有的问题，所以想做个 PR 生成预览，然后听不同人的意见。目前的版本是跟着感觉来的，只要其中有一部分能提高效果就达到目的了。这个 PR 我会保持打开一阵子，吸取意见之后再做决定。 |
|
好的。很明显我最近处于一种比较极端的状态，奥卡姆剃刀非常锋利 🔪 |
|
我其实是偏向B的... |
|
对齐应该是字体的锅，这种英文字体比较往下沉，跟中文有区分，你可以看正文里面其他中英混杂的时候是什么样的。 |
|
啊, 好像是这样.... |
|
我觉得图标显露出来的是一个时代病。没错，我反对的不是在座的某个人，而是这整个时代：注意力分散。我觉得我们要拷问自己灵魂的问题是：给读者五秒钟时间，你想让她的眼睛看到什么？ 图标如果是用来做链接（比如 Github、微博、微信链接），我毫无异议，因为它有自己特有的功效；如果是用来做装饰，我觉得可以商榷。我支持图标的情形是，页面文字信息非常混乱，需要用视觉方式给文字做一个分类，导航读者的眼睛；我反对的情形是，文字已经很少量、很整齐了，图标从信息的角度来说纯属冗余，从装饰的角度来说效果也有限。 @ksxinyuh 的意见：
我的问题是，这几样信息的重要性排序是怎样的？标题、摘要、日期、作者。换句话说，我们对什么样的元素优先进行视觉区分？还是说所有的元素都需要划重点？ 我可以接受日期标题作轻微的 CSS 调整，但我觉得这两个图标实在没有必要。 |
我同意从信息角度来说冗余, 展示效果我认为是和之前相比要好, 因为我没有看到装饰效果更好的PR, 所以我认为这个效果是我满意的.
我认为重点是标题和摘要 日期作者分类没那么重要, 那就让他们负责好看, 和重点内容有所区分 比如我想读一篇文章的摘要
改之后会读:
所以对我来说这个东西又好看了, 摘要内容又突出了, 所以可以接受 |
|
重要性排序，可能每个人阅读文章的习惯不同。像我，一般会看 标题-作者-正文，而跳过日期。所以我觉得把这些分开表示比较好。比如说像陈松蹊老师那篇访谈 2017/05/17 COS 编辑部 这样数字英文中文都在一起，视觉就不太清晰，加上图标感觉会好一些。而且我觉得这两个图标也比较简洁，增加不很多复杂度 |
|
同意楼上大为的观点；关于标签，我倒觉得分类名称前面的tag很必要；关于时间和作者信息，应该和摘要有区分，所以B版的字体和颜色我都很喜欢，以及有标签肯定是比没标签要好看一些，但我觉得不是必需的。 |
|
我觉得修改后看起来反而更清楚美观。分条说： |
|
|
投票的话我支持没有图标，比较简洁，年纪大了眼花容易晃眼啊实在是…… 觉得已经很好了！！！感谢程序猿小哥哥 |
|
@PuddingNnn 老泪纵横，好像 COS 全体只剩我们两个人老眼昏花了。 园主的摘要少一截是因为她的文章第一段有好多英文单词，而英文的一个字符比中文窄很多，所以截取前200个字符之后，她的摘要会比纯中文的摘要看起来短很多。这个问题也许可以解决，但不是特别方便。最直接的办法是人工写摘要，然后在 YAML 里面加上选项 分类信息我已经有意淡化它的视觉影响了，字体缩小到90%并且颜色变灰。放在那里的作用是展示统计之都文章的栏目品牌，就像报纸一样，体育专栏，新闻专栏，等等。它对读者的重要性可能不如对我们自己的重要性大，我们自己对自己的分类不够清晰，挖人挖文章就会非常随意和随机，有了栏目指导，找文章也更有目的性，这是个管理问题（#609）。 搜索问题可以给你做得更方便，比如点搜索的菜单之后直接弹出搜索框。你可以新建一个 Github 事项专门讨论。 |
|
如果我理解正确的话现在还剩翻页器最后一个问题。说实话我不是很懂这个语境下成本和收益是什么意思。代码和字体我都准备好了，如果确实更美观了一些直接用上不就是了……用 JS 无非是不想动现有的模板，如果愿意的话 JS 都可以不用，全是静态的格式，CSS 加模板完全可以实现。当然如果目的是不用任何额外的资源的话我也没意见，说清楚就好。 |
|
表面成本：字体、CSS 和 JS。潜在成本：维护代码、讨论。收益：让四个按钮变得好看。就目前这个 PR 的代码量来说，我个人觉得性价比有点低。我觉得一个元素外在的地位和内在我们以代码和工作量来衡量的地位应该能大致匹配。如果只看外在，很容易掉进琐碎律的陷阱：https://en.wikipedia.org/wiki/Law_of_triviality 比如这个 PR 的问题是所有人都可以直观看到的，所以讨论容易无休止（就像讨论自行车棚应该刷成什么颜色一样）；而真正重要的问题，比如分类该怎么设置、理事会职责问题，因为思考起来会死去活来，所以大家就倾向于不发言。我这不是批评，只是提出这么个现象，各位看是否有道理。 当然，如果去掉 JS 换成改模板，性价比会变得更低，因为它的代价是更可怕的一坨 Hugo 代码：https://github.com/gohugoio/hugo/blob/deccc540/tpl/tplimpl/template_embedded.go#L125-L166 所以我的意见是，如果能以更轻便的方式实现这四个按钮，我双手赞成。也许你可以考虑更灵活的 CSS 选择器：https://www.w3schools.com/cssref/css_selectors.asp 用 抱歉，我说了太多不，你们一定觉得我超级蛮横，但我只是在蛮横地坚持优先级。如果觉得没道理，我完全可以接受点击合并按钮，翻过这篇去办别的事情。毕竟大家都是在尽力为 |
|
然。 |
|
最后再顺带提一个 issue。不知道有没有人发现，目前的翻页器不是页面居中的，因为 |
|
@yixuan 居中对齐这个问题请你把修正直接推到 master 分支吧。谢谢！ |
稍微优化了一下首页的样式，比如增加作者栏行距，调宽翻页器使得手机上触摸更方便，以及引入了若干小图标。
可能比较有争议的是引入小图标，有过度丰富化的嫌疑。不过我觉得一些轻量的图标还是可以让一些页面元素更直观和突出，比如标签和作者，而且让页面显得更“现代”一点。总之我还是把这个 PR 放上来，是否采用可以看大家的投票意见。图标字体只包括了要用到的图形，字体和 CSS 总共加起来不到 3K，所以基本不占资源。