伯爵之魂
致力于web设计,讲究新时代换新思维模式

     放假了,有更多的实践来写博,大家多多支持,博客开通没几天,请大家多多支持,和感谢这些天一些朋友的评论,让我也学到了一些知识!如果有写的不好的地方大家及时指正,谢谢各位园友。

    这次我想讲的是html页面内所使用的标签合理化,主要对大框架的勾勒,对html页面标签的语意进行分析和一些运用技巧来展开。我们都知道,web标准提倡的是把整个页面的文档流结构按照树状排列。那么它们的标签运用也值得我们来深入研究一下,这样不但能够让你的页面看起来更合乎web标准也能对搜索引擎的优化起到至关重要的作用。那么,我首相想要讲的是div标签,div,单看它的拼写,我们大概能看出来,它的字面意思能够解释成“分区”“分层”但是它在html页面中的理解意思为box也就是盒模型,它能够像盒子一样把内容放进去,拿这个div来拉框架最合适不过。完整的是<div>。。。</div>中间的部分你可以写出你想要的样式。比如,你想要写一个B2B的网站来,首先我们要考虑的是如何加快浏览器对页面的解析速度,那么我们构架首选的框架标签就是div了。

     框架使用div那么,我们如何使用也是值得推敲的,千万不要滥用。下面我们来看一段代码:

 1 <div class="1">
 2 <div class="2"></div>
 3 <div class="3">
 4 <div class="3"></div></div>
 5 <div class="4"><div class="4_1"></div></div>
 6 <div class="5"><div class="5_1"></div></div>
 7 <div class="6"><div class="6_1"></div></div>
 8 <div class="7"><div class="7_1"></div></div>
 9 <div class="8"><div class="8_1"></div></div>
10 </div>

    劝告大家千万不能这样的滥用,尤其是新手对div+css不理解,导致过分的崇拜div就滥用一气。否则,由于文档内充斥着div标签导致你的页面结构不清晰,维护压力倍增,而且也违背的web的标准。虽然我一直对web标准持有一些怀疑态度,但它的利总是大于弊的(这方面的我以后会在这里跟大家解释)。那么我们如何合理使用呢?下面我们再来看段代码:

 1 <div class="head"><!--这个为头部div-->
 2 <div class="main"><!--这个为中间主要内容div-->
 3 <div class="left"></div><!--这个为左侧div(一般主要写一些类别,或者导航,附加信息之类的)-->
 4 <div class="right">
 5 <div class="center"></div><!--主要内容-->
 6 <div class="log_news"></div><!--主要的登录框或者是新闻一类的右侧-->
 7 </div><!--这个为右侧div主要写一些主题的内容-->
 8 </div>
 9 <div>
10 <div class="footer"></div>

    我们看一下,它们的结构是不是很像树状呢?结构清晰,一目了然,对浏览器解析也非常的合理。更重要的是,对搜索引擎的爬行蜘蛛很友好,他能很快的分辨出,那些是主题内容,哪些是次要内容!对我们以后的维护也是非常简单!

    接下来我们看一些h1标签,很大一部分的开发人员中都忽略了这个标签,其实这个标签,很重要,非常重要。它的重要性不亚于div标签,我们来理解它的html中的语意:h系列的标签是内容的强调标签。我们不要忽略强调,在结构中它代表着主题,在h系列中他是老大,主题内容的老大,也就是说你如果写一个门户网站的终端页面,也就是众多会员发布信息的页面,里面的内容都是一些商家来写的,他们有的一些不太懂这些方面的知识。它们只会写一个标题,一些内容,了事。甚至,有的是专业发布信息的专员,来进行发布信息,这是任务完成就好了。但是我们的网站却要收录,达到很高的收录,积累流量!那么我们首先要考虑的就是优化,如何优化,你想一下这个h1标签要放在哪个位置合理呢?标题,这个标题在终端页面就是一个主题,在搜索引擎的蜘蛛来到你的页面爬行找到h1标签,它首先对你这个标签的内容进行分析,好,首先找到了你的h1标签,里面内容是标题,词语结构都很好(一般发布信息的人对标题也是要经过思考写出来的,不存在胡乱复制)!抓取了,你这个页面的主题内容突出,带给你的好处是很大的。这样我们不是刻意去优化,而且也很和合乎web的标准,何乐而不为呢?所以说结构和标签的语意我们一定要掌握。

     接下来是p标签,p标签是指段落,文字的段落,在优化方面这个作用不是太明显,但是这个标签在html文档流中也非常的重要,比如新闻、软文、信息的主要介绍信息等大量文字的时候,能使用p标签尽量不要用div标签,因为不适合。浏览器对文档的解析也是有一定的分析的。

     这几个标签因为在网上介绍的少,就想写给大家分享一下!我知道还有很多优化的标签,就是有点懒,对不住大家,下次再来写,先去眯一会,昨晚睡太晚了!

     我对这些框架类型的几个标签分析完毕,请大家多多指正,一定虚心接受!

        (喜欢学习的和想与我探讨各种web知识的留下你的邮箱或联系方式,或者跟我发邮件747850255@qq.com转载请自觉附上转载地址,来自博客园“明年开奥迪”)

posted on 2011-06-04 15:24  伯爵之魂  阅读(1509)  评论(4编辑  收藏  举报