Why use Arial, Helvetica, sans-serif as font-family instead of just sans-serif?

Question

I can't see what is the point of doing this? For me it renders identically the same, so why should I use Arial, Helvetica, sans-serif vs just sans-serif?

Answer 1

The default font the user is seeing depends on the browser and its configuration. If you don't care what font the user is seeing—except that it is a sans-serif font, regardless of their system default—then by all means just use font-family: sans-serif;.

However, you can't depend on the defaults being specific fonts (e.g., Helvetica, Arial), as users can change them in their preferences. For a more uniform experience and design, it is a better practice to explicitly specify your font preferences, in order of priority.

In this case, it will default to using Arial, then fall back to Helvetica if Arial isn't installed, and then, finally, fall back to the system sans-serif default if Helvetica can't be found.