Connect with us

SEO

How to Make Fewer HTTP Requests

Published

on

When you browse the internet, do you ever stop to wonder what’s happening in the background? If the answer’s no, don’t worry. You’re not alone. Most marketers, even great ones, don’t give the “tech stuff” much thought. How a website performs is just something for IT specialists to worry about, right?

No, unfortunately.

If your website’s slow or clunky, it directly affects the user experience. In fact, 40 percent of people won’t hang around if your website takes more than 3 seconds to load. With this in mind, it’s crucial you know how to fix a sluggish website and streamline your page loading times before you lose leads.

Where do you start? Well, one way is to make fewer HTTP requests for your website.

Although an HTTP request sounds like a really technical term best reserved for engineers and IT pros, don’t panic. It’s something any good marketer can understand. Now, let’s take a deep dive into how these requests work and how you can use this knowledge to boost your website’s performance.

What Are HTTP Requests?

Before we get started, it’s crucial you’re clear on what HTTP requests actually are.

HTTP stands for “HyperText Transfer Protocol.” Think of HTTP as the language browsers and web servers use to talk to each other. We (thankfully) don’t need to cover all the intricacies of web code to understand how HTTP affects load time, but here’s a breakdown of the key steps marketers need to know.

When someone wants to visit your website, their browser sends a “request” to your server. This is known as an HTTP request. Your server acknowledges the response and kicks into gear, ready to display the webpage.

Advertisement

Here’s where it gets a little tricky, though. The browser can’t display the page right away. It needs copies of the various different files, such as plug-ins and images, to load the page properly.

How does the browser get these files? By making multiple HTTP requests. If the browser doesn’t make these requests, the page components won’t load.

Depending on how many components your page has, these requests can really add up, which is a problem. Here’s why.

Why You Need Fewer HTTP Requests

There are two simple reasons why every website should aim to reduce the HTTP requests associated with it.

Firstly, let’s start with page load time. The more HTTP requests your site receives, the longer it takes for the requested page to load. For example, a page with 20 HTTP requests will load faster than a page with 70 requests.

The issue? People don’t want to hang around waiting on a website loading.

  • 39 percent of visitors won’t return if your images or videos don’t load properly, as research by SAG IPL shows.
  • 45 percent of respondents won’t buy from a retailer if the website takes too long to load, according to research by Unbounce.

In short, with much competition out there, you’ll lose leads if your website takes too long to load or it doesn’t load properly at all.

Next, let’s think about what impact these lost leads have on your metrics.

According to Google, bounce rate increases by 32 percent when loading time slows from 1-3 seconds, and to make matters worse, poor loading time affects your SEO ranking. Delays in page loading time can cut page views by 11 percent, which tells Google your page isn’t offering value.

Advertisement

Think about it this way: If your website doesn’t impress visitors, they won’t shop with you. They won’t recommend you to their friends. In time, this leads to a lower search ranking, less visitors, and reduced conversion rates overall.

See also  Facebook Identifies 2021 Topics and Trends

What can we take from all this? Well, too many HTTP requests directly affect your key metrics and your marketability online.

How to Identify Unnecessary HTTP Requests

OK, we’re clear on how HTTP requests work and why you need less of them. How do you identify these excess requests, though? By doing two things: identifying how many requests you’re dealing with, and grading your website performance.

Establish the Number of HTTP Requests Your Website Receives

You can’t eliminate HTTP requests until you know how many your website receives. Luckily, there are tools available to help you identify the number.

For example, HubSpot’s Website Grader give you a free website “health check” so you can instantly see how many requests you’re receiving:

Make Fewer HTTP Requests - Website Grader HubSpot

If you use Chrome, you can also use Chrome’s DevTools to identify the number of HTTP requests. Simply right-click the page you want to check, click “Inspect,” then click the “Network” option. The image you’ll see looks something like this:

Make Fewer HTTP Requests - Chrome’s DevTools

This page receives 112 requests.

Grade Your Website Performance

When was the last time you assessed your website’s performance and, most importantly, page loading time? If you can’t remember, now’s a great time to run an audit.

You can try Ubersuggest for this. It’s really simple to use. Simply open Ubersuggest, type in your URL, and click “Site Audit” from the sidebar when the search results finish loading.

Once you’ve clicked “Site Audit,” you’ll see an overview of your website’s speed. It’ll look something like this:

Advertisement
Make Fewer HTTP Requests -Site Audit with Ubersuggest

A low score indicates you’re suffering from poor loading times. For example, if your mobile website takes 6 seconds to load, but your desktop site loads in 2 seconds, there’s a problem with your mobile site, and so on.

Don’t worry if you’re unhappy with your page loading times or the number of HTTP requests you’re seeing. Now you know there’s a problem, you can begin streamlining those HTTP requests and ensure your page loads as quickly as possible. Let’s look at how to do just that.

8 Steps to Make Fewer HTTP Requests

Although every website is unique, we can usually blame excessive HTTP requests on a few common problems. With this in mind, here are eight simple steps you can take right now to reduce the number of requests passing through your website.

1. Remove Unnecessary Plug-Ins

Plug-ins are great. They add new functionality to your website and make your web pages more engaging. However, too many plug-ins clutter your page and hold up loading times. While there’s no “right” number of plug-ins, a good rule of thumb is to keep them minimal.

First, identify which plug-ins you use. Do they add value to your website? If the answer’s no, they can go. If it’s a plug-in you only use now and then, you can always reinstall it when it’s required then delete it again.

Not sure how to identify your plug-ins? Reach out to me and see how I can help you better understand your website’s performance.

See also  TikTok Launches Branded Mission, A New Way To Crowdsource Creative

2. Replace Heavy Plug-Ins With Streamlined Ones

OK, so you can’t remove every plug-in. However, if you want to make fewer HTTP requests, you can often replace resource-heavy plug-ins with more streamlined options.

For example, maybe you want to add social media buttons to your page. Great. Social media shares can increase engagement and boost your exposure. However, the plug-ins can be resource-intensive.

To streamline your social media plug-ins, use tools like Novashare. This tool won’t slow your page down, but it will help you reduce the HTTP requests generated by your social sharing plug-ins:

Advertisement
Steps to Make Fewer HTTP Requests - Replace Heavy Plug-Ins With Streamlined Ones

3. Remove Images You Do Not Need

Sure, images can improve your website’s visual appeal and boost the user experience. Unless the image helps your reader understand your content in some way, or it’s a highly useful piece of content in its own right like an infographic, it might be worth deleting it.

Remember, every image creates an HTTP request. While those fun GIFs might have visual appeal, they won’t impress your audience if they affect load time.

Audit every individual web page and don’t be afraid to get a little ruthless. If the image doesn’t add value to your content, delete it.

4. Reduce the File Size for Remaining Images

Once you’ve deleted the unnecessary images, you need to optimize the ones you plan on keeping. In this context, “optimizing” doesn’t mean using alt text or keywords, although you should optimize for SEO, too.

Instead, what I mean is compressing each image. Compression preserves the image quality while reducing the overall file size, which improves load time.

If you don’t have access to image editing tools like Adobe, try free tools like Squoosh instead. You can tinker with the image to find the perfect balance between file size (which should be less than 1 MB, ideally) and image quality:

Steps to Make Fewer HTTP Requests - Reduce the File Size for Remaining Images

5. Drop Unnecessary Videos

Just like not every image adds value to your content, some videos detract from the user experience and increase the page loading time.

To be honest, this tip’s really simple. Just like you should cull any images or plug-ins you don’t need, limit how many videos you’re playing on any webpage.

How do you know which videos to delete? Well, there’s no rule here. However, if it doesn’t educate your audience or add value in some way, cut it or replace it with a shorter, comparable video.

6. Enable Lazy Load

“Lazy loading” means an image or video won’t load until the user begins scrolling down your webpage. How does this reduce HTTP requests?

Advertisement

Since the media doesn’t load right away, it won’t trigger an HTTP request for the initial page load. It doesn’t affect the user experience either, since users won’t know the difference between a regular or lazy load. All they’ll know is that the images or videos are viewable once they scroll down.

To enable lazy load, try out plug-ins like the aptly-named LazyLoad. The script takes up less than 10 KB of space, so it’s not resource-intensive. Just install the plug-in and it gets to work immediately:

Steps to Make Fewer HTTP Requests -Enable Lazy Load

7. Use Content Caching

Caching is a great way to reduce HTTP requests.

Essentially, caching means a visitor’s browser stores copies of the scripts it used to display your webpage, rather than delete them all. When the visitor returns, there’s no need to make all those HTTP requests again, because the scripts they need are already stored in the browser unless they clear their cache.

See also  Google Introduces a New Shopping Section in Search Results

Let me give you some tips for priming your website for content caching.

  • Don’t use cookies unless they’re essential.
  • Always use the same URL if you serve the content across different pages.
  • Build up a library of images and videos and reuse them.
  • Try out free tools like REDbot to assess your website’s cacheability.
Steps to Make Fewer HTTP Requests - Use Content Caching

8. Reduce Third-Party Requests

If a visitor’s browser needs to request or download data from a third party to display a website properly, like YouTube or Google Analytics, it’s called a third-party request. The issue? How long your page takes to load depends on how quickly the third-party server responds.

This is a huge problem because you’re not in control of your page loading time. To take back control, think about lazy loading third-party content like embedded YouTube videos. You could also try hosting scripts for necessary programs like Google Analytics locally rather than externally.

Finally, if a plug-in you use makes its own third-party requests, switch it for another plug-in where possible.

How to Make Fewer HTTP Requests

  1. Remove Unnecessary Plug-Ins

    Figure out which plug-ins are installed and remove those that you don’t use.

  2. Replace Heavy Plug-Ins With Streamlined Ones

    Audit the plug-ins you keep and replace them with more efficient ones if they’re available.

  3. Remove Unnecessary Images

    Delete images that don’t add value since each one creates an HTTP request.

  4. Reduce the File Size for Remaining Images

    Compress the images you keep to reduce load time.

  5. Drop Unnecessary Videos

    Only keep videos that add value to your page.

  6. Enable Lazy Load

    Use a plug-in that allows images and videos to load once a user scrolls.

  7. Use Content Caching

    To prepare your site for content caching avoid using cookies; use the same URL for content used on different pages; build an image library and re-use them; and audit your site’s ability to be cached.

  8. Reduce Third-Party Requests

    Try not to include content that pulls from a third party, like YouTube, since your page load time depends on theirs. You should also replace plug-ins that rely on third-party requests.

Conclusion

HTTP requests are essential to displaying a website and giving your audience an engaging experience. However, too many HTTP requests can disrupt your website performance and deter would-be customers from doing business with you.

Advertisement

The good news? With a few simple tweaks, you can ensure browsers make fewer HTTP requests to your website. You can boost page loading time, improve a webpage’s visual appeal, and, ultimately, increase conversions in the long run.

If you’re not sure where to get started with improving your website’s performance, check out my consulting services and we’ll see how I can help.

Have you tried reducing the number of HTTP requests on your website? Which strategies are working for you?

See How My Agency Can Drive Massive Amounts of Traffic to Your Website

  • SEO – unlock massive amounts of SEO traffic. See real results.
  • Content Marketing – our team creates epic content that will get shared, get links, and attract traffic.
  • Paid Media – effective paid strategies with clear ROI.

Book a Call

Neilpatel.com

SEO

10 Must-Know SEO Basics For Web Developers

Published

on

10 Must-Know SEO Basics For Web Developers

You know the struggle… you just need these four or five tickets taken care of and it would mean so much to your SEO goals for the month.

But how do you get your web developers on board?

How can you help them understand the urgency of your SEO needs when they have so many other competing priorities on their plate?

Fifteen years ago, I could do about 90% of my SEO work for a given client myself.

Those days are gone. SEO now relies on content creation, UX, code development, IT, various layers/levels of approvals, and more.

I have written many times about how SEO can’t be done in a silo and am happy it’s a discipline that now focuses more on alignment for creating a quality experience for website visitors.

Over my career, there has always been a need for the support of web developers.

Advertisement

That meant going down the hall in my agency or working with a third-party developer contracted or employed by my clients.

In either case, getting buy-in and support from web development is critical for SEO.

Even better is when developers have an understanding of SEO principles.

It is much more efficient if developers know the basics and factor them into their builds and site maintenance, avoiding any re-work later.

Check out the 10 must-know SEO basics for web developers and some focus group discussions with my teams of SEO specialists and developers as well.

1. Security

Website security matters to the search engines.

Make sure you have an SSL in place and without any errors.

That’s the starting point.

Advertisement

Beyond that, have the necessary safeguards to ensure the site has no vulnerabilities that allow for an injection, manipulated content, etc.

Getting hacked at any level hurts user experience and trust signals for users and search engines.

However, be mindful of site speed (more to come on that) when you secure the site with any plugins, extensions, or tools.

2. Response Codes

Server response codes matter.

See also  What Are The Top SEO Considerations For Merging Sites?

Often there are ways to get a page to render for a user and unique UX designs that prompt some creative dev implementations.

Regardless, make sure pages are rendering 200 server codes.

Source and update any 3xx or 4xx codes. If you don’t need redirects, remove them.

3. Redirects

Speaking of redirects, they are a critical part of the website migration and launch process coming from an old site to a new one.

Advertisement

If you don’t do anything else in your launch process, at least implement redirects.

We’re talking about making sure all URLs from the old site have a 301 redirect to the most relevant subject matter page on the new site.

This could be 1:1 old site to new site pages or many to one if you are streamlining and updating content structure.

Like with server codes above, don’t trust a page is rendering and assume it is ok.

Use tools to validate that redirects are 301s.

4. Robots.txt

Nothing matters in SEO if the site can’t get indexed and shown in search results.

Don’t let the robots.txt file be an afterthought.

Sometimes default commands are too open and, in other cases, too restrictive.

Advertisement

Know what’s in the robots.txt.

Don’t blindly push the staging file to production without checking it.

Several sites with great migration and launch plans have been foiled by a disallow all command from staging (to keep the dev site from being indexed) that was pushed to the live site.

Also, consider blocking low-value items like tag pages, comments pages, and any other variations your CMS creates

You’ll usually need to consider a lot of low-value junk and if you can’t keep the pages from generating, at least block them from indexing.

5. Sitemaps

XML sitemaps are our chance to ensure the search engines know about all of our pages.

Don’t waste resources and opportunities letting images, insignificant pages, and things that shouldn’t be prioritized for focus and indexing.

Ensure all pages listed in XML sitemaps render a 200 server code.

Advertisement

Keep them clean and free of 404s, redirects, and anything that isn’t the destination page.

See also  What It Is & How It Works

6. URLs

Good URLs are concise, include words relevant to the page’s subject matter, are lower case, and have no characters, spaces, or underscores.

I love to see a URL structure of sub-folder and pages that match the content hierarchy in the navigation and site structure.

Three levels down?

Then “example.com/level-1/level-2/topical-page.”

7. Mobile Friendly

Again, remember that just because something works or looks good in a browser doesn’t mean it is ideal for a search engine.

Mobile-friendliness is important to search.

Validate it with Google’s mobile-friendly tool.

Advertisement

Make sure it passes.

Beyond that, think about the content rendered in the mobile version.

Google uses “mobile first” indexing.

That means they are looking at the mobile version of the site.

If you’re hiding or not rendering important content that you want search engines to consider in the mobile version for UX considerations, think twice and know that the content may be missing from what Google sees.

8. Site Speed

This is number eight on the list but possibly the most important after ensuring your site can be indexed.

Site speed is important.

Slow page loads and sites hurt UX and conversion rates.

Advertisement

They also have an impact on SEO performance.

There’s not a single set of ways to optimize site speed.

It really comes down to keeping your code light, being judicious in using plugins or extensions, having an optimized hosting environment, compressing and minifying JS and CSS, and keeping image sizes under control.

Any code, files, and aspects that can cause shifts in performance or instability are a risk.

Build in any safeguards for content management controls so a 10MB image can’t be uploaded and tank a page. Or a plugin update goes undetected in how it slows down things.

Baseline, monitor, and improve site speed on an ongoing basis.

My Lead Developer’s favorite tool is web.dev or Lighthouse in the Google Chrome browser dev tools.

See also  How To Write A Stand Out SEO Resume (With Examples)

9. Heading Tags

Heading tags are great context clues for search engines.

Advertisement

Keep in mind they are for content and not CSS shortcuts.

Yes, tie your CSS to them, but keep them in order of importance.

Don’t have the first, biggest page heading as an H5 and subheadings on a page as H1s.

There’s plenty of commentary on the impact (or not) of headings on SEO performance.

I’m not going there in this article.

Just be as literal as you can in the hierarchy and how they’re used.

Use them where you can instead of other CSS.

Have just one H1 on a page if you can.

Advertisement

Work with your SEO resources to understand the plan for headings and on-page content overall.

10. Content Management & Dynamic Content

As noted above, CMS functionality can wreck the best dev implementations.

Be smart about the control you give.

Understand the site’s ongoing content plan and needs so content creators have the control they want and need but can’t wreck site speed or any of the SEO on-page elements.

Having as many dynamic aspects like tagging, XML sitemap generation, redirects, and more can save you time and safeguard your site and code to keep everything stable.

Conclusion

The intersection and collaboration between SEO professionals and web developers are important.

SEO relies on best practices for technical SEO and other things like enterprise scaling of on-page items.

Developers understanding SEO basics can go a long way toward successful collaboration and SEO performance.

Advertisement

Plus, it can make for more efficient website development work and the need for less re-work or “SEO-specific” updates and requests.

More resources: 


Featured Image: baranq/Shutterstock

!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version=’2.0′;
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window,document,’script’,
‘https://connect.facebook.net/en_US/fbevents.js’);

if( typeof sopp !== “undefined” && sopp === ‘yes’ ){
fbq(‘dataProcessingOptions’, [‘LDU’], 1, 1000);
}else{
fbq(‘dataProcessingOptions’, []);
}

fbq(‘init’, ‘1321385257908563’);

fbq(‘track’, ‘PageView’);

fbq(‘trackSingle’, ‘1321385257908563’, ‘ViewContent’, {
content_name: ‘seo-basics-for-web-developers’,
content_category: ‘enterprise web-development’
});

Advertisement

Source link

Continue Reading

DON'T MISS ANY IMPORTANT NEWS!
Subscribe To our Newsletter
We promise not to spam you. Unsubscribe at any time.
Invalid email address

Trending