
Web fonts, boy, I don't know - guessmyname
http://meowni.ca/posts/web-fonts/
======
mouzogu
I have had the exact experience in the last month. Being on a slow connection,
I've come to loath web fonts. There is nothing wrong with them in general but
it's just that they've come to symbolise over-indulgence and a myopia towards
the users actual task-focused needs as opposed to aesthetics.

Part of the issue is dealing with progressive enhancement as far as slow
internet connections go. How do you solve that problem? There is no native
browser API to my knowledge that does not depend on using JS which isn't ideal
imo.

Would love an attribute on script and link tags that could be conditional
based on connection speeds.

P.S Would also encourage those who have the choice to use system fonts
([https://medium.design/system-
shock-6b1dc6d6596f](https://medium.design/system-shock-6b1dc6d6596f)) instead
of web fonts. Seems more in-line with the spirit of the web and these fonts
are very well tested in general.

~~~
Declanomous
As much as I believe font matters, I really think people should just use
system fonts in general. No content is definitely more annoying than ugly
content, but I have a seething hatred for webpages who jump around as content
loads. "Let's click on this link... ah, not that link, let's go back. Yes,
this link... NO! STOP MOVING!"

Besides, I'm used to my fonts. I know your fonts are a deliberate design
choice, but I'm here for content. Maybe I'm just a neophyte, because I think a
smaller cleaner website is better than a reactive design that has to
constantly change to cram everything in. I don't care though, it's stupid when
I have to wait 10 seconds for a page to load on my home connection because
you've got so much crap going on, and all the while the content is jumping
around like a frog with it's butt on fire.

If your site sucks, I'm not going to whine about it on twitter, I'm just going
to stop visiting.

~~~
cperciva
_" Let's click on this link... ah, not that link, let's go back. Yes, this
link... NO! STOP MOVING!"_

This is my #1 complaint about reddit. Not due to fonts; but rather when I load
reddit on my phone, a "get the reddit app" banner appears... timed perfectly
so that my attempt to view my messages sends me off to the app store.

~~~
Mahn
Heck, this is my #1 complaint of almost anything on a mobile browser. It's
easily the worst offender when it comes to mobile in general; I wish browser
vendors put a bigger focus on fixing this, somehow.

~~~
theandrewbailey
Google is fixing it, but it's punishing them in search, not Chrome.

[http://arstechnica.com/business/2016/08/google-to-punish-
sit...](http://arstechnica.com/business/2016/08/google-to-punish-sites-that-
use-intrusive-pop-over-ads/)

~~~
eterm
Which will lead to the same hack as paywalled news sites, the ads won't load
when referred from google meanwhile the rest will suffer.

~~~
marblar
So users reaching a site through google have a better experience than users
accessing it through some other method? This seems like a pretty good thing
from Google's perspective...

~~~
DeadBabyOrgasm
Sounds like a good reason to build a plugin to always sets the http referrer
header to google.com on certain news sites.

~~~
colejohnson66
Is there any good reason for having the "Referer:" tag at all?

------
discreditable
My feeling on web fonts is that that they can sometimes look nice but aren't
worth the page weight. My approach is to pick two fonts I expect MacOS and
Windows to have, then fall back to generic. Other times, I'm more lazy and
just use the generic.

To put it more bluntly: [https://bestmotherfucking.website/#remote-
fonts](https://bestmotherfucking.website/#remote-fonts)

~~~
mos_basik
>that link

Nice. I was only familiar with the original one; I wasn't aware that there
were more. It appears to be the most recent one? I was hoping to find a
comprehensive list of this kind of site somewhere but didn't. I did find these
by following some breadcrumbs:

    
    
      1. http://motherfuckingwebsite.com/ [original]
      2. http://bettermotherfuckingwebsite.com/
      3. http://evenbettermotherfucking.website/
      4. https://bestmotherfucking.website/ [yours]
      5. https://thebestmotherfuckingwebsite.co/ [with extra satire]
    

I don't think #3 is a particularly strong example, though. I don't think it
looks _bad_ \- In fact I think it looks good; my personal site uses monospace
fonts - but I think it adds too much to make its point effectively.

#4's criticism of #3 is spot on, and its mention of Let's Encrypt, gzip and
caching make it my new favorite. Thanks!

~~~
dredmorbius
And one more:
[https://codepen.io/dredmorbius/pres/KpMqqB](https://codepen.io/dredmorbius/pres/KpMqqB)

------
jaredcwhite
Yes, web fonts often suck on slow connections. Meanwhile, on fast-ish
connections, I find the FOUC effect to be greatly annoying. That 1-2 seconds
of seeing Times and Helvetica and then seeing Freight Text Pro and Proxima
Nova drives me bonkers. I think there must be some kind of happy medium
between FOUC for faster connections and rage-inducing FOIC for slow
connections. Unfortunately, most devs (and sadly I claim to be one) don't test
their sites frequently on a range of connection speeds so it's common to have
badly-tuned font dynamics on sites.

Bottom line: as someone who cares about design and visual experiences, I _don
't_ think the answer is just accept and live with FOUC everywhere. Browsers
and dev tooling both need to improve in order to find that happy medium.

~~~
adambrenecki
I think the Chrome behaviour (display invisible content for a while, then
after a timeout render using fallback fonts) would be a happy compromise were
the timeout not three whole seconds.

font-display: optional and font-display: fallback (as linked in the article)
look like promising solutions to the problem (both recommend a FOIC aka 'block
period' of 100ms), but it'd be even nicer to set the exact duration of the
block and swap periods in CSS.

------
metafunctor
The HN crowd frequently compliments Stripe on their good looking, functional,
well designed web pages. The Stripe home page is 75% web fonts (432k).

~~~
syrrim
To be fair, 500k, at least compared to some webpages, is actually a fairly
small size. This isn't really a case where a percent of the total is useful.

------
tvon
I'm regularly annoyed by the flash when loading the Docker documentation, e.g.
[http://docs.docker.com/engine/reference/builder/](http://docs.docker.com/engine/reference/builder/)

It's annoying enough to warrant using Stylish to override the web font.

~~~
joshdotsmith
Is this because of the web fonts or because of markdown rendering?

~~~
tvon
It is the web fonts, if I override 'body' and 'body p' then it loads quickly
(the content does anyway, sidebars still flicker).

------
WorldMaker
I've been slowly adding the contents of Google Fonts into my system fonts
storage as I see them used on sites that I visit often. Things like Open Sans
and Roboto for instance are quite common.

I think there would probably be a good case for an extension to automate that
in some fashion for fonts with known open licenses (essentially anything from
Google Fonts, for example) to go ahead and just install them into the system.

There was at least one HN commenter I've seen that has claimed to just go
ahead and install _all_ of Google Fonts locally, which might be a bit extreme,
but even automating that isn't necessarily a bad idea.

~~~
jajern
If someone uses the Google CDN to load the font does the browser/website even
look to see if the font is loaded on your local computer?

~~~
chipotle_coyote
Assuming they're using pure CSS for the font loading (which is standard for
Google's CDN), yes, the browser will use a local copy in preference. (There's
a way to disable that in CSS's font spec, although it's hard to think of a
good use for that.)

------
mslev
For anyone missing the WW reference:
[https://www.youtube.com/watch?v=wvr1T1sFvEg](https://www.youtube.com/watch?v=wvr1T1sFvEg)

~~~
cs2818
After instinctively reading the headline in a Rob Ritchie voice I am realizing
I may have watched the West Wing too many times.

~~~
acchow
Currently on my fourth viewing of the series :)

It's the only show I can watch over-and-over again.

~~~
chipx86
I'm pretty sure I've seen it at least 10 times now. I may have a problem.

That said, it helped me get through a (terrible) US Government class back in
college. There's a surprising amount of useful information in that series.

~~~
paulcole
There should be a 10x club (support group?). I think I've seen it about that
many times, too. My favorite thing is how often Sorkin reuses the exact same
lines throughout all of his works. I'm assuming this is 100% intentional, but
haven't ruled out the possibility he was simply too high to remember what he
wrote previously.

------
rndmize
For God's sake man, don't leave a huge, fast gif infinitely looping where I
can see it while trying to read your blog post. Make it activate after I
scroll down to a certain point, or on hover, or _anything_ that doesn't make
me feel like I'm trying to read through a strobe light.

~~~
dictum
Honestly, gifs in blog posts instantly add 50 years to my age.

Before you give me the No Fun Allowed badge, let me explain:

I'm probably reading your post because I'm searching for something, in a hurry
( _software: it breaks apart!_ ). When I see a gif or beat-up meme in a
software-related post, it does the opposite of lightening the mood.

~~~
SquareWheel
It also does the opposite of lightening the page load. The amount of bandwidth
I've wasted due to silly animated gifs...

------
drinchev
Badly engineered, multi-purpose WordPress themes are my favorite on that
matter. Not only they make you download the entire set of assets ( Think of ~2
icon fonts, half a megabyte stylesheets, megabytes of JS and on top of that 5$
DO box serving all the PHP `magic` ), but also include some entrance
animations, which take additional time, before you focus on the content.

Actually this reminds me of the IoT DDoS attack. The low-tech users, making a
blog by clicking around and installing 25$ theme are actually unaware that
their website drains mobile-bandwidth.

So if you are developing one of these portfolio-with-landing-page-with-blog-
section-woo-commerce-supported mega theme, please consider optimizing assets
as your next priority.

~~~
shash7
Most of these are premade themes from themeforest or other similar
marketplaces. The devs have no incentive to optimize their themes as they are
usually bought by non-tech people and they don't know how adding five
different fonts in their website makes it really hard to load and render.

~~~
jamesdelaneyie
This is true, they don't understand how 5+ fonts make it hard to load and
render. But they do care about bandied about stats like 83% of people will
leave a site if it doesn't load in -0.3 milliseconds.

------
elcapitan
Are there actually font blockers like ad blockers? That would solve the
problem pretty easily for everybody who's annoyed. Although they probably
won't be available for mobile browsers, where it's the most painful.

~~~
gcb0
about:config

search for webfonts.enabled. change to false.

alternatively, install noscript extension to have a UI with whitelist.

if you are not using Firefox, then i have no sympaty. wait until google cares
about you.

~~~
leephillips
Also, in preferences, you can uncheck the box that allows sites to choose
fonts. After I saw your comment I fired up Chrome to check and was surprised
that there seems to be no option for this.

~~~
gcb0
Reason there is no option on chrome: google serves 99.9% of the fonts online
for "free".

That means every site with a custom font from google now leaks the page and
time you are accessing to them.

Same reason they forbid disabling 3rd party referrer on chrome.

------
makecheck
Are web fonts smart enough to download only the symbols that you’re using?
With Unicode growing all the time, and fonts supporting significant parts of
that total set, it would be insane to have to download hundreds of thousands
of symbols when you’re just trying to write a 3-word headline.

Another problem is aggressive filtering, oddly. I once visited China and found
my entire web site wouldn’t load; it turned out to be triggered by a font from
a Google domain. How silly for _content_ to be thrown out because an optional
_style_ element is unavailable. I have since stripped out all my Google
dependencies.

~~~
Raticide
Nope, I don't think so. It would be hard to pull off as you might be using the
font on an <input> and the user could type any character. Or you could be
pulling text in through an XHR and won't know in advance what characters will
be returned.

------
niftylettuce
For web fonts in emails, look no further than my latest package `custom-fonts-
in-emails` for Node.js.

[https://github.com/crocodilejs/custom-fonts-in-
emails#custom...](https://github.com/crocodilejs/custom-fonts-in-
emails#custom-fonts-in-emails)

~~~
timboslice
pretty cool. love the fast-levenshtein addition - can't tell you how many
times user error has killed me (used the wrong extension or missed a letter)

------
wickedlogic
I feel like all developers should be forced to load their site over Amtrak
wifi....

~~~
symlinkk
Chrome Dev Tools have an option to simulate loading over slower connections
(2G, 3G, etc). Not one for Amtrak wifi though ;)

------
Animats
Fonts ought to have Subresource Integrity checksums, and clients should cache
them effectively, even cross-site. It's not like they change much.

~~~
Klathmon
This has been tried and failed many times in the past with other things. The
biggest problems are with what a "canonical" version actually is, and
security.

Browser cache sizes are already too small to effectively cache things for one
origin for any significant amount of time, and when you try to introduce
cross-site caching you quickly run into a few issues.

The big one for fonts is that you very rarely include a WHOLE font in your
site, you generally include a subset of codes that you care about (if you are
targeting english speaking users, no need to include russian characters...).
But in addition to this, unless everyone everywhere agrees to load a specific
version, file encoding, file format, compression format, compression settings,
and more, the checksums will be so spread out as to be basically be useless.
While it's less of an issue with fonts vs something like .js files, it can
still be a problem.

And someone else already touched on the security issue, but to go into more
detail. At the very least, caching ANYTHING cross-origin lets any page you
load probe for things in your cache. To use a bit of an absurdist example, A
government website could try to load fonts used on a popular "terrorist"
website, and if it gets a cache hit, they can immediately be pretty sure you
have been on the site recently. The size of most caches, and the propensity
for people to clear their cache (or use private browsing) means that this only
gets more and more accurate.

It's one of those things that sounds like a great idea on the surface, but in
the end it would end up causing more issues than it solves. That being said, I
believe there is a proposal somewhere for a standard along these lines, but I
can't seem to find it any more.

~~~
Animats
_Browser cache sizes are already too small to effectively cache things for one
origin for any significant amount of time, and when you try to introduce
cross-site caching you quickly run into a few issues._

Oh? We have browsers eating a gigabyte of RAM now.

~~~
Klathmon
Which has nothing to do with cache sizes.

------
initram
I find web fonts so annoying, along with images that don't load until you
scroll to them. I usually read in Reader mode, and it takes the loaded page
and re-renders it without web fonts in a normal style. But when the site
doesn't load all the images, I end up missing half the article because I can't
see what they're talking about. So annoying.

------
skizm
Why are GIFs in articles a thing? Can anyone focus on the words while they are
looping in the corner of your eye? I always open the inspector and delete the
elements, but it is annoying to do that every time.

~~~
kmfrk
The GIFs are fine - although I get the impression that they weren't put
through an optimizer.

Converting GIFs to autoplay=false videos is still a miserable experience with
kinda awful results. Not to mention that it takes forever.

~~~
SquareWheel
Surely any screen recording software can output as a video format? Converting
from video > gif > video would produce a janky output.

------
frivoal
I blame the browsers. There's no deep reason you have to introduce a piece of
javascript to hide stuff from the browser so that it can load the page
normally, and then add back the fonts. If browsers cared about making the web
usable for everybody more than they cared about making web page look like
slick native apps, they'd do it for you.

The way browser internals work is already designed for that. if the network is
slow and you get only half the html, half the css, miss some images, or
whatever, the browser will render as best as it can with what it got so far,
and re-render when it gets the rest. The fact that it doesn't do that with
fonts sucks.

------
draw_down
In truth, if web design took seriously the constraint of bad network
connections, the result would be much different to what we have today. This is
but one example.

(And to be totally honest, if the author took that constraint seriously this
page would be different as well.)

But in that world, things would be less pretty and less flashy, and that stuff
means more to people than they would care to admit.

~~~
dictum
If there was a way to progressively enhance based on available resources
(connection speed, usage metering, device performance, battery charge) we
wouldn't have to compromise.

As it is, you either design something really bare for the worst connection
(which works for some content, but not all, and keeps us from effectively
using the power we have in our devices) and serve it for all
devices/connections, or design something for a mid-tier device/connection,
which amounts to a bad experience on weak devices/connections and an
_unimaginative_ experience on better devices.

------
mhd
I despise icon fonts with a raging passion. It feels like we're back in 8 bit
time where we're using sprites for things that Man Wasn't Meant To Do with
them.

Web fonts as real world fonts are kinda-sorta okay. Although it's yet another
area where "All the world's a VAX" can proliferate, when designers think
everyone's got the Windows font engine or their MacBook/iPhone's Hippidippi
display.

------
forrestthewoods
All web developers should be forced to spend a full week using their site on
each of LTE, 3g, and 2g. If your website takes more than 10 seconds to load on
an ad-block free LTE device you're fired.

Relevant: Page Weight Matters (2012) [http://blog.chriszacharias.com/page-
weight-matters](http://blog.chriszacharias.com/page-weight-matters)

~~~
Retra
There is absolutely nothing forcing people to use the internet through their
phones, so I see no reason to force developers to optimize for it.

Some people eat their food through a tube, but you wouldn't force every cook
to prepare all of their food to be eaten through a straw. And there you at
least have a moral argument.

~~~
forrestthewoods
Yes. Why would developers optimize for the platform that the majority of users
use? Truly a question for the ages.

~~~
Retra
_ALL_ web developers. All. That word means something.

Just because something is popular doesn't mean everyone needs to cater to it.

------
codedokode
I think the easiest solution would be just not to use web fonts at all. Do you
need fancy fonts on a website with technical documentation? I think you don't
but sadly PHP developers added a whole megabyte of fonts to PHP manual. As a
result one has to wait until the fonts are loaded to see the text.

And web fonts are often poorly rendered on Windows.

I want an option in Chromium that would allow disabling web fonts by default
and enabling them on a per-site basis (like it has an option for disabling
JS). And what surprises me most is that mobile browsers (which are often used
on slow and metered connections) do not have such options at all.

I remember old Opera browser that is now long gone had a lot of options to
make user experience better on poor connections (and a builtin domain block
list). Well, at those times internet users had higher average IQ and now
typical Internet user would not even understand what is the meaning of
"disable JS".

~~~
stomato
> I think the easiest solution would be just not to use web fonts at all.

Here's another option: plain text.

That's right. You can have webpages that are plain text without any HTML
formatting, and they will render.

Here is an example file:

    
    
      This is text.
    

This is the absolute best way of presenting web content. No one will complain.

~~~
wingerlang
> This is the absolute best way of presenting web content. No one will
> complain.

Not sure if this is a joke or not, most people would complain.

------
kutkloon7
I absolutely do not understand the need for 'web fonts'. Just specify a normal
font that most users already have installed in CSS, with some fallbacks.

'Progressive styling' is way more annoying (in my humble opinion) than waiting
some time. Pages like the verge can take minutes anyway, when the wifi is not
optimal. When you do things progressively, the page just keeps on changing,
and the page can't really be used. So if you have a long page with text, and
the user is somewhere halfway, the font loads and... BOOM! You are reading
text that is located 8 paragraphs from where you were reading one instant ago.

This is far more annoying with images which dont specify their size, but I
would still consider it bad practice to use an uncommon font for non-artistic
pages.

~~~
mcbits
The shifting page layout is a symptom of a broader problem, in that it's
impossible to accurately predict or specify the rendered dimensions of text.
Even measuring a container after the fact is unreliable because of the
arbitrary amount of whitespace in different fonts. You'd have to generate a
bitmap image and detect a bounding box around the pixels, which definitely
won't help with loading times. This can't be done at development time because
different browsers and system configurations all render the same fonts
slightly differently. So, even sticking with system fonts to avoid this one
symptom, we have this giant elephant in the room making it difficult to ensure
anything but the most primitive layouts will be legible across devices.

~~~
wallacoloo
Seems like it could at least be mitigated on the browser's side though: "This
text was at the top of the viewport before the restyling, so let's scroll the
document to the point where that text still appears at the top."

~~~
tmnvix
The text in column 1, 2, or 3? Or perhaps you were reading the text in the
footer at the time that the page decided to slap on its makeup?

~~~
wallacoloo
Yeah, so it clearly can't solve everything, hence "mitigate" instead of e.g.
"completely solve". In any case, I'd argue that 90% of the time it's better
than doing nothing at all.

------
mrec
I had a very strong impression that the quality of Web typography took a
colossal nosedive when web fonts became a thing. My suspicion at the time was
that this was largely a result of designers pushing pet fonts that looked fine
on their Mac but like crap on other OSes (due to different rendering/hinting
algos); can't prove that, though.

I did try disabling web fonts in Firefox, but then that semi-broke sites like
GitHub who seemed to think that using them to display UI button images was a
good idea. This is why we can't have nice things. And why designers are
sometimes held in less esteem than they might like.

------
CoolGuySteve
I had the exact same problem in China last month, only worse because I was
also going through a crowded VPN. The only page I could reliably load before
losing patience was Hacker News.

The best workaround I found was to load Opera Mini and crank up the
compression proxy. It's annoying though, if Opera Mini can automatically
compress the page's imaging and formatting, why can't the web server do the
same?

We can nag designers/developers all day long about web fonts and whatnot, but
at the end of the day, only an automated solution is going to actually get put
into regular use.

------
tribby
it's easy enough to edit web fonts to include only necessary characters, but
most EULAs won't allow for this. any font licensed under the SIL open font
license is fine, though you may have to change the font's name if it has a
reserved font name (check the license file). this makes a _huge_ difference
(fonts under 10k), but no one ever bothers to do it. not sure if inlining them
as base64 in your CSS and serving with gzip would help much more.

a lot of the stuff that we do in font editors is going to start happening in-
browser. variable fonts that use two masters (the thinnest and heaviest font
weights) to interpolate all the other weights in-browser are an emerging
standard that will get font sizes down[0]. you're essentially being sent two
fonts over the wire that can generate quite a few more. font files are bloated
in a number of ways. eventually we'll have a standard where diacritics like ¨´
etc can automatically be added to letters without the need for an entirely
separate glyph. (å,a,á,ä, are currently separate, which is very expensive).

google, adobe, and other big players are hard at work on this stuff, and it
won't be long. there are pain points now, for sure, but to me this isn't an
argument in favor of system fonts. most of web design is typography design,
and anyone who says otherwise probably hasn't been designing for the web very
long.

0\. [http://blog.typekit.com/2016/09/14/variable-fonts-a-new-
kind...](http://blog.typekit.com/2016/09/14/variable-fonts-a-new-kind-of-font-
for-flexible-design/)

------
vbezhenar
Web page should just disable web fonts, if they are not loaded after 1 second
and reenable them, when they are loaded. It's not hard to do and it's greatly
improves usability. Actually it would be nice, if browsers would do it
automatically, show system font, if web font is not cached and it's not going
to be ready in the next few milliseconds. Anything better than white page.

~~~
metafunctor
Chrome does something like this already. I think it's something the browser
should take care of, rather than having every site use some half-baked JS
solution which ends up just adding to the bloat.

------
hpaavola
What fonts are available in recent versions of all major operating systems? So
what are the "web safe" fonts of 2016?

~~~
Freak_NL
There are no more guarantees about which font is installed, although you will
probably get a decent match if you use one of the old Microsoft core fonts
(Verdana, Times New Roman, etc.). Just don't expect the exact font; often you
will get a font that matches the metrics for the one you've chosen as a fall-
back for those (once) popular fonts.

In any case, you can always safely specify one of these font groups: sans-
serif, serif, monospace. These will give you the user's default font for that
broad category of typefaces. No guarantees about which font you will get
though.

If you do want to leverage installed fonts, you can craft a decent so-called
font-stack that will cover a lot of fonts typically installed on various OSes.
For instance, you might specify:

    
    
        /* Just an example, these do not necessarily match. */
        "DejaVu Sans", "Bitstream Vera Sans", "Droid Sans", Verdana, sans-serif;
    

Again, no guarantees, that is why we have web-fonts.

Also, I am probably missing something, but don't you just get the fall-back
font (e.g., whatever matches sans-serif) with a web-font as long as you
specify one? Isn't that common CSS knowledge among developers?

~~~
angry-hacker
You do get fallback but might experience FOIT and other nasty things.

------
okonomiyaki3000
As she's in Taiwan, she might have mentioned that webfonts, despite any pros
and cons they have for western language sites, will never (never say
"never"...) be useful for Chinese or Japanese sites. A bit off the topic of
the article but maybe adds some perspective. Or not.

------
niftich
The gripes are valid and some of the links about fixing it are good content.

I'm starting to sound old, but "back in my day" people would use the 'media'
parameter in link tags to load mobile-specific stylesheets. Has this practice
died out? If so, why?

~~~
angry-hacker
You can do it but designers want consistency on every device pixel perfect bla
bla. All major OS providers should included in all the Google fonts by default
and we can move on with our lives.

------
williamsharkey
I wish that system fonts could be told the size of the characters of a web
font upfront, before the web font was loaded. The system font's glyphs should
smoothly fade/morph into the target webfont once it is loaded.

To solve the problem generally would be difficult or equivalent to the
effort/data required to download the web font in the first place, but there
may be a quick and dirty solution that covers 99% of text in the wild. The
easiest case is monos paced fonts. Is there really an excuse why the system
font can't be told via Css what spacing/height to use to match the target
webfont?

~~~
williamsharkey
To be more explicit, it is insane that we find it acceptable for text to
reflow/ break over lines at different points once the web font is loaded.
There is something that bugs me -- On the one hand we are being considerate
and trying to make the reading experience pleasant. On the other hand we are
being careless creators of jank. Maybe jank is something that primarily
irritates nerds and I am overreacting.

------
b1daly
I'm mystified by how many major sites have terrible usability issues on mobile
devices that are used widely. (older iDevices cheap-mid level Android phones).

Are the proprietors of these sites, which live and die on their traffic,
actually unaware of how bad the experience is?

Or are the proprietors oblivious because they always have the latest iPhone or
Galaxy? Are the developers oblivious too, or are they keeping their bosses in
the dark?

Or are the business requirements for the sight so absolutely needed, and it is
simply hard to make it work?

Anyone able to venture a perspective on this?

~~~
jonatron
>Are the proprietors oblivious because they always have the latest iPhone or
Galaxy?

Probably. They can say "I've checked it on mobile".

------
rocky1138
This is one of the reasons I browse with all web fonts disabled.

~~~
cm3
My primary reason is that I don't view a page on the same display and machine
as the author, so more often than not the presentation is sub-optimal or
entirely unreadable locally. Custom fonts are similarly abused like low-
contrast text (grey on white).

Also loading via JavaScript and changing the fonts of an already rendered page
disrupts my reading. If you want remote fonts, load them from the beginning,
or if this isn't possible, just don't, please.

Another justification for disabling remote fonts is that it's one security
critical interpreter of complex data which, when disabled, doesn't adversely
affect the presentation, whereas on most pages disabling images does and
cannot reasonably be disabled. The latter justification may go away with
Mozilla's Oxidation efforts with time, leaving just loading time and
readability as arguments.

------
ivanhoe
Problem is that lazy loading will introduce a flicker on fast connections or
if the font is already in browser's cache since re-rendering of the page takes
some amount of time (more content, slower it will be). And if you have
multiple pages, this means this will affect even people on slow connections on
every page except the first one. So it's not a win-win solution, one side will
have more or less degraded experience.

------
iamandoni
That invisible ink at the top is a good subtle touch.

------
innocenat
One thing this completely missed are non-Latin script. For example, the
default Thai font on Windows is just plain ugly.

------
lacampbell
Off topic, but the first paragraph mentioned using 2G mobile internet in
Taiwan... why!? 4G is cheap and plentiful there.

[https://guidetotaipei.com/article/cell-phones-and-sim-
cards](https://guidetotaipei.com/article/cell-phones-and-sim-cards)

($100 TW = $3.18 US)

~~~
notwaldorf
I was roaming! T-mobile gives me free 2G when roaming, and I don't like
temporary SIM cards because nobody knows how to call me if there's an
emergency :(

------
rcarmo
I just gave up on web fonts and go with Georgia, Arial and a sensible set of
fallbacks (although I try Menlo instead of Courier first, because it's ugly in
retina)

------
daodedickinson
Ehhh. Slowness has its benefits. But you need to know the fallout that will
result.

------
incompatible
I got a message from my provider to say they are closing down their 2G network
next year since hardly anyone uses it and they want to reuse the bandwidth for
something else. Maybe this protocol will die out soon.

------
Illniyar
When you hover on the links they flash like a 90's era webpage horror, why? is
this what the cool kids do now?

------
jacobmischka
Really love the title, nice article.

------
Crenchaw
Custom fonts and web fonts are fine... if they are stored on the same web
server, so they load with the document.

Images are fine... if you specify the width and height so the page doesn't
jump around while the page loads.

Menus and top bars that change when you scroll down are never acceptable. It's
distracting and unnecessary.

Goofy background and image effects in general are very annoying if they are
synced with page scrolling. It reminds me of a child's pop-up book.

------
tyingq
A 1.2 MB blog post complaining about bloat.

~~~
BinaryIdiot
You do realize sometimes it's _okay_ to have a page larger than, say, 50kb.
Right? The gifs were a great way to show the exact issues she was discussing
and they take up the bulk of that space. So why is that a bad thing in any
way?

Yes web pages should, _ideally_ , be small but that doesn't mean the media
they show to the user has to be small as well.

~~~
tyingq
>You do realize sometimes it's okay to have a page larger than, say, 50kb.
Right?

50KB isn't anywhere near 1.2MB. Did you mean 500KB?

The blog post specifically mentioned an experience on a 2g connection, and the
bloat associated with webfonts.

Webfonts seem to typically be in the 50KB - 150KB range.

I just find it ironic to complain about bloat from one type of artifact, in a
blog post that uses even larger artifacts to make that point.

~~~
spankalee
The article's point is that all text not rendering cripples a page. Not seeing
a specific image for a while, especially one that's relatively optional, is
fine.

------
DocTomoe
> awesome free roaming 2G

So instead of fixing the real problem - which is obviously connectivity - we
need to break the web and add another layer of Javascript complexity to
something that works perfectly fine without.

It's 2016. 2G is 25 years old (started in 1991!). Stop being cheap. Stop
working with 2G.

~~~
bakli
I think you're used to the developed world. Here in India, most of the places
(except big cities) only get 2G. 3G towers are being laid and will probably be
operational in 2-3 years.

------
JepZ
If she cares so much about the experience, why does she use an iphone after
all?!?

------
NumberCruncher
Tl;dr: if you are travelling in a foreign country and you think about whatever
fonts... girl, you are doing it totally wrong. Buy a city guide, printed on
good old fashioned paper, even if it is so 1990, and get a fuck off-line! Or
just talk to the natives! In person!

~~~
jamra
I think you are a bit off with your comment. Having a web connection makes
traveling much nicer. The authors mistake was not pre purchasing a data sim
with a fast connection. Amateur traveler complaining about nonsense

~~~
NumberCruncher
The next time I pick up a chick I chatted up on a trip and I can't find back
to my b'n'b because we both are so wasted and I don't have internet connection
to use google maps I hope you will be there. At first to be able to use your
4G phone and at second to prove you how wrong you are.

~~~
jamra
Did you read my comment? Get a data plan before you travel and you'll be slow
internet proof.

~~~
NumberCruncher
Did you read my comment? I do not want to be [paste an "indispensable" first
world service] proof if I am in a foreign country because it kills the
advanture and makes me thinking about fonts and cats.

