When designing websites, it's important to balance form and function;

Make sure the website looks appealing AND works as required.

Until a few years ago, it was next to impossible for a web designer to achieve true SEO while trying to use unique, nonstandard fonts for page titles, or special texts.

Graphic and web designers seeking natural/organic SEO were limited to using, standard default fonts such as Arial, Times, Helvetica and a few other fonts.

If these designers wanted anything unique, custom or fancy for title font lettering, they would have to resort to creating a graphic of the word(s) in the desired font.

The Font Style Dilemma

Search engines view website content as the most important factor when ranking websites (often just above the factor of whether a website is responsive and will render [load smoothly] on various browsers; versus failing or rendering inaccurately).

Therefore, it's imperative to keep as much website content in readable text format (instead of graphic images of desired fonts) for top SEO (search engine optimization) and to maintain top search engine ranking.

Since the readable text of a website (especially the titles and headers of a site) are the most important factors in SEO, this has left many web designers in a quandary as to how to create a unique aesthetic look for a site, while avoiding the use of boring Arial and Times New Roman fonts; all while maintaining best SEO practices.

Graphic designers can take any text in any font style (cursive, handwritten, etc) and create a graphic of the word or title.

However, a graphic is often still not readable by many search engines.

In order to achieve any substantial SEO with a graphic, requires the use of an ALT tag on the graphic image.

While an ALT tag will help a search engine decipher what the graphic is about, it is not as powerful, effective, nor meaningful to search engines as using actual text; especially if used for a Header or Paragraph Title.

Before the advent of the web font, if a web designer wanted to achieve maximum SEO, they would be limited to using regular, standard font styles for a Header or Paragraph Title (such as Arial, Times New Roman, or other standard fonts that come on most computers today).

Just because a font is installed on the computer of a designer, does not mean that font is a standard font that will appear on all computers, and often times, different computer systems, may have different default fonts available.

When a font is not installed on a local user's computer, the browser simply defaults to a standard font on the user's computer such as Arial, Times and so on.

Hence, by not creating a graphic of the special font style, the designer may loose any unique aesthetic originally intended due to lack of support of non-standard fonts in today's browsers.

A New Era For Unique Website Fonts

Fortunately, over are the days of limited font styles to choose from for web development.

With the advent of CSS3 and the ability to embed special fonts into a website stylesheet, designers can now create unique website looks using web fonts. Web Fonts allow a designer to achieve specialized looks with new fonts such as scripts, hand written, cursive and more.

By using web fonts, the content is still actual text that is readable by search engines; hence designers avoid using graphic images of fonts that diminish the value of the text for SEO purposes.

There are several services providing web fonts for designers to use in their website. However, probably the largest, free, and most reliable service would be Google's Web Fonts.

Choosing a Reliable Web Font Service

When using a web font in a style sheet, it's important that the service be a large and reputable service that will always be up and running.

If the web font's service were to go down, then the website using the web font's service would no longer display the font intended by the designer.

Again, the site would default to the standard fonts (such as Arial, Times New Roman, etc) that come available on the user's computer viewing the site.

Incorporating Web Fonts Into A Website

Web Fonts are relatively easy to incorporate into a website. Normally they only call for two additional lines of code; hence they're easy on processing power, and easy to integrate into any existing website.

Using Google Web Fonts as an example, one line of code normally would go into the header of the website calling the font from the web font server:

Again using Google Web Fonts as an example, the second line of code that would be supplied would go into the website style sheet:

For example, if we were to use the font on a header tag, simply add the following line of code into the style sheet for the appropriate H header tag:

Summary

To summarize:

Web Fonts allow designers to maintain the highest level of SEO possible while giving a website a unique aesthetic so as to set that website apart from other sites.

By using web fonts, a website designer has a great deal more flexibility in designing a unique website for a unique business; while avoiding monotonous fonts such as Arial and Times New Roman, and maintaining top-notch SEO practices.