To really take control of your SERPs, you are, of course, going to need more than just a well-designed, search-optimized website. You are probably going to need a ton of social mentions, quality links, citations and co-citations, etc. The problem with these ranking factors is that they are difficult to accomplish in volume and generally require a lot of work to achieve, and, subsequently, the vast majority of websites don’t have them. You can, however, still achieve great things with solid design and on-page optimization. What’s the problem?
The problem is simple: websites that look amazing typically offer little opportunity for on-page optimization and conversely pages that are well optimized will often compromise the design and user experience.
This creates a chicken and egg scenario – what is the point in having a website that looks great if it can’t be found? And is there any point of being easy to find if the website isn’t engaging? How can we build sites that look amazing and are engaging, yet still maintain SEO performance? That’s where the webfont comes into play.
Webfonts from the likes of Google, Font Deck, Typekit, and Fonts.com have been around for a couple of years and offer a great way to give a website style without compromising crawlability. They form the fundamental structure and underpinning of any well-designed, well-optimized site.
To add more of a visual appeal, designers will add graphical elements to websites such as banners and calls to action. These elements are usually created as images so the designer can use attractive fonts, add type effects such as drop shadows, gradients, and a whole host of other treatments that form part of the designer’s toolkit. Websites need these kinds of graphics, as they make websites engaging and they make the user much less likely to become uninterested and leave.
By using a combination of webfonts, HTML, and CSS, it is possible to retain the beauty and achieve good SEO by creating all of the text elements within a banner as “live text.”
Not only can a live text banner look great, but they can also be marked up with H1’s, body type, bold text, and updated dynamically. Search engines will just see this as standard HTML. Best of all, these banners or graphics can be even be marked up as rich text using schema or microdata.
The biggest hurdle in building a good looking website that also has great performing SEO attributes is uniting these two disciplines. Designers focus on sites that look great and create a good user experience whilst being engaging, whereas an SEO typically wants a site which is very search engine friendly and one that ranks well.
If the design and SEO teams gain an appreciation of each others’ requirements, the results can be innovative and outstanding.