Connect with us

SEO

10 Optimization Tips to Build a Mobile-Friendly Site

Published

on

10 Optimization Tips to Build a Mobile-Friendly Site

A majority of all website visits worldwide are attributed to mobile devices. Optimizing your website for mobile has never been more important in SEO.

In this article, I’ll kick things off by explaining what mobile SEO is and why it’s important. I’ll then get to the core focus of this article, sharing my top 10 tips for effective mobile optimization.

Mobile SEO is the process of optimizing the mobile version of a website to drive organic traffic from search engines. Mobile optimization is focused on providing the best experience on mobile devices where technical implementations, such as using responsive design, play a key role.

Why is mobile optimization important?

Advertisement

According to Statista, mobile devices generated 59% of worldwide mobile traffic in the final quarter of 2022.

It’s not just users that predominantly view your site from a mobile device, but Googlebot too.

In 2016, Google announced mobile-first indexing. As a result, Google predominantly crawls the web via the Googlebot smartphone user agent. This means that Google will primarily use the mobile version of content for indexing and ranking. 

Mobile-first indexing began rolling out in 2018. By 2021, a majority of sites moved over to the new format of crawling. 

For many years, this was a hot topic among SEO professionals. However, mobile-first indexing is now “part of life,” as put by John Mueller from Google.

10 tips to make your website mobile-friendly

So now we know why mobile optimization is so crucial, here are my top 10 tips to ensure you effectively optimize for mobile.

Tip 1. Use responsive design

When it comes to picking your approach to serving content to different devices, you have a few options to choose from.

Responsive design (recommended)

With responsive design, you serve the same HTML file regardless of the device. CSS then alters the rendering of the page to suit the dimensions of the device’s viewport. This also means that you use a singular URL to serve all versions of your content.

Responsive design ensures you can effectively load the same piece of content, oriented to suit your device.

Advertisement
Page content adapts responsively to viewport

Responsive design is the recommended choice, not just among SEOs but in Google guidance too.

Back in 2019, John took to Reddit to state, “At some point all of these sites with separate mobile URLs should just move to a responsive design.” 

Ultimately, there’s no SEO gain by using responsive design. However, it is much easier and cleaner to maintain. For example, you won’t have to worry about canonical issues or Googlebot misunderstanding which URL to serve in the mobile/desktop rankings.

Separate domain/URL structure (not recommended)

An approach used commonly in the past is to serve the mobile version of a page via a separate URL or domain structure. A common example of this is the m. structure.

Desktop: example.com/page

Mobile: m.example.com/page

When a user loads your page, the server will have to determine which device the user is using and then direct them to the appropriate URL.

Advertisement
Separate m. URL structure for mobile sites

This approach is not recommended, as using multiple URLs for a single page leads to a messy scenario of URL management. 

Even with the correct signals in place, there is the added risk of Googlebot not interpreting these signals appropriately. This can lead to indexation issues or even Google identifying the pages as duplicate content.

If you currently work with this setup, you should ensure you follow the below canonical tag structure.

Desktop: Self-referencing canonical tag

Mobile: Canonical tag to target desktop URL

You’ll also want to implement a rel=”alternate” tag on the desktop version.

<link rel="alternate" media="only screen and (max-width: 640px)" href="https://m.example.com/">

Advertisement

That said, the best solution in the long term is to move to a responsive design setup.

Dynamic serving (not recommended)

Similar to responsive design, with dynamic serving, you’ll be serving content suited to different devices via a singular URL.

However, the main difference with dynamic serving is that you’ll serve different HTML files pre-defined to suit the respective device.

Dynamic serving serves separate HTML files by device

This approach certainly trumps the separate URL/domain structure option, as you have the advantage of serving content to multiple devices via a single URL.

However, dynamic serving is not recommended. History teaches us that this approach is renowned for technical issues.

With dynamic serving, it’s up to your web server to determine which device the user is browsing on. Quite often with dynamic serving setups, the desktop version of the page is accidentally shown to users on a mobile device.

Tip 2. Optimize for page speed on mobile devices

In the era of Core Web Vitals, you could argue that strong page speed performance has never been more sought after by SEO professionals.

Advertisement

In fact, when Google first rolled out Core Web Vitals as a ranking factor in 2021, it focused solely on mobile performance. Google then waited until February 2022 before using desktop Core Web Vital performance as a ranking factor. It’s clear to see which device Google prioritizes.

Google applies mobile and desktop Core Web Vital ranking signals to the respective search results. So for mobile search results, Google will focus on Core Web Vital performance from mobile devices.

A great starting point to see how your site performs against Core Web Vitals is to head to the dedicated report in Google Search Console (GSC). You can navigate to this report via left-hand navigation under the Experience section.

CWV performance graph

Clicking into the mobile report, you can see how your site has been performing against each Core Web Vital metric over the past three months. This data is gathered via CrUX (Chrome User Experience Report) from real users on your site who used a mobile device.

CWV issues segmented by issue type and category of performance

What’s great about this report in GSC is that the issue URLs are bucketed together into groups of similar pages. This means you can note down a list of key page templates that you need to work on.

Search Console bucketing similar page types

For a more detailed insight into issue areas and potential fixes, PageSpeed Insights is always worth a check.

PageSpeed Insights is simple to use. Just enter in the URL of the page you wish to test and hit “enter.” By default, the tool will automatically review the mobile version of your page.

Selecting mobile view in PageSpeed Insights

You’ll initially be presented with some insights under the heading “Discover what your real users are experiencing.” This report is the main one I focus on, to start with.

This report utilizes real user data via CrUX. Not only is it important to understand the experience of real users as opposed to bots, but Google also uses this data source within its ranking algorithm.

Here, we can see that Ahrefs’ homepage has passed all three Core Web Vital metrics.

Advertisement
Passing all three Core Web Vitals

Further down the report, you can also find some actions under the “opportunities” and “diagnostics” sections. These make for some great starting points when having conversations with developers about improving Core Web Vital performance.

Page Speed Insights actionable page speed opportunities

When using PageSpeed Insights, don’t forget to test the URLs of multiple page templates within the tool. Page speed performance often varies considerably across different page types.

We’re only scratching the surface here, though. GSC and PageSpeed Insights are only great starting points for auditing page speed.

Check out Patrick Stox’s dedicated guides on page speed and Core Web Vitals to take your page speed knowledge, analysis, and action plan to the next level.

Tip 3. Test and monitor your site for errors

It’s good practice to regularly test your site for key mobile usability errors.

There are multiple tools for this, but a great place to start is via GSC with a dedicated “Mobile Usability” report. You can find this report under the Experience section of the left-hand navigation.

Here, you can keep track of the number of URLs with mobile usability issues. GSC provides a three-month velocity graph. This is handy for identifying spikes in errors, allowing you to correlate them with development releases.

Mobile usability graph comparing usable and not usable URLs

By scrolling down, you can see the exact mobile usability issues that occur on your site. By clicking through to the individual reports, you’ll also be able to see which URLs are affected.

Summary of mobile usability issues

Outside of Search Console, you can also use Google’s Mobile-Friendly Test tool to uncover mobile usability issues. 

This is especially useful if you don’t have GSC access to the site you wish to review. Gaining access is recommended though, as you’ll automatically have a wider range of URLs covered.

Advertisement

To use the Mobile-Friendly Test, simply enter the URL (or code) for the page you wish to test to see if your page is deemed as mobile-friendly.

In this case, the tools show that the Ahrefs homepage has passed the test.

Page passing the Mobile-Friendly Test

On the other hand, if your tested page isn’t mobile-friendly, you’ll be hit with a message saying it’s not usable on mobile with a list of reasons why.

Issues for page failing the Mobile-Friendly Test

Keen to read more about specific mobile usability issues and how you can address them? Google has some great documentation that goes into more detail.

Tip 4. Make your content mobile-friendly

Making sure your website is optimized for mobile isn’t all about technical foundations. You’ll want to ensure your content is produced with mobile users in mind too.

Many SEOs prefer to use shorter paragraphs and sentences. This aligns nicely with mobile optimization practices.

This approach ensures that your content is readable on mobile devices. Who lands on an article and wants to read a big wall of text? Not me.

As a general guide, aim for a maximum of three sentences per paragraph. If a paragraph naturally just has one sentence, that’s OK too.

Advertisement
Example of a short sentence in a single paragraph

When proofing copy drafts, it’s good practice to break long sentences into shorter sentences where possible.

The same rule applies to introductions. In fact, you should apply these rules most strictly here. These should be short, snappy, and to the point.

Example of a short and snappy article introduction

To further enhance readability, you’ll want to break your copy up by including various elements and media.

These can include:

  • Bullet points
  • Numbered lists
  • Quotes
  • Images
  • Videos

See what I just did there?

When using different types of media, you’ll want to make sure these display correctly on mobile devices. It’s so frustrating for users when an image loads way out of proportion.

Tip 5. Optimize for mobile SERPs

Mobile SERPs (search engine results pages) can vary quite considerably between the mobile and desktop versions.

When browsing the SERPs for a chosen keyword, it’s important to manually check both the desktop and mobile results.

Here’s an example. Let’s take this wikiHow search result for the query, “how to fry an egg.”

Advertisement

On the desktop search results, we have a pretty standard search result. 

Basic desktop search result

On the mobile results, however, we can see that Google has included the how-to images rich result.

Mobile search result with how-to rich features

SERP estate is crucial. Gaining rich features like in the example above helps your result stand out from the crowd. 

This shows how important and relevant schema markup is for mobile optimization. In this example, wikiHow did a nice job by including how-to schema.

Looking to switch device in the search results but don’t want to grab your phone? With Ahrefs’ SEO Toolbar, you can load the results from another device directly in your desktop browser.

Selecting a device, via Ahrefs' SEO Toolbar

Tip 6. Include mobile-friendly navigation

One of the biggest considerations when optimizing your site for mobile devices is the choice of implementation for the header navigation.

This is quite easily one of the most complicated areas of the site to get right for a mobile device.

The hamburger menu has become a popular option in the mobile-first world. It gets its name because the button often looks like a hamburger (apparently).

Here’s an example of the hamburger menu in action on Amazon.

Advertisement
Hamburger menu icon on Amazon

Once you click on the “hamburger” icon, usually located at the very top of the page, the menu will then open out.

In this case, the menu opens out from the left-hand side with options to further expand into navigation subcategories.

Amazon hamburger menu expanded from the left

Hamburger menus are hotly debated among SEOs and UX professionals. In my opinion, however, you can’t beat the hamburger navigation when it comes to optimizing for mobile.

Not only is this approach clean and compact, but users are also becoming more accustomed to these types of menus on mobile.

It’s OK to go with the “mega menu” approach for your desktop site and switch to the hamburger menu for your mobile site. 

The number #1 rule is to ensure that the links within both menus are the same. You’ll want to make sure that you include the exact same links on both your desktop and mobile navigation.

Here, we can see that Apple displays the mega menu on desktop.

Apple navigation on desktop

And on its mobile site, it uses the hamburger menu but shows the exact same links seen on the desktop version.

Apple navigation on mobile

For e-commerce websites, faceted navigation is a big consideration too. 

Let’s take a look back at Amazon. It has tons of filter options on its product listing pages.

Advertisement

To keep the faceted navigation compact for mobile users, it uses a similar approach to the hamburger menu.

Faceted navigation on Amazon

Allowing the faceted navigation to expand on a simple button click keeps your page neat and compact. Perfect for mobile users.

Keen to learn more about site navigation? Be sure to check out Sam Underwood’s article on mastering website navigation

Tip 7. Keep your content the same

Parity between your site’s mobile and desktop versions is essential. As we mentioned earlier, Google will predominantly crawl the mobile version of your website. 

If you were to remove content from the mobile version of your page, you’d run the risk of weakening your content in the eyes of Google.

This rule should be applied to all types of content, from the copy itself to imagery. This rule also applies to technical items, from canonical tags to internal linking.

A great way to test mobile parity is to run a crawl on your mobile site and compare it against a crawl on the desktop version of your site.

Advertisement

Setting up a crawl via Ahrefs’ Site Audit, you have the option to switch between the mobile and desktop user agent. 

You can locate this setting under the “Robots instructions” section of the crawl settings.

Selecting user agent, via Ahrefs' Site Audit crawl settings

To test mobile parity via Site Audit, start two separate crawls. One with the user agent set to “AhrefsSiteAudit (Desktop),” and the other with “AhrefsSiteAudit (Mobile).”

You can then compare these crawls in the project history side by side to check for parity between the desktop and mobile crawls.

Comparing Ahrefs' Site Audit crawl results

Notice significantly more errors on the mobile crawl compared to the desktop crawl? This can indicate that your technical elements aren’t being implemented correctly on mobile.

In Site Audit, it’s well worth comparing the HTML source code between your mobile and desktop crawls. This allows you to easily identify any unexpected differences between the mobile and desktop code of your page.

In the example below, we can see that the header menu code has changed between the mobile and desktop crawls. Luckily in this case, this code difference is expected.

Comparing HTML source code, via Ahrefs' Site Audit crawl comparisons

You should also consider rendering JavaScript in the crawl settings for websites that heavily rely on that. You can then compare the rendered HTML between the crawls with different user agents. Check our guide to JavaScript SEO for more information.

Tip 8. Avoid intrusive interstitials

Interstitials (also known as pop-ups) that are intrusive and distracting are frustrating for users. This is often an even stronger frustration for mobile users, as pop-ups often take up an even bigger portion of the screen.

Advertisement

Not only could you be decreasing your conversion rate with annoying and intrusive pop-ups, but you’d also get a thumbs-down from Google.

As part of Google’s Page Experience set of ranking signals, Google approves more subtle interstitials as opposed to the large interstitials that cause great frustration.

Acceptable interstitial practice

The big exception to the rule here is that the interstitial may be required by law. Common examples include cookie consent and age gate pop-ups.

For example, on alcohol-related content, the supplier could land in hot water if they didn’t force a user to enter their date of birth before accessing the content.

Age gate on alcohol website

Tip 9. Review mobile performance

It’s good practice to regularly review the devices that drive your website’s organic traffic.

Starting off with GSC, you can filter by device type in the search performance report.

Simply add a new filter by clicking the “+ new” button above the report and select “Device…”

Filtering by device in Google Search Console's Performance report

Here, you can filter your organic performance report via device, allowing you to see just how much organic traffic you’ve acquired via mobile devices. You also have the option to compare traffic by device.

Comparing traffic by device in Search Console

Similar to the “Mobile Usability” report in GSC, it’s worth keeping an eye out for any unexpected fluctuations and traffic drops in mobile traffic. This can be a sign of mobile optimization issues that need further investigation.

You can also view traffic by device in Google Analytics 4. Head to the “Device Category” report by loading Reports > User > Tech > Overview. 

Advertisement

Here, you’ll want to click “View platform devices” for the full analytics by device.

GA4's Device Category report

You’ll then be presented with data tables, charts, and graphs based on traffic by device type. Don’t forget to add an organic traffic filter to ensure you’re looking purely at “SEO traffic.”

GA4 table comparing traffic by device category

Tip 10. Track rankings on a mobile device

When it comes to tracking keywords, it’s easy to forget that rankings can vary between the desktop and mobile SERPs.

Luckily, switching between desktop and mobile on Ahrefs’ Rank Tracker is simple, making it super easy to see how your site is ranking on either SERP.

What’s also great about Rank Tracker is that you don’t need to specify a device as a setting when you first track your keywords. Keywords are automatically tracked within both the mobile and desktop SERPs.

Simply load your keyword report and switch between mobile and desktop reviews in the top left corner.

Switching between mobile and desktop rankings in Ahrefs' Rank Tracker

Final thoughts

You may be wondering, “Should I just ditch the desktop version of my site and focus on mobile optimization?”

Steady on. It’s true that mobile is now the dominant device, but you won’t want to completely disregard the desktop experience. 

Not only will some of your users visit your site via desktop, but Googlebot will also crawl via a desktop user agent from time to time (just not as frequently as the mobile version).

Advertisement

In fact, many websites continue to predominantly drive traffic through users on desktop. This is particularly the case for SaaS companies and many B2B-focused websites in general. For example, the Ahrefs Blog has over 70% of organic traffic coming from users on desktop devices.

High organic traffic to Ahrefs via desktop devices

To sum it up, the key takeaways are to:

  • Show the same content on your mobile site as you would on your desktop site.
  • Understand that responsive design is the way to go.
  • Prioritize your mobile pages for page speed optimization.
  • Not be afraid to use the hamburger menu for mobile devices.
  • Regularly monitor and track mobile usability and mobile traffic/rankings.

Have any questions? Ping me on Twitter and let me know.



Source link

Keep an eye on what we are doing
Be the first to get latest updates and exclusive content straight to your email inbox.
We promise not to spam you. You can unsubscribe at any time.
Invalid email address

SEO

2024 WordPress Vulnerability Report Shows Errors Sites Keep Making

Published

on

By

2024 Annual WordPress security report by WPScan

WordPress security scanner WPScan’s 2024 WordPress vulnerability report calls attention to WordPress vulnerability trends and suggests the kinds of things website publishers (and SEOs) should be looking out for.

Some of the key findings from the report were that just over 20% of vulnerabilities were rated as high or critical level threats, with medium severity threats, at 67% of reported vulnerabilities, making up the majority. Many regard medium level vulnerabilities as if they are low-level threats and that’s a mistake because they’re not low level and should be regarded as deserving attention.

The WPScan report advised:

“While severity doesn’t translate directly to the risk of exploitation, it’s an important guideline for website owners to make an educated decision about when to disable or update the extension.”

WordPress Vulnerability Severity Distribution

Critical level vulnerabilities, the highest level of threat, represented only 2.38% of vulnerabilities, which is essentially good news for WordPress publishers. Yet as mentioned earlier, when combined with the percentages of high level threats (17.68%) the number or concerning vulnerabilities rises to almost 20%.

Here are the percentages by severity ratings:

Advertisement
  • Critical 2.38%
  • Low 12.83%
  • High 17.68%
  • Medium 67.12%

Authenticated Versus Unauthenticated

Authenticated vulnerabilities are those that require an attacker to first attain user credentials and their accompanying permission levels in order to exploit a particular vulnerability. Exploits that require subscriber-level authentication are the most exploitable of the authenticated exploits and those that require administrator level access present the least risk (although not always a low risk for a variety of reasons).

Unauthenticated attacks are generally the easiest to exploit because anyone can launch an attack without having to first acquire a user credential.

The WPScan vulnerability report found that about 22% of reported vulnerabilities required subscriber level or no authentication at all, representing the most exploitable vulnerabilities. On the other end of the scale of the exploitability are vulnerabilities requiring admin permission levels representing a total of 30.71% of reported vulnerabilities.

Permission Levels Required For Exploits

Vulnerabilities requiring administrator level credentials represented the highest percentage of exploits, followed by Cross Site Request Forgery (CSRF) with 24.74% of vulnerabilities. This is interesting because CSRF is an attack that uses social engineering to get a victim to click a link from which the user’s permission levels are acquired. This is a mistake that WordPress publishers should be aware of because all it takes is for an admin level user to follow a link which then enables the hacker to assume admin level privileges to the WordPress website.

The following is the percentages of exploits ordered by roles necessary to launch an attack.

Ascending Order Of User Roles For Vulnerabilities

  • Author 2.19%
  • Subscriber 10.4%
  • Unauthenticated 12.35%
  • Contributor 19.62%
  • CSRF 24.74%
  • Admin 30.71%

Most Common Vulnerability Types Requiring Minimal Authentication

Broken Access Control in the context of WordPress refers to a security failure that can allow an attacker without necessary permission credentials to gain access to higher credential permissions.

In the section of the report that looks at the occurrences and vulnerabilities underlying unauthenticated or subscriber level vulnerabilities reported (Occurrence vs Vulnerability on Unauthenticated or Subscriber+ reports), WPScan breaks down the percentages for each vulnerability type that is most common for exploits that are the easiest to launch (because they require minimal to no user credential authentication).

Advertisement

The WPScan threat report noted that Broken Access Control represents a whopping 84.99% followed by SQL injection (20.64%).

The Open Worldwide Application Security Project (OWASP) defines Broken Access Control as:

“Access control, sometimes called authorization, is how a web application grants access to content and functions to some users and not others. These checks are performed after authentication, and govern what ‘authorized’ users are allowed to do.

Access control sounds like a simple problem but is insidiously difficult to implement correctly. A web application’s access control model is closely tied to the content and functions that the site provides. In addition, the users may fall into a number of groups or roles with different abilities or privileges.”

SQL injection, at 20.64% represents the second most prevalent type of vulnerability, which WPScan referred to as both “high severity and risk” in the context of vulnerabilities requiring minimal authentication levels because attackers can access and/or tamper with the database which is the heart of every WordPress website.

These are the percentages:

  • Broken Access Control 84.99%
  • SQL Injection 20.64%
  • Cross-Site Scripting 9.4%
  • Unauthenticated Arbitrary File Upload 5.28%
  • Sensitive Data Disclosure 4.59%
  • Insecure Direct Object Reference (IDOR) 3.67%
  • Remote Code Execution 2.52%
  • Other 14.45%

Vulnerabilities In The WordPress Core Itself

The overwhelming majority of vulnerability issues were reported in third-party plugins and themes. However, there were in 2023 a total of 13 vulnerabilities reported in the WordPress core itself. Out of the thirteen vulnerabilities only one of them was rated as a high severity threat, which is the second highest level, with Critical being the highest level vulnerability threat, a rating scoring system maintained by the Common Vulnerability Scoring System (CVSS).

The WordPress core platform itself is held to the highest standards and benefits from a worldwide community that is vigilant in discovering and patching vulnerabilities.

Advertisement

Website Security Should Be Considered As Technical SEO

Site audits don’t normally cover website security but in my opinion every responsible audit should at least talk about security headers. As I’ve been saying for years, website security quickly becomes an SEO issue once a website’s ranking start disappearing from the search engine results pages (SERPs) due to being compromised by a vulnerability. That’s why it’s critical to be proactive about website security.

According to the WPScan report, the main point of entry for hacked websites were leaked credentials and weak passwords. Ensuring strong password standards plus two-factor authentication is an important part of every website’s security stance.

Using security headers is another way to help protect against Cross-Site Scripting and other kinds of vulnerabilities.

Lastly, a WordPress firewall and website hardening are also useful proactive approaches to website security. I once added a forum to a brand new website I created and it was immediately under attack within minutes. Believe it or not, virtually every website worldwide is under attack 24 hours a day by bots scanning for vulnerabilities.

Read the WPScan Report:

WPScan 2024 Website Threat Report

Advertisement

Featured Image by Shutterstock/Ljupco Smokovski

Source link

Keep an eye on what we are doing
Be the first to get latest updates and exclusive content straight to your email inbox.
We promise not to spam you. You can unsubscribe at any time.
Invalid email address
Continue Reading

SEO

An In-Depth Guide And Best Practices For Mobile SEO

Published

on

By

Mobile SEO: An In-Depth Guide And Best Practices

Over the years, search engines have encouraged businesses to improve mobile experience on their websites. More than 60% of web traffic comes from mobile, and in some cases based on the industry, mobile traffic can reach up to 90%.

Since Google has completed its switch to mobile-first indexing, the question is no longer “if” your website should be optimized for mobile, but how well it is adapted to meet these criteria. A new challenge has emerged for SEO professionals with the introduction of Interaction to Next Paint (INP), which replaced First Input Delay (FID) starting March, 12 2024.

Thus, understanding mobile SEO’s latest advancements, especially with the shift to INP, is crucial. This guide offers practical steps to optimize your site effectively for today’s mobile-focused SEO requirements.

What Is Mobile SEO And Why Is It Important?

The goal of mobile SEO is to optimize your website to attain better visibility in search engine results specifically tailored for mobile devices.

This form of SEO not only aims to boost search engine rankings, but also prioritizes enhancing mobile user experience through both content and technology.

Advertisement

While, in many ways, mobile SEO and traditional SEO share similar practices, additional steps related to site rendering and content are required to meet the needs of mobile users and the speed requirements of mobile devices.

Does this need to be a priority for your website? How urgent is it?

Consider this: 58% of the world’s web traffic comes from mobile devices.

If you aren’t focused on mobile users, there is a good chance you’re missing out on a tremendous amount of traffic.

Mobile-First Indexing

Additionally, as of 2023, Google has switched its crawlers to a mobile-first indexing priority.

This means that the mobile experience of your site is critical to maintaining efficient indexing, which is the step before ranking algorithms come into play.

Advertisement

Read more: Where We Are Today With Google’s Mobile-First Index

How Much Of Your Traffic Is From Mobile?

How much traffic potential you have with mobile users can depend on various factors, including your industry (B2B sites might attract primarily desktop users, for example) and the search intent your content addresses (users might prefer desktop for larger purchases, for example).

Regardless of where your industry and the search intent of your users might be, the future will demand that you optimize your site experience for mobile devices.

How can you assess your current mix of mobile vs. desktop users?

An easy way to see what percentage of your users is on mobile is to go into Google Analytics 4.

  • Click Reports in the left column.
  • Click on the Insights icon on the right side of the screen.
  • Scroll down to Suggested Questions and click on it.
  • Click on Technology.
  • Click on Top Device model by Users.
  • Then click on Top Device category by Users under Related Results.
  • The breakdown of Top Device category will match the date range selected at the top of GA4.
Screenshot from GA4, March 2024

You can also set up a report in Looker Studio.

  • Add your site to the Data source.
  • Add Device category to the Dimension field.
  • Add 30-day active users to the Metric field.
  • Click on Chart to select the view that works best for you.
A screen capture from Looker Studio showing a pie chart with a breakdown of mobile, desktop, tablet, and Smart TV users for a siteScreenshot from Looker Studio, March 2024

You can add more Dimensions to really dig into the data to see which pages attract which type of users, what the mobile-to-desktop mix is by country, which search engines send the most mobile users, and so much more.

Read more: Why Mobile And Desktop Rankings Are Different

Advertisement

How To Check If Your Site Is Mobile-Friendly

Now that you know how to build a report on mobile and desktop usage, you need to figure out if your site is optimized for mobile traffic.

While Google removed the mobile-friendly testing tool from Google Search Console in December 2023, there are still a number of useful tools for evaluating your site for mobile users.

Bing still has a mobile-friendly testing tool that will tell you the following:

  • Viewport is configured correctly.
  • Page content fits device width.
  • Text on the page is readable.
  • Links and tap targets are sufficiently large and touch-friendly.
  • Any other issues detected.

Google’s Lighthouse Chrome extension provides you with an evaluation of your site’s performance across several factors, including load times, accessibility, and SEO.

To use, install the Lighthouse Chrome extension.

  • Go to your website in your browser.
  • Click on the orange lighthouse icon in your browser’s address bar.
  • Click Generate Report.
  • A new tab will open and display your scores once the evaluation is complete.
An image showing the Lighthouse Scores for a website.Screenshot from Lighthouse, March 2024

You can also use the Lighthouse report in Developer Tools in Chrome.

  • Simply click on the three dots next to the address bar.
  • Select “More Tools.”
  • Select Developer Tools.
  • Click on the Lighthouse tab.
  • Choose “Mobile” and click the “Analyze page load” button.
An image showing how to get to Lighthouse within Google Chrome Developer Tools.Screenshot from Lighthouse, March 2024

Another option that Google offers is the PageSpeed Insights (PSI) tool. Simply add your URL into the field and click Analyze.

PSI will integrate any Core Web Vitals scores into the resulting view so you can see what your users are experiencing when they come to your site.

An image showing the PageSpeed Insights scores for a website.Screenshot from PageSpeed Insights, March 2024

Other tools, like WebPageTest.org, will graphically display the processes and load times for everything it takes to display your webpages.

With this information, you can see which processes block the loading of your pages, which ones take the longest to load, and how this affects your overall page load times.

Advertisement

You can also emulate the mobile experience by using Developer Tools in Chrome, which allows you to switch back and forth between a desktop and mobile experience.

An image showing how to change the device emulation for a site within Google Chrome Developer ToolsScreenshot from Google Chrome Developer Tools, March 2024

Lastly, use your own mobile device to load and navigate your website:

  • Does it take forever to load?
  • Are you able to navigate your site to find the most important information?
  • Is it easy to add something to cart?
  • Can you read the text?

Read more: Google PageSpeed Insights Reports: A Technical Guide

How To Optimize Your Site Mobile-First

With all these tools, keep an eye on the Performance and Accessibility scores, as these directly affect mobile users.

Expand each section within the PageSpeed Insights report to see what elements are affecting your score.

These sections can give your developers their marching orders for optimizing the mobile experience.

While mobile speeds for cellular networks have steadily improved around the world (the average speed in the U.S. has jumped to 27.06 Mbps from 11.14 Mbps in just eight years), speed and usability for mobile users are at a premium.

Read more: Top 7 SEO Benefits Of Responsive Web Design

Advertisement

Best Practices For Mobile Optimization

Unlike traditional SEO, which can focus heavily on ensuring that you are using the language of your users as it relates to the intersection of your products/services and their needs, optimizing for mobile SEO can seem very technical SEO-heavy.

While you still need to be focused on matching your content with the needs of the user, mobile search optimization will require the aid of your developers and designers to be fully effective.

Below are several key factors in mobile SEO to keep in mind as you’re optimizing your site.

Site Rendering

How your site responds to different devices is one of the most important elements in mobile SEO.

The two most common approaches to this are responsive design and dynamic serving.

Responsive design is the most common of the two options.

Advertisement

Using your site’s cascading style sheets (CSS) and flexible layouts, as well as responsive content delivery networks (CDN) and modern image file types, responsive design allows your site to adjust to a variety of screen sizes, orientations, and resolutions.

With the responsive design, elements on the page adjust in size and location based on the size of the screen.

You can simply resize the window of your desktop browser and see how this works.

An image showing the difference between Web.dev in a full desktop display vs. a mobile display using responsive design.Screenshot from web.dev, March 2024

This is the approach that Google recommends.

Adaptive design, also known as dynamic serving, consists of multiple fixed layouts that are dynamically served to the user based on their device.

Sites can have a separate layout for desktop, smartphone, and tablet users. Each design can be modified to remove functionality that may not make sense for certain device types.

This is a less efficient approach, but it does give sites more control over what each device sees.

Advertisement

While these will not be covered here, two other options:

  • Progressive Web Apps (PWA), which can seamlessly integrate into a mobile app.
  • Separate mobile site/URL (which is no longer recommended).

Read more: An Introduction To Rendering For SEO

Interaction to Next Paint (INP)

Google has introduced Interaction to Next Paint (INP) as a more comprehensive measure of user experience, succeeding First Input Delay. While FID measures the time from when a user first interacts with your page (e.g., clicking a link, tapping a button) to the time when the browser is actually able to begin processing event handlers in response to that interaction. INP, on the other hand, broadens the scope by measuring the responsiveness of a website throughout the entire lifespan of a page, not just first interaction.

Note that actions such as hovering and scrolling do not influence INP, however, keyboard-driven scrolling or navigational actions are considered keystrokes that may activate events measured by INP but not scrolling which is happeing due to interaction.

Scrolling may indirectly affect INP, for example in scenarios where users scroll through content, and additional content is lazy-loaded from the API. While the act of scrolling itself isn’t included in the INP calculation, the processing, necessary for loading additional content, can create contention on the main thread, thereby increasing interaction latency and adversely affecting the INP score.

What qualifies as an optimal INP score?

  • An INP under 200ms indicates good responsiveness.
  • Between 200ms and 500ms needs improvement.
  • Over 500ms means page has poor responsiveness.

and these are common issues causing poor INP scores:

  1. Long JavaScript Tasks: Heavy JavaScript execution can block the main thread, delaying the browser’s ability to respond to user interactions. Thus break long JS tasks into smaller chunks by using scheduler API.
  2. Large DOM (HTML) Size: A large DOM ( starting from 1500 elements) can severely impact a website’s interactive performance. Every additional DOM element increases the work required to render pages and respond to user interactions.
  3. Inefficient Event Callbacks: Event handlers that execute lengthy or complex operations can significantly affect INP scores. Poorly optimized callbacks attached to user interactions, like clicks, keypress or taps, can block the main thread, delaying the browser’s ability to render visual feedback promptly. For example when handlers perform heavy computations or initiate synchronous network requests such on clicks.

and you can troubleshoot INP issues using free and paid tools.

As a good starting point I would recommend to check your INP scores by geos via treo.sh which will give you a great high level insights where you struggle with most.

INP scores by GeosINP scores by Geos

Read more: How To Improve Interaction To Next Paint (INP)

Image Optimization

Images add a lot of value to the content on your site and can greatly affect the user experience.

Advertisement

From page speeds to image quality, you could adversely affect the user experience if you haven’t optimized your images.

This is especially true for the mobile experience. Images need to adjust to smaller screens, varying resolutions, and screen orientation.

  • Use responsive images
  • Implement lazy loading
  • Compress your images (use WebP)
  • Add your images into sitemap

Optimizing images is an entire science, and I advise you to read our comprehensive guide on image SEO how to implement the mentioned recommendations.

Avoid Intrusive Interstitials

Google rarely uses concrete language to state that something is a ranking factor or will result in a penalty, so you know it means business about intrusive interstitials in the mobile experience.

Intrusive interstitials are basically pop-ups on a page that prevent the user from seeing content on the page.

John Mueller, Google’s Senior Search Analyst, stated that they are specifically interested in the first interaction a user has after clicking on a search result.

Examples of intrusive interstitial pop-ups on a mobile site according to Google.

Not all pop-ups are considered bad. Interstitial types that are considered “intrusive” by Google include:

Advertisement
  • Pop-ups that cover most or all of the page content.
  • Non-responsive interstitials or pop-ups that are impossible for mobile users to close.
  • Pop-ups that are not triggered by a user action, such as a scroll or a click.

Read more: 7 Tips To Keep Pop-Ups From Harming Your SEO

Structured Data

Most of the tips provided in this guide so far are focused on usability and speed and have an additive effect, but there are changes that can directly influence how your site appears in mobile search results.

Search engine results pages (SERPs) haven’t been the “10 blue links” in a very long time.

They now reflect the diversity of search intent, showing a variety of different sections to meet the needs of users. Local Pack, shopping listing ads, video content, and more dominate the mobile search experience.

As a result, it’s more important than ever to provide structured data markup to the search engines, so they can display rich results for users.

In this example, you can see that both Zojirushi and Amazon have included structured data for their rice cookers, and Google is displaying rich results for both.

An image of a search result for Japanese rice cookers that shows rich results for Zojirushi and Amazon.Screenshot from search for [Japanese rice cookers], Google, March 2024

Adding structured data markup to your site can influence how well your site shows up for local searches and product-related searches.

Using JSON-LD, you can mark up the business, product, and services data on your pages in Schema markup.

Advertisement

If you use WordPress as the content management system for your site, there are several plugins available that will automatically mark up your content with structured data.

Read more: What Structured Data To Use And Where To Use It?

Content Style

When you think about your mobile users and the screens on their devices, this can greatly influence how you write your content.

Rather than long, detailed paragraphs, mobile users prefer concise writing styles for mobile reading.

Each key point in your content should be a single line of text that easily fits on a mobile screen.

Your font sizes should adjust to the screen’s resolution to avoid eye strain for your users.

Advertisement

If possible, allow for a dark or dim mode for your site to further reduce eye strain.

Headers should be concise and address the searcher’s intent. Rather than lengthy section headers, keep it simple.

Finally, make sure that your text renders in a font size that’s readable.

Read more: 10 Tips For Creating Mobile-Friendly Content

Tap Targets

As important as text size, the tap targets on your pages should be sized and laid out appropriately.

Tap targets include navigation elements, links, form fields, and buttons like “Add to Cart” buttons.

Advertisement

Targets smaller than 48 pixels by 48 pixels and targets that overlap or are overlapped by other page elements will be called out in the Lighthouse report.

Tap targets are essential to the mobile user experience, especially for ecommerce websites, so optimizing them is vital to the health of your online business.

Read more: Google’s Lighthouse SEO Audit Tool Now Measures Tap Target Spacing

Prioritizing These Tips

If you have delayed making your site mobile-friendly until now, this guide may feel overwhelming. As a result, you may not know what to prioritize first.

As with so many other optimizations in SEO, it’s important to understand which changes will have the greatest impact, and this is just as true for mobile SEO.

Think of SEO as a framework in which your site’s technical aspects are the foundation of your content. Without a solid foundation, even the best content may struggle to rank.

Advertisement
  • Responsive or Dynamic Rendering: If your site requires the user to zoom and scroll right or left to read the content on your pages, no number of other optimizations can help you. This should be first on your list.
  • Content Style: Rethink how your users will consume your content online. Avoid very long paragraphs. “Brevity is the soul of wit,” to quote Shakespeare.
  • Image Optimization: Begin migrating your images to next-gen image formats and optimize your content display network for speed and responsiveness.
  • Tap Targets: A site that prevents users from navigating or converting into sales won’t be in business long. Make navigation, links, and buttons usable for them.
  • Structured Data: While this element ranks last in priority on this list, rich results can improve your chances of receiving traffic from a search engine, so add this to your to-do list once you’ve completed the other optimizations.

Summary

From How Search Works, “Google’s mission is to organize the world’s information and make it universally accessible and useful.”

If Google’s primary mission is focused on making all the world’s information accessible and useful, then you know they will prefer surfacing sites that align with that vision.

Since a growing percentage of users are on mobile devices, you may want to infer the word “everywhere” added to the end of the mission statement.

Are you missing out on traffic from mobile devices because of a poor mobile experience?

If you hope to remain relevant, make mobile SEO a priority now.


Featured Image: Paulo Bobita/Search Engine Journal

Source link

Advertisement
Keep an eye on what we are doing
Be the first to get latest updates and exclusive content straight to your email inbox.
We promise not to spam you. You can unsubscribe at any time.
Invalid email address
Continue Reading

SEO

HARO Has Been Dead for a While

Published

on

HARO Has Been Dead for a While

Every SEO’s favorite link-building collaboration tool, HARO, was officially killed off for good last week by Cision. It’s now been wrapped into a new product: Connectively.

I know nothing about the new tool. I haven’t tried it. But after trying to use HARO recently, I can’t say I’m surprised or saddened by its death. It’s been a walking corpse for a while. 

I used HARO way back in the day to build links. It worked. But a couple of months ago, I experienced the platform from the other side when I decided to try to source some “expert” insights for our posts. 

After just a few minutes of work, I got hundreds of pitches: 

So, I grabbed a cup of coffee and began to work through them. It didn’t take long before I lost the will to live. Every other pitch seemed like nothing more than lazy AI-generated nonsense from someone who definitely wasn’t an expert. 

Advertisement

Here’s one of them: 

Example of an AI-generated pitch in HAROExample of an AI-generated pitch in HARO

Seriously. Who writes like that? I’m a self-confessed dullard (any fellow Dull Men’s Club members here?), and even I’m not that dull… 

I don’t think I looked through more than 30-40 of the responses. I just couldn’t bring myself to do it. It felt like having a conversation with ChatGPT… and not a very good one! 

Despite only reviewing a few dozen of the many pitches I received, one stood out to me: 

Example HARO pitch that caught my attentionExample HARO pitch that caught my attention

Believe it or not, this response came from a past client of mine who runs an SEO agency in the UK. Given how knowledgeable and experienced he is (he actually taught me a lot about SEO back in the day when I used to hassle him with questions on Skype), this pitch rang alarm bells for two reasons: 

  1. I truly doubt he spends his time replying to HARO queries
  2. I know for a fact he’s no fan of Neil Patel (sorry, Neil, but I’m sure you’re aware of your reputation at this point!)

So… I decided to confront him 😉 

Here’s what he said: 

Hunch, confirmed ;)Hunch, confirmed ;)

Shocker. 

I pressed him for more details: 

Advertisement

I’m getting a really good deal and paying per link rather than the typical £xxxx per month for X number of pitches. […] The responses as you’ve seen are not ideal but that’s a risk I’m prepared to take as realistically I dont have the time to do it myself. He’s not native english, but I have had to have a word with him a few times about clearly using AI. On the low cost ones I don’t care but on authority sites it needs to be more refined.

I think this pretty much sums up the state of HARO before its death. Most “pitches” were just AI answers from SEOs trying to build links for their clients. 

Don’t get me wrong. I’m not throwing shade here. I know that good links are hard to come by, so you have to do what works. And the reality is that HARO did work. Just look at the example below. You can tell from the anchor and surrounding text in Ahrefs that these links were almost certainly built with HARO: 

Example of links build with HARO, via Ahrefs' Site ExplorerExample of links build with HARO, via Ahrefs' Site Explorer

But this was the problem. HARO worked so well back in the day that it was only a matter of time before spammers and the #scale crew ruined it for everyone. That’s what happened, and now HARO is no more. So… 

If you’re a link builder, I think it’s time to admit that HARO link building is dead and move on. 

No tactic works well forever. It’s the law of sh**ty clickthroughs. This is why you don’t see SEOs having huge success with tactics like broken link building anymore. They’ve moved on to more innovative tactics or, dare I say it, are just buying links.

Sidenote.

Talking of buying links, here’s something to ponder: if Connectively charges for pitches, are links built through those pitches technically paid? If so, do they violate Google’s spam policies? It’s a murky old world this SEO lark, eh?

If you’re a journalist, Connectively might be worth a shot. But with experts being charged for pitches, you probably won’t get as many responses. That might be a good thing. You might get less spam. Or you might just get spammed by SEOs with deep pockets. The jury’s out for now. 

Advertisement

My advice? Look for alternative methods like finding and reaching out to experts directly. You can easily use tools like Content Explorer to find folks who’ve written lots of content about the topic and are likely to be experts. 

For example, if you look for content with “backlinks” in the title and go to the Authors tab, you might see a familiar name. 😉 

Finding people to request insights from in Ahrefs' Content ExplorerFinding people to request insights from in Ahrefs' Content Explorer

I don’t know if I’d call myself an expert, but I’d be happy to give you a quote if you reached out on social media or emailed me (here’s how to find my email address).

Alternatively, you can bait your audience into giving you their insights on social media. I did this recently with a poll on X and included many of the responses in my guide to toxic backlinks.

Me, indirectly sourcing insights on social mediaMe, indirectly sourcing insights on social media

Either of these options is quicker than using HARO because you don’t have to sift through hundreds of responses looking for a needle in a haystack. If you disagree with me and still love HARO, feel free to tell me why on X 😉



Source link

Keep an eye on what we are doing
Be the first to get latest updates and exclusive content straight to your email inbox.
We promise not to spam you. You can unsubscribe at any time.
Invalid email address
Continue Reading

Trending

Follow by Email
RSS