What is the difference between typeface and font?
Typeface is the overall look or design of a collection of characters that contain fonts which are different treatments of that typeface. For example, Arial is a typeface and Arial Bold at 12 point or Arial Italic at 24 point are different fonts of the Arial typeface. The distinction between the two terms dates back to early printmaking, however the terms have been synonymously used in recent times.
Serif vs. Sans-serif
Generally, typefaces are categorized into two groups, serif and sans-serif. The two groups are divided by a unique visual feature called serifs. Serif typefaces contain small lines (typically characterized as "tails") known as serifs that accent the end of a stroke in letters and symbols. Sans-serif typefaces do not have these accents. An example of serif and sans-serif can be seen when comparing two popular typefaces: Times New Roman and Arial.
Web-fonts
Text on a website, specifically live text (which is generated dynamically from font files), up until recently has been limited to a small collection of commonly installed computer fonts. In the past if an individual didn't have a font installed on their local machine they wouldn't be able to see that font in use on a website. This prevented web designers from using unique fonts that many individuals wouldn't have had installed. This led to the use of different text implementation methods that enabled the use of unique fonts without worrying about prior font installation. Methods included embedding rasterized text images and Flash elements. Although these methods achieved their intended purposes they didn't generate live text content and are usually not recommended. However, with the introduction of web-fonts, fonts licensed for web use, web designers now have access to a larger font library that is accessible to everyone. Unique fonts no longer need to be installed on your local machine and can display properly thanks to web-fonts.
Why are Web-fonts recommended?
- Live text: Dynamic text is created on your website and can be modified by the website itself through languages like HTML and CSS. Whereas rasterized images and Flash elements require a third-party software to create and modify.
- Searchability: Browsers can search live text generated through web-fonts.
- SEO: Web-fonts are by nature SEO ready. This allows search engines to read and understand the relevance of your website content more effectively. Readable content can help contribute to better search engine ranking when compared to image/Flash based content.
Licensing
Unless you're handwriting content for your website you will most likely use fonts to display text on your website. When implementing different fonts to your website it's important to keep in mind font licensing. Like all original content, fonts are also protected by copyright laws. When looking at the various licensing options, which varies by typefaces, publishers, designers, etc., it's important that you fully understand the EULA (end-user licensing agreement). Even if a font is labeled as free there may be restrictions on its usage.
Quick tips
Some fonts labeled as free are only free for personal use and may require additional permission for commercial usage. When in doubt, consult with a professional.
Different paid font licenses may only allow usage for different mediums (ex. Desktop or Web). Some licensing options are not one-time based fees and can be a subscription or view based license.
Resources
For a list of high-quality free and premium font libraries please take a look at our blog on 11 Desktop & Web Font resources.
For more information on choosing the right fonts for your next website design project please feel free to contact us for a free consultation.
718-381-9515 or info@designbrooklyn.com
