SEARCH

Nginx配置404页面,提供网站用户体验

发布日期:2019年09月05日,网站分类:网站新闻

很多网站都没有设置404,502等页面,尤其是404页面及其重要,这样对搜索引擎优化及其不利,今天教大家添加404页面,提供网站用户体验,修改Nignx下网站的.conf文件,在server内增加 error_page   404   /404; ,需注意/404后的尾缀。代码如下:


第一种
error_page   404   /404;
或
error_page   404   /404.html;

第二种
error_page   404   https://rongkeji.cn/404;
或
error_page   404   https://rongkeji.cn/404.html;


404.png


如需要自动返回首页可将此代码加入HTML源代码HEAD内:


如果页面错误较多不建议使用自动跳转,因为会让搜索引擎误判为重复页面,错误页面较少,推荐使用。


<!--
设置3秒返回,为了不让搜索引擎认为是重复链接,所以设置成手动跳转了
<script>setTimeout(function(){top.location='/';},3000)</script>
-->


html404页面源代码


<!DOCTYPE html>    
<html lang="en">    
<head>    
<meta charset="UTF-8">    
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">    
<meta content="yes" name="apple-mobile-web-app-capable">    
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">    
<title>抱歉,肖像照已经下架</title>    
<style>    
html,body {    
display: table;    
margin: 0;    
padding: 0;    
width: 100%;    
height: 100%;    
background: #f8f8f8;    
}    
body {    
display: table-cell;    
vertical-align: middle;    
text-align: center;    
font:normal 18px/1.6 'Helvetica Neue',Arial,'Hiragino Sans GB','Microsoft YaHei','WenQuanYi Micro Hei',sans-serif;    
-webkit-font-smoothing:antialiased;    
color: #666;    
}    
.panel {    
display: inline-block;    
margin-bottom: 88px;    
}    
.logo {    
margin-bottom: 40px;    
}    
p {    
margin: 0 0 20px 0;    
}    
a {    
display: inline-block;    
padding: 5px 10px;    
margin: 0 10px;    
border-radius: 3px;    
font-size: 13px;    
line-height: 1.2;    
}    
a:link,    
a:visited {    
color: #fff;    
background: #888fff;    
text-decoration: none;    
}    
a:hover,    
a:active {    
color: #fff;    
background: #666fff;    
text-decoration: none;    
}    
</style>    
</head>    
<body>    
<div class="panel">    
<div class="logo">    
<img src="https://cloud.rongkeji.cn/zb_users/upload/2019/09/20190904235056156761225678900.png" width="300" />    
</div>    
<p>(-ω-)zzZZ</p>
<p>对不起,页面不存在</p> 
<a href="/">返回首页</a>    
</div>    
</body>    
</html>


关键词:nginx

转载请注明来自:https://rongkeji.cn/news/454.html


上一篇:企业网站建设SEO优化的经验心得

下一篇:淘宝天猫违禁词、敏感词有哪些?

地区分布

  • Da Tong
  • He Fei

大同融网信息科技有限公司

地址:大同格兰云天E座4楼411

提供了定制化的行业网站建设解决方案

合肥融建站网络文化工作室

地址:合肥市包河区绿地中心F座

融建站技术服务,助您打造高端形象

公众号

微信公众号