Archive for the ‘技术支持’ Category
2010 年的 Web 会是什么样,或者说,未来的 Internet 意味着什么,2010 会是值得关注的一年。本文从 5 个方面展望 2010 年的 Web,包括 HTML5,CSS3,字体服务技术;浏览器;社会媒体;JavaScript 框架;以及 SAAS。

1. CSS3, HTML5 以及 字体服务

CSS3,HTML5,以及 Typekit 一类的字体服务,将给 Web 设计师带来更多自由。
CSS3 的新功能会让 Web 内容的展示变得更容易,从多背景图,到更强大的选择器,到颜色渐变,到圆角,这一切都让原先复杂的工作变得简单。
HTML5 虽然进展缓慢,但必将改变我们描述页面的方式,成为通往语义 Web 的重要阶梯,为 Web 带来真正的本地多媒体支持,并改善我们同 Web 内容的沟通。
而 Typekit 一类的字体服务联同 @font-face ,将允许我们在 Web 页面上使用任何字体,设计师们不必再依赖 CSS 背景图,JavaScript 或 Flash。
这意味着什么?
这些新技术将为 Web 世界带来新的美学体验,当然,也会引发新的滥用潮,那些蒙古大夫式的设计师将会大量使用各种花里胡哨的字体和渐变色,使他们的页面变得难以访问,对专业的设计师而言,这些新功能会让他们的创意更吸引人。
延伸阅读:
- Typekit
- CSS3.info
- Play around with CSS3
- Get Ready for HTML 5
- 5 Exciting Things to Look Forward to in HTML 5 (Six Revision 主编 Jacob Gube 撰写)
2. Web 的消费方式

浏览器领域重新繁荣,诸如 Google Chrome, Firefox, Safari, Opera 一类的浏览器大行其道,用户如今拥有更广泛的选择,厂商之间的竞争更加激烈。浏览器之战进入新的阶段,和过去不同,过去的浏览器之争是微软主导并最终将对 手消灭,新的浏览器之争使 IE 身涉危境。
人们消费 Web 的方式也在改变,上网不再意味着坐在电脑桌前打开电脑,智能手机越来越普遍,电视可以上网,SP3 之类的游戏机,上网本,iPhone,Android 设备都可以在一个相对小的屏幕上给用户带来上网体验。
浏览器本身也在改变,Google Chrome 将 WebKit 引擎,将大部分 CSS3 和 HTML5 功能从苹果迁移到 Windows,Google 在未来几年的目标是争取到 10% 的市场份额,这将撼动 IE 的统治地位,在德国,Mozilla Firefox 已经在超过 IE 成为主导浏览器。
这些因素也将改变我们对 Web 设计以及可访问性的看法,你的站点是否有一个移动版本?它们在小屏幕上看上去如何?在一个很大的屏幕上看上去又如何?在 Weibit 引擎,或是 Gecko 引擎,或是 Trident 引擎上看上去是否一致?
人们对在不同设备上访问 Web 的观念也在改变,设计师们逐渐意识到,没必要在各种不同设备上输出相同的页面,也无需为不同的设备提供相同的用户体验。
这意味着什么?
人们将发现 Web 在不同的浏览器上有不同的样子,诸如渐进式增强的 Web 技术越来越普遍,为不同 Web 用户提供不同的体验。同时,放弃对陈旧浏览器的支持也逐渐为人接受,让用户将压力推向浏览器厂商而不是设计师。另外,人们会将注意力转向内容,功能,可访问性,并注重设计和创意。
3. 社会媒体

没有人会否认,2009年是社会媒体极其重要的一年,比如, Twitter 已经成为热门话题,它还会继续热门。诸如 Twitter, Facebook 一类的平台的发展使 Web 逐渐成为社区导向的 Web,毫无疑问,社会媒体会有大的变革且会实现盈利。
围绕着社会媒体的一个问题是,如何衡量它的价值并获得这份价值。1000个 Twitter 跟随者价值几何?他们是否将为此收费?在2010年,对这类问题的解答将导致社会媒体的大变革。
伴随着这些变革,信息的实时获取将成为焦点,Google 已经在讨论针对 Twitter 等平台进行实时搜索的问题。这些改变如何同现有的系统,尤其是搜索引擎技术集成,将引发一些技术革新。
这意味着什么?
随着越来越多的人参与 Web 信息的创建,我们获取信息的方式将从过去的单一来源向更社区化的来源转变,假如我们要搜索修车行,我们会看到修车行最新的 Twitter 或 Facebook 消息而不是那些过时的静态内容。
4. JavaScript

当 CSS3 和 HTML5 开始涉足 JavaScript 的地盘,JavaScript 本身也向 Flash 逼宫。诸如 jQuery 一类的框架使富客户端,异步与无缝用户体验变为现实,Web 应用的开发变得更简单,并引发竞争和创新。
JavaScript 已经可以帮我们实现过去只能靠 Flash 实现的东西,如交互式游戏,复杂的交互式数据可视化技术,也使那些富客户界面,Flash 式体验变得更具可访问性。
最近,已经 10 年没有升级的 JavaScript 也迎来了它的一次重要升级 (中文),一旦浏览器厂商们吸纳了这些标准,Web 开发者们将拥有更强大工具来创建 Web 应用。
这意味着什么?
随着 CSS3 和 HTML5 开始涉足一些 JavaScript 的功能(如复杂对象的选取,动态圆角,实时可编辑页面),JavaScript 将趋向于用来处理 Web 应用与客户端的程序逻辑。JavaScript 的最新升级将使 Web 应用之间更容易相互操作(JavaScript 的这次升级的一个主要目标是实现 JSON 对象的安全细则)。
5. SaaS – 软件即服务
SaaS (软件即服务)已经不新鲜,象 37 Signals,Google Enterprise 一类的 SaaS 越来越普遍。竞争会越来越激烈,引入门槛低,那些小厂商将有机会和大厂商展开竞争,2010年,我们会看到这种竞争加剧并带来 Web 应用的创新。
这意味着什么?
SaaS 商业模式会继续取代传统软件的位置,随着上网的人越来越多,人们需要的是基于 Internet 可以相互操作的系统。
延伸阅读
- Creating a Timeless User Experience
- 10 Useful Gadgets for Mobile Computing
- 10 Simple Web Accessibility Tips You Can Do Today
- Related categories: Web Development and User Interface
关于作者
Dave Sparks 是一位 Web 设计与开发工程师,现居 Lake District 的 Kendal,就职于 Armitage Online (偶尔自由职业)。擅长 PHP 开发。他的博客为 Kamikazemusic.com,Twitter 为 twitter.com/dsparks83。
关于译者
刘清涛(35公里),CSDN特约记者,Web开发与设计师,COMSHARP CMS 开发成员,热衷 Web 技术,长期译介海外最新 Web 相关的技术文章与资讯,在 CSDN 开有专家博客。
缤纷桌面是一款小工具,它可以Bing首页每日图片设置为桌面背景,还能帮你自动保存当天的桌面背景图片,和随机使用已经保存的历史图片。支持所有Windows操作系统;具备每天自动更换Windows桌面壁纸的功能,其缤纷夺目的图片来自搜索引擎新贵-微软的www.bing.com首页。
用户除了能够欣赏到超酷的图片壁纸外,还能每天看到bing首页图片背后的小故事。
Bing自推出以来,其独特的图片故事吸引了不少用户驻足,其每天数张的精美图片中,更是不乏可作为壁纸的精品。
有鉴于此,Bing官方推出了一款有意思的小工具-缤纷桌面,它可将Bing首页每日图片设置为桌面背景,还能自动保存当天的桌面背景图片,甚至可以随机使用已经保存的历史图片作为桌面。

软件完全绿色,解压缩后,即可运行,而且简单的连主界面都省了,透过简单的设置界面,软件功能也一目了然。
喜欢Bing的用户不妨体验一下缤纷桌面,或许它可以让您的桌面更美丽。
在Web编码中,CSS默认应用的Web字体是有限的,虽然在新版本的CSS3,我们可以通过新增的@font-face属性来引入特殊的浏览器加载字体,但多数情况下,考虑各个因素的影响我们还是在尽量充分利用这些默认调用的字体实现CSS的编写,这里整理了19个Web安全字体,让你无需任何顾虑的情况下畅快使用。
1, Arial
微软公司的网页核心字体之一,最常用的sans serif字体,当字号很小时不容易阅读。但是,大写的“I”和小写的“l”是无法区别的,你可以考虑用Tahoma字体来替代。
(苹果系统没有这种字体,但有一种对应于Arial的字体叫Helvetica,它是MAC机上与Arial 字体最相似的WEB字体,是别一种非衬线字体.它是一种性能优良的打印字体,但在屏幕上表现不是很好,说道Helvetica字体,昨天发现了很多有意思的站点,主要是纪念Helvetica字体诞生50年而设的。)

CSS写法:font-family: Arial, Helvetica, sans-serif;
2, Arial Black

CSS写法:font-family: ‘Arial Black’, Gadget, sans-serif;
3, Arial Narrow

CSS写法:font-family: ‘Arial Narrow’, sans-serif;
4, Verdana
微软公司的网页核心字体之一,微软公司专门为屏幕显示而开发的。应用广泛。易于阅读。是显示器中最清晰的字体,即使字号很小,也很容易阅读。半肥猫比较喜欢采用10PX的Verdana来做英文正文字体,也推荐大家使用,但字号最好介于10~14像素之间,超出这个范围就不好看了。

CSS写法:font-family: Verdana, Geneva, sans-serif;
5, Georgia
微软公司的网页核心字体之一,可用性好。可读性比Times New Roman强。是网站设计中,浏览效果最好的serif字体,因为它是专为网上阅读设计的。)

CSS写法:font-family: Georgia, serif;
6, Times New Roman
微软公司的网页核心字体之一,可能是最常用的serif字体,是网站浏览器默认的字体,12pt以上的字体容易阅读,但小字号的字体易读性差。(苹果系统没有这个字体,有一个对应于Times New Roman的字体叫Times)

CSS写法:font-family: 'Times New Roman', Times, serif;
7, Trebuchet MS
微软公司的网页核心字体之一,与Arial相似,半肥猫觉得:Trebuchet MS比Arial看起来优雅、古典一点。可以用来做标题,但小字号阅读起来会很困难(低于13PIX阅读起来就很累了,不太推荐用来做正文字体)。在苹果系统上也可以用Helvetica做替代。

CSS写法:font-family: 'Trebuchet MS', Helvetica, sans-serif;
8 , Courier New
微软公司的网页核心字体之一,老式打印机字体,有一种独特的机械工整感觉。呈现计算机编码时,还会用到这种字体。12 pt的Courier New字体曾是美国国务院的公文标准字体,但于2004年1月停用,改使用14 pt的Times New Roman,因为其具“现代性”和“易读性”。

CSS写法:font-family: 'Courier New', Courier, monospace;
9, Impact
微软公司的网页核心字体之一,Impact是1965年发表的一个无衬线字体,其特粗的笔画、紧缩的间距。半肥猫觉得:字体较为粗犷,适合使用在标题上,而不常用在内文。

CSS写法:font-family: Impact, Charcoal, sans-serif;
10, Comic Sans MS
微软公司的网页核心字体之一,手写体。这是一种争议很大的字体,讲实话,半肥猫也不喜欢这个字体,一点美感都没有,不过在一大堆规规矩矩的字体里面,有这么一个随意性比较的字体,可以变换一下口味,也算不错吧,建议不要用在正规的金融、政府、商业机构站点。

CSS写法:font-family: 'Comic Sans MS', cursive;
11, Tahoma
Tahoma是一个十分常见的无衬线字体,Tahoma和Verdana师出同为名设计师马修·卡特的作品,由微软在1999年推出,被采用为Windows 2000、Windows XP、Windows Server 2003等系统的默认字型。半肥猫觉得:它的字体结构和Verdana很相似,其字符间距较小,用来作为标题,效果好过Arial(Tahoma的大写I 和小写l比Arial容易识别),但如果作为正文,他的字号不能小于13PIX,否则很多笔画粘连到一起,不利于阅读。

CSS写法:font-family: Tahoma, Geneva, sans-serif;
12, Courier
Courier是一个等宽字体的粗衬线字体,主要是依据打字机所打印出来的字型来设计。原来Courier New的字体是IBM公司在1950年代设计给打印机使用的字体,后来这个字型成为整个打字机制造业的标准。Courier New是Courier的变体,比Courier更具机械味道。

CSS写法:font-family: Courier, monospace;
13, Lucida Sans Unicode
是一种OpenType型的无衬线字体 。1993年制作并随微软公司的Windows NT 3.1操作系统发布。有较大的x字高,具有很好的可读性,被广泛用于显示、出版等各种用途。
它支持Unicode2.0版本的基本字符,包括拉丁字母,希腊字母,西里尔字母,希伯来字母,以及国际音标字符。该字体是首个 Unicode代码的字体, 该字体从Windows 98开始一直作为系统预装字体发行。
后来发布的 Lucida Grande字体作为苹果公司Mac OS X系统的默认字体发布。
CSS写法:font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
14, Lucida Console
同Lucida Sans Unicode类似。

CSS写法:font-family: 'Lucida Console', Monaco, monospace;
15, Garamond
Garamond(加拉蒙德)是一类西文衬线字体的总称,自16世纪40年代开始至今,有很多家公司和很多设计师参与到Garamond字体设计,如: Adobe Garamond, Monotype Garamond, Sioncini Garamond,和 Stempel Garamond等等。半肥猫觉得:字体给人端庄典雅,有些古典的感觉,在博物馆和历史性悠久的项目中使用,应该可以获得不错的效果。

CSS写法:font-family: Garamond, serif;
16 , MS Sans Serif
微软系统自带字体。屏幕显示的像素字体。非衬线字体。

CSS写法:font-family: 'MS Sans Serif', Geneva, sans-serif;
17 , MS Serif
微软系统自带字体。屏幕显示的像素字体。衬线字体。
CSS写法:font-family: 'MS Serif', 'New York', sans-serif;
18, Palatino Linotype

CSS写法:font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
19, Symbol

CSS写法:font-family: Symbol, sans-serif;
20, Bookman Old Style

CSS写法:font-family: 'Bookman Old Style', serif;
本文参考了WEB安全字体,希望在Web编写过程中这些核心的Web字体能对你有用。
WordPress 默认状态下是不提供压缩代码输出到用户浏览器的,但只要简单的几行代码就可以达到我们需要的压缩输出的目的了,甚至可以压缩尽75%的内容。
首先,我们要做的就是检测自己所用的主机是否支持zlib(一个比较通用的压缩库,通过在程序中引入zlib,可以方便的对数据进行压缩),把下面的代码复制到一个新建的.php文件中,不妨叫它为test.php。
<?php phpinfo(); ?> |
把test.php页面上传到你的主机,在浏览器中运行这个页面,看看参数中是否支持zlib。我所在的空间显示如下:

如果确定主机支持zlib,那么你可以继续往下做了。
把下面的代码复制到你主题的header文件中,在DOCTYPE之上。
就是这些,之后去Port80Software.com上看看是否压缩输出了吧。文章译自wprecipes.
负责Web编写的前端人员,都清楚可以通过W3验证服务功能,来在线验证自己编写的XHTML代码是否正确,在验证期间,最容易出现的错误往往都是在最简单以至容易忽略的地方,以下就是在日常的验证过程中最容易出现错误的几个总结。
![]()
1, 没有为<img>添加 alt=”” 属性
错误写法:<img src="" />
正确写法:<img src="" alt="" />
2, 没有闭合的标签
XHTML规范中有一条标准就是“每个XHTML标签都有一个结束标记”。那么对于HTML中原来不带结束标记的元素,则在该结束前加上“/”来关闭这个标签。
像 <img> , <br> , <meta> 等标签就需要这样闭合
- <img />
- <br />
- <meta />
3, 大小写敏感
XHTML 区分大小写,而且XHTML中所有的标签必须小写。
错误写法:<META name=”y_key” content=”www.bbon.cn “>
正确写法:<meta name=”y_key” content=”www.bbon.cn” />
4, 未使用引号括包含属性值
XHTML中所有的属性值必须使用英文双引号括起。
错误写法:<div>
正确写法:<div class=”header”>
5, 元素嵌套不规范
这类错误虽然出现的频率不多,但却也是最难发现的问题,正确的元素嵌套是在日常手写代码过程中,逐步培养成的好习惯。
错误写法:<strong><em>…</strong></em>
正确写法:<strong><em>…</em></strong>
