HTML weight loss Streamline HTML tags to create web pages

HTML 4

HTML (not XHTML), MIME type is text/html, some tags are allowed to be omitted. With HTML 4 DTD, you can omit the following tags (the so-called avoidable elements are marked with strikethrough):

 </area>

 </base>

 <body>

 </body>

 </br>

 </col>

 </colgroup>

 </dd>

 </dt>

 <head>

 </head>

 </hr>

 <html>

 </html>

 </img>

 </input>

 </li>

 </link>

 </meta>

 </option>

 </p>

 </param>

 <tbody>

 </tbody>

 </td>

 </tfoot>

 </th>

 </thead>

 </tr>

For example, if your code is

 <li>List item</li>

It can be written as

 <li>List item

For example, paragraphs should be

 </p>

At the end, you can just write

 <p>My paragraph

You can even remove html, head, and body (make sure you are comfortable with this before making it your coding standard).

Omitting the tags will keep the HTML valid while reducing the file size. For typical pages, this can save 5-20%.

HTML 5

The ongoing development of HTML 5 provides some methods to reduce file size.

For example, the page document type declaration

 <!DOCTYPE html>

contrast

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Obviously HTML 5's DTD is shorter.

When specifying the encoding for a page, HTML 5 is easier to use and shorter:

 <meta charset="utf-8">

replace

 <meta http-equiv="content-type" content="text/html; charset=utf-8">

Normally, browsers process HTML correctly.

Additionally, in today's HTML 5, you can remove the type attribute that declares the MIME type, such as

 type="text/css"

 or type="text/javascript"
 You can use
 <script>
 Alternative <script type="text/javascript">
 use <style>
 Alternative <style type="text/css">
 In all types of pages (even XHTML) you can omit
 type="text/css"
 HTML 5 makes this easier.
 Using all of the above techniques together can save 10%-20% (or even more) of your file size, depending on your coding style and the amount of text in your page. The code will be cleaner and visitors will get to your site content faster. We used many of these techniques in the Privacy Center project, saving 20% of the original file size.

<<: JavaScript to implement a simple clock

>>: DELL R730 server configuration RAID and installation server system and domain control detailed graphic tutorial

Teach you the detailed process of installing DOClever with Docker Compose

HTML weight loss Streamline HTML tags to create web pages

Teach you the detailed process of installing DOClever with Docker Compose

Web Design Tutorial (7): Improving Web Design Efficiency

The difference and advantages and disadvantages of Mysql primary key UUID and auto-increment primary key

js to achieve drag and drop sorting details

How to connect a Linux virtual machine to WiFi

Detailed explanation of MySQL three-value logic and NULL

Div adaptive height automatically fills the remaining height

Linux IO multiplexing epoll network programming

How to remotely connect to MySQL database with Navicat Premium

Two ways to solve the problem of MySQL master-slave database not being synchronized

Recommend

Detailed explanation of webpack-dev-server core concepts and cases

A brief discussion on browser compatibility issues in JavaScript

CSS3 animation to achieve the effect of streamer button

Detailed explanation of MySQL DEFINER usage

How to monitor and delete timed out sessions in Tomcat

Steps to install RocketMQ instance on Linux

A brief discussion on Flink's fault-tolerant mechanism: job execution and daemon

Detailed tutorial for installing ffmpeg under Linux

Detailed explanation of the two modes of Router routing in Vue: hash and history

Detailed explanation of Linux kernel macro Container_Of

Summary of MySQL database like statement wildcard fuzzy query

Detailed explanation of incompatible changes of components in vue3

Improvements to the web server to improve website performance

HTML Tutorial: Collection of commonly used HTML tags (5)

MySQL 8.0.16 installation and configuration tutorial under CentOS7