想谈一下几个基本的HTML问题,都是围绕着应该怎样使用HTML。
1. 多用有语义的标签,少用div和span,避免使用没有class的div和span。
设想一下HTML的世界最初只有div和span这两个标签,其实网页依然能够写得出来。更多标签的出现,实际上是为了替代利用率高但很差书写的
</code> 和 来的>
想再接着多说一句的是,在HTML5里愈来愈多常见的div class组合或div id组合被直接命名为了新的标签。理由也是相同的,像header/footer/aside/nav/section/article都是我以前常用的class或id。我甚至以为w3c创造新html标签的工做很简单,按期统计一下最经常使用的class和id,而后取前几名做为新的标签名就好了。
有人在微博上感慨那个“史上最牛的HTML代码”:
再过几年它真的也许会消失的。
反过来思考也能够,尽可能使用有语义的标签名,实在想不出来合适的标签名了,再用div而后起个class或id。这样的思路也不错。
2. 不要滥用class而回避id,该出手时就出手。
和问题1同理,设想一下HTML的世界最初只有class没有id,其实网页依然能够写得出来,语义依然表达得出来。无非就是会出现不少特殊的class呗。所以,咱们也很好理解,id的出现,就是能够和class一块儿协做,使某些语义即便没有现成的标签能够表示它,但依然能够把通常性和惟一性完美的结合在一块儿。
这里驳斥一个观点:“尽可能都使用class,由于控制样式的时候class的优先级是同级的,id的优先级更高,它的出现会破坏样式优先级的平衡”。首先我以为这是一个假命题,所谓的“平衡”是不存在的,也没有必要去刻意维护,经过id来表示的内容必定是相对特殊的,优先级天然高一些,这样的优先级设计是如此的天然。我可以接受的所有是class的适用范围仅是一些底层的css基础样式,如oocss里的基础样式,或不少网站都会有common.css文件或general.css文件,里面的东西尽可能用class没问题。
另外一个更重要的理由是,在HTML5里,除了id和class这两个特性能够控制样式以外,还能够经过特性选择器来定义样式,相似E[attr="..."]的写法。咱们会发现能够控制样式的方式愈来愈灵活,选择愈来愈多。这是Web发展的必然趋势。当其余人已经在用id/class/data-*/tagname对样式展开多重维度攻势的时候,咱们实在没有必要把本身还关在class的世界里。
3. 尽可能给每一个表示布局的class或id换一个站在内容角度的合理的名字。
好比两列布局的左右侧多半是正文和辅助信息的关系,那么就不建议用class="left"和class="right"而是倾向于class="main-content"和class="sidebar",或者直接用article和aside。
在自适应Web设计(responsive web design)如火如荼的今天,页面上的某个元素处在网页什么位置更像是个变量,因此经过位置来定义一个元素显然是会承受不少额外的维护成本和扩展成本。当改变发生的那一天,你发现本身的HTML代码变得文不对题。曾经的left跑到最上面去了,right变成了底部通栏,这都是很正常的变化。
实在没什么语义的,好比为了给IE加圆角而增设的标签,或清除浮动用的额外的标签,再或者是基础样式的,和具体内容无关的,再用div加表象的class来描述。
4. 尽可能避免表示纯样式的class或id。
好比class="f14 red"。印象中网上有不少拙劣的例子,也有不少深入批判这种用法的文章,我想说的是,若是你非要这样改样式,那不如直接写内联style来得直观。
最后想说的是……
互联网是一个快速发展的领域,它的快速发展甚至让人们忘却了不少传统领域的停滞不前。在这样的领域里工做,勇敢尝试,关注新技术,把握新趋势是如此的重要。不要拒绝新事物,不要被不思进取的人拖累,不要对大千世界失去好奇心和求知欲,方可永葆青春。
css