ÍøÂçѧԺ w3popÉçÇø ÍøÂç×ÊÔ´ ITÐÂÎÅ

w3pop.com :: ÍøÂçѧԺ :: Éè¼ÆÀíÄî :: ÍøÂ簲ȫ×ÖÌå

»áÔ±µÇ½

ÕʺÅ

ÃÜÂë

»Ø´ð

¼ÇסÃÜÂë

Íü¼ÇÃÜÂë? ×¢²á

Éè¼ÆÀíÄî
¹¹½¨ÍøÕ¾µÄ6¸ö²½Ö..
ºÏÀí°²ÅÅÍøÕ¾ÑÕÉ«
ͼƬÉè¼Æ
ÍøÕ¾Éè¼ÆÓ¦¸Ã×·Çó..
³É¹¦½øÐÐÍâ°üÒµÎñ..
ÍøÕ¾Éè¼Æ±ÜÃâ³öÏÖ..
´´½¨ÓÐÐ§ÍøÕ¾µÄ5Ì..
ÍøÂ簲ȫ×ÖÌå
ÍøÕ¾Î¬»¤µÄ¼òµ¥·½..
ÍøÕ¾Éè¼ÆÍŶÓÓ¦¸Ã..
ÈçºÎÉè¼ÆÓмÛÖµµÄ..
Éè¼ÆÓÐÌØÉ«µÄÍøÕ¾
ÍøÕ¾ÓªÏúÖÐÈÝÒ׳ö..
ºÏÀíÉè¼ÆÍøÕ¾
Ìá¸ßÍøÒ³ÏÂÔØËÙ¶È
¸ßÖÊÁ¿µÄÍøÕ¾Éè¼Æ
ÍøÕ¾Ó¦¸ÃÄܹ»Ôö¼Ó..
Ò×ÓÚä¯ÀÀµÄÍøÒ³¿É..
ÍøÕ¾Éè¼ÆµÄ¼¸¸öÖ÷..
´´½¨Flashµ¼º½²Ëµ..

ÍøÂ簲ȫ×ÖÌå


×÷Õß:Mario Sanchez ·­Òë/ÕûÀí:w3pop.com ·¢²¼:2008-01-22 ä¯ÀÀ:2084 :: ::

Web_Safe_Fonts_For_Your_SiteChoosing the right typeface for your website copy is important, since it will affect the way your readers perceive your page (serious and formal, or friendly and casual). Aside from this, there are also important usability concerns. For example, some font types are more easily readable than others, and some are more widely available.

Ñ¡ÔñºÏÊʵÄÍøÕ¾×ÖÌåÊÇÍøÕ¾Éè¼ÆµÄÒ»ÏîÖØÒªÄÚÈÝ£¬ÒòΪÕâ»áÓ°Ïì¶ÁÕß¶ÔÍøÒ³²úÉúʲôӡÏó£¨ÑÏËà¡¢Õýʽ»¹ÊÇÇ×ÇС¢ËæÒ⣩¡£³ý´ËÖ®Í⣬×ÖÌ廹»áÓ°ÏìÍøÕ¾¿ÉÓÃÐÔ£¬±ÈÈç˵£¬ÓÐЩ×ÖÌå¸ü±ãÓÚÓû§ÔĶÁ£¬ÓÐЩ×ÖÌåÓ¦Óøü¹ã·º¡£

You want to choose font types that:

ÍøÕ¾×ÖÌåÓ¦¸Ã·ûºÏÒÔÏÂÒªÇó

1. fit the character of your site,

1.
·ûºÏÍøÕ¾ÌØµã£¬

2.
are easy to read on a computer screen, and

2.
Ò×ÓÚÓû§ÔĶÁ£¬

3.
are widely available across many browsers and operating systems.

3.
¶àÖÖä¯ÀÀÆ÷Óë²Ù×÷ϵͳµÄ¼æÈÝÐÔ¡£

There are basically two types of fonts: serif and sans serif. Serif fonts are those that have fine cross-lines at the extremities of the letter. Sans serif ("sans" being the French word for "without") are fonts that don't have serifs. The most common serif font is probably Times New Roman. Arial is an example of a common sans serif font.

×ÖÌåÀàÐÍ»ù±¾¿ÉÒÔ·ÖÁ½ÖÖ£ºserifÓësans serif£¬serif×ÖÌåÊÇÖ¸ÔÚ×Öĸĩ¶ËÓкáÏßµÄ×ÖÌ壬¶øsans serif×ÖÌåÊÇָûÓгÄÏßµÄ×ÖÌå¡£ÎÒÃǾ­³£Ê¹ÓõÄserif×ÖÌåÊÇTimes New Roman£¬¶øArialÊÇÎÒÃǾ­³£Ê¹ÓõÄsans serif×ÖÌå¡£

Let's go briefly through the most popular font types and evaluate their availability, readibility and character:

ÎÒÃǼòµ¥·ÖÎöһϳ£ÓÃ×ÖÌåµÄ¿ÉÓÃÐÔ¡¢Ò×¶ÁÐÔÒÔ¼°ËüÃǸ÷×ÔµÄÌØÕ÷¡£

Arial*:
Arial
×ÖÌ壺

Availability: Thoroughly available. It is probably the most common sans serif font. It is the default font for Windows, and it first shipped as a standard font with Windows 3.1.

¿ÉÓÃÐÔ£ºÍêÈ«¿ÉÒÔÀûÓá£Ëü¿ÉÄÜÊÇ×î³£ÓõÄsans serif×ÖÌ壬ÊÇWindowsµÄĬÈÏ×ÖÌ壬ÔÚWindows3.1ÖÐÊDZê×¼×ÖÌå¡£

Readability On Screen: Not the worse but definetely not the best, especially at small sizes, when it becomes too narrow and the spacing between characters too small.

Ò×¶ÁÐÔ£º²»ÊÇЧ¹û×î²îµÄ£¬µ«Ò²¾ø¶Ô²»ÊÇЧ¹û×îºÃµÄ£¬ÓÈÆäµ±×ֺźÜСʱ¡£×ÖÌå̫խ£¬×Ö·ûµÄ¼ä¾à»áºÜС¡£

Character: Has a streamlined, modern look but is also plain and boring.

ÌØÕ÷£ºÍâ¹ÛÏÖ´ú¡¢Á÷ÐУ¬µ«Ò²ºÜÆÕͨ¡¢ÓÐʱÁîÈËÑá·³¡£

*For Mac users, the equivalent of Arial is Helvetica.

Æ»¹ûµçÄÔÖУ¬HelveticaµÈͬÓÚArial¡£

Times New Roman:
Times New Roman
×ÖÌ壺

Availability: Thoroughly available. It is probably the most common serif font. It is the default font for web browsers. It was first shipped as a standard font with Windows 3.1

¿ÉÓÃÐÔ£ºÍêÈ«¿ÉÒÔÀûÓá£Ëü¿ÉÄÜÊÇ×î³£ÓõÄserif×ÖÌ壬ÊÇÍøÕ¾ä¯ÀÀÆ÷ĬÈϵÄ×ÖÌ壬ÔÚWindow3.1ÖÖÊDZê×¼×ÖÌå¡£

Readability On Screen: Acceptable for font sizes of 12pt. and up, but terrible for smaller sizes.

Ò×¶ÁÐÔ£º12ptÒÔÉϵÄ×ÖÌåÈÝÒ×ÔĶÁ£¬µ«Ð¡×ֺŵÄ×ÖÌåÒ×¶ÁÐԲ

Character: Serious, formal and old fashioned.

ÌØÕ÷£ºÑÏËà¡¢Õýʽ¡¢³Â¾É¡£

* For Mac users, the equivalent of Times New Roman is Times.

ÔÚÆ»¹ûµçÄÔÖУ¬TimesµÈͬÓÚTimes New Roman¡£

Verdana:
Verdana
×ÖÌ壺

Availability: A widely available sans serif font, Verdana was first shipped with Internet Explorer version 3, when the exponential growth of the Internet demanded a new font that was easy to read on the screen.

¿ÉÓÃÐÔ£ºÕâÖÖ×ÖÌå±»¹ã·ºÔËÓá£ËüÊ×ÏȳöÏÖÔÚIE3ÖÖ£¬ÒÔºóÖð½¥³ÉΪһÖÖÒ×ÓÚÔĶÁµÄÐÂ×ÖÌå¡£

Readability On Screen: Exceptional. It's wide body makes it the clearest font for on-screen reading, even at small sizes.
Ò×¶ÁÐÔ£º·Ç³£Ò×ÓÚÔĶÁ¡£¿í¶È´óʹÆä³ÉΪÏÔʾÆ÷ÖÐ×îÇåÎúµÄ×ÖÌ壬¼´Ê¹×ֺźÜС£¬Ò²ºÜÈÝÒ×ÔĶÁ¡£

Character: Modern, friendly and professional.

ÌØÕ÷£ºÏÖ´ú¡¢Ç×ÇС¢×¨Òµ¡£

Georgia:
Georgia
×ÖÌ壺

Avaliability: Good. It is a serif font introduced by Microsoft with Internet Explorer version 4, when the need for a serif font which much better readability than Times New Roman became evident.

¿ÉÓÃÐÔ£º¿ÉÓÃÐԺá£ÕâÖÖ×ÖÌåÊ״γöÏÖÔÚMicrosoft¹«Ë¾µÄIE4ÖУ¬ÊÇÒ»ÖÖserif×ÖÌå¡£ÕâÖÖ×ÖÌåµÄ¿É¶ÁÐÔ±ÈTimes New RomanÇ¿¡£

Readibility On Screen: Very good. It is the best serif font for on-line reading, since it was specifically designed for that purpose.

Ò×¶ÁÐÔ£º·Ç³£ºÃ¡£ËüÊÇÍøÕ¾Éè¼ÆÖУ¬ä¯ÀÀЧ¹û×îºÃµÄserif×ÖÌ壬ÒòΪËüÊÇ×¨ÎªÍøÉÏÔĶÁÉè¼ÆµÄ¡£

Character: Modern, friendly and professional.
ÌØÕ÷£ºÏÖ´ú¡¢Ç×ÇС¢×¨Òµ¡£

Microsoft has also popularized two more fonts: Comic Sans Serif and Trebuchet.

Microsoft
»¹Ôø¾­Á÷ÐйýÆäËüÁ½ÖÖ×ÖÌ壺Comic Sans SerifÓëTrebuchet¡£

Comic Sans Serif was launched with Internet Explorer version 3 and mimics the hand writing used in comics. It is easy to read and is informal and friendly, but it is not considered appropriate for more serious, professional sites.

Comic Sans Serif
Ê״γöÏÖÔÚIE3ÖÖ£¬ËüÄ£·Âϲ¾çÖеÄÊéд·½Ê½£¬¿É¶ÁÐԺá£ÕâÖÖ×ÖÌåµÄÌØÕ÷ÊÇ£ºËæÒâ¡¢Ç×ÇУ¬²»ÊʺϳöÏÖÔÚÑÏËࡢרҵµÄÍøÕ¾ÖС£

Trebuchet is another sans serif font, similar to Arial but with more character, although it can be difficult to read in small sizes.

Trebuchet
ÊÇÁíÍâÒ»ÖÐsans serif ×ÖÌ壬ÓëArialÏàËÆ£¬µ«¾ßÓиü¶àÌØµã¡£Èç¹ûÊÇС×ֺţ¬ÔĶÁÆðÀ´»áºÜÀ§ÄÑ¡£

Finally, we can mention Courier New, a serif font that was widely popular with old, mechanical typewriters, and that is now used only to present simulated computer code (if you need to present snipets of sample HTML code in your web pages, this is the font to use.

×îºó£¬ÎÒÃǽéÉÜÒ»ÖÖÀÏʽ´òÓ¡»ú¹ã·ºÊ¹ÓõÄ×ÖÌåCourier New¡£ÏÖÔÚÎÒÃdzÊÏÖ¸´ÖƵļÆËã»ú±àÂëʱ£¬»¹»áÓõ½ÕâÖÖ×ÖÌ壬±ÈÈç˵£¬ÎÒÃÇÐèÒªÔÚÍøÕ¾ÖгÊÏÖHTML±àÂëÑù±¾£¬¾Í»áÀûÓÃÕâÖÖ×ÖÌå¡£

Therefore, from a usability perspective, the clear winner is Verdana. If you are inclined to use a serif font, Georgia is the best option. Arial remains a good option for specific parts of text, like headlines and titles, where a different font must be used and you can use larger sizes.

×ÛÉÏËùÊö£¬VerdanaÊÇ¿ÉÓÃÐÔ×îÇ¿µÄ×ÖÌ壻GeorgiaÊÇ¿ÉÓÃÐÔ×îºÃµÄSerif×ÖÌå¡£ÔÚÖîÈç±êÌâ¡¢ÌâÄ¿µÈÌØÊâÎı¾ÄÚÈÝÖУ¬Äã¿ÉÒÔʹÓÃArial×ÖÌå¡£ÔÚÀûÓÃÆäËü×ÖÌåʱ£¬×ÖºÅÒ»¶¨Òª´ó¡£

The way you specify your desired font in HTML is by using the <font face> attribute. The best practice is to specify several fonts instead of just one, putting the easiest to read first.

ÔÚHTMLÖÐÉ趨×ÖÌåʱ£¬ÎÒÃÇÐèÒªÀûÓÃ<font face>ÊôÐÔ¡£×îºÃµÄ·½·¨ÊǰѼ¸ÖÖ×ÖÌå·ÅÔÚÒ»Æð£¬¶ø²»ÊÇÖ»³öÏÖÒ»ÖÖ×ÖÌ壬Ȼºó°ÑÒ×¶ÁÐÔ×îÇ¿µÄ·ÅÔÚµÚһλ¡£

For example, if you want to use serif fonts, your HTML code will look like this: <font face=Georgia, Times New Roman, Serif> . That way, your visitor's browser will try to load Georgia first, but if it doesn't have it installed it will try the next one on the list, in this case Times New Roman; if it doesn't have it either, which is highly unlikely, the browser will choose the third option, which we have specified as any other serif font.

ÀýÈ磬Èç¹ûÔËÓÃserif×ÖÌ壬HTML±àÂë¿ÉÒÔд³É£º< font face=Georgia, Times New Roman, Serif >¡£ÕâÑù·ÃÎÊÕßµÄä¯ÀÀÆ÷»áÊ×ÏÈÏÂÔØGeorgia×ÖÌ壬µ«Èç¹û¼ÆËã»úÖÐûÓа²×°´Ë×ÖÌ壬¾Í»áÏÂÔØµÚ¶þÖÖ×ÖÌ壬Ҳ¾ÍÊÇTimes New Roman£¬Èç¹ûÕâÖÖ×ÖÌåҲûÓа²×°£¬¾ÍÏÂÔØµÚÈýÖÖ×ÖÌ壬Ҳ¾ÍÊÇÖ¸¶¨µÄÆäËüserif×ÖÌå¡£µ«ÕâÑùµÄÇé¿ö²»Ì«¿ÉÄܳöÏÖ¡£

For sans serif fonts, the code will look like this: <font face=Verdana, Arial, Sans>.

Èç¹ûʹÓÃsans serif×ÖÌ壬±àÂë¾ÍÊÇ£º<font face=Verdana, Arial, Sans>¡£

ÆÀÂÛ (0) All