我最近更新了博客的主题,我觉得我应该发一个帖子,不仅记录原因,还为将来存档更改前后博客的图片。
当我创建这个博客时,我选择nikhil-theme作为主题,因为我发现它简约又漂亮。 (当我将字体切换为与https://www.thirtythirdforty.net/博客中的字体相同后,甚至更漂亮)
然而,相当长一段时间后,当我查看主题的模板 HTML 文件时,我惊讶地发现这个非常简单的主题包含 JavaScript。我尝试加载删除了 JavaScript 的页面,发现只需要让汉堡菜单在移动设备上展开即可。这让我不太舒服。像这样的简单博客根本不需要任何 JavaScript。我发现更烦人的是,只因为一个功能而需要它。
当时我已经对博客进行了其他更改,并不期待完全切换主题,所以这个想法一直留在我的脑海中,直到最近,当我终于决定对此做点什么时。
为了决定博客的新主题,我首先浏览了pelican-themes (我最初发现 nikhil-theme 的地方),但只找到了一两个不使用任何 JavaScript 的主题,而且它们对我来说并没有真正的吸引力。
最终我想起了seirdy.one博客。这是我关注的一个博客,其中有精彩的文章,并且有一整页关于该网站遵循的设计标准。这些标准侧重于极简主义、兼容性和可访问性,这些都是我希望我的博客具有的品质,所以我决定在我的博客中采用 Seirdy 的主题。
查看seirdy博客的源代码,我注意到它使用Hugo静态站点生成器,而我的博客使用pelican ,因此适应这个主题不仅仅是简单的复制粘贴。
理想情况下,我会浏览 Seirdy 的 HTML 模板并理解它们,这样我就可以将它们改编成我的 Pelican HTML Jinja2 模板,但老实说,我没有那么多精力。所以我采用了懒惰的解决方案:我复制了 CSS 文件并调整了我的模板,直到网站看起来足够好。这意味着我可能没有遵循 Seirdy 的许多标准,但至少网站更精简,没有任何 JS(甚至外部 CSS),这是主要目标。
由此产生的源代码更改可以在此提交中看到(以及后续修复的此和此)。
至于网站本身带来的变化,下图分别展示了主题更改前后的不同页面。
主页:
一篇博文:
标签:
关于:
我不会撒谎,看到旧主题消失我已经感到怀旧和有点悲伤,但我相信让网站变得更加简约是值得的。
此转换中丢失的一件事是代码片段的语法突出显示。我认为出于可访问性问题,Seirdy 故意避免了它,但我应该在某个时候确认这一点,如果情况并非如此,则考虑将其添加回来。
尽管还有一些细节需要解决,但我对这一更改非常满意,并且在看到此博客时特别松了一口气,因为不再有 JavaScript 运行。
原文: https://nfraprado.net/post/a-new-theme-for-the-blog-now-with-0-javascript.html