现在,打开浏览器,各种各样的页面可以让人眼花缭乱,对于行外人看到的是美观效果是用户体验,对行内人很多其它的是关注技术和创造力。

对于开发者都知道DIV是一对html经常使用标签,DIV+CSS是一对非常诱人的组合,非常多界面设计师通过软件培训班等学习这门手艺,当然自然非常多是冲着会用了DIV+CSS制作网页。经常会被人赞以大拇指的。现在提到DIV+CSS,还有非常多人热情高涨。接下来帮助大家纠正下DIV+CSS的一些误解。

1、DIV仅仅是HTML最经常使用的标签之中的一个

显然HTML并不仅仅是一个DIV标签实用,每一个标签都有它的用途。仅仅是DIV是当中最实用的一个罢了。假设说你一个DIV就能统领天下。那么W3C 还公布那么多标签做什么呢。Table也不是一无是处,仅仅是用table比較简单、easy上手才在早期被人错误的广泛推广。可是table在处理网页数据的表现上,是其它标签无法替代的。仅仅是,它不适合用来做整个页面的布局。

2、代码的可读性



纯DIV+CSS的站点的代码的可读性无疑是很差的。甚至table还能够通过tr和td来区分行和列,一堆DIV堆砌在一起,假设没有凝视,你根本不知道某个部分是做什么用的。

因此凝视是每一个开发者都必须要编辑的一个至关重要的环节。

3、语义化与结构化



W3C公布N多标签,他们肯定有他们的优点,假设说你页面所有是div。我想无论你是多数牛叉的人。你眼睛必花。如今,在开发CSS的时候,提的越来越多的是语义化,语义化归根究竟事实上还是代码的可读性问题。语义化就是让代码更易读,更加易懂,比方。.text_01{color:red} 就没有.text_red{color:red} easy理解。



HTML相同如此,比方我们看到<ol>就知道这是个有序列表;看到<p>标签就知道这是一个段落,内容为文字;看到<span>就知道这个是比<p>还小的文字单位;看到<h1>、<h2>之类的就知道他们是标题。

显然。所有是div的页面。是看不出来这些的。



页面的结构化亦是如此,比方<div><div><div><div>…..</div></div></div></div>这种代码,显然是非常难理解其DOM结构的,可是<div><p><h2><span>…..</span></h2></p></div>就比上面的那个结构要清晰非常多。相信做开发的人对代码的语义化和结构化的理解会更加深刻。





 

4、团队合作



可读性低、结构化和语义化差,团队的其它成员的学习和维护难度就会提高,这对于一个团队来说,是非常浪费时间和精力的。





 

综合以上所述。DIV+CSS的说法,已经把我们从table带到了另外的一个极端。正确的网页设计不是一个标签雄霸天下,而是每一个元素都使用合适的标签。

畅谈HTML开发的更多相关文章

  1. SQL基础培训实战教程[全套]

    学习简介:林枫山根据网上搜索资料进行参考,编写制作的SQL Server实操学习教程,欢迎下载学习. 下载链接目录如下: 进度0-SQL基础语法    下载学习文档 进度1-建数据表-美化版-2018 ...

  2. 自动化高效css开发,畅谈less的灵活变化

    css是一种让html与样式分离解析而出现的代码,它的出现大大提高了程序员的工作效率,和后期进行维护的效率.但是发展至今,由于起死板单调的写法,越来越不能满足程序员们灵活的思维,很多时候是种恨铁不成钢 ...

  3. 从设计到开发,硅谷技术专家教你做“声控”APP

    编者:本文为携程机票研发部技术专家祁一鸣在携程技术微分享中的分享内容,关注携程技术中心微信公号ctriptech,获知更多一手干货. [携程技术微分享]是携程技术中心推出的线上公开分享课程,每月1-2 ...

  4. 作为一个web开发人员,哪些技术细节是在发布站点前你需要考虑到的

    前日在cnblogs上看到一遍文章<每个程序员都必读的12篇文章>,其中大多数是E文的. 先译其中一篇web相关的”每个程序员必知之WEB开发”. 原文: http://programme ...

  5. Web开发需要关注的技术细节

    摘要:在网站发布前,开发者需要关注有许多的技术细节,比如接口设计.用户体验.安全性.Web标准.性能.SEO等,倘若一个疏忽就会影响到整体的体验效果.作为一名Web开发者,哪些技术细节需要考虑呢? [ ...

  6. web开发人员

    随笔- 4  文章- 18  评论- 12  [译]作为一个web开发人员,哪些技术细节是在发布站点前你需要考虑到的   前日在cnblogs上看到一遍文章<每个程序员都必读的12篇文章> ...

  7. 安晓辉大神的感悟:如果你发现了自己的学习模式,愿意学并且能坚持,我觉得没什么能阻挡你征服软件世界的脚步(对于开发人员来讲,最大的风险是:在职业规划上没有延续性地乱跳槽。时刻要牢记在心的:培养自己的稀缺性) good

    从技术支持中途转战软件开发,如今从事编程工作已十多有余,2014年CSDN博文大赛编程语言组冠军.CSDN Qt论坛的版主安晓辉老师从今天开始,坐镇CSDN社区问答栏目的 第十四期,届时会接受广大网友 ...

  8. [译]作为一个web开发人员,哪些技术细节是在发布站点前你需要考虑到的

    前日在cnblogs上看到一遍文章<每个程序员都必读的12篇文章>,其中大多数是E文的. 先译其中一篇web相关的”每个程序员必知之WEB开发”. 原文: http://programme ...

  9. MySQL开发篇,存储引擎的选择真的很重要吗?

    前言 谁说MySQL查询千万级别的数据很拉跨?我今天就要好好的和你拉拉家常,畅谈到深夜,一起过除夕!这篇文章也是年前的最后一篇,希望能带给大家些许收获,不知不觉查找文档和参考实体书籍就写了这么多,自己 ...

随机推荐

  1. FCC 基础JavaScript 练习1

    1.JavaScript中的注释方式有以下两种 // This is an in-line comment. /* This is a multi-line comment */ 2.avaScrip ...

  2. get、post、put、delete、head请求方式

    对资源的增,删,改,查操作,其实都可以通过GET/POST完成,不一定要用PUT和DELETE. 一:Jersey框架,实现了restful风格,常用的注解@GET.@POST.@PUT.@DELET ...

  3. 11Oracle Database 视图

    Oracle Database 视图 视图语法 create [or replace] view <名字> as <select 语句> 视图用于简化查询,视图中实际存放的是一 ...

  4. position的简单用法实例 ----- 方框里图片放对应的角标

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  5. js实现汉字中文排序的方法 例如:省市列表的排序

    localeCompare() 1.数组内的元素是中文字符串的简单排序 var arr = ['南京', '北京', '上海', '杭州', '深圳']; function sortChinese ( ...

  6. 12Cookie、Session

    12Cookie.Session-2018/07/24 1.保存会话数据 cookie客户端技术,把每个用户的数据以cookie的形式写给用户各自的浏览器 HttpSession服务端技术,服务器运行 ...

  7. 11servlet接口

    11.servlet接口-2018/07/23 1.servlet 是一个接口,需要导包javax.servlet.Servlet; 第一种编写一个servlet程序的方法 写一个Java类,实现se ...

  8. 洛谷——P2094 运输

    P2094 运输 题目描述 现在已知N件商品,和搬运它们其中每一件的费用.现在搬家公司老板Mr.sb决定让我们每次任意选取2件商品.然后这2件商品只算一件商品的费用.但是这个商品的搬运费用是将选出的2 ...

  9. 每日命令:(11)nl

    nl命令在linux系统中用来计算文件中行号.nl 可以将输出的文件内容自动的加上行号!其默认的结果与 cat -n 有点不太一样, nl 可以将行号做比较多的显示设计,包括位数与是否自动补齐 0 等 ...

  10. ubuntu 安装codeblocks13.12

    通过添加PPA的方法安装: sudo add-apt-repository ppa:pasgui/ppa sudo apt-get update sudo apt-get install codebl ...