The Dilemma with SEO Web Design
Designers Understand Design
As a web designer it all starts with an idea, a vision per say. This vision starts as a seed in the mind of a craftsman that when properly nurtured yields a beautifully designed and functional website that both the designer and customer can be proud of. As web designers every piece of creating a site is important. From creating the persona to building a website, we understand the importance of getting those things right.
Transitioning to SEO Web Design
However, more often than we would like to admit, search engine optimization, social media, and content marketing plans come as an afterthought to the web design process. SEO web design can seem like a hindrance to our creative process that traps our inner Picasso from getting out.
The dilemma is real.
We want to design beautiful user experience focused websites or landing pages, while also making them search engine friendly. Today we want to introduce 4 basic concepts that web designers can implement to design SEO friendly optimized websites.
1. Master Multimedia
Web Designers understand that multimedia not only draws the readers attention but also adds a level of professionalism to the web page. Videos and high quality images are par for the course, but we must be mindful of two potential problems. The way you handle these problems can mean the difference between you being good or great.
Implement Image Optimization
Larger images mean longer load times which can mean higher bounce rates. Higher bounce rates signify to the search engine that users aren’t finding the content they were looking for by visiting your page. This can result in a loss of search engine rankings.
The answer to this is to optimize your images. Scaling down your images to a smaller size can work wonders for pageSpeed. There are several plugins and websites that offer automatic image optimization.
Image Optimization Plugins
I have had success with WordPress plugins such as shortpixel and imagify. These plugins compress the image down to a smaller size without significantly affecting the image quality. This allows you to strike the balance between design and search engine optimization.
Use Alt Text & Captions for Indexing
Human Interaction and Emotional Appeal
Ever heard the saying “A Picture is worth a 1000 words?” Well it’s definitely not true when it comes to SEO. Search engines don’t understand images the way people do. A person processes images with a great deal of thought and emotions which can be used as an opportunity to make a connection.
Search Engine Googles
What does a search engine see? Search engines don’t interpret images they see “alt attributes.” Providing alt text for all of your images gives search engines a clear understanding of what your image is about and shows the relevancy of your images to the rest of the page content. Without “alt attributes” your images may not get indexed by search engines properly or may not show up in search results.
Provide Quotes & Transcripts for Videos
With the use of content management systems our clients can add professional and informative videos to their websites without hiring an SEO web design firm. The problem is that customers don’t understand what web design companies do about videos. Search engines do not watch videos and index the words or actions that took place.
Multimedia is a great way to convey a message, but make sure search engines can get the message as well. The answer is simple. If you want search engines to index it, make a transcript or specifically quote the portions of the video you want to be found. You can now keep visitors engaged with a video, without compromising search engine rankings.
2. The Power of Span for HTML Headings
What is the purpose of Headings?
Headings serve more of a purpose than being a bold title, they along with the overall url structure provide the roadmap of a particular webpage. Think of headings as the outline of your webpage. Even without the body elements a search engine should be able to get a good idea of what the page is about.
Use Span elements to Achieve Style Goals
Before I began studying and getting passionate about SEO web design, I would use heading tags strictly as style elements in my website design. I would choose whichever heading had the font size and style that looked aesthetically pleasing.
Headings are the Backbone of the Page
Fast forward. I now know that the heading tags are meant to provide the overall structure of the webpage. Search engines rely on the heading tags to create sections of content which will be given a hierarchy based on the heading tag.
‘h1’ tags are viewed as more important than ‘h6’ tags. However, there are times when the designer in me doesn’t want to use a particular tag because it doesn’t blend well with other design elements I’ve implemented on the page. In situations like this, span is your best friend. Say you have a heading such as:
<h2>Get Healthy <br>Start Drinking More Water</h2>As a designer I want “Start Drinking More Water” to be smaller, but it contains a keyword that I want search engines to view as important. Using a span can give you the visual design elements you’re looking for, while not impacting SEO. Try rewriting it like this:
<h2>Get Healthy<br><span class="heading_size--small">Start Drinking More Water</span></h2>Style with this…
.heading_size--small {
font-size: .8rem;
font-weight: 400;
}3. Find a Great Hosting Provider
One of the most overlooked factors in SEO and overall user experience is the hosting provider you choose to host your website. The overall performance and consistency of your website will be directly impacted by your hosting provider. There are three major factors when choosing a hosting provider.
The specialization of Your Hosting Provider
Every project is unique. Also every hosting provider has their unique set of strengths and weaknesses. This should go without saying, but you should align your website needs with the strengths of your hosting provider. If you have a WordPress website, you should really consider a managed WordPress Hosting Solution.
High Uptime Guarantee
According to Search Engine Journal, “Your host’s uptime guarantee is arguably the most important factor in whether they’re SEO-friendly.” If your website is experiencing downtime it will not only result in lost business, but also in a high bounce rate and lower Google search rankings.
4. Supplement with Text
SEO Web Design is all about making websites that are functional and effective for both clients and search engines. There are 3 main areas to watch out for as web designers.
Links in non-parseable JavaScript
Search engine sometimes do not crawl links written with javascript. Therefore these links should be switched out for regular HTML links if possible. If this is not possible it is best to supplement with text by adding the link in HTML in some other place on the same page.
Robots don’t use search forms
If you believe that you can put a search box on your webpage and that will provide search engines what they need to find your content, it doesn’t work this way. Search engines do not use search forms therefore if there is a link that you want the search engine to find you must supplement with text by putting it on the page in regular HTML.
Be careful with Flash Elements
Using too much flash is another thing that may reduce search engine rankings. Search engines often devalue flash elements. When practicing SEO Web Design try to limit your use of flash elements and…you guessed it…Supplement with Text.
Hopefully you have learned some concepts that will help you to better practice principles of SEO Web Design. Either way let me know what you think in the comments.
