category oscprofessionals - Blogs - Why Minify HTML?

Why Minify Html ?

The main goal is to remove unnecessary data and also as spacing, well-named variables and comments.if the files are minified then, comments,extra-spaces are removed and variable names to minimize the code and reduce the file size.

Minify Html online tool

Link: https://minifycode.com/html-minifier/

How to minify HTML code or file

The way is to reduce the HTML file try any tool for the minification so use it the reduce the code.

What is the proper HTML page size

Refers to the sum of all the elements it takes to render your page that includes the HTML file, the css files,the images, the scripts, the multimedia.you should target 200k for your total page size.

Minify html code

Example-
Before
< ul class=”Linklist”>
< li class=”Linklist__Item”>
< a title=”Home” href=”/” class=”Link Link–primary”>Home< /a>
< /li>< li class=”Linklist__Item”>
< a title=”About Us” href=”/pages/about-us” class=”Link Link–primary”>About Us< /a>
< /li>< li class=”Linklist__Item”>
< a title=”Contact Us” href=”/pages/contact-us” class=”Link Link–primary”>Contact Us< /a>
< /li>< li class=”Linklist__Item”>
< a title=”+91 876-444-5555″ href=”www” class=”Link Link–primary”>+91 876-444-5555< /a>
< /li>< li class=”Linklist__Item”>
< a title=” [Mon-Sat 10:00 am to 6:00 pm IST]” href=”/” class=”Link Link–primary”> [Mon-Sat 10:00 am to 6:00 pm IST]< /a>
< /li>< li class=”Linklist__Item”>
< a title=”Terms of Service” href=”/policies/terms-of-service” class=”Link Link–primary”>Terms of Service< /a>
< /li>< li class=”Linklist__Item”>
< a title=”Sitemap” href=”/pages/sitemap” class=”Link Link–primary”>Sitemap< /a>
< /li>< li class=”Linklist__Item”>
< a title=”Refund policy” href=”/policies/refund-policy” class=”Link Link–primary”>Refund policy< /a>
< /li>< /ul>< /div>< div class=”Footer__Block Footer__Block–links” >< h2 class=”Footer__Title Heading u-h6″>My Account< /h2>
< ul class=”Linklist”>< li class=”Linklist__Item”>
< a title=”My Account” href=”www” class=”Link Link–primary”>My Account< /a>
< /li>< li class=”Linklist__Item”>
< a title=”My Cart” href=”www” class=”Link Link–primary”>My Cart< /a>
< /li>< li class=”Linklist__Item”>
< a title=”Order Tracking” href=”www” class=”Link Link–primary”>Order Tracking< /a>
< /li>< li class=”Linklist__Item”>
< a title=”Search” href=”/search” class=”Link Link–primary”>Search< /a>
< /li>
< h2 class=”Footer__Title Heading u-h6″>Information< /h2>
After:
< ul class=”Linklist”>
< li class=”Linklist__Item”>
< a title=”Home” href=”/” class=”Link Link–primary”>Home< /a> < /li>
< li class=”Linklist__Item”>
< a title=”About Us” href=”/pages/about-us” class=”Link Link–primary”>About Us< /a>
< /li>
< li class=”Linklist__Item”> < a title=”Contact Us” href=”/pages/contact-us” class=”Link Link–primary”>Contact Us< /a>
< /li>
< li class=”Linklist__Item”> < a title=”+91 876-444-5555″ href=”https://api.whatsapp.com/send?phone=918764445555″ class=”Link Link–primary”>+91 876-444-5555< /a> < /li>
< li class=”Linklist__Item”> < a title=” [Mon-Sat 10:00 am to 6:00 pm IST]” href=”/” class=”Link Link–primary”> [Mon-Sat 10:00 am to 6:00 pm IST]< /a> < /li>< li class=”Linklist__Item”> Terms of Service< /a> < /li>
< li class=”Linklist__Item”> < a title=”Sitemap” href=”/pages/sitemap” class=”Link Link–primary”>Sitemap< /a> < /li>
< li class=”Linklist__Item”> < a title=”Refund policy” href=”/policies/refund-policy” class=”Link Link–primary”>Refund policy< /a> < /li>< /ul>< /div>
< div class=”Footer__Block Footer__Block–links” >< h2 class=”Footer__Title Heading u-h6″>My Account< /h2>
< ul class=”Linklist”>< li class=”Linklist__Item”>
< a title=”My Account” href=”http://aaheli.com/account” class=”Link Link–primary”>My Account< /a> < /li>
< li class=”Linklist__Item”>
< a title=”My Cart” href=”http://aaheli.com/cart” class=”Link Link–primary”>My Cart< /a>
< /li>
< li class=”Linklist__Item”>
< a title=”Order Tracking” href=”https://www.bluedart.com/tracking” class=”Link Link–primary”>Order Tracking< /a>
< /li>
< li class=”Linklist__Item”>
< a title=”Search” href=”/search” class=”Link Link–primary”>Search< /a>
< /li>
< /ul>< /div>
< div class=”Footer__Block Footer__Block–links” >< h2 class=”Footer__Title Heading u-h6″>Information< /h2>< /a>

Latest Posts

Leave A Comment