HTML4和HTML5的区别[转]

HTML5是最新的HTML标准,或迟或早,所有的web程序员都会发现需要使用到这个最新的标准,而且,很多人都会感觉到,重新开发一个HTML5的网站,要比把一个网站从HTML4迁移到HTML5上容易的多,这是因为这两个版本之间有很大不同之处。

事实上,HTML5并没有对HTML4做什么重大的修改,它们很多东西都是相似的。

  可是,其中有一些很重要的区别你需要知道。下面列出的就是一些HTML4和HTML5之间主要的不同之处(并不是全部,全部列出来是不可能的):

1. HTML5标准还在制定中
  这头一个不同之处显而易见,但非常重要,我需要先从它开始。也许你已经注意到了关于HTML5很酷的言论到处都是,但是事实情况是,HTML5是一个还未完成的标准。HTML4已经有10岁了,但它仍是当前正式的标准的事实没有改变。

  另一方面,HTML5仍处在早期阶段,以后的修改会不断的出现。你必须考虑到这些,因为你在网站上使用的这些新增加或修改的网页元素会每年都出 现一些变化,你需要不停的更新升级你的网站,这可不是你希望的。这就是目前为止,你最好在产品里使用HTML4,只在实验里使用HTML5的原因。

2. 简化的语法
  更简单的doctype声明是HTML5里众多新特征之一。现在你只需要写<!doctype html>,这就行了。HTML5的语法兼容HTML4和XHTML1,但不兼容SGML。

3. 一个替代Flash的新 <canvas> 标记
  对于Web用户来说,Flash既是一个惊喜,也是一种痛苦。有很多的Web开发人员对HTML5对Flash产生的威胁很不满。但对于那些忍 受着要花几年时间加载和运行的臃肿的Flash视频的人来说,用新的 <canvas> 标记生成视频的技术已经到来。

  目前, <canvas> 标记并不能提供所有的Flash具有的功能,但假以时日,Flash必将从web上淘汰。我们拭目以待,因为很多人还并不认同这种观点。

4. 新的 <header> 和 <footer> 标记
  HTML5的设计是要更好的描绘网站的解剖结构。这就是为什么这些<header> 和<footer> 等新标记的出现,它们是专门为标志网站的这些部分设计的。

  在开发网站时,你不在需要用<div>标记来标注网页的这些部分。

5. 新的 <section> 和 <article> 标记
  跟<header> 和 <footer>标记类似,HTML5中引入的新的<section> 和 <article> 标记可以让开发人员更好的标注页面上的这些区域。

  据推测,除了让代码更有组织外,它也能改善SEO效果,能让搜索引擎更容易的分析你的页面。

6. 新的 <menu> 和 <figure> 标记
  新的<menu>标记可以被用作普通的菜单,也可以用在工具条和右键菜单上,虽然这些东西在页面上并不常用。

  类似的,新的 <figure> 标记是一种更专业的管理页面上文字和图像的方式。当然,你可以用样式表来控制文字和图像,但使用HTML5内置的这个标记更适合。

7. 新的 <audio> 和 <video> 标记
  新的<audio> 和 <video> 标记可能是HTML5中增加的最有用处的两个东西了。正如标记名称,它们是用来嵌入音频和视频文件的。

  除此之外还有一些新的多媒体的标记和属性,例如<track>,它是用来提供跟踪视频的文字信息的。有了这些标记,HTML5使Web2.0特征变得越来越友好。问题在于,在HTML5还未被广泛的接受之前,Web2.0还是老的Web2.0。

8. 全新的表单设计
  新的 <form> 和 <forminput> 标记对原有的表单元素进行的全新的修改,它们有很多的新属性(以及一些修改)。如果你经常的开发表单,你应该花时间更详细的研究一下。

9. 不再使用 <b> 和 <font> 标记
  对我个人来说,这是一个让我不太理解的改动。我并不认为去除 <b> 和 <font>标记会带来多大的好处。我知道,官方的指导说这些标记可以通过CCS来做更好的处理,但这样一来,为了在文章一两个地方出现的这 种标记,你就需要在独立的css和文本两个地方来实现这一的功能,岂不笨拙。也许我们以后会习惯这种方法。

10. 不再使用 <frame>, <center>, <big> 标记
  事实上,我已经记不清曾经何时用过这些标记了,所以,我并不为去除这些标记感到悲哀。相同的原因,有更好的标记能实现它们的功能——这很好,任何作废的标记从标准中剔除都是受欢迎的。

  这10个HTML5和HTML4之间的不同只是整个新的规范中的一小部分。除了这些主要的变动外,我还可以略提一下一些次要的改动,比如修改了<ol> 标记的属性,让它能够倒排序,对<u>标记也做了修改。

  所有这些次要的改动数量众多。而且新的修改也在不断的增加,因此,如果你想实时跟踪最新的动向,你需要经常的查看w3.org的HTML4 和 HTML5之间的不同这个页面。如果你很心急,想在你的工作中使用这些新的标记和属性,我劝告你最好只是做实验,原因已经说的很清楚了,这些新标记和新属性在将来也许会有很大的改变,所以,除非你不断的更新你的代码,它们很可能会过期失效。

  尽管如今大多数流行的浏览器的最新版都支持HTML5,但有些新的(或修改的)标记和属性它们并不支持,所以你的网页在用户的屏幕上有可能前后显示的不一致。耐心等待,等待HTML5真正可以实用时候。目前还不是时候。

转载:http://www.cnblogs.com/web100/archive/2012/07/27/html4-html5.html

转载于:https://www.cnblogs.com/lifuyun/archive/2012/07/30/lifuyun2012073001.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/274702.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vs2017字体最佳选择_如何为下一个项目选择最佳字体? 一个简单的游戏

vs2017字体最佳选择“If I have the right font, half my design battle is already won!”“如果我使用正确的字体&#xff0c;那么我的设计大战已经赢了一半&#xff01;” In my first UX Design job, my AVP( Satish if you’re reading this, this one’s for you. ) onc…

浅谈初中级前端学习方法~

大家好&#xff0c;我是若川。 常有小伙伴问我如何学习前端开发。今天就简单谈下学习方法&#xff0c;方法可能主要适用于初中级前端。回想我们高中学习&#xff0c;是不是都是"以课本为主&#xff0c;其他资料为辅"。而且课堂上记笔记&#xff0c;然后通过大量练习&…

HDU-水饺基情 二维树状数组

该题就是简单的二维树状数组&#xff0c;保留一份棋盘的最新状态即可&#xff0c;树状数组里面就只保留在原有基础上增加或者减少的某一种饺子的数量。 代码如下&#xff1a; #include <cstring> #include <cstdlib> #include <cstdio> using namespace std;…

ui设计中的版式设计_设计中的版式-第3部分

ui设计中的版式设计and how not to suck at it以及如何不吸吮它 This is the 3rd and last part of the series. Here we take all our learnings from Part 1(Click to read) & Part 2(Click to read) and put to good use. Lets begin!这是本系列的第三部分也是最后一部…

听说你还在用开发者工具手动上传小程序,快来试试 miniprogram-ci 提效摸鱼

大家好&#xff0c;我是若川。持续组织了8个月源码共读活动&#xff0c;感兴趣的可以 点此加我微信ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外…

ucla ai_UCLA的可持续性:用户体验案例研究

ucla aiRole: UX Researcher / UX Designer / Critical-thinker角色&#xff1a; UX研究人员/ UX设计人员/批判性思维者 Scope: 4 weeks, March — March 2020范围&#xff1a; 4周&#xff0c;2020年3月至2020年3月 What I Did: UX Research, Speculative Design, Product D…

推荐10个国外图片素材网站

下面&#xff0c;为大家带来的 10 个国外精选的墙纸网站。 NO.1 Social Wallpapering 给我带来全新的体验&#xff0c; Web2.0 一个热门话题。可以让我自由的评选自己喜欢的东西&#xff0c;投票、评论、沉沦等等&#xff0c;对于网站内喜欢的东西可以做出自己喜欢的方式。进入…

大三的小白同学是如何拿到字节offer的,经验分享

这是来自大三邵小白同学的投稿。原文链接&#xff1a;https://juejin.cn/post/7092806181856657445很多时候我们容易羡慕别人成功了&#xff0c;却往往没有看到别人背后的努力。1前言大家好&#xff0c;我是邵小白&#xff0c;一个长沙某不知名双非的大三学生。今年三月份来到杭…

UNIBO大学博物馆网络设计—品牌重塑和数字产品设计

Brief / Redesign the Visual Identity of the University of Bologna Museum Network (SMA) and apply the new designs to a Digital Product简介/重新设计博洛尼亚大学博物馆网络(SMA)的视觉识别&#xff0c;并将新设计应用于数字产品 Period / Mar 2020 — June 2020期间/…

oracle中的sga和pga

oracle中的sga包含了几个主要的部分 1.shared pool 共享池 2.database buffer cache 数据库高速缓冲区 3.redo log buffers 重做日志缓冲区 4.large pool 大池 5.java pool java池 a.shared pool: oracle shared pool包括library cache(库缓存)和dictionary cache(数据字典高速…

进来做几道 JavaScript 基础题找找自信?

大家好&#xff0c;我是若川。持续组织了8个月源码共读活动&#xff0c;感兴趣的可以 点此加我微信ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外…

人物肖像速写_骄傲家庭:肖像项目

人物肖像速写2020 has been a solemn, transformative year. Pride month takes place in the context of a groundswell up-rising against racism and police brutality and in the continued isolation of COVID-19.2020年是庄严&#xff0c;变革的一年。 骄傲月的发生是在反…

答读者问:钱和成长,哪个更重要?

大家好&#xff0c;我是若川。持续组织了8个月源码共读活动&#xff0c;感兴趣的可以 点此加我微信ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外…

ui设计颜色的使用_UI设计中颜色使用的10条原则

ui设计颜色的使用重点 (Top highlight)1.颜色术语 (1. Color Terminology) Color terminology forms our foundation of color knowledge. Think of color terms like hue, tint, and shade as tools that we can employ to develop unique color palettes.颜色术语构成了我们颜…

Chrome插件:网易云音乐听歌识曲

大家好&#xff0c;我是若川。持续组织了8个月源码共读活动&#xff0c;感兴趣的可以 点此加我微信ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外…

五大常用算法之四:回溯法

1、概念 回溯算法实际上一个类似枚举的搜索尝试过程&#xff0c;主要是在搜索尝试过程中寻找问题的解&#xff0c;当发现已不满足求解条件时&#xff0c;就“回溯”返回&#xff0c;尝试别的路径。 回溯法是一种选优搜索法&#xff0c;按选优条件向前搜索&#xff0c;以达到目标…

如何设置ad18捕捉图标_图标设计中的像素捕捉

如何设置ad18捕捉图标More in the iconography series:• Foundations of Iconography• 7 Principles of Icon Design• 5 Ways to Create a Settings Icon• Icon Grids & Keylines Demystified• 3 Classic Icon FamiliesWe all want our designs to display sharp on a…

React Hooks 原理与最佳实践

大家好&#xff0c;我是若川。持续组织了8个月源码共读活动&#xff0c;感兴趣的可以 点此加我微信ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。历史面试系列。另外…

BW:BW增量更新方法(假增量)

1 说说假增量 我们都知道&#xff0c;对于BW来说&#xff0c;很多ECC的标准数据源自带了增量更新功能&#xff0c;每天各种凭证产生的增量数据会自动堆积到增量队列里&#xff0c;然后BW端做一个增量信息包按天把这些增量抽取到数据仓库里&#xff0c;非常轻松自然&#xff0c;…

插图 引用 同一行两个插图_为什么插图是产品的重要组成部分

插图 引用 同一行两个插图“Hi, my name is Ludmila and I’m a UX/UI designer”“嗨&#xff0c;我叫Ludmila&#xff0c;我是UX / UI设计师” “Hi, Ludmila”“嗨&#xff0c;路德米拉” “Welcome”“欢迎” Not anonymously at all, I’ve been doing UX/UI design fo…