2.品优购项目练习

最新推荐文章于 2024-07-30 10:27:19 发布

sun 马胖

最新推荐文章于 2024-07-30 10:27:19 发布

阅读量56

点赞数

分类专栏： css3 文章标签： html 前端

本文链接：https://blog.csdn.net/m0_66349719/article/details/128472348

版权

css3 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

品优购项目:

1.favicon 图标:

favicon.ico 一般作为网站的缩略标志,显示在浏览器的地址栏或者标签上.

favicon图标使用方法:

制作favicon图标:

把图片切成png的图片,再通过第三方的网站,把png的文件转换成ico的格式的 : https://www.aconvert.com/
favicon放在网站的根目录下

HTML页面引入favicon图标,放在head-head之间:

<head>
      <link rel="shortcut icon" href="图片名" type="image/x-icon">
</head>

2.网站TDK三大标签SEO优化:

SEO（Search Engine Optimization）汉译为搜索引擎优化，是一种利用搜索引擎的规则提高网站在有关搜索引擎内自然排名的方式。
SEO 的目的是对网站进行深度的优化，从而帮助网站获取免费的流量，进而在搜索引擎上提升网站的排名，提高网站的知名度。

页面必须有三个标签用来符合 SEO 优化:

在这里插入图片描述

title 网站标题:

title 具有不可替代性，是我们内页的第一个重要标签，是搜索引擎了解网页的入口和对网页主题归属的最佳判断点。
建议：网站名（产品名）- 网站的介绍 （尽量不要超过30个汉字）

description 网站说明`(简要说明我们网站主要是做什么的)`:

例子:

<meta name="description" content="京东JD.COM-专业的综合网上购物商城,销售家电、数码通讯、电脑、家居百货、服装服饰、母婴、图书、食品等数万个品牌优质商品.便捷、诚信的服务，为您提供愉悦的网上购物体验!" />

keywords 关键字:

keywords 是页面关键词，是搜索引擎的关注点之一,keywords 最好限制为 6～8 个关键词，关键词之间用英文逗号隔开，采用关键词1,关键词2 的形式

例子:

<meta name= " keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,京东" />

3.logo的SEO优化:

logo 里面首先放一个 h1 标签，目的是为了提权，告诉搜索引擎，这个地方很重要。

h1 里面再放一个链接，可以返回首页的，把 logo 的背景图片给链接即可。
为了搜索引擎收录我们，我们链接里面要放文字（网站名称），但是文字不要显示出来。
方法1：text-indent 移到盒子外面（text-indent: -9999px) ，然后 overflow:hidden ，淘宝的做法。
.logo a {
    display: block;
    width: 171px;
    height: 61px;
    background: url(../images/logo.png) no-repeat;
    /* font-size: 0; 京东的做法 */
    text-indent: -9999px;
    overflow: hidden;
    
}
方法2：直接给 font-size: 0; 就看不到文字了，京东的做法。
.logo a {
    display: block;
    width: 171px;
    height: 61px;
    background: url(../images/logo.png) no-repeat;
    font-size: 0;
    
}
最后给链接一个 title 属性，这样鼠标放到 logo 上就可以看到提示文字了。