Member Avatar for HoverportMedia

Hello everyone again, I'm getting back into the web-design world once again (after being absent for some time) and I'm striving to understand some of the true professional core web-design tactics used throughout the web.

My question today relates to the famous font: "Helvetica Neue".
According to CSS Font Stack, which can be found here: http://cssfontstack.com/
Helvetica Neue seems to be a "web safe font".

What I'm not understanding is that even with that special line of placed in the html or body css elements:

font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

Now while my understanding of font-families in the web design world are semi-limited (yes there are some simple basics I don't even know, it happens) does that mean the "Helvetica Neue" font will default and display even on the most updated browser? Or is it destined to default down to Arial a majority of the time (provided the user doesn't have Helvetica Neue or Helvetica installed on their machines)? Some websites, (i.e. Hubspot) will have their fonts displayed regardless whether the font is installed on the machine or not (Which I'm imaging what we would call a web-safe font and whether thats the CSS or JS enabling it to happen - I'm not sure.) It's not to say I can't download the font, upload it to my website for compatiable viewing, but that doesn't seem like the most appropriate tactic.

The follow up question to this, does anyone have any good books and/or regarding web-design font tactics? I'm always looking to explore as much as I can in my field.

  • 2 Contributors
  • 6 Replies
  • 667 Views
  • 1 Week Discussion Span
  • Latest Post Latest Post by HoverportMedia

Recommended Answers

All 6 Replies

Member Avatar for cereal

Or is it destined to default down to Arial a majority of the time (provided the user doesn't have Helvetica Neue or Helvetica installed on their machines)?

Correct.

But you can include a font from a remote server, check for example at Google Fonts: http://www.google.com/fonts

Member Avatar for HoverportMedia

Thanks for the response cereal, do you know how web-designers most handle the situations where they want to use Helvetica Neue in their websites?

Member Avatar for cereal

Yep, you have to buy the license to use it as webfont and then you apply it to the website through the @font-face attribute. In order to work you need to host the file in your server or in a CDN (Content Delivery Network).

For the license check here:

If you click on Webfont View you can read the license agreement, this is important because it explains how you can use the font. In some cases, for example, you cannot use a font to create a logo or for commercial sites.

Additional note: if you go through the above link and read the licensing tab, you will see that they allow the webfont for 250000 views and after that the font must be bought another time.

Edited by cereal
Member Avatar for HoverportMedia

Okay, time to think of a Plan B! Besides Arial, what other webfonts (perferably free ones) resemble Helvetica Neue? (I have a feeling Arial is my best bet.)

Member Avatar for HoverportMedia

Thanks a ton cereal. I'm liking the Roboto font as I already have the Lato font downloaded. :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.