How to Effectively Remove .html and AMP Extensions Using .htaccess

Описание: Discover how to seamlessly remove .html and .html/amp extensions from URLs using .htaccess, ensuring clean URLs for better usability and SEO.
---
This video is based on the question https://stackoverflow.com/q/75429487/ asked by the user 'Alexander F.' ( https://stackoverflow.com/u/9052299/ ) and on the answer https://stackoverflow.com/a/75429730/ provided by the user 'MrWhite' ( https://stackoverflow.com/u/369434/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: Remove .html and .html/amp extension with .htaccess only for files from directory

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
How to Effectively Remove .html and AMP Extensions Using .htaccess

When it comes to optimizing your website, having clean and user-friendly URLs is essential. If you've recently moved your site and want to eliminate file extensions like .html and .html/amp from your URLs, you’re in the right place. In this guide, we’ll walk you through how to achieve this using your .htaccess file.

The Problem: Unwanted URL Extensions

After a website migration, maintaining the integrity of your URLs is crucial. For instance, consider the following scenarios:

Visiting a URL like https://www.example.com/blog/anyfile.... should seamlessly redirect to https://www.example.com/blog/anyfile.

URLs with amp should also be handled, such as https://example.com/blog/anyfile.html... redirecting to https://www.example.com/blog/anyfile.

The challenge arises when your existing .htaccess rules don’t retain the directory structure, leading to potential 404 errors or incorrect redirects.

Solution: Using .htaccess for Clean URLs

The simplest way to clean up these URLs is by modifying your .htaccess file. Here’s a step-by-step breakdown of how to implement this.

Step 1: Setting Up Rewrite Rules

Place the following rules at the top of your root .htaccess file to:

Remove .html and .html/amp from the URLs.

Discard any query strings from the end of the URLs.

[[See Video to Reveal this Text or Code Snippet]]

QSD Flag: The Query String Discard flag removes any attached query strings in Apache 2.4 and later, which is cleaner than just appending an empty query string.

Step 2: Redirecting Query Strings

While the previous rule takes care of URLs with .html, you might also want to manage URLs that contain only query strings. Use the rule below immediately after the first one:

[[See Video to Reveal this Text or Code Snippet]]

This rule ensures that any URL that merely has a query string (without .html) is redirected appropriately.

Common Mistakes to Avoid

Overlooking Directory Structure

In your original setup, the rule you used was only capturing the filename (anyfile) and discarding the preceding URL path (like blog/). Consequently, when you referenced $1, it only contained the file name.

Inefficient Condition Checking

The conditional test for checking if the URL starts with /blog/ in your original setup is unnecessary because the rules you are working with directly impact URLs under that directory. Streamlining your conditions leads to cleaner and more maintainable code.

Conclusion

Optimizing your URLs by removing unnecessary extensions not only enhances the appearance of your URLs but also boosts usability and SEO performance. By carefully implementing the provided .htaccess rules, you can ensure that users and search engines alike will navigate your site more efficiently.

If you've followed this guide, you're now equipped to effectively manage your URL structure! Embrace the power of clean URLs. Happy coding!