TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

Bringing “The Elements of Typographic Style” to the Web

59 点作者 crepererum超过 3 年前

15 条评论

oefrha超过 3 年前
Unfortunately this blog is hardly a shining example of web typography. 16px Cormorant used throughout has a very small x-height and very thin strokes, making for terrible legibility. I looked at this on both macOS and Windows on a high DPI screen as well as an iPad, the experience is universally poor; I suppose it would only be worse on a low DPI screen. Any user agent stylesheet is way more legible than this design. And this complaint is coming from a young person with good eyesight who routinely trade font size for more content on screen.
评论 #28402179 未加载
评论 #28401255 未加载
评论 #28401760 未加载
评论 #28401508 未加载
评论 #28402182 未加载
评论 #28401352 未加载
评论 #28401873 未加载
评论 #28402236 未加载
评论 #28401318 未加载
necovek超过 3 年前
I am happy to see somebody else taken aback by The Elements of Typographic Style similarly, but I would hope that instead of blindly applying some principles (eg. line height restriction makes sense on printed pages which are next to each other, and when you can sometimes see through the paper), they are of limited use on the web (maybe in multi-column layouts for line height restriction).<p>Instead of just translating suggested style into CSS&#x2F;HTML&#x2F;JS, I&#x27;d appreciate an exploration of <i>why</i> something is useful in print, and how that translates to digital screens.
评论 #28403169 未加载
gerikson超过 3 年前
<a href="http:&#x2F;&#x2F;webtypography.net&#x2F;" rel="nofollow">http:&#x2F;&#x2F;webtypography.net&#x2F;</a><p>Created in 2005, open-sourced in 2014
评论 #28402562 未加载
评论 #28402387 未加载
Ardren超过 3 年前
I really don&#x27;t like commenting on style over substance. But the font choice for the blog makes it hard to read on a normal DPI screen. Some characters, like the uppercase titles, render extremely poorly.<p>I can only assume this looks better on designers&#x27; computer?
评论 #28401381 未加载
评论 #28402359 未加载
myfonj超过 3 年前
Do you find those light-on-black code blocks in dark-on-white context OK?<p>I know nowadays it&#x27;s almost a &quot;standard&quot;: dark colour scheme for coding environment is truly widespread (mostly I stick to it myself) but on &#x2F;bright&#x2F; page about typography it feels weird: I thought typography relies on visual balance and &#x27;airiness&#x27;, and seeing super heavy black rectangles on page promoting good typography is … strange.<p>(I generally consider alternating bright and dark blocks in same page really bad design choice, because it produces aggressive contrast switches putting unnecessary strain on my eyes, but is seems it&#x27;s just my deficiency.)
yummybear超过 3 年前
For a blog about typography the text sure is difficult to read, on my monitor at least.
Veen超过 3 年前
Lots of comments saying the font is hard to read, but I don’t find it to be so. Perhaps a difference in browser rendering? Overall, I think it’s a job well done, and I’m much in favour of old-style serifs and justification on the web instead of yet another boring sans-serif left-aligned page.<p>Elements of Typographic Style is one of my favourites too. However, I’d suggest that for web publishing, Butterick’s Practical Typography might be a better guide than Bringhurst, who was primarily focused on print.
评论 #28401843 未加载
评论 #28401486 未加载
jstrieb超过 3 年前
Kudos to the author for challenging themselves to apply best practices, especially on the web where everything looks slightly different for everyone! As other comments show, this is not an easy task to take on.<p>I also read Bringhurst&#x27;s book and found it eye-opening. Even though the author (crepererum) notes that you&#x27;ll see bad typography everywhere after reading it, which is true, in my case it also had a converse effect: physical books became much more magical. Since learning about the techniques and best practices when typesetting for print, every book now feels more like a work of art to me.<p>And like the author, I was inspired to apply the practices from the book to a concrete project. In my case, I created a LaTeX template since I was typesetting a lot of math homework in college at the time.<p>The book is well worth reading for any lover of physical books, especially for those without prior background in design. It was also well-written and overall a joy to read.
pmontra超过 3 年前
The general look of the page is nice. Two critics:<p>1. The font is too thin (Firefox on a Samsung A40)<p>2. I tried to pinch to zoom to compensate but the page doesn&#x27;t zoom.<p>Luckily reader mode works. It doesn&#x27;t look as nice but it&#x27;s easier to read.<p>2.5 I&#x27;m not sure the left and right margins are needed. If I could zoom I&#x27;d have zoomed the text to fill the page.
评论 #28405215 未加载
wruza超过 3 年前
Web is still missing a few important things like baselining (…:baseline doesn’t work through a hierarchy of containers or between a label and an input) or sub&#x2F;superscripts (²) that do not change the base line height.<p>Edit: ² here is a regular height unicode char, I was talking about &lt;sup&gt;…&lt;sup&#x2F;&gt;
deltron3030超过 3 年前
Serif fonts are always too busy at small sizes, Rosario (free on Gfonts) works well for a classic sans look.
enriquto超过 3 年前
I still have to see a website that looks better than the default browser styles. Just leave your CSS empty (unless required for some functionality) and enjoy the pure, raw, unadulterated look of the internet.
mro_name超过 3 年前
while I don&#x27;t buy the article on typography, the surrounding site was interesting, thanks for sharing!
keithalewis超过 3 年前
Is there a hyphen in anal retentive?
hyperstar超过 3 年前
Web pages shouldn&#x27;t have typography, and typography shouldn&#x27;t have 100 characters per line.
评论 #28406226 未加载