Jump to content
ThatAdrian

Default font styles

Recommended Posts

Hello,

 

I'm working at a site in wordpress, I use 'inspect element' a lot, and I want to know how can I see all the default font styles and their preview, so I can choose it more easily.

 

In inspect element it only shows me the one available for font-family : serif, sans-serif, monospace, fantasy etc.

 

Is there maybe a site or something (or a chart) where I can instantly see all those default text styles (so not something I have to download), and their preview?

 

Thanks.

Share this post


Link to post
Share on other sites

Those web safe fonts, are fonts that should be available on all operating systems, any other fonts are not guaranteed 100% to be on all these operating systems, which is why the fallback is used that list these websafe fonts.

 

With introduction @font-face you can download and reference many more fonts directly from your website folder, and not rely on the fonts being installed on the users O/S itself.

 

Note: if no font-family is defined, browsers usually set the default fonts to use in such a situation, which are the web safe fonts.

Share this post


Link to post
Share on other sites

Just a tip from an old hand. It is almost always a mistake to force your idea of good fonts on users. When you do that you override the default fonts the user has set for their computer and I the ones they like and are comfortable with. Some users may not like the fonts you select and will have a negative experience on your site as a result.

Share this post


Link to post
Share on other sites

Just a tip from an old hand. It is almost always a mistake to force your idea of good fonts on users. When you do that you override the default fonts the user has set for their computer and I the ones they like and are comfortable with. Some users may not like the fonts you select and will have a negative experience on your site as a result.

 

I don't agree with this. A good designer knows which fonts look best in which contexts. The same way the designer chooses the page layout and colors, fonts are also an important aspect of the design. If the user chooses to override that with a custom stylesheet it's up to them.

Share this post


Link to post
Share on other sites

if you want more fonts which can be easily embeded....then check the link https://www.google.com/fonts

 

if you still do not like any fonts listed in the above link......then search for a font you like and go @font-face way..

 

btw which type of fonts are you in need of?....fancy font for headlines n stuff or straight simple font for paragraph.

Share this post


Link to post
Share on other sites

 

If the user chooses to override that with a custom stylesheet it's up to them.

One of the differences between those who are design oriented and those who are technical development oriented is how we view users. From where I sit forcing the user to accept anything that might be an accessibility or usability problem for them is not generally a good idea unless there is a compelling reason to do so. The purpose of a web site is to present content; not to impress them to get a "wow". Generally the WOW only happens the first time, then the site has to stand on technical merit, not how it looks. The exception to that is a site in a business related to visual or graphic arts.

 

But what do I know most of my clients are pretty conservative and I have had some of them since before the internet even existed. On my personal site I like to play, but not so much with fonts. A special font is not going to gain any additional traffic, but even if it only increases the bounces by one a day it is a net negative. Everytime I have run experiments where I specify fonts, the results has always been a net loss.

Share this post


Link to post
Share on other sites

This is why we use ems and relative font sizes. The font face, like the website's color or layout, is up to us. Should we also give the user the option to use one, two or three column width or have a grey site and give them a color picker?

 

There is no usability or accessibility problem with using your own custom font as long as you provide a fallback, I challenge you to describe a scenario where using my own font is in some way detrimental to the user.

 

I understand your mode of thinking, it's a phase people go through as they're gaining experience. At this point, you're caring more about adhering strictly to a set of "best practice" rules than using your own judgement to decide what to do.

Share this post


Link to post
Share on other sites

 

it's a phase people go through as they're gaining experience

 

Yes while I guess i am not experienced enough after programming for only 50 years. I will have to tell my clients (some of whom have been with me over 30 years) that they will need to find someone who has a better understanding of user needs and behavior because all the experimentation I have done proves nothing. :facepalm:

Share this post


Link to post
Share on other sites

I'm not sure if that is sarcasm or not. If you still disagree with me, all you need to do is describe a scenario where imposing my own font face (while providing a generic fallback) would be detrimental to the user.

 

I'm open to changing my mind if I see that I'm wrong.

Share this post


Link to post
Share on other sites

You are looking for harm. The issue is user perception. If they don't like something then it is a negative in how they feel about the site. Unless a site is in the font business; then no one is visiting the site to see what kind of fonts they use, but if a user does not like a font that is overriding their defaults it can add nothing but negative karma. Is it possible that the user will like the overriding font better? Probably, but they are not checking out sites for fonts if they are shopping for shoes or looking for a new bank.

 

So it is not harm to the user, but harm to a site that is putting design ahead of a user's right to control how their browser behaves and renders.

 

If you are not sure about sarcasm, just Google COBOLdinosaur to see how long I have been working the boards on tech sites. or look at my profile at the site I recently left after starting there 15 years ago.

Edited by COBOLdinosaur

Share this post


Link to post
Share on other sites

Any psychologist or professional designer knows how important typography is to the user's perception of a website. You're correct that if the user doesn't like the font they'll have a less positive perception of the site. If you're stuck to using the defaults they have on their computer, you're limited as to what you're able to present to them.

 

Design plays a lot on the user's subconscious. Colors, fonts and layout are all important aspects into selling a product to the user. They don't consciously care what the font looks like, but the page looks more or less desirable based on these subtle aspects.

 

You're not taking away any control from the user by using web fonts. They still have their own browser stylesheet if they want to. You're already selecting a font for them by choosing the generic "sans-serif", or "monospace", it's no different than using a less generic font name. I can only see positives and no negatives in using particular fonts for your website.

Share this post


Link to post
Share on other sites

Thanks all, I was mainly looking for something like this http://www.cssfontstack.com , existing font styles, even shows the availability on systems.

 

btw which type of fonts are you in need of?....fancy font for headlines n stuff or straight simple font for paragraph.

Kind of...both. I'm in the phase of experimentation, need to see what's 'available' :)

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...