Mobile app version of vmapp.org
Login or Join
Si6392903

: Why does Boostrap 3 use Helvetica Neue? My understanding currently is: "Helvetica Neue" is Linotype font. That means it needs to be paid for and is not free to use. It is also a font that

@Si6392903

Posted in: #Css #Fonts #Html #WebFonts #WebSafe

My understanding currently is: "Helvetica Neue" is Linotype font. That means it needs to be paid for and is not free to use. It is also a font that is not for web, it is for print. It will not render well on a range of devices, for example, PC users browsing with Chrome or IE. Helevtica Neue is particularly poor at rendering in small sizes.

And yet right in Bootstrap v3.3.5 we see

body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
...
}


And if I look for the "common" cross browser font declaration of the likes of:

@font -face {
font-family: 'Helvetica Neue';
src: url('Helvetica-Neue-webfont.eot');
src: url('Helvetica-Neue-webfont.eot?#iefix') format('embedded-opentype'),
url('Helvetica-Neue-webfont.woff') format('woff'),
url('Helvetica-Neue-webfont.ttf') format('truetype'),
url('Helvetica-Neue-webfont.svg#Helvetica Neue') format('svg');

}


It is no where in any Bootstrap file, nor does Boostrap provide .eot,.woff,.ttf or.svg files for Helvetica Neue via CDN or download.


Why does Twitter choose to use Helvetica Neue when it is not a Web Friendly font?
How is Twitter delivering Helvetica Neue to browsers if there is no .eot, .woff, .ttf or .svg files being requested to a CDN or included when downloading Boostrap?

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Si6392903

1 Comments

Sorted by latest first Latest Oldest Best

 

@Shelley591

That Helvetica Neue doesn't render well on screen is mostly a matter of opinion. A valid opinion, but less so today than in the past now with the onslaught of high density screens. Apple had been using it on iOS for quite a while, for example.

Also note that these are not 'web fonts' in that they are being served from the server. Bootstrap is merely using standard CSS font-stacks. It uses Helvetica Neue if it's on the end-user's system, but if not, it goes on to the next font on the list.

So, to answer the questions:


Why does Twitter choose to use Helvetica Neue when it is not a Web Friendly font?


Many would argue it's web friendly. As to why it was chosen for bootstrap, it's likely because twitter uses it on their own site. It's their framework, so that makes sense from a purely branding standpoint.


How is Twitter delivering Helvetica Neue to browsers


It's not. It's merely a CSS declaration. As noted above, it only uses it if it's installed on the end-user's machine.

Finally, keep in mind that this is a framework. The idea is that it's a great place to start, but by no means should dictate your visual design entirely.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme