Forum Moderators: not2easy
Just going through one of my stylesheets and thinking to myself - Why do I have to say "Arial, Helvetica, sans-serif"
Who doesn't have arial? And if they don't have Arial, what are the chances they have Helvetica?
Looking for ways to reduce some code bloat, and I just can't think of, apart from some very archaic browsers that probably don't read css anyways, any reason to have three font families listed.
Can someone give me a reason?
Can someone please correct me if I'm wrong? :)
Or Verdana.
That way if the client hasn't got Arial, and I don't know about Macs here, it will fall back on whatever it's default is.
I think Arial and Helvetica are Microsoft prorietary fonts
Helvetica has nothing to do with Microsoft, and is a 1950s typeface from Switzerland.
Likewise Arial (a 1980s font) is based on Helvetica and only differs very slightly from it.
The relevance of the old-style type foundries has faded somewhat in the computer age.
I don't recall many websites in the mid-1990s specifying fonts at all, most seemed to leave it to the viewer's default and were consequently displayed in Times New Roman on Windows or Times on a Mac - often with a grey background (the default colour on Netscape browsers).
When font specification became widespread it was usually done with FONT tags (remember those?) as browsers had extremely patchy CSS support and few people making websites even knew about style sheets.
The common specification "Arial, Helvetica, Verdana, sans-serif" (or variations thereof) came about because Arial was the default sans face on Windows while Helvetica was the default sans on Macs and is fairly common on Linux installations.
Verdana was designed specifically for computer screens and quickly became popular on the web because it was bundled with both the major browsers (Netscape and Explorer), so a designer could be pretty confident that visitors would have it installed.
I would say Verdana is still an excellent first choice for body text, but specifying alternate fonts remains a good idea as you never know what any given user will have deleted from their system.
Handheld devices are another matter, at least for now.
* {font-family: .... }
h1, h2, h3, h4, h5, h6 {font-family: ....}
Adding a few words to both to give the browser more options should it need it (Courier is an alternative it might use when it doesn;t find any font!), might be not be that bad.
Following out the rest of your question, you would at least want
Arial, sans-serif
to indicate that if Arial is not present, use the default sans-serif font available on the client's system.
Where the syntax of the family spec is really useful (IMO) is when using fonts that really may or may not be present on the user's system.
{ Georgia, Book Antiqua, Palatino, Palatia, Times New Roman, Times, Serif; }
This is a source of great annoyance to visual designers, who naturally like to consider every detail of the look of their sites and whose painstaking work can be undone in an instant. But it is part of the nature of the web that the end user has optional control over presentational aspects.
I have never met anyone who actually set their own stylesheets in their browser, but the fact is that there is no way to absolutely guarantee that your preferred font will be displayed as intended, even if it is installed on the client computer - you could use an image, but there remains the remote possibility that the user has images turned off, in which case they will see the contents of the ALT tag in a system default font (and they can change that as well).
So, to get back to the original question "is specifying three fonts necessary?", my answer would be "No, but understanding how browsers work is highly advisable if you are designing for the web".
I figure for that small 0.01 percent of people (just a guess ;) ) I'd rather make the stylesheet smaller. I'm all about a fast site.
I'm all about a fast site
I think you're looking in the wrong place for performance increases.
How long does 15 or so bytes take to send over a broadband connection at 8mbps? Maybe a jiffy.
The biggest difference you can make is by reducing the number of HTTP requests the client has to make. If you have one HTML file, one (maybe more) CSS file, and a couple of JS files, that's 4 files the client will have to download. If you embed all that stuff into the main HTML file that will increase the speed much more.
however there are also compelling reasons not to do this! webmasters need to make the best case decision for their situation.
Most Linux users add the MS Core Fonts package, but you shouldn't count on it.
This can very easily be accomplished by using SHTML inserts thereby maintaining a central CSS file and structure. It's a little but more work for the server but nothing it couldn't handle.
I've been going through the 'font thing' recently. Had tried to standardise on Verdana but found that it takes a lot more space than Arial/Helvetica, which can matter in documents with a lot of text & images interspersed. I still like Arial/Helvetica a lot but for a somewhat more 'modern' look have been experimenting with Trebuchet. It's interesting - much more compact than Verdana while maintaining readability. See this:
[wiki.webcentre.unimelb.edu.au...]
For sure. Different solutions for different sites. In my case I have a fairly complicated design that requires a rather large CSS file, so I'm just looking for ways to trim that down.
I'm pretty sure bringing all you font-family definitions together in one definition and then remove them everywhere else will gain you more reduction of CSS size than to remove ", helvetica" from dozens of places.
