404 html代码,不懂代码，如何制作漂亮的404页面【新手简易教程】-程序员宅基地
技术标签： 404 html代码
404是用户在访问页面时，搜索引擎常返回的状态码，常见的还有200，301，302，500等。搜索引擎通过http状态码识别网页状态，404状态码，常指所访问的页面不存在或已被删除。
404页面，是用户访问不存在内容或者已删除网页时，呈现给用户的界面，又称404错误页面/404-Not Found。
404页面常见误区
①网站没有设置404页面
404错误页面对用户而言：告诉浏览者其所请求的页面不存在或链接错误，同时引导用户使用网站其他页面而不是关闭窗口离开，消除用户的挫败感。
对SEO而言，没有404页面，会增加搜索引擎蜘蛛的丢失率，也会增加网站的跳出率，造成糟糕的用户体验。
②404页面没有返回网站的链接
比如某多多的404页面，只有404 Not Found，没有任何返回网站的链接。
搜索引擎蜘蛛是顺着超级链接爬取的，无论是横向爬取还是纵向爬取，没有返回链接，用户回不去，蜘蛛也回不去。只能进不能出，有来无回，蜘蛛就是这样被坑死的。
对搜索引擎友好的页面，需要有返回网站的链接，可以是首页、栏目页、活动页，也可以网站的导航栏。
③404页面使用了强制跳转
某品会的404页面使用了强制跳转，跳转到首页。实现跳转功能的方式有多种，meta标签、301、js等，但无论你用什么方式实现跳转，都对搜索引擎不友好。
404页面也是一个页面，搜索引擎蜘蛛在爬取页面的过程中，还没有爬完就被强制拽回到其他页面。就像你在吃饭，才吃两口，就被人强行拽走，是不是超级不爽。
综上所述，优秀的404页面应该具备如下条件：
①必须有返回链接；
②不建议使用跳转代码，尤其是强制跳转；
③符合目标群体的趣味性。
王者荣耀网站的404页面设置很暖心，看到后，想重新回归了。
如果比较幸运，有程序员支持，就可以省过调代码的过程。画好404页面的原型后，把404图片和原型效果图交由程序员处理。这里推荐款好用的原型设计软件Mockplus。
如果没有程序员的支持，你是新手小白不懂代码，也没关系，下面【新手简易教程】正式开始，教你如何制作漂亮的404页面。
第一步：选取你喜欢的404页面，右键查看源代码，全选复制。
这里以某个小型博客的404页面为例，地址：http://www.luokuangtui.com/404。你可以任意选取自己喜欢的404页面，步骤都是一样的。
第二步：新建文本文件(txt文件)，命名404.html，扩展名改成.html。然后以记事本方式打开，粘贴刚才复制的代码。
第三步：制作404图片，保存到桌面。
或者把刚选取的404页面的图片，右键图片另存为，保存到桌面；也可以百度搜索404图片，选取一个自己喜欢的，保存到桌面。
第四步：在保存的代码中，Ctrl+F搜索，404页面中出现的汉字，找到需要修改的文本。
更改对应的跳转链接，文字，以及页面的标题，404图片的地址，不需要的也可以删掉。
第五步：修改完以后，文件-另存为，选择弹窗下方的编码方式，选择UTF-8，点击保存，替换原文件。
如果没有更改编码方式，则打开是乱码。网页编码常用的两种方式为：UTF-8国际通用版、GBK中文简体版。一般来讲UTF-8用的最多，出现乱码时，在UTF-8和ANSI总来回切换就行。
第六步：把html和404图片放在一个文件夹中，双击打开html查看效果，不满意的地方继续调整。
我在源代码基础上，调整了图片的尺寸大小，就是h1标签中的内容，如下。在改代码的过程中，零基础的朋友，可以多多百度。比如觉得文字和图片太紧，想加个空行，就可以搜索html加空行。
第七步：效果调整满意后，把html文件和404图片上传到网站的根目录下。
第八步：在主机管理后台-基础环境设置-404页面设置-选择404文件(/404.html)，点击设置404错误页面。
成功后，等待几秒(后台反应时间)，网站的404页面就设置成功了。如果操作过程中有任何疑问，欢迎留言哦。
好文推荐：
【设计神器推荐】设计协作，用摹客！100人以下团队免费使用
摹客，支持Sketch/PS/XD/Axure设计稿交付、自动标注切图、全流程协作。助力设计师和产品团队高效工作！
智能推荐
AE内置效果1_match grain-程序员宅基地
文章浏览阅读639次。文章目录解释步骤match grain(添加杂色)解释 addgrain是用来合成CG渲染视频、绿幕素材、蓝幕素材的效果，甚至是直接加到CG场景里面,在AE里面比较相似的效果叫做match grain addgrain最关键的一点就是：从无到有的生成一些噪点出来步骤选择effect->Noise&Grain->addgrain修改基础设置：1、一般..._match grain
Mybatis的你所不知ResultMap生成方式_根据sql语句生成resultmap-程序员宅基地
文章浏览阅读4.1k次，点赞4次，收藏6次。三种方式//第一种 @ConstructorArgs({ @Arg(column = "id", javaType = Integer.class, id = true), @Arg(column = "userName", javaType = String.class, id = false), @Arg(column = "password", javaType = String.class, id = false)} _根据sql语句生成resultmap
Detected jump back in time of XXs. Clearing TF buffer.解决办法_detected jump back in time of 0.000678472s. cleari-程序员宅基地
文章浏览阅读3.4k次，点赞5次，收藏5次。跑move_base的时候突然出现这个错误，结果amcl定位跑偏，机器人直接疯跑：Detected jump back in time of 2.72104s. Clearing TF buffer.发现是系统时间自动同步网络造成了时间变化（我还以为ROS内部有专门的计时器，居然受系统时间影响）手动更改时间也会触发这个错误。关掉系统时间通过网络同步即可。..._detected jump back in time of 0.000678472s. clearing tf buffer.
Python算法总结（七）Adaboost（附手写python实现代码）_adaboost算法python代码-程序员宅基地
文章浏览阅读3.7k次，点赞3次，收藏37次。注：adaboost可以做分类也可以做回归，本篇以构建二分类模型为例，通过手写代码，加深对算法原理与流程的理解。一、算法类型有监督的分类算法二、算法原理- 分类器的错误率：- 弱分类器的权重：注：错误率越高，该分类器的权重越小- 正确分类的样本权重：- 错误分类的样本权重：注：初始化样本权重是相等的；如果该样本被错误分类，则在下一轮该样本的权重被提高三、手写Python算法def classify(xmat,i,threshold,mark): ''' 函数功能_adaboost算法python代码
“C语言与揭秘文件：从内存到外部存储的旅程“-程序员宅基地
文章浏览阅读1.7k次，点赞41次，收藏29次。文件是相关数据的集合，通常存放在外部介质上，并在使用时加载到内存中。程序执行时的数据存储在内存中，但只能临时保存，需以文件形式永久保存。C语言将外部设备视为文件，统一处理磁盘文件和设备文件，为程序设计提供便利。
备战蓝桥杯------递归算法及经典例子_蓝桥杯考递归多吗?-程序员宅基地
文章浏览阅读2.6k次，点赞6次，收藏23次。递归算法在程序中不断反复调用自身的方法调用方式。此处的重点是调用自身递归满足两个条件1.有反复执行的过程（调用自身）2.有跳出反复执行过程的条件（递归出口）递归算法在软件竞赛中，考察的非常多我的qq：1527624144 希望和大家交流，一起努力进入总决赛经典例子：1.求10的阶乘public class A13 { public static void main(String[] arg..._蓝桥杯考递归多吗?
随便推点
【8】tkinter代码---对图片进行高斯滤波、边缘锐化、中值滤波、旋转图片、灰度处理等图像处理_tk锐化 教程-程序员宅基地
文章浏览阅读129次。设置窗口，打开单张图片，对图片进行高斯滤波、边缘锐化、中值滤波、旋转图片、灰度处理几个方面的图像增强处理，最后将处理过的图片保存在本地。运行界面对图片处理界面。_tk锐化 教程
关于p操作和v操作的理解_pv操作中p和v各代表什么-程序员宅基地
文章浏览阅读4.9w次，点赞43次，收藏130次。操作系统之PV操作今天在做操作系统老师布置的操作系统作业，但是碰到了一个有关pv操作的问题，由于对pv操作的理解不是很透彻，所以我查阅了很多资料，下面来简单的通俗的介绍一下pv操作1、信号量 公用信号量：实现进程间的互斥，初值=1或资源的数目 私用信号量：实现进程间的同步，初值=0或某个整数2、信号量S的物理意义：S>=0时表示某资源的可用数，s3、P操作表示申请一_pv操作中p和v各代表什么
Matlab信号处理综合工具_matlab中sptool在哪里-程序员宅基地
文章浏览阅读3.2k次，点赞5次，收藏16次。使用信号综合工具SPTool可以进行如下操作：1)信号分析2)设计滤波器3)分析滤波器4)对信号滤波器进行处理5)分析信号频率1打开信号处理工具SPtool在APPS菜单中点击Signal Analysis即可进入SPTool界面如下分别有3个列表框Signals、Filters和Spectra，列表参数分别为信号、滤波器和频域谱。其中，Signa..._matlab中sptool在哪里
SSA-CNN-GRU-Attention回归预测 | Matlab 基于麻雀算法优化卷积神经网络-门控循环单元结合注意力机制-程序员宅基地
文章浏览阅读70次。SSA-CNN-GRU-Attention回归预测 | Matlab 基于麻雀算法优化卷积神经网络-门控循环单元结合注意力机制
Swagger_swagger cve poc-程序员宅基地
文章浏览阅读55次。前言：了解前后端分离前后端分离Vue + SpringBoot后端时代：前端只用管理静态页面；html==>后端。模版引擎 JSP =>后端是主力前后端分离式时代：后端：后端控制层，服务层，数据访问层【后端团队】前端：前端控制层，视图层【前端团队】– 伪造后端数据，json。已经存在了，不需要后端，前端工程依旧能够跑起来前端后如何交互？ ===> API前后端相对独立，松耦合。产生了一个问题：前后端集成联调，前端人员和后端人员无法做到“即时协商，尽早解决”，最终导_swagger cve poc
华为Mate60和Mate60 Pro有什么区别_华为60跟华为60pro区别-程序员宅基地
文章浏览阅读2.6k次。从外观来看，华为Mate60 Pro和Mate60最大区别就是在屏幕形态上，前者是另类的三孔设计，后者则是延续了Mate50的单孔设计，就个人审美角度来看，还是偏向于单孔屏的Mate60。当然，Pro也不是平白无故多了两个挖孔，为的就是增加更多功能，拥有更出色自拍体验的同时，还支持3D人脸识别技术，解锁体验相对更好。华为Mate60 Pro和华为Mate60都是5000万主摄，支持十档可变光圈调节，但Pro拥有更强的潜望式长焦镜头，像素达到4800万，标准版只有1200万，其他几颗镜头参数一致。_华为60跟华为60pro区别