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

对于开发者都知道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. reduce的特殊用法

    //计算数组中每个元素出现的次数var arr = ["apple","orange","apple","orange" ...

  2. Android基础夯实--重温动画(一)之Tween Animation

    心灵鸡汤:真正成功的人生,不在于成就的大小,而在于你是否努力地去实现自我,喊出自己的声音,走出属于自己的道路. 摘要 不积跬步,无以至千里:不积小流,无以成江海.学习任何东西我们都离不开扎实的基础知识 ...

  3. LR接口测试---socket

    前提条件: 编译:javac TcpServer.java 启动:java TcpServer ============================================ 代码示例: # ...

  4. 上传一个npm包

    1.先创建一个npm账号 https://www.npmjs.com/signup 2.在cmd里输入命令进入项目文件夹 3.使用npm init 命令创建一个package.json(确保nodej ...

  5. Android开发笔记(1)——View

    笔记链接:http://www.cnblogs.com/igoslly/p/6781592.html   一.View基础知识            IDE——Integrated Developme ...

  6. js文件中引用其他js文件

    这一个功能的作用是做自己的js包时,可以通过引入一个整体的js文件而引入其他js. 只需要在总体的js加上这一句话 document.write("<script type='text ...

  7. Java Servlet DAO实践(二)

    Java Servlet DAO实践(二) DAO连接类 package com.seller.servlets.dao; import java.sql.*; public class DataBa ...

  8. java动态代理实现与原理详细分析(【转载】By--- Gonjan )

    [转载]By---Gonjan  关于Java中的动态代理,我们首先需要了解的是一种常用的设计模式--代理模式,而对于代理,根据创建代理类的时间点,又可以分为静态代理和动态代理. 一.代理模式     ...

  9. for循环,isinstance() 函数

    #isinstance()的运用 #练习: 求值总和以及平均值. str_list = [1,2,3,4,5,6,'a',7,8,9,'b',10,'c'] my_tal = 0 my_var = 0 ...

  10. ionic3视频播放功能

    因为项目的需要,需要使用视频播放的功能,使用的是videogular2插件,但是报了一个无法识别video-player 这个标签,百度了很多,发现原来是版本 不对,ionic3是以来angular5 ...