资源描述
*,*,单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,HTML,基础培训教程,主题：讲解,HTML,的基本语法及日常过程中常用标签，规范,HTML,语法对搜索引擎,SE0,的优化,公司内部编辑人员培训材料,HTML,语言,HTML,语言概述,HTML,基础知识,编辑最常用到的几个标签,HTML,和,SEO,优化,HTML,语言概述,HTML,英文全称：,Hypertext Marked Language,，中文就是超文本标记语言。是网络世界中通用的一种基本语言。,HTML,不是程序设计语言，而是一种结构语言。,HTML,有许多元素，文档通过元素置标就形成了所谓的,HTML,文档。,HTML,也是文本文件，所以可以用纯文本编辑器来编辑（如,Windows,的记事本、写字板),HTML,文件的后缀名,必须是,.htm,或者是,.html,。,通过浏览器才可以对,HTML,文档进行相应的解释,HTML,基础知识,HTML,的基本的基本结构,一个标准的简单的,HTML,页面包括文档头，文档体两个部分,头部信息,文档主体，正文部分,创建一个简单的,HTML,文档,创建一个简单的,HTML,文档,HTML,基础知识,HTML,的基本页面,这里放这个页面的标题,欢迎光临我的主页,主页内容,HTML,基础知识,HTML,基本结构解说,与,在文档的最外层，所有的标签都包含其中。用以声明这是,HTML,文件，让浏览器认出并正确处理此,HTML,文件。,至,称为头部，浏览器中头部信息是不被显示在正文中的，在此标签中可以插入其它标记,用以说明文件的标题和整个文件的一些公共属性。,和,是嵌套在,头部标签中的，标签之间的文本是文档标题，它被显示在浏览器窗口的标题栏。其出现于,部分。,至,称正文。,和,标记一般不省略，标签之间的文本是正文，是在浏览器要显示的页面内容。,HTML,基本结构解说,上面的这几对标签在文档中都是唯一的。,HEAD,标签和,BODY,标签是嵌套在,HTML,标签中的,和,告诉浏览器，这里面的内容 要居中显示。,和,是一个固定样式的标签，这里面的所有文本都会被加上它的样式，如果不想要它自带的样式，需要给它定义属性。像这样标签有,h1,h2,h3,h4,h5,h6,每个样式都不一样。,换行的意思，使用这个后，两行之间距离很小。还有一个换行,，正确的理解是换段，两段文字之间的行，所以它的行距离比,的两行距离要大很多。,在,Dreamweaver,设置中的输入方法是,shilf+,回车，,的输入方法是直接回车。这两个是常用的,html,标签。,HTML,基本结构解说,和,用来设置字体的样式，如红色，宋体，大小。,安居丽业网,这句的效果就是让,“,安居丽业网,”,这七个字，设置字体为,“,隶书,”,，颜色为红色，大小为,6,号字。,这个属性也是编辑常用的一个标签。如果不愿意手写代码的话，可以直接通过,Dreamweaver,设置中设置一下。方法：,1,、选中页面上的文字,“,安居丽业网,”,2,、点击右键，属性,3,、在下面的属性一栏中，找到字体属性，下拉中选择隶书，大小 中选择,6,号，颜色中选择红色。这样就可以了。,HTML,基本结构解说,编辑最常用到的几个标签,或者,换行,当一段话要分两行时，可以在代码中输出这个字符来达到分两行的效果，或者在设计视图中使用,shift+,回车来分行。,换段,当要将一串文字分成两段，并且两段文字之间有一段的距离，就使用这种标签。在设计视图中直接使用回车就可以输出这样的标签了，页面上看到的效果就是换段了，并且 两行之间有一定距离的空白。,设置文字样式,给文字加上字体、颜色、大小 、倾斜、下划线、粗体。,编辑最常用到的几个标签,加粗,和,倾斜,和,下划线,字体,face=,“某种字体”,颜色,color=,“,#ff0000,”或者,color=red,大小,size=,“某个数字”,编辑最常用到的几个标签,超链接功能，页面上从这个页面跳到另一个页面都是通过这个来实现的。像我们的首页，点击首页上某个子频道的名字，就打开子频道页面。页面上可以为文字加超连接功能，也可以为图片加超连接功能。,插入图片,这个标签的意思是将一个图片放到页面上。具体的写法：,排版的技巧,1,、网页里多大的字看起来比较舒服？,一般说来，,9,磅字比较美观，目前也最为最流行。注意我们说得,9,磅字是,9pt,。对于新闻，常采用更大一号的字体。对于英文而言，可以选择,7,磅字，也很好看的,如果觉得,9pt,太小，也可以用,11pt,、,10.5pt,排版的技巧,2,、字距小于行距，行距小于段距，段距小于块距,字距是,word-spacing,行距是,line-height,段距可以对,p,使用,margin,块距一般指,div,之间的距离，也可以是,margin,个人习惯，前三者依次是：,120%,、,150%,、,200%,至于块,DIV,可以根据布局需要另行设置。,排版的技巧,3,、,请问怎么在段前空两格啊？,一般情况切换成全角输入两个空格,如果可以用,CSS,的话,可以对,p,标签设定如下样式：,p text-indent:2em;,p,表示段落（一般来说，按一下,enter,就相当于分段,p,，按一下,ctrl+enter,等于转行不分段,br,）这样每段开头就会空两个,em,的距离。,em,是相对单位，,2em,表示两个字的距离,论坛交流,最后推荐大家可以去鞭牛士网编论坛去转转,那个是全国著名的网编交流论坛,网址是：,HTML,标签与,SEO,搜索引擎优化,NO.1,标题,网页的优化中，网页的标题标签是一个很重要的优化因素。首先,每一个网页要有独创的标题标签。,先看一个案例,苏州人才网,网站首页,-,苏州人才网,当打开一则新闻时 标题则还是苏州人才网,对搜索引擎就不是太友好,NO.1,标题优化,对于搜索引擎来讲：标题是文章的主旨、灵魂。,一个好的标题有什么优势呢？,A.,标题独特，利于搜索引擎快速收录。,B.,吸引用户的眼球（用户至上）。,C.,标题中包含关键字或相关长尾关键词获得好排名,D.,标题字数不要太长，,NO.1,标题,标题独特，利于搜索引擎快速收录,每一个网页的标题标签尽量不同，这样才会让搜索引擎可以收录你网站的更多网页。,标题吸引眼球（用户至上）,用户在判断应该点击哪一个网站时，很大程度上就取决于你的标题写的怎么样？是否对用户有足够的吸引力？搜索引擎的链接过来的文章，只要你的标题的名字吸引人，即使你的排名不是太靠前，但因为标题更劲爆，还是能引诱网友点击的。,NO.1,标题 关键词提炼,标题标签要包含关键字。,首先标题应该服从于内容。把内容分解成无数个常出现的关键词。例如：,“,拍,我的父亲母亲,第一场戏，,孙红雷,拍了一整天，一共,25,条，他没有找到一点感觉。,孙红雷,说：开拍前张导就给我敲过警钟了。他说这部戏火不火跟你个人没关系，因为和你配戏的所有,演员,都是非职业的，原型木匠就是木匠，村长就是村长，都是农民，只有你一个人是,演员,。如果这部戏上映了，大街上有人认出你，那你就失败了。你想那时候,张艺谋,多火，哪个,演员,跟他拍戏不想出名啊，听完这话我都傻了,事实证明张导说的是对的，我成功了，几乎没有人记得,孙红雷,演过,张艺谋,的片子。,张艺谋,第一次让我学会了不露痕迹地去表现。有的人一辈子都转不过来，,张艺谋,帮我捅破了那层窗户纸，然后我把所有的纸都撕碎，才发现窗户外的景色别有洞天。,”,要形成分解关键词的习惯，一眼看过去知道这一段话的主旨，以及其他关键词是附属的次要信息。,NO1,、标题,标题中关键词的提炼,于是可以提取出关键词“孙红雷”“演员”“张艺谋”“我的父亲母亲”。,标题命名中就应该含有这些关键词规则,标题最好包含文章内容关键词。,其次总结出来这一段的特点。把词语分出来。,一级 我的父亲母亲,二级 张艺谋,三级 孙红雷,NO1,、标题,标题标签字数不要太长。,一般来说，搜索引擎只考虑标题中有限的字数，比如前,10,个字或前,15,个字。要尽量把关键字放在标题的前面，这样更容易让搜索引擎搜索到,NO.2,排版,1,、什么是,标签,标签又称为标题标签，是所有权重标签中最重要的，它一共有,6,种形式。,它们在页面的相关性影响起重要作用。,推荐用法：,表示网页的主标题,表示段落标题,表示段落中小节标题,这些关键词需要尽早出现在句子的开始,标签权重比较,Titleh1h2h3b,h1,在引擎优化中的作用为强调关键词，加深网站对关键词的关联性,备注：,h1,标签在一个页面中只能用一次，不能多用，否则会起副作用。,H2-h6,可以嵌套使用,NO.2,排版,排版更加清晰，建议用如下方式,标题一,标题二,段落一,段落二,文字,段落二,文字,段落一,段落二,NO.3,（,keywords,）,以关键词除在文章中提取的，还有相关关键词。如何收集这些相关关键词，很简单的办法就是看搜索引擎最底部的相关搜索,。,NO.3,（,keywords,）,怎么选择更加合理的关键词，所谓更加合理的关键词，就是相关的，并且竞争度比较小的关键词。例如,利用工具进行相关查找,这样的关键词收录少，竞争度小，并且确实能带来流量的，为最佳选择。当然竞争还有商业因素，这里暂时不进行讨论。,NO.3,（,keywords,）,确定几个核心关键词及组合，关键词以,3-5,个为宜，最好不要超过,15,个字，以避免堆砌之嫌。描述是网站的简短说明，含有关键词。,如果每个主要页面的内容相差很大，则应根据网页内容不同而改变,title,和,meta,标签，不要全部网页都采用首页的标题和标签,网页文本内容需出现该页关键词，关键词密度在,3%-7%,之间。太多有堆砌之嫌。,NO.4,Description,Description,标签就在,title,后面，该标签可以是一小段（一个或者两个句子）。用于描述你网站。网页的说明内容，主要给搜索引擎看。收录之后，给用户看。,按照这两天必循遵守两个规则。,A,包含关键词，能说明清楚这个网页。,B,不要超过,150,个字，最好不要到,120,个。,NO.5 tag,Tag,标签是,web2.0,的东西，相当关键词,文章标签，主要用于大批量增加网站链接。为什么会大批量增加呢。假如一个网页有三个,tag,，一个,tag,能有,3,个相对应的文章。那么在三个层级内所增加的链接为,3,0,+3,1,+3,2,+3,3,如果每个有,10,个相关文章呢？那在三个层级里增加的文章不计其数。,NO.6,相关文章,相关文章主要是为了用户体验和内部链接。举例说明：,新车上市资讯,-,新车图片,-,推荐,4s,店,-,新车报价,-,售后服务,按照用户思维习惯进行相关文章链接。同时增加了这些文章的外部链接,NO.7,内容,原创为最好的选择，如果没有原创，就需要伪原创。一般来说,copy,过来文章，必须有,80%,的不同才算伪原创。,翻译，寻找国外网站，翻译成中文,在不破坏用户体验的基础上，我建议采取拼凑、段落置换、修改句子、标题、段落名方式进行伪原创。,NO.8,文字链,文字链主要为了增加内部链接，是一对一的链接。是为了根据需要，针对某一个专题，项目进行链接的做法。,例如：,朗朗、白岩松等关键词链接到了相关专题，这样无形中告诉了用户，你可以看更多，也同时增加了外部链接。,补充：页面版式,文章页面的样式为：,细节注意,图片增加,Alt,、,Title,，文字主要为关键字。,链接增加,Title,图片的,Alt,属性代码,在图片的代码中运用,Alt,属性标签进行说明，含关键词，同时在图片旁边也加上含关键词的文本注释。避免纯图象网页（,Splash,）。包括图像在内的一页网页字节数最好不要超过,50K,。,Alt,属性对百度图片搜索，或者,google,图片搜索还是有很大作用,img,title=,陈晓。（资料图片）,src= ，,搞得出专题，策划好活动，,做得了方案，搞的定执行 ，,弄得透市场，更要能忽悠，,实践案例,大家做一个植树节专题,要求：应用,title,、,keywords,、,description,并结合今天学校内容尽可能考虑用到,seo,技巧,THE END,
展开阅读全文