|
经验之谈!解读Div+CSS网页制作误区(2)
主菜单究竟是用<div id="mainnav"><ul>还是<ul id="mainnav">？这是一个博弈的问题。至今这个问题也没有人能够给出明确的答案，就连我也是如此。诚然，<div id="mainnav">在只包含了一个<ul>元素的时候，这个div就显得有些冗余，但有时候为了配合美工绚丽的设计，多一层标签就意味着多一层变化（有些人在a标签里套span也是如此）。而div不带任何原始属性的先天优势也是其它标签所无法比拟的。这个命题我只是想说明一件事，就是我们应该意识到，<div id="mainnav"><ul>之外，还有<ul id="mainnav">这种写法，同样具有良好的结构和语义，并且省去了一层嵌套。在我们不需要为华丽的美工劳心劳神的时候，是不是也可以让结构更加简约呢？
这个命题其实还可以引申为——“并不是所有内容都需要块元素做容器”、“并不是所有链接都需要其它元素做容器”，例如很多页面都有的“更多”。有些人写做“<div class="more"><a>”，也有人写做<p><a>或者<strong><a>。在这些“容器”只包含了一个<a>标签的时候，它们是否还有存在的必要？直接写成<a class="more">会破坏结构吗？会缺乏语义吗？会影响布局吗？换一种思路，你也许就会有不一样的收获。
4、工作上也做到“结构与表现分离”
关于这一点，网络上很多高手都是这样建议的，也就是先打开编辑器，把结构完整地写出来，再去CSS里写表现，而尽量不去动已经写好的结构。
然而以看书为主要学习方式的人却很难体会，因为关于标准的书籍多半是手把手来教的，也就是必然是结构表现结合，循序渐进。虽然有些书籍有这方面的建议，但短短的几句话远不如读书过程中的潜移默化。在制作人员能够对结构良好把握的时候，同时写结构与表现也不会对结果有太大的影响。但以我的经验，结构表现分离的工作方式，要比同时写结构与表现效率高很多，同时也不容易遗漏页面上的元素。
当然，所谓的“结构与表现分离”并不是完全不考虑表现，想要兼顾到表现，就要保证——在不破坏结构的前提下，CSS选择器能够选择到尽量多的内容。在哪些地方加class，或者用哪些标签来区分，是一个见仁见智的地方，相信每个人都有自己的体会。而结合不同的设计稿，有时候也需要做出相应的变化，然而这些变化都应该有一个同样的前提——不破坏代码的结构和可读性。
再就是，一定要意识到，任何可视化的工具都是魔鬼。它们可视化界面下所呈现的效果，往往与真实浏览器相差千里，而我们真正要兼容的是浏览器，不是编辑器的可视化界面。
5、CSS不是万能的，没有CSS也不是万万不能的
相比于CSS1.0时代，今天CSS可以完成更多的事情，然而需求永远是领先于技术的，CSS无法完成网页所有的表现层工作，有时候我们必须结合JS或者其他语言来实现一些效果。而另一些时候，用JS的方法比只靠CSS简单得多，并且代码结构更加良好——最典型的例子就是下拉菜单。这些时候，我们要说服自己，或者说服老板与客户，去采用更简单更合理的方式。因为DOM同样是网页标准的重要组成，并不是使用了JS我们的网页就降低了效率或是不再标准，恰恰相反，这是对JS最大的误解。说到这里不得不提一点，就是今天的时代，比以往更要求每个职业了解更多的相关知识，做设计的人要懂一点交互和制作，做制作的也必须了解设计和程序，尤其是JS这样的前端技术，只有这样，你和同事才能够更好地合作，个人的发展前景也会更加光明。
没有CSS，指的是当我们的网站因为各种未知的原因导致CSS文件载入失败，不要因此而慌乱，这是考验我们代码质量的最佳时机。在没有CSS的时候，如果网页仍旧保持良好的可读性，这成果要远比通过W3C验证更值得我们自豪。
|
