Что такое хорошие шрифты веб-разработки? [закрытый]
Используя примеры из Sohnee и karim79. Я проверил это, и оно работало как в FF3.6, так и в IE6.
<script type="text/javascript">
$(document).ready(function(){
$("#logo").bind("load", function () { $(this).fadeIn('slow'); });
});
</script>
<img src="http://www.gimp.org/tutorials/Lite_Quickies/quintet_hst_big.jpg" id="logo" style="display:none"/>
13 ответов
See this list of browser safe fonts.
It's Windows+Mac centric, but still applies. They do include a linux distribution screenshot, as well.
Here's some required reading:
Also some related questions on StackOverflow:
Единственный 100% безопасный способ объявления шрифтов - это использовать общие шаблоны в качестве резервных.
Общие:
- 'serif' (например, Times)
- 'sans- serif '(например, Helvetica)
- ' cursive '(например, Zapf-Chancery)
- ' фэнтези '(например, Western) (wtf?)
- ' моноширинный '(например, Courier)
Из W3C
Все пять семейств общих шрифтов определено, чтобы существовать во всех CSS реализации (они не нуждаются обязательно сопоставить с пятью различными актуальные шрифты). Пользовательские агенты должны предоставить разумный выбор по умолчанию для общие семейства шрифтов, которые выразить характеристики каждого семья как можно лучше в лимиты, разрешенные базовым технология.
Шрифты, такие как Arial и Verdana, которые многие веб-дизайнеры считают само собой разумеющимся, могут не присутствовать в браузерах Linux (даже в Firefox на CentOS по опыту). У Apple есть большинство шрифтов Microsoft, но некоторые из них отсутствуют.
Features:
- compare fonts side by side;
- choose from the list of safe fonts, win fonts or mac fonts;
- all from the browser.
Just remember: Friends don't let friends use Comic Sans.
(Seriously, you've got good answers above already...).
Вот руководство ...
http://www.ampsoft.net/webdesign-l/WindowsMacFonts.html
Что касается мобильных устройств, все, что я могу сказать, это удачи ! Моя дочь получила от меня мой Blackberry на пять минут и изменила мой фон, мелодию звонка, и теперь все мои шрифты - мультяшные.
Вот список шрифтов для iPhone, но он, возможно, немного устарел. http://daringfireball.net/misc/2007/07/iphone-osx-fonts
Arial is my "safe" font that I use all the time.
But I've been using Trebuchet a lot lately. It's common enough that practically everybody is going to have it. It's used all over the place at StackOverflow, FeedBurner, and a lot of other popular sites these days.
But, just in case the user doesn't have it, I'd use CSS like this (just like StackOverflow has it)...
font-family:Trebuchet MS,Helvetica,sans-serif;
While having such a list is certainly useful, you should also take advantage of the fallback mechanism of CSS. For example, you can list Consolas, Courier New, monospace in your font-family attribute and get the best possible match on that device.
The last item on each font-family list should be a neutral one such as "sans serif", "serif", "monospace", etc.
This way, your designers can use fonts they think best, as long as there's a reasonable downlevel experience.
See, for example w3.org's guidance
Вы можете использовать sIFR для заголовков и вообще не беспокоиться о веб-безопасных шрифтах. Взгляните на пример страницы . Это довольно круто.
Вот хорошая статья о шрифтах для Интернета .
Многие шрифты доступны в современных браузерах. Тем не менее, оставьте его простым и немного большим. Также используйте контрастные цвета для облегчения чтения.
CSS allows you to use any fonts installed on the system. font-family allows you to list many fonts. If the parser doesn't find the first one installed on the system, it moves onto the next one. That's why most font-family definitions cascade down to sans-serif or serif. If the browser doesn't have any of your fonts, it uses the default serif, sans-serif, or monospaced font, etc.
If you're a sucker for typography, unfortunately until CSS3 fonts take off you're going to have to live with serving up all the good fonts to your Mac users, since Mac OS X has a far greater selection of great fonts installed than Windows. I get a little depressed when I load up my sites on Windows and I'm greeted with a pile of rigid, aliased fonts.
You're pretty save with Helvetica/Arial (yes, I know there's a difference!) or Verdana for sans-serif or Georgia or Times for serif. In your css you can just put a list in your preferred order. You should always end in a generic font-family to cover all your bases.
My sites usually look something like this:
font-family: Helvetica, Arial, sans-serif;
font-family: Georgia, serif;
If you want to get cute and fancy with your typography, you should look into SIFR, which uses flash to embed special fonts.