Find Web Developers
Find Web Developers

Web Typography For the Element of Design

When designing your site you may want to decide what font you are going to use before you start writing your content. Each different style of font will render differently depending on your operating system and your web browser. You web typography will also have a different effect on each area of your site. There are a few things to watch for when deciding which font to use. There are several different fonts are the safe typography for web development.

Sans-Serif Font and Serif Fonts

To start things off there are two general categories of fonts. There are sans-serif and serif fonts. A sans-serif is most common with Arial and Verdana on a Windows operating System and Helvetica for a Mac operating system. Sans-serif fonts have no flat spots on the text. These small flat spots have a nick name of feet. A serif font is Times New Roman and is the most popular serif font that developers use. The best way to determine if your font is serif font or a sans-serif font is to look at the bottom of the text. Serif fonts have small feet at the bottom of their text and sans-serif fonts have clean cut offs at the bottom.

Windows Fonts Linux Fonts and Mac Fonts

Each operating system has different style of fonts. Of all the popular operating systems, most of them have the same fonts. There are a lot of windows fonts that are not supported by the other operating systems. Windows Vista has added a lot of different fonts to its operating system. If you choose a font that isn’t support by the operating system, this will force the operating system to choose one. The result can crash your web design. But choosing a font that is supported by all operating systems will keep you design safe from rendering incorrectly.

Web Safe Fonts
These typography fonts have been common to all versions of Windows, Linux and Macs:

  • Andale Mono
  • Arial
  • Arial Black
  • Century Gothic
  • Comic Sans MS
  • Courier New
  • Helvetica
  • Georgia
  • Impact
  • Times New Roman
  • Trebuchet MS
  • Verdana

Finding your Web Typography

When finding your font-family you need to find a good size and weight. Font size can be very important. Make sure that you font size is readable on all operating systems and browser. Font sizes verify between operating systems. A font size of 12pt on a Windows operating system is smaller than a font size of 12pt on a Mac operating system.

Font weight is also by the font size. When choosing a bold font weight, size can change how much bold effects your font. A small font size will take a small amount of bold, where a bigger font size will give it a stronger bold. Bold is really use for focus points and important items.

Typography can be Fun!

There might be fonts on your developing computer that you might love. But it might not be the best choice to use for your site. Play around and be creative with your web typography. Just keep in mind what your users will be using different internet browsers and operating systems. If their computer can’t find your font, it will be the computer’s choice by default. This could change the whole outlook of your page. Always check your pages in different browser and operating systems. An easy way to do this is to use a website called BrowserShots. (www.browsershots.org) It will run your website throw different scenarios of internet browsers and operating system and output the results in thumbnails.

Comments are closed.