少用例如iframe等标签引入内容，可以不用尽量不用，因为搜索引擎无法搜索到框架里面的内容；
<!--页面注解-->
<html>
<head>
<title>页面标题</title>
<meta http-equiv=Content-Language content=zh-cn />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="description" content="网站描述" />
<meta name="keywords" content="关键词" />
<link href="inc/css.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div>
<h1>页面内容标题</h1>
<h2>页面相关性标题</h2>
<h3>标题系列</h3>
<h4>标题系列</h4>
<h5>标题系列</h5>
<h6>标题系列</h6>
<img src="xxx.jpg" alt="图片说明" />
<a href="/" title="链接说明">链接词</a>
<strong>重点关键词强调</strong>
<b>关键词强调</b>
<u>关键词强调</u>
<i>关键词强调< /i>
</div>
<div>
版权部分关键词强调
</div>
</body>
</html>说明
注：在<body>..</body>标签区中的罗列，都是一些基础的HTML标签，这些标签出现的次序是可以变化的。但head里面的标签最好不要变动！
下面来给大家详细解答一下。
第1行的<!--页面注解-->这个标签主要是写关于W3C验证
第4行<title>页面标题</title>。这是相当重要的！不要堆关键字，保持你的主要词在这里出现三次就行，太多对你没有好处，对排名也不会有好处。GG并不喜欢太长的标题，bd也偶尔提到只希望在标题的前20个字里出现你的关键词。还要注意的是，主要关键词应该在标题里越靠前越好！
第7行<meta name="description" content="网站描述" />这个是主要是在索引结果就是在bd搜索你的站的时候标题下面的摘要内容。现在的权重不高，跟 keywords标签一样，不太受重视。所以主要需要描述得吸引一点，能让用户有点进去的欲望！
第8行<meta name="keywords" content="关键词" />这个的用途现在权重越来越低，但是再低都是有权重的，只要认真对待，这里的词是有效果的。这里注意2点： 第一、大部分人都会选择在这里写关键词不会超过三个，有的人直接只写一个，这是有好处的，每一处标签都有权重，你强调的内容越少，那么它的权重会相对更高的，所以不要写太多，否则不如不写，而让搜索引擎自己去判断你的页面关键词。 第二、几乎所有的seo专业人员都会跟你说尽量在每一个页面写不同的关键词，避免被认为是重复页面的危险。
第13行<h1>页面内容标题</h1>这个标签是一个页面最重要的标签，也是搜索引擎定位这个页面的主要依据，如果你的<h1>标签里没有出现你的页面关键字，那真是的一种很大的损失，这里的权重相对于其它的在<body>区的标签来说更加重要。在HTML代码中，它的重要性仅次于<title>，最好只出现1 次，以达到明确说明的目的。
第14行<h2>页面相关性标题</h2>这个标签与<h1>是一样和道理，但是权重相对来说较低，如果你的页面没有<h1>，那么这个标签对于页面来说基本上就相当于<h1>的重要性了。这里面你包含的是长尾关键词相关的内容，比如你的页面做几个关键词，主词应该出现在<h1>里，那么其它的词以及你想发展的词就可以出现在<h2>里，这样来说是一种合理的安排。 而<h3>~<h6>这些标签，重要性是依次递减的，在一个页面的权重越来越低。 第19行<img src="xxx.jpg" alt="图片说明" />我想这个标签主要是写关于图片的说明，这样写当然也有利于你在图片搜索的结果里显示排名更前面一点，不过现在bd基本上是以页面标题作为一张图片排名的要素，当然，你的alt标记做得好，将会增加你的图片匹配度。
第20行<a href="/" title="链接说明">链接词</a>这是链接说明，同时也是一个页面链接的SEO重点，这里的”链接词”相当的重要，如果你跟别人交换链接，你这个词的写法是起着外链好坏与否的决定性因素的。”链接词”建议你最好写成自己的关键词，如果觉得实在不行或者怎么样，你一定要在”链接说明”里出现你的关键词。否则对于排名，你的链接做得没有太大的好处。这在SEO专业术语里还有一种叫法，叫做”google炸弹”，就是用很多站点，同时做链接到一个网站，然后所有的”链接词”都写一个词-“刘亦菲”，不久以后google就会将这个站当做”刘亦菲”这个词最权威的站点，即使被那些站点链接的这个页面没有任何与”刘亦菲”相关的内容，这个网站在”刘亦菲”这个词的排名情况也会很好。不过google已经调整了算法，但是这样做链接肯定是有用的，一定要认真对待你的链接。还有一个重点，就是对方的链接，如果是JS调用的，你就别想在他那里得到任何权重，因为搜索引擎不会去读取JS里的内容，所以，建议大家好好做链接，不要做了链接你的站却跟没做一样。像bd空间的友情链接就是JS文件调用的，所以bd空间里的友情链接你是没有权重的。具体可以查看HTML代码，正常情况下一个页面你找不到你的网站地址在<a>..</a>标签内出现，基本上这就是属于无效链接。
第21行<strong>重点关键词强调</strong>这个标签基实重要性仅次于<h1>，它比<b>、<u>、<i>等标签要权重高。所以如果你的页面有很重要的词，而你想强调它，首先选这个<strong>标签吧，接下来相对不重要的词强调请你选<b>、<u>、<i>等标签。当然，不要用得太多了，用得太多没有重点就等于没有用了。
第26行版权部分关键词强调 我为什么要写这个？因为这个权重越来越高了，在底部版权部分，及很接近版权部分出现关键词，是一种手法。在这里强调你的关键词，是让你的关键词布局更加合理，而不是头部出现关键词，中部强调很多次，而底部却没有什么相关联的内容，这个词在这个页面是否值得怀疑呢？
css两端对齐——div+css布局实现2端对齐的4种方法总结
css两端对齐，通过margin负值、justify、space-between、column-count等多种方式来实现css的两端对齐。
flex布局,学习flex弹性布局总结
flex布局(Flexible Box)是对界面css盒模型的一个优化，适应不同尺寸的屏幕，被定义flex的容器可以控制子元素的排列方向和大小，能够用更简单清晰的代码来完成复杂的布局。
html通过css,js实现div悬浮效果总汇，如原生JS实现滚动到一定位置实现div悬浮
在我们的实际开发中，经常会遇到页面中需要悬浮效果，本文将介绍通过fixed的实现，以及通过原生Js实现滚动到一定位置，实现div的悬浮
理解css中Grid布局，在项目中如何实现grid页面布局
CSS中Grid是一种二维网格式布局方式，Grid是为了解决二维布局问题而创建的CSS模块。使用Gird的好处，Gird在浏览器的兼容性，Grid布局的示例源码...
使用flex实现5种常用布局
flex常用布局：经典的上-中-下布局。在上-中-下布局的基础上，加了左侧定宽 sidebar。左边是定宽 sidebar，右边是上-中-下布局。还是上-中-下布局，区别是 header 固定在顶部，不会随着页面滚动。左侧 sidebar 固定在左侧且与视窗同高，当内容超出视窗高度时，在 sidebar 内部出现滚动条。
你以为 CSS 只是个简单的布局？
本文中，所有的图形都是在单个标签内实现的，大量使用了 CSS3 中的 ::before 、::after 伪元素，transparent 、border，多重线性与径向渐变，多重内外阴影，如果你的效果不尽人意，请尝试在 Chrome 浏览器下预览。
html实现时间轴_纯css实现响应式竖着/垂直时间抽布局效果
html实现用时间点来展示事件发生点来代替用table展示一条条数据，能够给人清晰、一目了然能够看清事情发生的过程，UI页面也显示的那么清晰。如何用css+html做出时间轴展示事件点的？
基于jquery 横向/纵向 时间轴插件推荐
这篇文章主要整理一些关于基于jquery，实现横向/纵向时间轴的插件推荐：jquery.jqtimeline插件、timeline.js插件、Timeglider.js插件、Melon HTML5 、jQuery Timelinr、Timeline Porfolio
CSS position 属性_css中常用position定位属性介绍
css可以通过为元素设置一个position属性值,position定位是指定位置的定位，以下为常用的几种：static（静态定位）、relative定位（相对定位）、absolute定位（绝对定位）、fixed（固定定位）、inherit定位
css圣杯布局的实现方式
css圣杯布局思路：外面一个大div,里面三个小div(都是浮动)。实现左右两栏宽度固定，中间宽度自适应。中间栏优先渲染。
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!