Showing posts with label web. Show all posts
Showing posts with label web. Show all posts
Tuesday, August 18, 2009

Ten web sites ten years ago


今天,SitePoint上有一篇文章,回忆了10年前的10个网站,我觉得很有趣。
1999年其实是很不平静的一年。一方面,网络时代即将到来,新技术纷纷萌芽,未来充满憧憬;另一方面,空气中弥漫着一股世纪末的气氛,报纸上都在谈论千年虫(Y2K),人们心中惴惴不安。
下面是当时的一些主要网站。
即使那时,苹果公司的网站就已经鹤立鸡群,非常简洁和美观。
正在提供IE 5.0的下载。
网站目录还是当时最受欢迎的服务。
克林顿时代的白宫网站,竟是如此简陋。
一个刚刚问世的新搜索引擎。
新浪从一开始就是以新闻为主。
7. 搜狐
1999年,张朝阳回国刚满三年,主攻中文网站目录,那时候百度还没成立。
8. 网易
那时候网易一点特色也没有,都忘记了它是怎么崛起的(应该是电子邮件吧)。
我的第一笔网上交易,好像就是在8848上买书。当年那是一个多么显赫的网站啊!这里有一篇《2000年:将要倒闭的十大网站》,你还记得几个?
1999年,我上网通常干三件事,到水木清华BBS灌水,到fanso.com(化云坊)下载歌曲,到chinaren.com下棋。俱往矣。
Wednesday, April 8, 2009

Web Trends Map

信息结构公司iA 刚刚发布了最新的测试版网络趋势地图。该地图每年发布一次,形象地展示了重大网络趋势、产品、公司和人物。

今天该地图也包括了读写网,这让我们感到非常荣幸。你可以在Flickr上看到完全展开的地图,也可以在zoomorama.com看到可缩放地图。附录:2008年互联网发展趋势交通图的beta版本

Wednesday, December 31, 2008

The Golden Ratio in Web Design


在 nettuts.com 上看到一篇文章名叫“Web设计中的黄金分割”, 作者是Jarel Remick 原文是英文, 由于文章有很多学术上的词汇,所以在这里我翻译成中文,便于大家理解:



数学是优美的. 听上去有点奇怪? 当我第一次开始设计的时候,我确信如此。数学如此刻板乏味。你可能会惊讶的发现,最美观的设计,艺术作品,物体,甚至人都有数学上的共同点。尤其是黄金分割,也被称为神之比例,希腊字母表示其为 Φ (phi). 本教程会剖析一个网站的布局,以及如何对其黄金分割。

网页骨架


这些是web页面的主要元素。有很多不同的方法去组织它们,但是这种布局也许是最常用的。

Container

所有的web页面都用一个container,主要是为了同一个目的:去包含一些页面元素,然而这个方法实现各有不同。例如,body标签或者是最常用的div。甚至于过去常用的table(不要使用table作为你的container,这是一个破方法)。想想container作为你房子的外墙,里面包含卧室,厨房,起居室等等。
container的类型:
  1. Liquid: 根据浏览器宽度填充。
  2. Fixed: 指定的宽度,并不会根据浏览器宽度改变。

Header

header并不真的是一个特定的元素,尽管某些人会认为它是。它更多是用在涉及到你放置你的logo,导航栏,tagline的web页面顶层的地方。许多人更愿意把这些元素包含在一个div里以方便使页面样式和内容分离。header会被视为一个container,所以它有两种类型选择,就是上文提到的 liquid 或 fixed 。

Logo

你的logo是你的身份和品牌。最常用的是把logo放在你header的左上角。我们的阅读习惯是,从左往右,从上至下,所以你的log应该放在访问者第一眼能看到的地方。

Navigation

页面导航是最重要的元素之一;你的访问者需要用它来使用你的站点。 它应该是容易被找到且易用的,这就是为什么大多数的人把它放在header部分,最少也是在页面顶端附近的原因。
 navigation类型:
  1. Horizontal: 水平显示,被称为‘navigation’。
  2. Vertical: 垂直显示,被称为‘menu’

Main Content

每个人都(应该)知道,内容才是王道!当人们来参观你的站点,这是他们想看的主要元素。它应该是web页面的焦点,所以参观者才能快速找到他们想要的。

Sidebar

sidebar是放置你次要内容的元素,像一些广告,站点搜索,订阅链接(RSS, Twitter, Email, 等), 联系方法等。这个元素不是必需的,尽管右很多站点用它。它大多数是放在右边的,但是你也能把它放在左边或者两边,只要不扰乱主要内容的浏览就行。网站使用横向或纵向导航,sidebar往往是用纵向导航。

Footer

web页面的尾部总会有一个页脚,让您的访客知道他已经到达了你web页面的结束部分。和heaser一样,footer也不是一个特殊的元素 。在你的页脚里包含版权,法律声明以及主要的联系方式。包含一些重要的链接是个好主意,比如home page, contact page, 等. 有些网站用这个区域提供一些相关材料或者其他重要信息。

"Whitespace"

你可能有强烈的愿望去填充这些页面上的空白,但是请不要这么做。“空白”也是相当重要的。你可以看看NetTuts网站是如何有效的使用空白区域的,创建了页面平衡给人一个好的感觉。
以上是web页面的骨架,现在我们来看如何黄金分割这些元素。

黄金分割和使用网格(Grids)

还记得之前我说数学是美丽的吗?我们认为视觉的吸引力是基于比例的(比如,黄金分割)。几千年来,艺术家,设计师,建筑师等都有意无意的在使用了一个共同的比例来增加他们作品的美感。这个神奇的数字是什么呢? 1.62 (实际是 1.618...) 我不会说这个数字的起源,但是我会告诉你如何使用它。
使用黄金分割是非常简单的。比如你像找到你主要内容和sidebar列表的宽度。你将使用你内容区域总的宽度除以 1.62. 然后得到555.55px. 我们不需要那么精确,所以我们就用555px。现在你就知道你的主要内容元素是555px的宽度,你的sidebar是345px。看看多么容易?!
但是等等先,乐趣不止于此!你也可以应用黄金分割到其他元素的宽度和高度。

Using Grids

如果你和大多数的人一样,不想每次都抱着个计算器来计算这个黄金比率。那么最简单的方法就是用grid。所以你需要做的就是把你的宽度或是高度分成三分。
要产生更详细的gird,只需要继续三等分就行。如果你读了前一篇文章“与Blueprint CSS框架的亲密接触”的话,你会看到Blueprint CSS框架用了一个详细的gird系统。 不仅仅是gird设计更容易更快,而且它也创建了一个美观的布局。如果你还没有使用gird设计,那么这是一个很好的尝试机会。你可以为fireworks,photoshops或者其他软件从 http://960.gs下载grid模板。
正如你看到的,NetTuts很好的遵循了黄金比率。顶端三分之一的网页再次分成了三分,非常接近黄金比率。难怪NetTuts的设计是如此吸引人!
如果你要做一个新的设计,我严重推荐你找一些流行的站点,评价他们的布局,以及如何应用黄金比率和gird。然后花一些时间去实践使用黄金分割,并在你的布局上面使用gird。
Sunday, November 30, 2008

10 milestones in web history

Web发展史是一部绵长的长篇巨著,有很多值得我们铭记的章节,这里只从中精选出十件意义重大的事件,它们给我们的生活和工作带来了极其深刻的影响。

1、感谢Linus Torvalds,感谢Linux
当Linux Torvalds在1991年推出Linux时,其他UNIX系统开发人员对他冷嘲热讽,一些人认为Linux所使用的计算机构架(32位)是错误的,其 基础结构就是完全错误的。在这些批评面前Torvalds丝毫没有退缩,时至今日,Linux不仅在PC主流操作系统中占据一席之地,也成为一款真正优秀 的Web服务器系统。Torvalds发布这个软件基于GNU开放许可证,这也使得Linux能够迅速地传播和成长。
Linux是互联网的核心:几乎所有的Web主机都使用或是支持Linux,它拥有庞大、忠诚的用户群,作为开源的典范,它促进了Web在大众间的普及。


2、Mosaic浏览器的推出

如果当初没有Mosaic浏览器,互联网将不会在这么短的时间内吸引如此多的用户。作为第一个真正的浏览器,在1993年发布的Mosaic开始支 持书签、图标和流畅的用户界面,还有在当时最令人惊叹的创新:图片支持。从那时开始,互联网才能提供图片下载服务。也正是得益于这一功能的推出,互联网改 头换面,迅速为主流人群接受。
可以这样说,是Mosaic改变了网络数据传输的方式。没有它,整个Web的发展将踏上一条完全不同的道路。


3、W3C发布CSS规范

1996年,世界万维网组织(W3C)发布了首个CSS规范。CSS改变了Web开发的方式,允许开发者轻松调用外部样式表,使得在短时间内改变整个网站的设计成为可能,而且不需要到每个HTML页去寻找需要修改的文本元素。
感谢CSS,正是因为它,网站开发和维护才变得如此简单。


4、开源的正式启动
开源由来已久,只是没有正式的定名,其根源可以追溯到二十世纪60年代,因特网就是在开源的帮助下创建的。1998年在Tim O'Reilly的“Freeware Summit”会议上,“开源”一名被正式确立,并正式启动了开源计划,一些相关的许可协议发布,开发商从此可以自主发布和修改源代码。
开源以软件的形式使现代的大多数网站都从中得益,单单看Wordpress、Firefox、PHP和Linux对Web的发展和浏览器的影响,我们就能窥见开源对网络的影响了。


5、Rasmus Lerdorf推出PHP
多亏了开源,像PHP这样的动态语言才可以在开发者之间自由传播。PHP几乎可以看作是Web编程中最流行的语言,目前运用在2000多万网页和100多万个Web服务器上。
1995年Rasmus Lerdorf首次推出PHP之后,它就迅速风靡起来,别众多开发人员评为优秀的Web编程语言。它运行在服务器上,可以嵌入HTML,与SQL数据库之间实现完美衔接,允许开发人员快速创建、维护复杂的动态交互性站点。



不论是现在还是从前,很多互联网上大型的站点都是基于PHP语言的,比如Facebook、雅虎、维基百科等。同样,这一便捷的语言也被应用于很多流行的网络应用软件的开发,比如Wordpress、Drupal、phpBB等等。

6、PayPal的创立
虽然争议颇多,但PayPal确实开创了在线金钱交易的先河。它创立于1998年,之后受到越来越多的eBay用户的欢迎,到2000年2 月,PayPal在eBay上每天能完成高达200000次的交易,在eBay收购Palpay之后,这一支付处理系统开始允许商家使用自己的API,并 成为一种快速安全的交易方式。


7、Firefox的问世
随着网景的惨败,IE到2003年已经控制了浏览器94%的市场,这种一家独大的局面严重制约了互联网的发展,而且IE也变得懒惰起来,从IE1到IE6,几乎是每年更新一个版本,而IE6到2006年IE7的发布之间隔了足足5年。

2003年Firefox的发布再次引爆浏览器市场,它解决了IE中存在的大量缺陷,提供了分页浏览、拼写检查、Live书签等许多新的功能。对于所有Web开发人员,Firefox最吸引人的是它所采用的Gecko渲染引擎。
如今Firefox已经可以和IE分庭抗礼了,也在无形中大大促进了互联网的发展,并将浏览器带到了一个百花争鸣的时代。


8、Ruby On Rails的崛起
很多人也许没有注意到Web发展史上这个里程碑式的事件,但这并不影响Ruby On Rails的重要性,正式它体现了网站开发的一个翻天覆地的转变:架构的使用。
David Heinemeier Hansson在2004年发布了Ruby on Rails,从此,许多以其他语言为核心的Web开发架构也陆续被推出。RoR是一个model-view-controller架构,也就是说,它利用机架(scaffolding)和其他辅助方法来消除编程中的重复任务,这样就大大缩短了开发者的项目开发周期。
架构加快了开发工作进程,改变了Web开发的方式。 自那时起,各大网站便用Web架构来提供完整的Web服务。RoR在苹果操作系统Leopard中的使用也证明了它的日益强大和重要。


9、37 Signals推出Getting Real Ebook
在过去五年中,37 Signals一直是最受欢迎的we开发公司,不仅仅因为他们所开发的优秀产品,还因为他们作为现代Web开发的精神领袖所做的一切,包括对敏捷开发的支 持和拥护。他们的旗舰产品Basecamp是在第一个RoR版本基础上开发的,并直接推动了架构概念在2004年的产生。而37 Signals在2006年推出的Getting Real Ebook也使得敏捷开发概念最终流行了起来。
Web开发者也是从那时起开始了敏捷Web开发实践,并接受学习了Getting Real Ebook的理念。像Google和微软这样的大企业也逐渐接受了这一理念,减少繁文缛节,利用较小的团队在最短的周期内发布新产品。





10、Amozon推出云存储和云服务

随着2006年Amazon S3和EC2的推出,云存储和在线云服务开始真正被人们所理解和接受。使用Amazon提供的服务,企业仅需要支付他们实际使用的流量就可以了,免去了增加服务器所需的昂贵费用。云服务提供了一种更快速更便宜的选择来替代传统的Web服务器。
云服务的推出降低了踏入Web行业的门槛,也正是由于云计算的出现,突发情况对通信的影响也不再是问题,当机时间也差不多可以忽略了。现在,Web开发人员可以不必再受困于资金或是担心昂贵的服务器费用,只要有创意就可以开始创业,以最小的成本完成自己的理想。

Sunday, September 21, 2008

Web Developer Tools

作者:Klaus Komenda
英文原文:Collection of Web Developer Tools, per Browser
原文发现:译言-Collection of Web Developer Tools for major browsers

网站开发者的一大苦恼,就是有太多的浏览器要应付。幸亏世界上有一些聪明的人,能够研究出一大些方便编辑和调试网页代码的好工具。不过,要从不计其 数的小工具里面找出合适的可真不容易。这篇文章列出了几个最好用的web开发工具,并指导你快速地激活、安装、使用他们。 下面是工具列表:

浏览器 可用的工具 (括号中是应用范围)
Firefox
IE6, IE7
Opera
Safari

Google Chrome 刚刚上市, 我们期待它的开发工具.
Friday, April 11, 2008

Web Stats