常见Web技术之间的关系,澳门金沙30064在线网站:你了解多少?

By admin in 计算机教程 on 2019年4月7日

塑造2010年的网页设计行业的那些事

2011/01/13 · HTML5 ·
HTML5

导读:原文由王五翻译,已修正原译文中的一些误译之处。以下是全文。

在2009年末,我曾坐下来考虑网页设计会向何处发展,当时发生的一切又将走向何方。我提起笔来(确切地说,我是坐在键盘前)写下了《2010年塑造Web的五项科技》,力图总结正在推动我们这个行业发展的科技趋势和行业发展的方向。为了真实的反映过去一年所发生的事,我在本文会讨论一些塑造了2010年网页设计行业的科技和趋势。

新的标记标准:CSS3 和HTML5

毫无疑问,在2010年中标记标准有巨大的发展。W3C理事会曾建议在几年之后最终确定CSS3和HTML5语言的地位(原本预计HTML5的地位最终会在2022年确立),可它们却已迅速成为新的标准。

澳门金沙30064在线网站 1

幸运的是。和IE9一样,当今的浏览器如Safari、Chrome、 Opera、
Firefox,都意识到了CSS3和HTML5对于移动平台和传统电脑桌面的的价值。它们都进了一步,将CSS3和HTML5投入应用,而不再只是做为样本。

对我而言,当看到2010出版的相关书籍,不少关于CSS3和HTML5的文章标题,如《无情的网页设计业》,
《网页设计者的CSS3》和 《网页设计者的HTML5
》时,我能总能感觉到一些更为切实和权威的意味——这只是冰山的一角。

澳门金沙30064在线网站 2

伴随对新语言的性能进行的无数实验和概念验证,网站设计者和浏览器供应商有了新的觉悟,这也把他们引入了主流。

也许开始赢得众多怀疑论者的是这些新规范在IE9中的应用——在最常用的浏览器中的重新运用——结果很受欢迎。微软浏览器的标准基于(大部分)其它浏览器供应商正在使用的标准,这意味着CSS3和HTML5在现今的项目中还是可以用的。

澳门金沙30064在线网站 3

IE9或许还不能支持CSS3和HTML5的所有特性,如你在谷歌浏览器和火狐浏览器中所看到的那样,但微软的工程师的确已经做出了很大转变,朝正确方向的转变。

即使在得到各种浏览器的全面支持之前,JavaScript助手资源库也扮演了很重要的角色,使得我们可以使用新CSS和HTML的特性。开放源代码项目如:Modernizr,HTML5
shiv, 和 HTML5
Boilerplate继续帮助网页设计者和网络开发者通过这些新的标记语言标准日益提升其产品的性能,同时又能迎合那些已经过时的浏览器。

网页排版

澳门金沙30064在线网站 4

使用CSS @font-face规则排版对网页设计也有很大的帮助。新的网络服务如Google
Font API 和Font
Deck,以及原有的TypeKit使得设计者可以跳出原来少量的网络安全字体的限制而有了更多的选择。

移动互联网

澳门金沙30064在线网站 5

2010年1月17日,苹果公司发布了iPad。iPad、笔记本电脑、MacBook
Air和Android
smartphones之类的超级便携电脑,使浏览器脱离了传统的静态桌面,转向沙发、机场休息室、火车及公园长凳上,实际上可以说是所有能接收无线网络信号的地方。

另一方面,去年有许多关于CSS3设计网页的讨论(和更多的应用)方面的媒体调查和反馈,使设计的网站可以在多种不同的平台展示。

通过设计iPad应用程序、设计现有网站的易用的移动版本、使用平果软件开发工具包设计iPhoner应用程序或利用开放的技术即设计HTML5
语言的iPhone程序, 很多设计者已经进入移动网络领域。

社交网络

2010年网络社交继续发展,甚至还有一部关于网络社交的电影!毋庸置疑现在网络社交比任何时候都要流行。对很多人而言,Facebook就是因特网。

我们已经看到了网络社交的文化效应,如某人网上的推特,还有Gap,这个国际大公司在Twitter和Facebook用户公开批评其选择后改换了公司标志。

有人说,并不是所有的网络社交理念都实现了, Google Wave做到了,谁不同意?

JavaScript

如果我问你在去年JavaScript做为一种标记语言发生了哪些变化,你或许发现并没有多少。新的JavaScript在开发方面的进展有些让人失望,尽管ECMAScript
5让人看到了JS引擎在现代浏览器中局部地应用(如FireFox)。

无论怎样,在去年通过做为CSS3和HTML5的业务引擎,JavaScript已为网页设计者和网络开发者所熟悉。JavaScript是HTML5中许多令人兴奋的功能的驱动程序,
如canvas的APIs, 音频, 视频,
网络存储等。我们可以看到服务器端面脚本语言在项目中的应用(如node,
JS)使客户端和服务器端和服务器端面实现无缝对接。

简而言之,JavaScrip比以往更流行了。Promote
JS之类的项目对做到更好的文件编制有所助益并且激发了对JavaScript的讨论。

2010年下半年涌现出大量的新的JavaScript的博客,同时原有的博客的关注度也大为提高。JavaScript周刊等通讯刊物高调报道了关于JavaScript的相关新闻。

澳门金沙30064在线网站 6

JavaScript在新闻报道中被提及的次数较之2010年以前大为增加(通过Google
Trends
的统计可以看出),这一数据证明了JavaScript在主流设计领域中正日益流行。

原文:sixrevisions  译文:王五

 

赞 收藏
评论

澳门金沙30064在线网站 7

GoogleSuggest 使用 AJAX 创造出动态性极强的 web
界面:当您在谷歌的搜索框输入关键字时,JavaScript会把这些字符发送到服务器,然后服务器会返回一个搜索建议的列表。

 

当把这段CSS代码应用于HTML中,它会找到id为“hello”的HTML标签,将其中的内容以蓝色显示出来;具体的插入HTML的方法这里不再赘述(说一句,只说明是什么,有什么用的问题,不关注技术细节,技术细节网上很好找)

DHTML
只是一种制作网页的概念,实际上没有一个组织或机构推出过所谓的DHTML标准或技术规范之类的。DHTML不是一种技术、标准或规范,DHTML只是一种将目前已有的网页技术、语言标准整和运用,制作出能在下载后仍然能实时变换页面元素效果的网页的设计概念。DHTML就是动态的
html,Dynamic
HTML。传统的html页面是静态的,Dhtml就是在html页面上加入了javascript脚本,使其能根据用户的动作作出一定的响应,如鼠标移动到图片上,图片改变颜色,移动到导航栏,弹出一个动态菜单等等。

在AJAX中,xmlhttp用来在不改变页面的情况下传输数据,其中传输的数据即是XML,然后通过XSLT将其格式化,利用js通过dom对象将其显示到HTML中,同时利用CSS确定数据的显示及位置。

CSS代码:

    <script>  
    window.onload=function hello(){  
          document.getElementById("hello").innerHTML="Hello China!";  
    }  
    </script>  

网页文件本身是一种文本文件,通过在文本文件中添加标记,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。

    function jsHello(){  
           alert('Hello World!');  

    }  

 

XML代码如下:

 

JavaScript
是一种基于对象(Object)和事件驱动(EventDriven)并具有安全性能的脚本语言。使用它的目的是与HTML超文本标记语言、Java脚本语言(Java小程序)一起实现在一个Web页面中链接多个对象,与Web客户交互作用。例如可以设置鼠标悬停效果,在客户端验证表单,创建定制的
HTML页面,显示警告框,设置cookie等等。

你便可以通过利用DOM对象构造如下代码并插入到HTML代码中的任何位置来实现

 

XSL-
FO:XSL在转换XML文档时分为明显的两个过程,第一转换文档结构;其次将文档格式化输出。这两步可以分离开来并单独处理,因此XSL在发展过程中逐渐分裂为XSLT(结构转换)和XSL-FO(formattingobjects)(格式化输出)两种分支语言,其中XSL-FO的作用就类似CSS在
HTML中的作用。

现在的绝对多数浏览器都增加了对XmlHttp的支持,IE中使用ActiveXObject方式创建XmlHttp对象,其他浏览器如:Firefox、Opera等通过window.XMLHttpRequest来创建xmlhttp对象。

铺垫终于完了,在进入正题之前,建议大家对比着图来理解后边的内容,废话不多说,开始进入正题。

AJAX:异步JavaScript和XML(AsynchronousJavaScript and XML)

 

 

澳门金沙30064在线网站 8

当把以上代码应用于HTML代码,它会在你的HTML载入时,弹出一个内容为“HelloWorld!”的对话框。同样,它是通过嵌入或调入在标准的HTML语言中实现的,至于如何嵌入或调入不再赘述,理由上面提到了。

 

 

<Hello>  
<bcd>China</bcd>  
<bcd>USA</bcd>  
<bcd>UK</bcd>  
</Hello>

 

 


XMLHTTP最通用的定义为:XmlHttp是一套可以在Javascript、VbScript、Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API。XmlHttp最大的用处是可以更新网页的部分内容而不需要刷新整个页面。

 

 

浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容

 

XSLT(eXtensibleStylesheet
LanguageTransformation)最早设计XSLT的用意是帮助XML文档(document)转换为其它文档。但是随着发展,XSLT已不仅仅用于将XML转换为HTML或其它文本格式,更全面的定义应该是:XSLT是一种用来转换XML文档结构的语言。

XML的起因是,用户受到SGML(后面再说)复杂性的挫伤和HTML的不充分。相对HTML来说,XML更追求严谨性,如果说你在HTML代码中标签比较混乱,如未关闭等,或许浏览器会忽略这些错误;但同样的事情发生在XML中会给你带来大麻烦。

 

XHTML 是可扩展超文本标识语言(TheExtensible HyperText
MarkupLanguage)。HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言,看起来与HTML有些相象,只有一些小的但重要的区别,XHTML就是一个扮演着类似HTML的角色的XML,所以,本质上说,XHTML是一个过渡技术,结合了部分XML的强大功能及大多数HTML的简单特性。

 

JS的代码如下:

这里的DOM指的是HTMLDOM。HTML
DOM是W3C的标准,同时它也是HTML的文档对象模型的缩写(the Document Object
Model
forHTML)。HTMLDOM定义了用于HTML的一系列标准的对象,以及访问和处理HTML文档的标准方法。通过DOM,可以访问所有的HTML元素,连同它们所包含的文本和属性。其中的内容可以修改和删除,同时也可以创建新的元素。HTMLDOM独立于平台和编程语言。它可被任何编程语言诸如
Java、JavaScript和VBScript所使用。HTMLDOM就是HTML语言对外界开通的接口,以便其他语言能够访问或修改HTML内部的元素。

 

总结:终于完了,本文主要探讨了Web开发技术之间的关系,以及他们组合起来到底有什么用的问题。这篇文章总结得挺不容易的,期间参考了不少别人的东西,包括:W3CSchool在线教程,《BeginningXML
With DOM and
Ajax》,《Javascript基础教程》,《css2.0中文手册》,还有一些大牛的博客,这里就不一一罗列了。希望对挣扎在Web开发学习前线的朋友有所帮助。如果有什么不够准确的地方,请大家斧正。

 概括,HTML就是整合网页结构和内容显示的一种语言。

 

 

Xml 可扩展标记语言 (Extensible
MarkupLanguage),是一套定义语义标记的规则,这些标记将文档分成许多部件并对这些部件加以标识。它也是元标记语言,即定义了用于定义其他与特定领域有关的、语义的、结构化的标记语言的句法语言。你可以把XML理解为一种数据库,例如rss就是xml的一种变体。

一个简单的定义IE的xmlhttp的对象及应用的实例如下:

 

 

 

 

我们看<p>标签上有一个id,这是这个<p>标签的唯一标识,方便别人找到它,对它进行操作。

 

在这里,我争取用最根本的语言向大家分别说明HTML,CSS,XML,JS到底是什么,有什么用。然后我们再来看把他们组合起来是什么,有什么用。当然如果你对HTML,CSS,XML,JS有足够了解,可以直接跳过,看文章的后半部分,那里才是本文核心所在。

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图
Copyright @ 2010-2019 澳门金沙30064在线网站 版权所有