Meta语句的格式通常是站长可以将此代码添加到PC站点的肚皮中,Meta信息会指明PC页面对应的移动页面的URL以及该URL对应的页面格式。
优点:代码简单易懂,操作方便。
缺点:只能在百度联通搜索中有效,对其他搜索引擎无效(另外也可以使用百度转码)。
4. 302规则
302规则是指当判断出联通终端访问网站时,302暂时跳转到某个网站(手机站)。
优点:不需要在网站后端代码中添加任何额外的东西,也不需要向搜索引擎提交规则。
缺点:即使302是临时重定向,过于频繁的302也可能对网站产生不良影响。 据测试,可能会导致PC站降级。 具体的尺度需要站长自己掌握确定。
以上4种适配方法是最常见的操作方法。 一般情况下,PC站做完上述处理后,一段时间后,从联通终端出来的搜索结果,下面匹配的URL就变成了联通网站URL,但标题仍然是PC站的标题。 。
至于哪种方法更好,我更倾向于第一种,虽然百度联通搜索占据了大部分网站流量,而且用户体验也是最好的。
三、百度开放适配服务的三大解决方案
百度站长平台对联通适配的定义是:为了提高用户对联通搜索结果的浏览体验,百度联通搜索为PC站与对应的手机站提供“开放适配”服务。 如果你同时拥有PC站和移动站,并且两者在内容上可以对应,那么你可以将PC页面和移动页面的对应关系“提交”给百度。 如果对应关系准确,将有助于百度排名 将原来的PC页面结果替换为对应的手机页面结果。 积极参与“开放适配”,将有助于您的手机站获得更好的百度联通搜索解读,同时以更好的浏览效果赢得用户口碑。
百度开放适配服务总共提供了三种解决方案——自适应、标记Meta声明、提交对应关系Sitemap、同时向站点提供开放适配进度查询。
也许您更熟悉站点地图中指示元声明和提交之间关系的项。 另外,对自适应的理解仅限于百度的siteapp的使用。 由于当时我们的网站是在原来的PC网站上,所以我们就创建了一个对应的手机站,并且这个手机站是单独存在的。
但是我们在联通设备上搜索的网站都是PC端的方式。 我们不想用百度的手动转码,只是想标记meta进行判断,判断成功后跳转,而我当时的需求就是为了这个跳转。 转码,也许你知道很多跳转码,而我当时想要的是一个符合百度或者搜索引擎能够适配联通网站前提的跳转形式,而不是简单的做一个跳转转,大家做SEO的谁知道呢。
知识拓展-开放式适配题及答案:
1. 百度提供的三个开放适配(自适应、标签化Meta声明、对应关系Sitemap)我只需要做其中之一即可,如果三者都做了,会有影响吗? 请问自适应如何设置?
答:自适应需要在服务器端进行。 PC版和联通主版本使用301重定向,联通各版本使用302重定向。 然后使用抓取诊断工具查看百度联通是否抓取到了PC站的url。 当识别为联通url状态时,你可以为所欲为,只要适配的映射关系不冲突,就保证是唯一正确的。
2. 打开中国联通页面。 如果这个页面只存在于PC端移动 网站模板,联通端不存在,那么这个页面应该是一个转码页面(也可以理解为联通端不存在PC端的页面也会被转码?),问题就是,这个进入转码的页面的PV是算联通端还是PC端?
答:有机会转码。 通常页面质量不利于在联通上浏览,也不会为您进行转码。 不过转码的前提是用户从搜索输入或者浏览器手动转码来适应。 如果用户没有从搜索介入或者浏览器没有转码适配功能,那么它不会帮你转码。
pv 取决于您使用的统计代码的性质。 如果转码后的源代码破坏了您的统计代码的调用,或者统计代码不利于接收联通数据,则不会对该访客进行统计。 如果只是pc页面,这样的话,这个pv估计是输入你安装代码的pc的域名,然后就可以进入无线分析查看联通用户的情况了。
3、如果我在联通端的内容都是产品,不具备关键词排名的优势,而从联通端搜索到的关键词排名全部来自于PC端的内容页面,如果我把所有的内容都映射将PC端的页面转移到联通端,更换不同的TDK标签,然后联通的内容页和PC端的内容页一一对应,这样对关键词的排名有帮助吗?
答:tdk和联通PC的用户行为有很大不同。 例如,联通用户更看重流量,而PC用户更喜欢页面的丰富性和设计性(两者都会导致数据量大、图片多,对于联通用户来说不喜欢)。
4、根据接入设备手动识别并显示移动站或PC站
随着联通互联网时代的到来,相信很多站长都在努力让自己的网站同时适用于手机和笔记本电脑。 如何手动识别网站的手机端和PC端是一直困扰站长的问题。
很多人都想实现这样一个功能:在笔记本电脑上输入域名访问PC端网站,在手机或平板笔记本上输入域名访问手机网站,并且PC端网站和手机联通网站则不同。 其实手机联通网站是简化的,和陌陌的微网站一样,非常简洁。
比如:网站已经建好了,现在又建了一个手机网站,如何访问同一个域名,让网站手动识别设备,比如用笔记本电脑进入官网,使用一个联通设备手动进入手机网站,这样就可以实现手机网站和PC网站使用同一个域名,不同设备访问时看到的是自己的网站。
1.在网站的head标签中添加跳转语句
要实现根据接入设备手动识别并显示移动站或PC站的功能,需要执行以下步骤:
(1)必须有PC端,在笔记本电脑上访问的官方网站,例如:。
(2)需要重新创建一个中国联通手机网站,例如:m.hiretianxia.cn。
(3)在PC端的网站中添加一段代码。 每个页面都需要添加并放置在PC端网站的head标签上。 代码如下:
//平台、设备和操作系统
var system = {
win: false,
mac: false,
xll: false
};
//检测平台
var p = navigator.platform;
system.win = p.indexOf(“Win”) == 0;
system.mac = p.indexOf(“Mac”) == 0;
system.x11 = (p == “X11″) || (p.indexOf(“Linux”) == 0);
//跳转语句
if (!(system.win || system.mac || system.xll)) {
window.location.href = “http://m.hiretianxia.cn”;
}
(4)进入域名解析系统,进行一些cname解析,例如:将手机网站地址123.domain.com解析为m.hiretianxia.cn域名解析系统。
2、根据联通终端和浏览器版本信息判断句型
还有一些站长或者SEO可能会考虑联通终端的版本和浏览器版本信息。 对此,我们为您整理了一个比较有效的代码,如下:
var browser={
versions:function(){
var u = navigator.userAgent, app = navigator.appVersion;
return { //移动终端浏览器版本信息
trident: u.indexOf('Trident') > -1, //IE内核
presto: u.indexOf('Presto') > -1, //opera内核
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/), //是否为移动终端
ios: !!u.match(/i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
iPhone: u.indexOf('iPhone') > -1 || (u.indexOf('Mac') > -1 && u.indexOf('Macintosh') -1, //是否iPad
webApp: u.indexOf('Safari') == -1 //是否web应该程序,没有头部与底部
};
}(),
language:(navigator.browserLanguage || navigator.language).toLowerCase()
}
if (browser.versions.ios||browser.versions.android||browser.versions.iPhone||browser.versions.iPad)O{
self.location=http://www.hiretianxia.cn;
}
3.自动识别手机页面、iPad页面、wap页面
正则表达式可以根据不同的终端类型适当改变。 将此代码添加到需要识别的网页中,会根据客户端类型手动跳转到手机页面、平板页面或其他联通设备页面。 非常灵活!
if(/AppleWebKit.*mobile/i.test(navigator.userAgent) ||
(/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){
if(window.location.href.indexOf("?mobile")<0){
try{
if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){
window.location.href="http://www.hiretianxia.cn/m";
}else if(/iPad/i.test(navigator.userAgent)){
window.location.href="http://www.hiretianxia.cn/pad";
}else{
window.location.href="http://www.hiretianxia.cn/wap"
}
}catch(e){}
}
}
4.使用PHP语言进行识别
对于一些精通PHP语言的博主来说,也可以通过PHP句型来实现,比如下面的写法:
//设定Mobile的定义
$mobileAgent = array("iphone", "ipod", "ipad", "android", "mobile", "blackberry", "webos", "incognito", "webmate", "bada", "nokia", "lg", "ucweb", "skyfire");
//读取用户的浏览器资料
$browser = $_SERVER['HTTP_USER_AGENT'];
$isMobile = false;
//检查开始
foreach($mobileAgent as $search){
if(stristr($browser,$search)!=false){
$isMobile = true;
//echo $search;
header("Location: http://www.hiretianxia.cn/m/index.html");
//停止运行程序
exit;
}
}
5、人工识别的疗效
经过多次试验,我们还可以对疗效进行人工鉴定。 方法非常简单。 在需要手动跳转的页面添加以下代码:
var mobileAgent = new Array("iphone", "ipod", "ipad", "android", "mobile", "blackberry", "webos", "incognito", "webmate", "bada", "nokia", "lg", "ucweb", "skyfire");
var browser = navigator.userAgent.toLowerCase();
var isMobile = false;
for (var i=0; i<mobileAgent.length; i++){
if (browser.indexOf(mobileAgent[i])!=-1){
isMobile = true;
//alert(mobileAgent[i]);
location.href = 'http://siteapp.baidu.com/webapp/hiretianxia.cn#m/http://hiretianxia.cn/';
break;
}
}
6.自动识别中国联通适配跳转URL代码
网站的移动版本需要简单且基于文本,因此可以非常兼容。 你可以在网站首页设置一个程序来判断用户是手机还是笔记本电脑。 如果是手机,则直接传输到手机上。 如果是笔记本端,直接转至笔记本端(也可以使用百度提供的百度联通搜索开放适配服务)。
对此移动 网站模板,您可以在网站首页插入以下代码:
function browserRedirect() {
var sUserAgent = navigator.userAgent.toLowerCase();
var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
var bIsMidp = sUserAgent.match(/midp/i) == "midp";
var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
var bIsAndroid = sUserAgent.match(/android/i) == "android";
var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) ){
window.location.href=B页面;
}
}
browserRedirect();
uaredirect("http://www.hiretianxia.cn/wap/");
通常PC版网页都是手动识别移动客户端并跳转,通过js来判断移动客户端是否最好跳转,尤其是静态网页。 这个过程可以以js的形式在用户客户端执行。 大大减轻服务器端额外处理的压力,有时需要通过服务器端的判断除外。
HTML5期末作业:汽车企业网站设计-新能源汽车租赁(6页) HTML+CSS+JavaScript 汽车网站HTML代码 学生网站课程设计 期末作业下载 动画 大学生网站设计制作
临近课程结束,你还在设计HTML网页的课后作业,老师的作业要求却让人应接不暇? 无法开始 HTML 作业? 总页面请求太多? 没有合适的模板? 等等一系列问题。 你要解决的问题在这篇博文中基本可以满足你的需求~
原创HTML+CSS+JS页面设计,大学生网页设计作业源码汽车网站模板ppt,这是一个不错的网页制作,图片锐利,非常适合初学者学习和使用。
作品介绍
1、网页作品介绍方面:简洁大方的新能源汽车租赁、创新科技公司、汽车能源科技公司网站模板。 包括:首页、关于我们、包车、列表页、新闻活动等,共6页html下载。
2、网页作品编辑:本作品以中学生个人主页的网页设计为主题。 代码是用简单的html+css布局制作的,中学生水平。 下载作品后,可以使用任何HTML编辑软件(例如:DW、HBuilder、NotePAD、Vscode、Sublime、Webstorm所有编辑器都可用)
3、网页作品布局:网页整体布局为LOGO、导航、主要内容布局。 子页面有多种布局,兴趣爱好内容采用图片列表布局,结果页插入表格,联系我们采用图片对齐方式设置左对齐。
4、网页作品技术方面:使用CSS制作网页的背景图片、鼠标经过和选中的导航变色效果、下划线等。首页制作了消息表单汽车网站模板ppt,同时简单使用JavaScript制作表单判断(提交时表单不能为空)
文章目录
1. 演示
2.代码目录
3. 代码实现
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
<link rel="stylesheet" type="text/css" href="css/animation.css">
<script src="js/jquery-1.8.3.min.js"></script>
<script src="js/main.js"></script>
</head>
<body>
<div class="banner index-bj">
<div class="banner-mask">
<div class="width1200 top">
<h1><a href="#"></a></h1>
<ul>
<li class="active">
<a href="#">首页</a>
</li>
<li>
<a href="#">共享汽车</a>
</li>
<li>
<a href="#">定制巴士</a>
</li>
<li>
<a href="#">新闻活动</a>
</li>
<li>
<a href="#">关于我们</a>
</li>
</ul>
</div>
</div>
<div class="animate1">
<div class="animate-img1"></div>
<div class="animate-img2"></div>
<div class="animate-img3"></div>
<div class="animate-img4"></div>
<div class="animate-img5">智能化绿色出行服务平台</div>
</div>
</div>
<div class="width1200 share-30 conduct">
<h3>宝港能源,智慧之选</h3>
<ul>
<li>
<i></i>
<img class="m1" src="images/conduct-li1.jpg" alt="">
<div>
<img src="images/conduct-img1.png" alt="">
<p>新能源</p>
</div>
</li>
<li>
<i></i>
<img class="m1" src="images/conduct-li2.jpg" alt="">
<div>
<img src="images/conduct-img3.png" alt="">
<p>互联网+</p>
</div>
</li>
<li>
<i></i>
<img class="m1" src="images/conduct-li3.jpg" alt="">
<div>
<img src="images/conduct-img2.png" alt="">
<p>多场景出行</p>
</div>
</li>
<li>
<i></i>
<img class="m1" src="images/conduct-li4.jpg" alt="">
<div>
<img src="images/conduct-img4.png" alt="">
<p>极致服务</p>
</div>
</li>
</ul>
</div>
<div class="bg-color share-bj">
<div class="width1200 share-30 share-mask">
<h3>核心竞争力</h3>
<ul>
<li>
<img src="images/share-lis11.jpg" alt="">
<a href="">用车企业成本低</a>
<div>
<p><span>零元购车,降低成本每月只需支付租车费用</span></p>
</div>
</li>
<li>
<img src="images/share-lis21.jpg" alt="">
<a href="">充电桩建设与运营</a>
<div>
<p><span>建设并运营新能源汽车配套充电站点,按需求随时随地为车充电</span></p>
</div>
</li>
<li>
<img src="images/share-lis31.jpg" alt="">
<a href="">全产业链构建</a>
<div>
<p><span>连接新能源汽车生产商、运营商与个人用户的出行平台</span></p>
</div>
</li>
<li>
<img src="images/share-lis41.jpg" alt="">
<a href="">维护保障</a>
<div>
<p><span>生产商提供质量、后勤、维修等保障措施,解决用车企业后顾之忧</span></p>
</div>
</li>
</ul>
</div>
</div>
<div class="width1200 share-30 partner-list">
<h3>战略合作伙伴</h3>
<ul>
<li><img src="images/partner1.png" alt=""></li>
<li><img src="images/partner2.png" alt=""></li>
<li><img src="images/partner3.png" alt=""></li>
<li><img src="images/partner4.png" alt=""></li>
<li><img src="images/partner5.png" alt=""></li>
<li><img src="images/partner6.png" alt=""></li>
</ul>
</div>
<div class="footer">
<a href=""></a>
<div>
<ul>
<li>关注我们</li>
<li>联系电话 400-1797-888</li>
</ul>
</div>
<p>Powered By BG Energy Copyright © 2017 All Rights Reserved.深圳市宝港能源科技有限公司</p>
</div>
</body>
</html>
4、一套完整的Web后端入门到中级(视频+源码+资料+面试)(教程)
Web后端零基础-入门到中级(视频+源码+开发软件+学习资料+面试题)全套(教程)
适合初学者到中级童鞋入手~免费1000套HTML+CSS+JavaScript模板网站
5、源码获取
~关注我,点赞博文~我每天都会给你带来更多知识!
1.如果您看到此内容,请【点赞+收藏】连续三连支持。 您的“点赞、收藏”是我创作的动力。
2.关注我吧~每天带你学习:各种后端插件、3D炫丽效果、图片展示、文字效果,还有全站模板、大学生毕业HTML模板、期末作业模板等。”这里有很多前端开发的大家一起讲解前端Node知识,互相学习”!
3、以上内容相关的技术问题可以互相学习,也可以关注↓公众Z号web后台日记获取更多源码!
6.更多HTML期末作业(成品下载)
200多个HTML5期末考核作业源码示例包括个人、美食、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节日、戒烟、电影、摄影、文化、故乡、鲜花、礼品、汽车等可以满足大学生网页的网页设计需求,您可以如果你喜欢的话就下载吧!