• Log InLog In
  • Register
Liquid`
Team Liquid Liquipedia
EDT 11:06
CEST 17:06
KST 00:06
  • Home
  • Forum
  • Calendar
  • Streams
  • Liquipedia
  • Features
  • Store
  • EPT
  • TL+
  • StarCraft 2
  • Brood War
  • Smash
  • Heroes
  • Counter-Strike
  • Overwatch
  • Liquibet
  • Fantasy StarCraft
  • TLPD
  • StarCraft 2
  • Brood War
  • Blogs
Forum Sidebar
Events/Features
News
Featured News
Code S RO12 Preview: GuMiho, Bunny, SHIN, ByuN3The Memories We Share - Facing the Final(?) GSL21Code S RO12 Preview: Cure, Zoun, Solar, Creator4[ASL19] Finals Preview: Daunting Task30[ASL19] Ro4 Recap : The Peak15
Community News
Weekly Cups (May 19-25): Hindsight is 20/20?0DreamHack Dallas 2025 - Official Replay Pack8[BSL20] RO20 Group Stage2EWC 2025 Regional Qualifiers (May 28-June 1)17Weekly Cups (May 12-18): Clem sweeps WardiTV May3
StarCraft 2
General
The Memories We Share - Facing the Final(?) GSL How does the number of casters affect your enjoyment of esports? Code S RO12 Preview: GuMiho, Bunny, SHIN, ByuN Can anyone explain to me why u cant veto a matchup Karma, Domino Effect, and how it relates to SC2.
Tourneys
DreamHack Dallas 2025 Last Chance Qualifiers for OlimoLeague 2024 Winter [GSL 2025] Code S:Season 2 - RO12 - Group B EWC 2025 Regional Qualifiers (May 28-June 1) [GSL 2025] Code S:Season 2 - RO12 - Group A
Strategy
Simple Questions Simple Answers [G] PvT Cheese: 13 Gate Proxy Robo
Custom Maps
[UMS] Zillion Zerglings
External Content
Mutation # 475 Hard Target Mutation # 474 Futile Resistance Mutation # 473 Cold is the Void Mutation # 472 Dead Heat
Brood War
General
Will foreigners ever be able to challenge Koreans? BW General Discussion BGH auto balance -> http://bghmmr.eu/ Battle.net is not working Practice Partners (Official)
Tourneys
[ASL19] Grand Finals [BSL20] RO20 Group D - Sunday 20:00 CET [BSL20] RO20 Group B - Saturday 20:00 CET Small VOD Thread 2.0
Strategy
I am doing this better than progamers do. [G] How to get started on ladder as a new Z player
Other Games
General Games
Path of Exile Nintendo Switch Thread Monster Hunter Wilds Beyond All Reason Battle Aces/David Kim RTS Megathread
Dota 2
Official 'what is Dota anymore' discussion
League of Legends
LiquidLegends to reintegrate into TL.net
Heroes of the Storm
Simple Questions, Simple Answers
Hearthstone
Heroes of StarCraft mini-set
TL Mafia
Vanilla Mini Mafia TL Mafia Community Thread TL Mafia Plays: Diplomacy TL Mafia: Generative Agents Showdown Survivor II: The Amazon
Community
General
US Politics Mega-thread Russo-Ukrainian War Thread Things Aren’t Peaceful in Palestine All you football fans (soccer)! European Politico-economics QA Mega-thread
Fan Clubs
Serral Fan Club
Media & Entertainment
[Manga] One Piece Movie Discussion!
Sports
2024 - 2025 Football Thread NHL Playoffs 2024 Formula 1 Discussion NBA General Discussion
World Cup 2022
Tech Support
Computer Build, Upgrade & Buying Resource Thread Cleaning My Mechanical Keyboard How to clean a TTe Thermaltake keyboard?
TL Community
The Automated Ban List TL.net Ten Commandments
Blogs
I was completely wrong ab…
jameswatts
Need Your Help/Advice
Glider
Trip to the Zoo
micronesia
Yes Sir! How Commanding Impr…
TrAiDoS
Poker
Nebuchad
Info SLEgma_12
SLEgma_12
SECOND COMMING
XenOsky
Customize Sidebar...

Website Feedback

Closed Threads



Active: 14873 users

Helvetica for the Web

Blogs > itsjustatank
Post a Reply
1 2 3 4 Next All
itsjustatank
Profile Blog Joined November 2010
Hong Kong9152 Posts
June 03 2013 23:53 GMT
#1
Helvetica for the Web


Web designers everywhere, please take heed:

Helvetica is completely inappropriate for use as a body typeface for the Web.

While it is important to recognize that Helvetica is superior to Arial in just about any other production usage type, the lack of font hinting and kerning control in the web environment makes it unsuitable for use. In fact, calling

font-family: "HelveticaNeue-Light",Helvetica,Arial,sans-serif;

makes one’s design uniquely unusable and ugly to the exact people who would find it most annoying and abhorrent: your fellow designers.

Please stop doing this, just call Arial or a suitable Google web font.

+ Show Spoiler [Examples] +

with helvetica
[image loading]

with arial
[image loading]


PS: This applies to any non-standard design typeface, not just Helvetica. I've seen websites do fun things like call Univers and FF DIN. The results were, predictably, horrendous.

****
Photographer"nosotros estamos backamos" - setsuko
MoonBear
Profile Blog Joined November 2010
Straight outta Johto18973 Posts
June 03 2013 23:57 GMT
#2
What's your opinion on Trebuchet, Lucida and Tahoma then?
ModeratorA dream. Do you have one that has cursed you like that? Or maybe... a wish?
itsjustatank
Profile Blog Joined November 2010
Hong Kong9152 Posts
June 03 2013 23:59 GMT
#3
legibility is king
Photographer"nosotros estamos backamos" - setsuko
QuantumPope
Profile Joined April 2011
Canada76 Posts
Last Edited: 2013-06-04 00:16:25
June 04 2013 00:12 GMT
#4
+ Show Spoiler +
[image loading]


Forgive me

EDIT: Seravek for life.
www.twitch.tv/onemoregametv || sc2l.gg || d2l.gg || www.twitter.com/QuantumPope ||
itsjustatank
Profile Blog Joined November 2010
Hong Kong9152 Posts
June 04 2013 00:20 GMT
#5
ahahhahaha
Photographer"nosotros estamos backamos" - setsuko
Deleted User 135096
Profile Blog Joined December 2010
3624 Posts
June 04 2013 00:54 GMT
#6
LOOOOL, I was just about do say something about comic sans. Also, I would agree with ya, I used helvetica in my last personal site design, and the results were less than I'd hoped for from the presentational aspect.
Administrator
DamageControL
Profile Blog Joined July 2007
United States4222 Posts
June 04 2013 01:09 GMT
#7
Why is helvetica better?
Liquid | SKT
Torte de Lini
Profile Blog Joined September 2010
Germany38463 Posts
June 04 2013 01:16 GMT
#8
Bring in the Calibri!
https://twitter.com/#!/TorteDeLini (@TorteDeLini)
VManOfMana
Profile Blog Joined December 2008
United States764 Posts
Last Edited: 2013-06-04 01:20:03
June 04 2013 01:19 GMT
#9
Helvetica? There are better options: Avenir, Frutiger, Myriad.

Edit: http://www.nikibrown.com/designoblog/2009/01/23/do-you-hate-helvetica/
Woo Jung Ho, FIGHTING! | "With the death of BW comes the death of an idea. And that idea, held by many BW fans, was that a computer game could actually outlive the Next New Game cycle. And to some extent it did." -Falling
EpiK
Profile Blog Joined January 2007
Korea (South)5757 Posts
Last Edited: 2013-06-04 01:23:08
June 04 2013 01:22 GMT
#10
what about calibri? That's my personal favorite
itsjustatank
Profile Blog Joined November 2010
Hong Kong9152 Posts
June 04 2013 01:29 GMT
#11
On June 04 2013 10:19 VManOfMana wrote:
Helvetica? There are better options: Avenir, Frutiger, Myriad.

Edit: http://www.nikibrown.com/designoblog/2009/01/23/do-you-hate-helvetica/


keep in mind, these have to be good for the web. im not just talking about general design. I dont think those are standard installed on everyone's computers.
Photographer"nosotros estamos backamos" - setsuko
VManOfMana
Profile Blog Joined December 2008
United States764 Posts
Last Edited: 2013-06-04 01:51:36
June 04 2013 01:47 GMT
#12
On June 04 2013 10:29 itsjustatank wrote:
Show nested quote +
On June 04 2013 10:19 VManOfMana wrote:
Helvetica? There are better options: Avenir, Frutiger, Myriad.

Edit: http://www.nikibrown.com/designoblog/2009/01/23/do-you-hate-helvetica/


keep in mind, these have to be good for the web. im not just talking about general design. I dont think those are standard installed on everyone's computers.


But Helvetica is just a bad font overall, web or not; I wouldn't even call it a "web font". The older web fonts like Verdana and Georgia, although widely installed, were created for a time where antialiasing was non-existing or primitive.

Given web font technologies (Google Font Directory, Typekit, etc.) local installation is no longer a requirement. You only need the publisher to be the licensee.
Woo Jung Ho, FIGHTING! | "With the death of BW comes the death of an idea. And that idea, held by many BW fans, was that a computer game could actually outlive the Next New Game cycle. And to some extent it did." -Falling
HawaiianPig
Profile Blog Joined July 2008
Canada5155 Posts
June 04 2013 02:09 GMT
#13
The problem here is actually not the font but the way browsers render it.

The image you used as an example... I can bet it was Chrome. Terrible awful horrible aliasing on web fonts (not just google web fonts, I'm talking @font-face on the whole).

Helvetica is fine for the purpose of that image. It's large display sized text and a single line subtitle.
AdministratorNot actually Hawaiian.
HawaiianPig
Profile Blog Joined July 2008
Canada5155 Posts
June 04 2013 02:09 GMT
#14
Moral of the story: Use Firefox.
AdministratorNot actually Hawaiian.
itsjustatank
Profile Blog Joined November 2010
Hong Kong9152 Posts
Last Edited: 2013-06-04 02:20:29
June 04 2013 02:17 GMT
#15
When a font choice disables usability for a significant amount of users when a common font that is interchangeable for it on the web is an option, it just shouldn't be used.

The number of people who use Chrome, have Helvetica installed, and use Flickr has to be a significant amount of people.
Photographer"nosotros estamos backamos" - setsuko
Mjolnir
Profile Joined January 2009
912 Posts
June 04 2013 02:17 GMT
#16

I have a noob question and I'd love an answer if someone is patient enough to try.

I find this sort of thing interesting. How does someone know (before trial and error) which fonts look good on the web and which do not? If I, as a complete noob, wanted to make a clean, fresh design on a website, how would I know not to use Helvetica or Univers or FF DIN as mentioned above?

Do web browsers just inherently suck at "hinting" (I've no idea what that is) or kerning (I know that one, I think) and therefore can only render "web fonts" that are designed specifically for them?

Also, this comes to mind while I'm asking people in the know: Why is League Gothic "free" but you're not allowed to put it on a site without paying?

OK, that's three questions. I apologize. Would love to know the answers, though!

HawaiianPig
Profile Blog Joined July 2008
Canada5155 Posts
June 04 2013 02:24 GMT
#17
On June 04 2013 11:17 itsjustatank wrote:
When a font choice disables usability for a significant amount of users when a common font that is interchangeable for it on the web is an option, it just shouldn't be used.

The number of people who use Chrome, have Helvetica installed, and use Flickr has to be a significant amount of people.


Ya this is why we're (trying to) limit our webfont usage in news. I'm not saying it justifies its use, but I'm saying that the problem isn't so much the font itself but rather the support for it.
AdministratorNot actually Hawaiian.
itsjustatank
Profile Blog Joined November 2010
Hong Kong9152 Posts
Last Edited: 2013-06-04 02:29:36
June 04 2013 02:27 GMT
#18
On June 04 2013 11:17 Mjolnir wrote:

I have a noob question and I'd love an answer if someone is patient enough to try.

I find this sort of thing interesting. How does someone know (before trial and error) which fonts look good on the web and which do not? If I, as a complete noob, wanted to make a clean, fresh design on a website, how would I know not to use Helvetica or Univers or FF DIN as mentioned above?

Do web browsers just inherently suck at "hinting" (I've no idea what that is) or kerning (I know that one, I think) and therefore can only render "web fonts" that are designed specifically for them?

Also, this comes to mind while I'm asking people in the know: Why is League Gothic "free" but you're not allowed to put it on a site without paying?

OK, that's three questions. I apologize. Would love to know the answers, though!



  1. Use one of these or a Google Web Font
    God help you if you choose Comic Sans or Impact.
  2. Browsers just don't have the typography tools that many of the core design fonts require to be acceptable for use in a production.
  3. As far as I know, League Gothic is an open source font without any such restriction on use.


On June 04 2013 11:24 HawaiianPig wrote:
Show nested quote +
On June 04 2013 11:17 itsjustatank wrote:
When a font choice disables usability for a significant amount of users when a common font that is interchangeable for it on the web is an option, it just shouldn't be used.

The number of people who use Chrome, have Helvetica installed, and use Flickr has to be a significant amount of people.


Ya this is why we're (trying to) limit our webfont usage in news. I'm not saying it justifies its use, but I'm saying that the problem isn't so much the font itself but rather the support for it.


Yeah, I understand. It's just that I get the feeling that the only reason why Helvetica and other fonts like these are being called is as an afterthought by the designer: "Oh, us superior design people can use these fonts instead!" Problem is it can break a site inadvertently if the conditions are met, and that is bad.

Google Web Fonts are different as they are actively being sought out and used as a design choice on the web, I feel.
Photographer"nosotros estamos backamos" - setsuko
Race is Terran
Profile Blog Joined May 2013
United States382 Posts
June 04 2013 02:39 GMT
#19
everyone should just stick with times new roman font 12 :/ avoid any trouble
Mjolnir
Profile Joined January 2009
912 Posts
June 04 2013 02:41 GMT
#20
On June 04 2013 11:27 itsjustatank wrote:
Show nested quote +
On June 04 2013 11:17 Mjolnir wrote:

I have a noob question and I'd love an answer if someone is patient enough to try.

I find this sort of thing interesting. How does someone know (before trial and error) which fonts look good on the web and which do not? If I, as a complete noob, wanted to make a clean, fresh design on a website, how would I know not to use Helvetica or Univers or FF DIN as mentioned above?

Do web browsers just inherently suck at "hinting" (I've no idea what that is) or kerning (I know that one, I think) and therefore can only render "web fonts" that are designed specifically for them?

Also, this comes to mind while I'm asking people in the know: Why is League Gothic "free" but you're not allowed to put it on a site without paying?

OK, that's three questions. I apologize. Would love to know the answers, though!



  1. Use one of these or a Google Web Font
    God help you if you choose Comic Sans or Impact.
  2. Browsers just don't have the typography tools that many of the core design fonts require to be acceptable for use in a production.
  3. As far as I know, League Gothic is an open source font without any such restriction on use.


Show nested quote +
On June 04 2013 11:24 HawaiianPig wrote:
On June 04 2013 11:17 itsjustatank wrote:
When a font choice disables usability for a significant amount of users when a common font that is interchangeable for it on the web is an option, it just shouldn't be used.

The number of people who use Chrome, have Helvetica installed, and use Flickr has to be a significant amount of people.


Ya this is why we're (trying to) limit our webfont usage in news. I'm not saying it justifies its use, but I'm saying that the problem isn't so much the font itself but rather the support for it.


Yeah, I understand. It's just that I get the feeling that the only reason why Helvetica and other fonts like these are being called is as an afterthought by the designer: "Oh, us superior design people can use these fonts instead!" Problem is it can break a site inadvertently if the conditions are met, and that is bad.

Google Web Fonts are different as they are actively being sought out and used as a design choice on the web, I feel.


1. I promise not to use Comic Sans, Impact, or Papyrus.
2. Thanks.
3. Tried to use it, it's through typekit. They wanted cash. Maybe I'm doing something wrong.

Thanks for the answers!
1 2 3 4 Next All
Please log in or register to reply.
Live Events Refresh
Road to EWC
10:00
Asia Closed Qualifiers
RotterdaM1348
CranKy Ducklings187
3DClanTV 83
Liquipedia
[ Submit Event ]
Live Streams
Refresh
StarCraft 2
RotterdaM 1348
Hui .206
StarCraft: Brood War
Britney 32670
Calm 4641
Rain 3312
Mini 1300
EffOrt 968
Stork 446
Snow 279
ZerO 137
Rush 136
Killer 136
[ Show more ]
Mind 108
Sharp 75
Barracks 52
sSak 50
Shinee 34
ToSsGirL 33
sas.Sziky 31
Aegong 26
Movie 25
GoRush 23
ajuk12(nOOB) 20
Terrorterran 17
IntoTheRainbow 14
Shine 13
Noble 11
Dota 2
Gorgc7794
qojqva2350
Dendi2198
XcaliburYe238
Fuzer 207
Counter-Strike
Foxcn380
edward75
Heroes of the Storm
Khaldor192
Other Games
singsing1800
hiko939
B2W.Neo846
Mlord537
Happy404
crisheroes361
ArmadaUGS180
XaKoH 113
Mew2King110
Beastyqt80
QueenE42
Trikslyr39
ZerO(Twitch)20
Organizations
StarCraft 2
Blizzard YouTube
StarCraft: Brood War
BSLTrovo
sctven
[ Show 13 non-featured ]
StarCraft 2
• AfreecaTV YouTube
• intothetv
• Kozan
• IndyKCrew
• LaughNgamezSOOP
• Migwel
• sooper7s
StarCraft: Brood War
• FirePhoenix4
• BSLYoutube
• STPLYoutube
• ZZZeroYoutube
Dota 2
• WagamamaTV476
League of Legends
• Jankos1664
Upcoming Events
Road to EWC
6h 54m
Road to EWC
17h 54m
Road to EWC
1d
BSL Season 20
1d 2h
Sziky vs Razz
Sziky vs StRyKeR
Sziky vs DragOn
Sziky vs Tech
Razz vs StRyKeR
Razz vs DragOn
Razz vs Tech
DragOn vs Tech
Online Event
1d 12h
Clem vs ShoWTimE
herO vs MaxPax
Road to EWC
1d 17h
Road to EWC
2 days
BSL Season 20
2 days
Bonyth vs Doodle
Bonyth vs izu
Bonyth vs MadiNho
Bonyth vs TerrOr
MadiNho vs TerrOr
Doodle vs izu
Doodle vs MadiNho
Doodle vs TerrOr
Replay Cast
3 days
Replay Cast
3 days
[ Show More ]
The PondCast
5 days
Replay Cast
6 days
Liquipedia Results

Completed

Proleague 2025-05-28
DreamHack Dallas 2025
Calamity Stars S2

Ongoing

JPL Season 2
BSL Season 20
KCM Race Survival 2025 Season 2
NPSL S3
Rose Open S1
CSL Season 17: Qualifier 1
2025 GSL S2
Heroes 10 EU
ESL Impact League Season 7
IEM Dallas 2025
PGL Astana 2025
Asian Champions League '25
ECL Season 49: Europe
BLAST Rivals Spring 2025
MESA Nomadic Masters
CCT Season 2 Global Finals
IEM Melbourne 2025
YaLLa Compass Qatar 2025
PGL Bucharest 2025
BLAST Open Spring 2025

Upcoming

CSL Season 17: Qualifier 2
CSL 17: 2025 SUMMER
Copa Latinoamericana 4
CSLPRO Last Chance 2025
CSLAN 2025
K-Championship
SEL Season 2 Championship
Esports World Cup 2025
HSC XXVII
Championship of Russia 2025
Bellum Gens Elite Stara Zagora 2025
BLAST Bounty Fall Qual
IEM Cologne 2025
FISSURE Playground #1
BLAST.tv Austin Major 2025
TLPD

1. ByuN
2. TY
3. Dark
4. Solar
5. Stats
6. Nerchio
7. sOs
8. soO
9. INnoVation
10. Elazer
1. Rain
2. Flash
3. EffOrt
4. Last
5. Bisu
6. Soulkey
7. Mini
8. Sharp
Sidebar Settings...

Advertising | Privacy Policy | Terms Of Use | Contact Us

Original banner artwork: Jim Warren
The contents of this webpage are copyright © 2025 TLnet. All Rights Reserved.