使用DIV+CSS设计网页的好处
作者:aw 来源:awflasher.com 发布时间:2007-10-14 15:02:00
今天偶然看到“一个有将近两年的div + CSS 开发经验和历史,曾经是Web标准绝对拥趸的同志”在自己的blog上发表放弃div+css的申明。我更深感一种悲哀——特别是当我苦口婆心地劝说公司的前端开发人员开始学习DIV+CSS的时候。
不过看看这个“好同志”放弃的理由的其中两条,不禁让我所心冷。
公司领导及客户不关心这个,他们需要的是快速、高效的工作和花哨的页面
所费功夫与收入不成正比,利用table可以大大减少工作量
确实,当今市场环境下,div+css对于一个财力一般的公司是一种奢侈。尤其是对于那种靠业务员疯狂跑业务而存活的(不打算上市)的公司,是一种莫大的浪费。我在广州曾见过许多“三天建站”的公司其中90%的人在外跑业务,然后10%的垃圾web开发设计人员把代码一遍一遍的往table里面塞。
甚至可以这么说,一个公司对div+css的认同和投入,直接决定了这个公司的期望目标,比如上市。好在我现在所在的公司在这一点上是非常愿意付出代价的。
其实,在具体商业产品实现上,并非一定要把自己拘泥于“Web标准绝对拥趸”的角色。我们似乎应该静心思考为什么使用div+css,而不是如何实现某个细节。
我们公司面临的困境则是相反的。就是太拘泥于div+css、为了DIV+CSS而DIV+CSS。这样做是毫无意义的。如果为了实现一个效果而不顾策略强行使用一种技术,是非常失败的一种做法。当然,我觉得这需要设计人员与开发人员的共同努力和让步。尤其是在B/S架构下。设计者肯定要做出更多的让步。比如某个布局中1px的差距能节省3k的HTML文件size,哪怕放弃视觉上这1px的效果,我看都值得。更何况,大多数干扰DIV+CSS布局的设计本身也是极不美观的。
movivi.com的SEO我思考了很多。我觉得最大的问题就出在我们并没有足够吃透W3C上。
当时,当w3c刚出的时候,三大门户十分不屑。清一色的table遍布整个首页。可是这样导致的问题不久就暴露出来了。搜索引擎爬虫难以解析复杂的table,而样式的改版也极为难受。
div+css,这个布局中,div承载的是内容,而css承载的是样式。内容和样式的分离对于所见即所得的传统table编辑方式确实是一个很大的冲击,尤其是设计人员很难接受设计一个他们不能立即看到的样式。不过div+css的好处实在是太明显了:
1、搜索引擎亲和力
搜索引擎不会在意一个页面的设计或者构成。搜索引擎不可能“欣赏”设计漂亮新颖的页面;也不会去“排斥”颜色搭配丑陋的页面。它们只是默默地拿到它们需要的内容就离开。如果一个页面中涵盖了大量的table来描述构架,试想搜索引擎要花多大的代价才可以拿到真正有用的信息呢?
凭我自己的经验,一般来说,table构架描述的页面,样式结构和内容信息大小比可能达到1:1甚至更高。而CSS+DIV构架的页面,虽然在客户端看来下载一个复杂的CSS也要占用差不多的带宽,然而搜索引擎可以很方便的绕过这个css,而直接抓去div中的内容。这便是div的优势所在。带宽的稍多占用,完全显得微不足道,更何况一个冗余的table设计架构如果代码写的不好会占用更多的带宽。
2、重构页面的方便性。
这个应用最经典的例子就是各 * log程序了。就如现在我用的LBS系统,以及流行的PJBLOG、php下面的WP、MT,都是采用div+css构架。内容和样式的分离导致我们在重构页面布局(更换皮肤)的时候,只用针对每一个div元素重新定义其具体位置、样式就行了。而在原来的table基础上进行改版,几乎必须改变所有的内容注入渠道,实在是太过于麻烦.
关于韩国风格网站难用div描述的问题,我个人认为在web2.0的大军冲击下,韩国的花哨流派很快会被简约派所代替。如果确实是优秀的设计,我个人认为用Flash来完成更好!
猜你喜欢
- 今天开始学习 YUI,加强一下对 JavaScript 的理解。1. 命名空间 YAHOO
- 前言python类与实例的方法的调用中觉得云里雾里,思考之后将自己的想法记录下,一来加深自己理解,巩固自己记忆,而来帮助一些想要学习pyth
- 目录问题复现隐式转换总结参考问题在工作中发现,有一个接口只执行一条SQL查询语句,并且SQL明明使用了主键列,但是速度很慢。在MySQL中E
- 一、把MySql.Data.dll放到BIN目录下。 二、这是aspx.cs的全部源码,修改参数直接运行即可! &nbs
- 我们将使用Python线程来解决Python中的生产者—消费者问题。这个问题完全不像他们在学校中说的那么难。如果你对生产者—消费者问题有了解
- 在本教程中,我们将构建一个程序,该程序可以使用流行的计算机视觉库 OpenCV 确定对象的方向(即以度为单位的旋转角度)。最常见的现实世界用
- Vue.js是一个轻巧、高性能、可组件化的MVVM库,同时拥有非常容易上手的API。分页一般和表格一起用,分页链接作为表格的一部分,将分页链
- 本文实例讲述了Python基于聚类算法实现密度聚类(DBSCAN)计算。分享给大家供大家参考,具体如下:算法思想基于密度的聚类算法从样本密度
- 有时候我们可能需要import另一个路径下的python文件,例如下面这个目录结构,我们想要在_train.py里import在networ
- 有个excle表格需要做一些过滤然后写入数据库中,但是日期类型的cell取出来是个数字,于是查询了下解决的办法。基本的代码结构data =
- 二是什么时候CPU是空闲的?空闲是一个相对的标准。有时会CPU使用率30%以下可以定义为空闲;而有时候CPU使用率只有不到60%,就是空闲。
- 简介这两天更新完Xcode8之后发现Xcode对图标的要求又有了变化,之前用的一个小应用“IconKit”还没赶上节奏,已经不能满足Xcod
- 目的:让在vuex中管理的状态数据同时存储在本地。可免去自己存储的环节。在开发的过程中,像用户信息(名字,头像,token)需要vuex中存
- 1、linux系统一般自带perl可运行程序在:/usr/bin/perl2、perl测试程序#!/usr/bin/perl -wuse w
- 解决MySQL插入时间差八小时问题一般 jdbc url中 需要添加几个参数 , 大多数博客给的教程都是 useSSL=false&
- Django中集成jquery首先,静态的资源通常放入static文件夹中:static/ css/
- 常见的几种分页方式:1.扶梯方式扶梯方式在导航上通常只提供上一页/下一页这两种模式,部分产品甚至不提供上一页功能,只提供一种“更多/more
- 本文实例讲述了Python排序搜索基本算法之堆排序。分享给大家供大家参考,具体如下:堆是一种完全二叉树,堆排序是一种树形选择排序,利用了大顶
- 前言在《Python中if语句的使用方法》中提到,对于一种可能性、两种可能性或者多种可能性的情况,可以通过if语句来实现。而用if语句实现多
- 使用mysql5.5,突然root密码忘记,怎么也登录不了,很急人,该怎么解决呢?下面通过本文给大家介绍mysql5.5忘记root密码的解