Have you ever been demoted

6 Catastrophic Design Mistakes That Will Ruin Your SEO

Artists hate limitations. The image of being free ’has developed in her job. It is believed that an artist can only develop freely in the sea of ​​immense creative possibilities without limits.

As a webmaster, you don't want to limit the potential of your designer either. You let him or her experiment with animated designs and hope that they come up with a sleek design that you like.

Is there a problem with this no-scoring scheme design approach?


Such a website might not be search engine optimized. While your designer's goal might be to pamper your visitors with a breathtakingly fantastic design, this beauty would not deliver convincing business results.


Because you won't have any visitors on your site in the first place.

Let's go back a little and ask why you created or redesigned your website.

The main goal was probably to make more money from your website.

Am I right?

The design of your website is the most important factor in generating more sales. The study Trust and distrust of health websites found that 94% of user comments refer directly to design elements of the website such as intros, layouts, etc.

But there is little point in creating a website that never appears in search results.

You will likely need to look at it from a different, artistic perspective.

Designing and marketing your company's websites doesn't work in silos. See the limitations as a challenge and try to find a balance between elegance and the demands of the search engines.

In this context, I remember what Prof. Jef L. Richards said.

Yes, Google is getting smarter every day. But still you have to feed his bots by following the usual webmaster guidelines to guarantee your visitors a great user experience. Otherwise, don't expect free traffic from the search giant.

When it comes to design, there are a few common mistakes that can limit your site's search performance. Whether you're creating a new website or redesigning an existing one (with good search engine rankings), you can't afford to make these mistakes.

The picture of a starving artist sounds romantic, but you don't want to end up like this.

The added value you create with your website must reach your audience. This is your duty.

Avoiding these 6 design mistakes will ensure that your website doesn't get lost in search engine rankings and that your work reaches your visitors.


Let's start with the first mistake.

1. Put important information in pictures and do not optimize on-page elements

Let's get one thing straight.

Text is still the easiest content to read for search engines.

Of course, podcasts, pictures and videos make your visitors happy and help you to get more involved.

But search engines also dig for media content by searching for keywords in popular locations.

When it comes to the most important content on your website, don't forget that search engines ignore these elements - including images, Flash files and Java applications.

You don't have to trust me blindly.

Here is an excerpt from Google's official webmaster guidelines.

Instead of using images, use text to show important names, content or links. The Google crawler does not recognize the text contained in images. If you need to use images as text content, please use the ALT text to add a few words as a description.

If you replace your text headings with images, your content might look awesome. But search engines need useful on-page elements to help them understand key keywords. That makes up over 15% of Google's ranking algorithm.

Your SEO headline (50-60 characters), meta description (150-160 characters) and keyword density are and will remain important elements of your website.

Here is a sample page properly optimized for the keyword “running shoes”.

A compelling meta description and SEO headline are also helpful for getting better click-through rates in search results.

With Ubersuggest you can find out whether each of your pages has its own title tag and meta description.

Enter your URL in the search box and click "Search".

Then click on “Site Audit” in the left sidebar and scroll down to the “Top SEO Problems” area

If your website has a particularly high number of errors, you should click on “Show all errors” for more information.

Click on the errors that have to do with the title tag or the meta description, for example “13 pages with duplicated meta description”, as in the screenshot above.

In this case, the error is due to the design chosen, so it is not a problem. However, if repetitive meta descriptions or title tags accidentally appear on your website, you should take care of them as soon as possible and reformulate the meta tags concerned.

Once you've completed these on-page elements, the visual elements come next. Image optimization is more important than you think. According to Roman Bebenista, a website that is well optimized for images can get between 20 and 60% of all its traffic from Google.

Are you now convinced that you should invest time in optimizing the visual elements?

Here are 4 tips for optimizing images.

1. Use the alternate image description to accurately describe your visual elements. This helps the search engines understand what is in the images.

2. Google recommends that every page in the hierarchy of your website should be accessible via at least one static text link.

The best thing to do is to refrain from using images when designing the menu. And not only because Google cannot read the text in images, but also because it restricts the accessibility of your users on mobile devices.

Stick to text-based navigation links to make sure the search robots don't miss them.

See how Swansonvitamins.com list all the major pages on their website in the footer. Search engines cannot miss these pages.

You can also group all high-quality links into categories. Then your footer will be easier to understand and use.

See how Apple groups all the important pages together.

3. Never use images in the header or footer of your website to show important company information such as contact details and addresses.

Instead, share them directly as text, like Jarad Johnson did.

4. Google expects you to avoid standardized image names like IMG0001.JPG. Use descriptive names like my-new-marketing-article.JPG.

A study by Moz found that the Google image bot also looks at factors other than the alt image tag and file name. He looks at the title tag, meta description, heading tags, links, and anchor text. You should also host all of the images yourself.

If you need more tips on how to optimize images, check out Peter Linsley’s presentation on Google Image Search:

[youtube https://www.youtube.com/watch?v=h2Zaj0CAUoU]

As with the images, Google expects that you also provide relevant mark-up information for videos (with schema.org).

The relevance of your video content is determined by the protocol, surrounding text, subtitles, and the meta-information you share. But the quality of your video is the key to getting more engagement and building a loyal audience (which ultimately affects your search engine ranking too).

Since we are currently on the subject of visual optimization, I would also recommend that you do not configure your video pages with complex JavaScript, Flash and hash tags. They would not show up correctly in video search because Google cannot provide a unique URL for the users.

Ideally, your goal should be to have text on all pages of your website.

What if you do a podcast?

Even then, you should create a text for each episode of your show that describes who was interviewed and what it was about.

Brian Clark offers transcripts of some of his interviews on the New Rainmaker Podcast.

This helps them get search engine traffic and serve both parts of their audience - the part that prefers text and the part that prefers audio.

The copy of the episode “How to Start a Podcast Network Episode” can be found, for example, directly under the audio file.

Bryan puts it in a nutshell - once it's in a readable format, you can redesign the podcast into SlideShares, articles, etc.

Tools that show you how search engines see your website

If you have any doubts about how search engines see your website, you can use SEO-Browser.com.

This gives you a clear picture of which elements of your website are visible / indexable and which elements are hidden.

Have you seen my homepage?

This is how the search robots see them.

It is very easy to use.

Just go to SEO-Browser.com and enter your website in the address bar.


Click on “I'm not a robot”. Then click “Simple”.

Alternatively, you can also use the Search Engine Spider Simulator from Webconfs.com.

In addition to text, it also shows you how search robots see the links, meta keywords and meta description of the entered website.

Look at the results for my homepage.

2. Don't neglect your mobile visitors

Still not sure if you need a responsive website or not?

Then you need to look at the following statistic.

In March 2015, Google even released an algorithm update that downgrades websites that are not mobile-friendly. And mobile-friendly websites saw an average of 12% increase in visibility on Google Mobile.


Smart Insights data shows that pages that are not mobile-friendly were downgraded by an average of 5 places.

Is that why you have to create extra mobile-friendly websites?

Although the responsive design of a website is not an official ranking factor, Google recommends that webmasters make their website mobile-friendly.

The reason is that Google doesn't have to index separate URLs (if you're building a dedicated mobile website), and the same HTML is served to all devices (as opposed to dynamic servers).

A responsive design offers your visitors a uniform user experience on all devices. The page is displayed differently depending on the user's device.

Further advantages of responsive design are higher engagement on your website and lower bounce rates.

TSYS implemented their digital user experience (based on principles of responsive web design paired with digital marketing strategies) for a global financial institution in Europe. The result was higher profitability, lower expenses and better customer engagement.

So where can you start making your website more mobile-friendly?

A practical and SEO-friendly option would be a content management system like WordPress. It has a one-click installation. Then you just have to Responsive theme select and install a few SEO plugins, such as Yoast SEO.

If you want to offer your users a higher quality experience, you can also buy responsive themes from providers like StudioPress or ThemeForest. Simply set the filter to “mobile responsive”.

Once you have the responsive design done, test your website to make sure it runs smoothly. You can restrict the loading of full-size images for large screens and limit the number of HTTP requests (such as CSS and JavaScript).

But make sure the design supports specific customer requirements such as shopping carts and user logins.

You can even spy on the websites of competitors in your industry and implement the good ideas on your side.

Here are 3 webmaster tools from Google to help you pass the mobile-friendly Litmus test.

1. Mobile-Friendly Test - Just enter your website and click “Analyze”.

If you get a green message like the one below, your website passed the test.

If your website is not mobile-friendly, you will receive suggestions on how to take corrective action.

Just like she got Shulcloud.com below.

2. Robots Testing Tool - A single robots.txt error message could lead to a huge crash of your search engine presence.

Google's robots testing tool shows you how Google searches your robots.txt file and reports possible errors.

Take a look at Joomla's standard robots.txt as an example. Google bots are denied access to images and template directories. This website is classified by Google as incompatible with mobile devices, so the webmasters need to investigate and fix the errors.

You can also subscribe to notifications of configuration changes to the robots.txt file using a free tool - changedetection.com.

3. PageSpeed ​​Insights - As you may know, internet connections are slower on mobile devices. And with our attention spans shrinking, even a split second delay could mean a loss of thousands of dollars.

Page Speed ​​Insights is a great tool that ranks your website based on its speed. And it also makes a few suggestions on how you can make them faster.

Unless you have the specific requirements and resources, it's better not to create your own mobile website.

  • You have to allocate resources and budget separately for both sides.
  • It could result in the page rank being split between the two versions of your page or problems with duplicate content if you do not configure your website correctly.

In order to avoid such problems, you cannot avoid taking further measures.

And you also have to redirect smartphone users to the appropriate and separate URL instead of a 404 error page.

The “responsive experience” doesn't have to end on your website. In 2013, Litmus found that 47% of all marketing messages were opened on mobile devices.

In a 3-week test, CareerBuilder achieved a 15-17% increase in email open rates and a 21-24% increase in CTR after switching to a responsive email design.

Most email marketing providers like Aweber, MailChimp and GetResponse offer responsive email templates that you can use for your mobile users.

3. An elegant 404 page

I assume that you don't want to lose first-time visitors who entered a wrong URL or visited a broken link on your website.

You want to offer these visitors a great experience so that they will remember your brand. With a lot of creativity, you have therefore created a memorable 404 page.

But, you know what?

It may well be that you have forgotten an important element ...

A link back to the pages of your website.

It's so mundane that most webmasters forget about it.

A broken link without proper navigation options is not only bad for the user experience. It could ultimately even lead to a poorer search engine ranking.

On the flip side, links to arbitrary pages are so effective at increasing the number of pages indexed that I personally have used this technique to increase Techcrunch's traffic by 9% in a month.

Do you want to know how?

By using an algorithm that linked to 25-50 random internal pages on the website.

You can also link to your most popular pages just like ModCloths does.

But please include at least one link to your homepage like Deviant Art does.

Don't confuse your visitor and scare them away with technical jargon, like on the 404 page below.

A well-designed 404 page can reactivate dissatisfied visitors or even turn them into an email subscriber if you offer a free e-book, as Leadpages does on their bug page.


You have to watch out for 404 pages very carefully. Especially when you republish your site.

Ben Cook and his team created a contact form on the 404 page for a customer's website. The reason for this was that the existing page structure was outdated and contained thousands of pages and files. It was inevitable that the visitor would land on 404 pages.

On the contact page, Ben apologized for the mess and asked for missing information. He also assured visitors that "we will find the file and send them an updated link, or add the file as an attachment."

The visitors to the website were convinced, and so Ben and his team received several emails asking for information.

4. Irrelevant and intrusive pop-up ads

They are not indexed by search engines. They are usually not even the responsibility of the designer.Visitors click "Close" as soon as they appear. No wonder Chrome blocks them by default.

But they have become a part of almost every site anyway as they deliver incredible results.

I'm talking about pop-ups.

Yes, they can be very pushy. 70% of Americans complain that they get annoyed by irrelevant pop-ups.

But they're a great tool for increasing email subscribers. Dan Zarrella found that pop-ups doubled his subscribers. And interestingly, his bounce rate stayed the same.

Even Entrepreneur.com saw a 162% increase in sales by sending limited-time offers to selected visitors through pop-ups.

I don't want to get involved in the discussion of whether or not to use pop-ups even though they make the user experience worse.

Still, there is one type of pop-up that you should stay away from ...

Ads like the one below ... they just hurt.

Twenty years ago, Ethan Zuckerman wrote the Javascript and Serversite Perl to post the first pop-up ad. And even he is sorry for unleashing such an annoying feature on the internet.

Remember, the key is to make your pop-ups relevant and not intrusive. Try to make your pop-ups interesting enough so that your visitors don't feel annoyed.

Getting aggressive in your pop-ups, like the example below, is unlikely to convince your customers to click "Yes" ...

I would recommend you, Add value to your pop-up and explain the benefits to the user.

I do this when collecting emails on Quick Sprout with pop-ups.

Webmeup got 95% of its subscribers through pop-ups in the first few months. But do you see how they clearly list 3 big benefits in their pop-up?

Creating a pop-up that is relevant and creating it with an elegant overlay works well, like the Search Engine Journal pop-up below.

Its readers are interested in SEO training. And who doesn't like discounts?

SumoMe found in the 30 day analysis of the List Builder Tool (which was used to collect 110,313 emails through pop-ups) that 3 types of headings work best.

  • Social proofshowing the number of people who have already signed up.
  • Offer an incentive, such as an e-book. I offer my visitors a free website analysis with the Quick Sprout tool.
  • Offer users a discount for your product. An example is the SEJ discount on their training as shown above.

Since pop-up technology is controversial, you may have additional doubts about things like timing, frequency, or colors. Let's take a look at each of them one by one.

1. The right time to make a pop-up appear can make a huge difference in how it is perceived.

The best moment is around 3 to 5 seconds after a new visitor has come to your site.

Or you give him enough time to deal with your content, let's say 30 seconds or more, and then show him the pop-up.

Of course, you have to test your audience's preferences.

SumoMe found that 5 seconds is the best time to collect the maximum amount of emails. This is enough time for the visitor to get an overview of your site. Go over the 5 second mark and your visitor may be too busy with the content.

2. Another important question is whether pop-ups should be turned off for your regular visitors. As a webmaster, there's really nothing that makes you happier than collecting more emails.

Showing the same pop-up to the same visitor over and over again can be very annoying.

SumoMe found it was ok is asking your visitors for their email address every time they visit your site.

Most of the emails were collected through pop-ups that appear every minute or once a month.


So when a reader returns to your site, you can easily ask them for their email.

3. In order to get more clicks in general, your CTA should have a color that contrasts with the color spectrum of your website.

Color psychology can also be very helpful.

SumoMe found that red colored email buttons collect the most email signups. The reason could be that we associate the color red with stop.

In addition to an email subscription form, you can use pop-ups to ask for customer feedback, just like PRNewswire does below.


Imagine suddenly having a higher bounce rate and lower engagement from pop-ups, like Matthew Woodward.

Then you can use pop-up technologies. They are a little less of a hindrance and give good results. Let me show you 2 ways.

1. Show pop-ups at the bottom of your blog posts like Jonathan Fields does.

To integrate such a pop-up into your website, you can use a plugin like WP Subscribe Pro, for example.

2. Show a pop-up when the user signals that they want to leave your website.

WPBeginner saw a 600% increase in their signups when they used OptinMonster to create such pop-ups.

5. Do you want Flash and lots of frames?

That's a pretty ridiculous question.

And it is the same with too much Flash or too many frames on your website.

Flash may look great, but it is difficult (or not at all) to be recognized by search engines.

A homepage based on Flash is one of the biggest SEO mistakes of all. Take a look at the difference in how people and search engines see a webpage using Flash.

Correct. Not a single scrap of information about the combative monkey is visible to the search engines. Therefore, it is incredibly difficult for websites like this to get ranked in the search queries, as there is no content on your homepage that is indexable.

If you think users will love Flash, then you are wrong. Check out the results of a survey on Flash Splash Screens. 78% of respondents say they don't like Flash.

In fact, Google Chrome has already started blocking flash ads that play automatically because they degrade the user experience.

You shouldn't use Flash for important elements of your website either. It greatly reduces the usability of your website; You will have problems with navigation, bookmarks, font sizes, etc.

Take a look at the problems that came up on a professional service provider's flash-based website.

Most mobile devices do not support Flash. So if you use Flash, you have to create another website in addition to the flash-based desktop page that can be displayed on mobile devices.

Just like CheeseAndBurger.com did.

Here is the flash-based desktop version.

And here is the CSS based mobile version.

Do you remember when we talked about maintenance, resource and budget issues?

You should switch to Flash alternatives like HTML5 to embed videos on your site. You can also use CSS.

If you are not sure whether your website has Flash elements, you can examine them with the Flash Test Tool from SEO SiteCheckUp.

Just like Flash, there is another redundant technology that I want to introduce to you.


The content is hidden and difficult for search engines to understand.

In fact, frames can mess up all of the content on a web page. They are very difficult to navigate.

Don't make life difficult for search engines and index your content impossible by dividing it into frames.

Note: I'm not talking about inline frames (or iFrames). They allow you to include a page from another website in your code. And they don't affect your search rankings.

6. Your website is cluttered with every imaginable element

How many pictures are there on your homepage? And how many social media share icons do you use?

Elaborate graphics, animations, superfluous code and an excessive number of widgets slow down your site. And slow pages mean a deterioration in the user experience, which can also have a negative impact on your search engine placement; not to mention your conversion rate.

Google even started "Slow to load“- to show labels in the search results of mobile devices.

Let's fix the speed killers on your website.

Step # 1 - Test your website with the Pingdom Speed ​​Test Tool

You first get a summary of the size of your website, along with loading time and a rating.

You also get a detailed breakdown of your individual pages and their contribution to the loading time.

You can then work on removing objects that are unnecessarily slowing down the response time. If you absolutely need high resolution images and HD videos, then you can work on tweaking the other elements on your site.

An important factor that leads to a slower loading time is the high number of HTTP requests (up to 80% of the response time for the end user is bound to them). You can use these 3 strategies to lower the request rate.

Step # 2 - Improve the loading times of your website with site caching

If you run a WordPress site, do you use a cache plugin?

Without active site caching, you ask the server to build the page every time a visitor asks for it.

By activating site caching, you can send the page directly to the user.

The only drawback is that pages that require authentication cannot be buffered. In addition, if you have made changes to your site, the cache must first expire in order for the changes to be visible.

Step # 3 - Clean up your website code

This is the big unknown when it comes to determining loading times. If you hire any cheap web designer, you shouldn't be surprised if you get a hodgepodge of messed up codes.

It is important that you delete all the empty HTML tags

Dyn's Lara Swanson found these culprits, which resulted in increased load times.

Do you want to clean up your code? Here are 3 resources.

  1. Minimize your CSS with clean CSS.
  2. Clean your HTML source code and JS with dirty markup.
  3. Follow these 12 principles to keep your code lean and lean.


Your developers, web designers, and SEO experts need to work as a team to ensure a seamless user experience.

If you ever republish a large page, you shouldn't just be concerned about meeting the deadline; You also need to try to keep your search traffic and retention high.

During their relaunch, Moz saw an increase in performance. You should try to do the same by paying equal attention to SEO and design.

Have you made any of the above design mistakes on your website? What other crucial design element of your website could massively hinder your SEO measures?