百度移动网页加速器MIP与常见网页加速方法

      百度站长近日出了一个MIP的功能入口,其实这个是谷歌的AMP的翻版,官方的解释是:

       MIP(Mobile Instant Page – 移动网页加速器),是一套应用于移动网页的的开放性技术标准,通过提供MIP-HTML规范、MIP-JS运行环境以及MIP-Cache页面缓存系统,实现移动网页加速。

百度移动网页加速器MIP与常见网页加速方法

       结合DedeCMS只需要在所有模板里增加几句代码即可。红色部分是必须增加的。

<!DOCTYPE html>
<html mip>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
        <link rel="stylesheet" type="text/css" href="https://mipcache.bdstatic.com/static/mipmain-v0.0.1.css">
    </head>
    <body>Hello World!</body>
    <script src="https://mipcache.bdstatic.com/static/mipmain-v0.0.1.js"></script>   
</html>

       还有许多重要说明请参考官方说明:https://www.mipengine.org/doc/2-tech/1-mip-html.html

自定义样式规范

       处于性能考虑,html中不允许使用内联的style,所有样式只能放到head的style标签内,参考本站首页的模板。

<head>
 <style mip-custom>
  p{color:#c00;}
 </style>
</head>
<body>
 <p>Hello world!</p>
 <p style="color:#c00">这样的内联style不再采用</p>
</body>

什么是网页加速,对网站SEO有多大影响

       网页加速顾名思义是让网页更快地传送到客户端,减少用户的等待时间,对SEO来说有重要作用,用户体验会影响到网站综合数据(PV、停留时间、跳出率等)。因此要做好网站的SEO优化,就要尽最大的努力让网站的表现最好。

常见的网页设计加速方法

1.良好的设计结构

       在网页头部添加下面代码,遵循XHTML编码,以提高下载和解析速度

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

必须牢记的代码标签规则:

①块级元素(元素占用一行,垂直方向排列)采用单独或者组合:<p>、<ul>-<li>、<dl>-<dt>-<dd>、<h1>~<h4>等;

②行内元素(元素在同一行)采用:<a>、<b>、<i>、<em>、<span>;

③块级元素包含行内元素,行内元素不包含块级元素;

④行内元素对width、height无效,可以设置line-height,margin、padding上下无效;

⑤采用display:block实现行内元素变块级元素,display:inline-block实现块级元素元素变行间元素并可以设置margin、padding上下;

⑥标签尽量使用class类,减少使用id类,命名规则以简短小写英文、小写全拼音加数字或下划线为主,不建议采用驼峰式命名,如

<p id="navHoverOne" class="navHoverOne">

例子:全通式导航HTML与CSS写法

<p id="nav">
 <ul>
  <li class="hover"><a href="/">首页</a></li>
  <li><a href="/link1">栏目1</a></li>
  <li><a href="/link2">栏目2</a></li>
  <li><a href="/link4">栏目3</a></li>
 </ul>
</p>
CSS样式表
<style>
 #nav{width:100%;}
 #nav ul{width:1000px;margin:0 auto;}
 #nav ul li a{display:inline-block;line-height:30px;padding:0 20px;background:#ccc;color:#808080;}
 #nav ul li a:hover{background:#c00;}
 #nav .hover{background:#c00;}
</style>

       在MIP的规则下<style>被替换为<style mip-custom>,一些具体的标签参考官方说明。

2.网页简洁,不宜填充过多内容

       特别以内容为主题的博客类网站,每一篇的内容简介尽量把重点概括,也可以采用文章开头的几十个字,建议单独编写简介,把关键词和主要内容包含在里面。

3.图片和文字的合理采用

       网站前端设计得非常大气吸引人,图片占据了绝大多数的空间,如果你的服务器不够牛,请尽量采用文字的形式,这样搜索引擎也能获取更多关于这个页面的信息。

       不要用图片代替文字,一些按钮、不必要的小图标可以采用文字和CSS样式的设计,尽量减少加载网页的加载次数。现在浏览器兼容性强,一些ie6的兼容性完全不用考虑,可以采用CSS解决绝大多数的图标问题。

       图片路径采用绝对路径而不要带有“/../”的相对路径。图片上传前需要进行处理,在清晰度和大小之间权衡,如果不是专业的图片展,大可以采用纯色背景+文字的形式,图片颜色元素越多,图片越大。 另外图片元素需要完整,尺寸也可以在样式表里统一编写,必须含有alt标签。

<img src="/img/1.jpg" alt="图片" width="100" height="200">

       如果是MIP规则的话<img>标签被替换为<mip-img>使用的时候需要注意。

4.正确使用JavaScript

       网页设计中少不了JavaScript,网上有非常多的JS效果,采用的JavaScript封装不一样,往往出现冲突、重复等情况,而网页内联这些内容的话会影响加载时间,最好的办法是让这些外部化。

<link href="/css/Style.css" media="all" rel="Stylesheet" type="text/css" />
<script src="/js/Javascript.js" type="text/javascript"></script>

5.不使用表格布局

       指的是表格而不是表单,<table>作为块级元素,早期被用来进行网页布局,但是会增加非常多的源代码和样式,修改维护麻烦,采用更简单的DIV+CSS。

6.压缩CSS、JS、PHP、HTML、XML方法

       最常用的是采用Gzip,许多浏览器都支持这样的压缩算法。参考文章《万网虚拟主机开启Gzip压缩教程测试有效》;

       也可以使用在线压缩工具,可以删除空格、回车、符号、注释、空白,其实自己在编写的时候有这样的意识后,这些问题都不是什么问题。

主题测试文章,只做测试使用。发布者:xiangxiang,转转请注明出处:http://www.poddns.com/513.html

(0)
xiangxiang的头像xiangxiang
上一篇 2024年12月24日 下午12:13
下一篇 2024年12月24日 下午12:13

相关推荐

  • 网站不收录怎么办?如何解决搜索引擎不收录问题?

    随着互联网的快速发展,越来越多的企业和个人开始建立自己的网站,希望通过网站来拓展业务、展示自我,在实际运营过程中,许多网站都面临着搜索引擎不收录的问题,网站不收录意味着在搜索引擎中无法搜索到该网站,这无疑对网站的流量和曝光度造成了极大的影响,网站不收录可以搜吗?如何解决搜索引擎不收录问题呢?本文将为您一一解答。 网站不收录可以搜吗? 网站不收录意味着在搜索引…

    2025年5月7日
    000
  • 如何高效查询网站的收录数,全方位指南

    随着互联网的不断发展,网站收录数成为了衡量一个网站质量和影响力的重要指标,一个网站收录数越高,说明其内容被搜索引擎认可的度越高,进而吸引更多的流量,如何查询网站的收录数呢?本文将为您详细介绍几种方法。 使用搜索引擎自带的工具 1、百度站长工具 百度站长工具是百度官方提供的免费工具,可以查询网站在百度搜索引擎中的收录情况,以下是查询步骤: (1)登录百度站长工…

    2025年3月27日
    000
  • 网站收录优化与文章更新,提升网站流量的双剑合璧

    在互联网信息爆炸的时代,拥有一个高流量、高排名的网站对于企业或个人来说至关重要,而网站收录优化与文章更新是提升网站流量的两大法宝,本文将深入探讨这两方面的策略,帮助您打造一个受欢迎的网站。 网站收录优化 1、关键词优化 关键词是搜索引擎收录和排名的关键因素,在进行网站收录优化时,首先要对关键词进行深入研究和分析,以下是一些关键词优化的策略: (1)确定核心关…

    2025年5月7日
    100
  • 揭秘学术资源宝库,哪个论文网站收录最全?

    在浩如烟海的学术世界中,论文是研究者们交流思想、展示成果的重要载体,而对于广大科研人员和学生来说,寻找高质量的论文资源无疑是一项至关重要的任务,在众多的论文网站中,哪个网站收录的论文最为全面呢?本文将为您揭秘这一学术资源宝库。 论文网站收录概述 论文网站收录的全面性主要取决于以下几个因素: 1、数据源:论文网站的数据源越广泛,收录的论文数量和质量就越高。 2…

    2025年5月16日
    100
  • 网站收录平台类型大盘点,助力网站优化与推广

    随着互联网的快速发展,网站已成为企业、个人展示形象、拓展业务的重要平台,如何让网站在众多信息中脱颖而出,吸引更多用户关注,成为许多网站运营者关注的焦点,网站收录平台作为搜索引擎优化(SEO)的重要工具,对于提高网站在搜索引擎中的排名具有重要意义,本文将为您盘点网站收录平台的类型,助力网站优化与推广。 免费收录平台 1、百度收录平台 百度收录平台是百度官方提供…

    2025年3月20日
    000

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信
域名可转让~