注重SEO搜索优化的css+div命名规则

        我最开始接触的网页布局使用table控制的,工作后开始学习css+div的布局。今天不说这个区别与好处,主要谈谈注重SEO搜索优化的css+div命名规则。

       搜索引擎可都是通过抓取你的网站源代码来进行亲密接触的,那么,如何才能更好地让搜索引擎的爬虫更快更准确地觉察到你的内容相关性,增强网站的搜索优化呢?可能从最基本的CSS +DIV的命名规则入手会有意想不到的收获,最基础的就是最有效的。下面从前端页面设计的角度整理的DIV+CSS的命名规则,就很好地考虑到了搜索引擎的喜好,在页面设计的过程中,尽量做你懂,搜索引擎也懂。

最常用的CSS 的class/id 命名规则:

页头:header

内容:content / container

尾:footer

导航:nav

侧栏:sidebar

栏目:column

外围:wrapper

页面左右中:left right center

具体的CSS 的class/id 命名规则:

外 套:  wrap  (控制整体布局宽度)
子导航:  subnav
页 脚:  footer
整个页面: content
页 眉:  header
页 脚:  footer
商 标:  label
标 题:  title
主导航:  nav
顶导航:  topnav
边导航:  sidebar
左导航:  leftsidebar
右导航:  rightsidebar
旗 志:  logo
标 语:  banner
菜单内容1: menu1content
菜单容量: menucontainer
子菜单:  submenu
边导航图标:sidebarIcon
注释:   note
面包屑:  breadcrumb   (即页面所处位置导航提示)
容器:   container
内容:   content
搜索:   search
登陆:   login
功能区:  shop   (如购物车,收银台)
注意:一般命名全部使用小写字母,假如需要多个单词,单词间使用“_”分隔,比如user_list。另外好的习惯可以在页面里和css文件里添加注释。

外联样式文件命名:

主要的 master.css

布局,版面 layout.css

专栏 columns.css

文字 font.css

打印样式 print.css

主题 themes.css

注重SEO搜索优化的css+div命名规则解说完毕,这么多就可以了。如果自己加内容命名的时候按英文命名。呵呵

发表评论