101款web应用推荐 从思维导图到Bug跟踪(上)
随着web应用多样化的今天,很难选择,更不用说发现一个满足需求的自己想要的应用了。有太多非常棒的应用,其中很多将让你或你的事业受益。
从思维导图、设计,到开发协作,项目跟踪和财务,这101款很棒的应用,对于初创公司或商业公司一定会降低成本,提高生产率。
本文作为“101款web应用推荐”的上篇,介绍了从思维导图到Bug跟踪的基于web的应用。
思维导图
mindmeister
MindMeister拥有所有思维导图工具所需要具备的标准功能,唯一不同的是,它是在线的,且拥有良好的协作能力。
目前MindMeister提供免费版本,以及每月4美元拥有所有功能的付费版本,还有每月2.8美元的小组工具包。不过,对于普通用户来说,免费版也就够用了,免费版本的思维导图制作提供创建、分享、导入、导出和协作功能。
设计
inPreso
inPreso是一个可用来制作高效率多媒体演讲稿的出色工具。利用平面和立体的图案、特效、动画和高效能绘图等工具, 您的演讲将会更为精彩。
Pencil
Pencil 是一款开源的原型图绘制工具,手绘风格的,就像自己在纸上画的那样。Pencil 还可以用来绘制各种架构图和流程图,同时还提供 Firefox 的插件。
PROTOSHARE
创建网站原型的线框图设计工具。
iPlotz
iPlotz可以帮你迅速创建可点击导航的网站和软件应用的雏形和线框图。你可以邀请其他人给出意见,你还可以管理开发人员和设计人员的任务,创建新的项目。
gliffy
除了线框图设计之外,gliffy可以帮助你创建业务流程图、组织结构图和网络图。
HotGloo
HotGloo是一个易于且美观的网络线框应用程序,它可以帮助设计师创建一个在早期发展阶段的网站互动的概念原型,所有的操作所见即所得。
开发
Kodingen
Kodingen是个基于web的集成开发环境(IDE),支持写代码和应用的版本控制,支持语言包括Python, PERL, PHP, Ruby on Rails, Fast CGI等。
Bespin
Bespin 是由 Mozilla Labs 所推出的一个新项目,该项目旨在构建基于 Web 的代码编辑工具。Bespin 具有的一些亮点包括:支持语法高亮显示、能够实时协作编辑、集成类似 vi/Emacs 的命令行、高效的文件浏览器、可扩展、跨平台等。
更多基于云的IDE可查看 “5 Great IDEs to Start Coding in the Cloud“。
协作
Scribblar
Scribblar是一个简单而有效的在线协作工具,以创建协作房间 (Room)的形式可邀请同事和同学在线协助完成具体的项目。 Scribblar 是由专门从事于富媒体应用、社会性网站以及增值服务的 Muchosmedia 公司开发的一款在线协助办公软件。它提供了一种与其他人全方位接触与协同办公的方式,广义上讲,任何人都可以在 Scribblar 中轻松创建专属于自己团队的房间(Room),并邀请更多成员参加其中,以便针对具体的项目进行深层次的在线讨论与交流。Scribblar 为每个房间配备了用户列表、绘图工具、白板、文字/语音聊天以及文件传输工具等基本工具。另外,还必须指出的是,如果你购买了 Scribblar的PRO版本,将会获得更多的定制的功能,并提供给你可嵌入到任何页面中的JS代码。
Sync.in
Sync.in 是个基于web的word处理器,支持实时协作。
版本控制
Beanstalk
GitHub
GitHub可以托管各种git库,并提供一个web界面,但与其它像 SourceForge或Google Code这 样的服务不同,GitHub的独特卖点在于从另外一个项目进行分支的简易性。为一个项目贡献代码非常简单:首先点击项目站点的“fork”的按 钮,然后将代码检出并将修改加入到刚才分出的代码库中,最后通过内建的“pull request”机制向项目负责人申请代码合并。
Springloops
Springloops 是一个在线的源代码管理工具,主要针对 Web 开发人员与开发团队协作。允许多用户共同编写同一个代码项目,或者与大家共享你的代码,类似于 WIki 一样,会保存多个历史版本,不会丢失或覆盖、改变源代码档案。还支持管理人员设定协作者与访客权限,可以在同一个项目内快速协作,以及有力的保护。 Springloops 可以简单的提供开发者一个有效率的解决方案,减少重复性劳动,非常实用。
分析
Google Analytics
Google Analytics是个强大的流量统计工具,免费,好用。
Clicky
Clicky流量统计工具与Google Analytis很像,更强之处是支持实时流量分析。
GoingUp
使用Ajax,用户界面很炫,也是世界级的流量分析工具,同时也是个SEO应用。
Yahoo Web Analytics
雅虎流量统计,是个高度定制化、企业级的站点分析系统。
Omniture
Adobe所有,Omniture被大量的世界500强公司使用。
Compete
帮助你从点击分享中受益。
comScore
comScore是个市场调研公司,提供市场数据和服务,针对大公司。
Bug 跟踪
Elementool
Elementool 是个在线bug/问题跟踪工具。
JIRA
JIRA是集项目计划、任务分配、需求管理、错误跟踪于一体的商业软件。JIRA创建的问题类型包括New Feature、Bug、Task和Improvement四种,还可以自己定义,所以它也一是过程管理系统。Jira融合了项目管理、任务管理和缺陷管 理,许多著名的开源项目都采用了JIRA。
FogBugz
FogBugz是基于web的bug跟踪应用,它有一组非常好用的插件,推荐尝试。
BUGtrack
BUGtrack Bugtracker是一个完整的bug/issue管理系统.它使用Java Servlet作为web前台,MySQL数据库作为后台.
Colabolo
Colabolo是一款免费的(非开源)(仅beta版,正式版$10左右),简单的,轻量级的像email一样简单的团队任务管理器。
可以有效的分配,跟踪,解决分配任务,商务问题 , 销售指导,审批请求,文档审查, 和其他合作性任务。
用Colabolo可以有效的管理虚拟团队,中小型的商务和企业团队 , 或者当作和客户交流的桌面帮助工具。
Colabolo是一款Adobe AiR软件程序,可以运行于任何平台上。也许不能处理所有的团队情况,但是Colabolo是一款非常轻量级的软件,占用非常少的系统资源,对于正版用户 来说也是 非常便宜的(用beta版免费,正式版$10左右)。Colabolo也即将加入对iPhone和 iPod用户的支持,可以随时随地的运用。
AdminiTrack
AdminiTrack 是高效的基于web的问题跟踪、缺陷跟踪和任务跟踪软件,面向专业的软件开发团队。
BugHost
BugHost,免费托管的Bug跟踪、缺陷跟踪和问题管理系统。
75个最佳Web设计资源,强烈推荐!
字体
- 60 套公司用设计字体 [Smashing Magazine]
- 20 套免费手写字体与资源 [Fuel Your Creativity]
- 50 套专业Web设计与印刷用字体 [Noupe]
- 15 套漂亮的高质量免费字体 [Smashing Magazine]
- 21 套来自 DeviantArt 的艺术字体 [Designflavr]
- 设计专业人士使用的7套最佳字体 [Just Creative design ]
- 45 套符合现代设计趋势的免费漂亮字体 [Six Revisions]
css
- 50 个强大的 CSS 实用工具 [Smashing Magazine]
- 30 套 CSS 小炒资料 [All Web design Resources]
- CSS 编辑器评测 [Smashing Magazine]
- CSS 高手的 10 个原则 [NETTUTS]
- 2008 最佳 CSS 设计 (中文 ) [Web Designer Wall]
- 40 个 CSS 生成器 [All Web design Resources]
- 重置你的CSS [Six Revisions]
- 实现干净代码的12条定律 (中文 ) [Smashing Magazine]
Logo 设计
- 81 个最佳 Logo 设计资源 [Logo design Love]
- 最佳Logo设计资源 [Just Creative design ]
- 105 个Logo设计资源 [Elite By design ]
- 35 个令人目眩的黑白 Logo [Siah design ]
- 50 套能够带来启发的 Logo [Fuel Your Creativity]
- 2008 年 33 个不俗的 Logo 重设计 [Smashing Apps]
- 30 个精彩的矢量 Logo 设计 [VECTORTUTS]
- 10 个成功的 Logo 设计 [Logo design Love]
图标
- 2008年50套最漂亮的图标 [Noupe]
- 40 套漂亮的免费图标 [Six Revisions]
- 22 套全新高品质免费图标 [Elite By design ]
- 40 套超漂亮的图标 [Noupe]
设计启发
- 50 个漂亮的博客设计 [Smashing Magazine]
- 40 个有创意的按钮 [PSDTUTS]
- 60 个非常 Cool 非常有创意的 404 页面 [Hongkiat]
- 30 个漂亮的 Web 设计例子 [Six Revisions]
- 2008年40个具有启发性的 Web 设计 [CrazyLeaf design Blog]
- 50 个漂亮的导航菜单 [Vandelay Website design ]
- Web 设计中的57个矢量字符 [CSSLeak]
- 50 个漂亮的,有创意的展示类站点设计 [Smashing Magazine]
- 40 个漂亮的暗色系 CSS 设计 [Toxel]
- 40 个漂亮的手画 Web 设计 [CSSBuilt]
- 79 个精彩的专辑封面 [Inspiredology]
- 40 套有创意的名片设计 [Toxel]
- 纹理与图样设计展示 [Smashing Magazine]
- 54 幅令人灵魂出窍的数字画 [PSDTUTS]
- 50 个出色的博客页脚设计 [Hongkiat]
- 24 个漂亮的,有创意的网站 Header 设计 [Toxel]
- 富有灵感的 PDF 杂志设计 [Smashing Magazine]
教程
- 41 个最好的 Photoshop 效果教程 [Hongkiat]
- 30 个漂亮的 Photoshop 文字效果教程 [Six Revisions]
- 70 个 Photoshop 美容教程 [Smashing Magazine]
- 50 个很棒的 Photoshop 教程 [PSDTUTS]
- 30 个 Fireworks 教程 [Arbent]
- Adobe Fireworks 教程与下载 [Smashing Magazine]
- 40 个 Wacom 数字画板教程 [DesignM.ag]
- 50 个出色的 AJAX 教程 [Smashing Magazine]
- 50 个富有创意的 Photoshop 文字效果教程 [PSDTUTS]
- 23 个不可思议的 Photoshop 教程 [Elite By design ]
- Adobe Illustrator 教程 [Smashing Magazine]
Photoshop 资源下载
- Photoshop Custom Shapes 集 [Smashing Magazine]
- 20 个 Photoshop 印刷作品与画笔资源 [PSDTUTS]
- 75 个超高分辨率 Photoshop 画笔 [Elite By design ]
- 50 个不可或缺的 Photoshop 画笔 [Smashing Magazine]
- 200 套 Photoshop 画笔 [You the Designer]
- 50 套免费的 Photoshop Pattern [Emma Alvarez]
- 55 套免费的画笔与矢量图 [Web Resources Depot]
- 40 套 Photoshop 万圣节主题画笔 [PSDFan]
wordpress
- 100 出色的 WordPress 免费主题 [Smashing Magazine]
- 30 个最实用的 WordPress 技巧 [Hongkiat]
- 45 套免费的 WordPress 网格布局主题 [WPZOOM]
- 45 套必须要看到 WordPress 主题 [Noupe]
- 20 套 WordPress 公司网站主题 [Blogsessive]
- 24 套高质量免费 WordPress 主题 [Toxel]
- 21 套令人耳目一新的免费Wordpress主题 [Smashing Apps]
- 50 套漂亮的免费 WordPress 主题 [Six Revisions]
- 10 个寻找免费 WordPress 主题的地方 [UPrinting]
- 50 个最好的 WordPress 主题 [CrazyLeaf design Blog]
- 10 个 WordPress 实用 RSS 技巧 [Smashing Magazine]
- 45 个出色的免费 WordPress 主题 [DzineBlog]
HTML5将重塑Web世界
HTML5将改变互联网的方方面面。Html5可能不会完全取代Flash,但它会重塑互联网,使浏览器无需借助插件就可以做更多的工作,从位置跟踪、视频播放到把云端的数据缓存到本地,最终能使互联网更安全、更高效、更灵活。
HTML5将重塑Web世界?
■ 乐天 编译
Adobe和Apple围绕
Flash发生的冲突是
今年上半年的一个焦点事件,引起了很多人的关注,其中有不少人因这一事件第一次了解到HTML5的存在。初次了解HTML5的人可能会非常惊讶,HTML5规范早在6年前就开始制定了,如今尽管HTML5规范草案已经非常好,但何时能真正成为标准却仍然不确定。
的确,HTML5规范制定委员会工作进展非常缓慢。因为关于如何改进浏览器和改进Web世界,不管是浏览器供应商还是其他人都有太多的想法,而这些都要汇聚到HTML5规范中并达成一致,这需要时间。许多新的标签和JavaScript函数尽管已经在一些浏览器上进行了实验,但互操作性和标准化问题还没有解决。比如,Apple所做的HTML5演示虽然令人印象深刻,但它们也只在Safari上运行良好。这就是为什么Flash的支持者嘲笑HTML5要把Web带回到2000年浏览器大战时代的原因。
虽然这种嘲笑可能让HTML5的支持者很伤心,而且漫长的等待的确很难熬,但如果就此忽略HTML5却是不对的。因为在HTML5的背后不仅有行业巨头的推动,更为重要的是,标准化是IT技术发展的必然趋势。就软件而言,不论是浏览器还是相关的开发工具,都会不断吸纳周围的各种技术,最后对其进行标准化,这是技术发展的必然规律。
可以肯定的是,HTML5将改变互联网的方方面面,显然它不会完全取代Flash,但HTML5的确会重塑互联网,使浏览器无需借助插件就可以做更多的工作,从位置跟踪到把数据保存到云端。HTML5的标签将取代那些完成比较简单任务的插件,至少在某些时候,它可以把一些高级的功能开发给更多的用户。最终它可能使互联网更安全、更高效、更灵活。
那么,即将成为新标准的HTML5到底会把我们带向哪里?下面收集了开发者、程序员以及设计师的一些看法,从中可以了解到HTML5如何改变互联网。
降低插件的重要性
从前,Web世界是非常欢迎浏览器插件的,因为它鼓励创新的想法和大胆实验,而声音、动画及其他一些非常生动的网页,通过Sun、Adobe、RealAudio、微软以及其他的一些公司开发的插件第一次在网络呈现时也的确让人耳目一新。然而,问题很快就出现了,插件的接口是向所有人开放的,每个人都在尝试给旧的、以文本为基础的世界增加新的功能,混乱不可避免。其中最有名的插件就是Flash,其他类似的插件更是数不胜数。
出于多种原因,Apple禁止Adobe的Flash在自己的平台上运行,这使得广大Apple迷们不能在Apple平台上看到Flash,而HTML5的流行将让这种冲突不再出现,它将逐步淘汰那些相对封闭的开发体系:JavaFX的功能可能真的很强大,但既然JavaScript和Canvas对象就能做同样的工作,为什么还要学习另一种语法?如果video标签能将音视频同步,谁需要Real的生态系统?
那么,插件真的会全部消失吗?也许吧,但这要取决于你想做的事情。如果你的目标只是绘制图像,那么Canvas对象可能就够用了。但如果你想建立一个专业的3D世界,正如在复杂的Flash和Shockwave游戏中所看到的那样,你可能还得依赖专有的插件技术,因为这些插件技术可以直接访问视频硬件,运行3D游戏。
支持动态生成图像
过去,网页中显示的图像来自于直接下载的GIF或JPG图像,而在HTML5中,图像可能并不是直接来自图像文件,而是由某个Canvas(画布)对象临时生成的。网络上已经出现了大量的非常好的图形库,这些图形库的存在使得动态生成图像更加容易。
如今,JavaScript层可以根据数据进行计算然后绘制出图形。如果软件开发商有足够的时间和人才的话,完全可以让网络上的一切变得更加生动,而纯文本内容越来越少。Flash只是一个开端,HTML5环境让Web开发人员更易于开发出复杂的图像。市场已经出现了一些类似的工具,它们将进一步提高Web开发人员驾驭图像的能力,而且随着工具的成熟,开发人员也将开发出更多更为专业的复杂图形。
这里可能存在的一个问题是,这种图像的处理可能会给客户端处理器带来很大负担,比如对客户端的处理器处理能力有一定要求。在过去,一些开发人员根本不敢用Flash插件,因为渲染和展现Flash内容可能会给处理器带来很大压力,极大地影响用户的最终体验。未来这不应该成为问题,开发者不应该因担心影响性能就不让用户体验生动的图像,只是开发者应该做出一个折中的选择。每一个抱怨Flash影响性能的人都应该知道,这与技术本身没有关系,问题来自设计师们为了吸引我们的注意力,他们过多地使用了这项技术。
允许Web程序
利用本地存储
Web程序员其实早就可以利用浏览器端的本地存储空间存储很多信息,比如IE允许最多300个Cookie,最多存储4096个字节的内容。不过,要开发真正实用的Web程序,可能需要比这更多的存储空间。比如,以前的Dojo工具包使用Flash插件来分配用户硬盘上的部分空间,把它留给浏览器使用,而现在很简单了,使用HTML5就可以达到同样的目的。
对于这部分存储,程序员可以按照自己的需要任意使用,比如把云服务的应用和数据保存在本地硬盘上。这也使得云应用的交付、安装和部署都非常像传统的应用程序。比如,无论是否有互联网连接,云应用程序都可以照常运行,因为之前已经从服务器上下载了HTML5应用的JavaScript代码,这部分代码就保存在本地。
当然,这种技术的应用并不会影响云应用的普及,因为现在的运行模式与过去有很大不同,本地数据库实际上扮演的是智能缓存的作用。另外,游戏开发人员可以在本地存储一些情景信息和装备信息,这样可避免每次一连机就要下载这些信息,省了下载资料的时间。而不利的方面就是这些数据库深埋在系统文件夹之中,这样,进行数据备份时就变得非常复杂。用户如果想把数据从一台机器迁移到另一台机器,数据迁移工作可能就会变得更为复杂。
或许混合云的出现可能解决这一问题,混和云允许云端和本地都保存有数据,而本地计算机只是缓存数据,最终版本保存在云中,这样从任意一台计算机上就可以访问到。
简化Web开发中的
数据提取
曾从网页中提取过数据的Web开发人员都知道,现有的HTML结构除了告诉浏览器这些信息在哪里之外,几乎不能再提供任何有意义的信息。而开发人员需要了解与数据本身有关的信息,这些信息能帮助程序员了解这些数据的真正含义。 HTML5中所谓的微格式(Microformat)引入了一种新的机制,它在HTML中新增了一些专门的标签,可以帮助程序员分析标签之中的数据的真实含义。
没有人能够预测微格式到底将带给网络多少改变,但很容易看出,这种新的机制将给程序员带来很大方便,帮助程序员开发出更有效率的Web应用。比如,如果有一个好的、标准的方式来表示日期和时间,那么程序员在为网站开发与时间有关的Web程序时,就无需另外编写专门的代码来分析或者猜测别人可能用的什么时间格式。这样,日历、时间表、日程安排等需要从多个数据源收集时间信息的应用也就变成非常简单的工作了。
支持位置服务
在Web世界里,过去我们只知道其IP地址,那些数字对应着一个什么样的真实世界我们根本不知道。比如,某台电脑究竟在哪里,过去几乎不可能知道,而现在出现的位置服务可以解决这个问题。HTML5标准中允许JavaScript询问浏览器用户的地理位置,比如纬度和经度信息。通常桌面系统不支持这一功能(因为需要有GPS或Wi-Fi),但如果终端是手持智能手机,这个功能就可以发挥作用。
今天,没有人能知道聪明的程序员会基于这些位置信息创建出什么应用来,但有一点可以肯定,未来一定可能以一种变幻莫测和难以置信的方式将把虚拟世界与现实世界整合到一起。
让Web视频
播放更流畅
HTML5中的“video”标签使Web开发人员很容易地把视频内容与网页中的其他内容整合起来,也让那些从事jQuery和PHP开发的人员可以加入到Web开发队伍中,使得Web开发不再仅仅是Flash、Silverlight和JavaFX开发人员的专利。
尽管这一设想看起来很诱人,但面临的困难依然不少,因为HTML5标准中没有指定任何编解码器,而每个人都想发布自己的视频和声音编解码器。这就意味着我们用一种混乱取代另一个混乱:只是过去我们把嵌入到浏览器中的软件称为插件,而今天把它称为编解码器而已。因此,今天我们虽然有了一个标准的“video”标签,但浏览器可能知道也可能不知道到底如何解释这些视频内容。
在洛杉矶任教的HTML5应用开发讲师Erich Ocean认为编解码器的战争仍在继续。“计算机开发人员和Mozilla组织如果认为他们能为视频专业人士制定视频标准,那就大错特错了。”他说,“我们看到谷歌的新视频格式在一些地方得到了使用,比如在YouTube网站,但永远不会像H.264那样普及。”
尽管视频播放可能面临比较混乱的局面,因为无法让大家达成一致,但是新的“video”标签肯定会让互联网视频内容越来越丰富,网页将成为视频内容的主要发布源地,而同时单纯的文字内容也会越来越少。只是这对孩子的教育未必是好事,因为现在的孩子们变得越来越习惯于看动画,而很少花时间来阅读,更别提书写了。
Widget将更丰富
在IFrame中运行的Widget让网页可以把其他网站的内容(比如天气预报)嵌入进来,非常实用也非常受欢迎,但由于安全方面的原因,这些Widget一直运行在一个相对独立的环境中,与网页中的其他内容基本保持隔离状态。
而HTML5为这些Widget提供了一个相互通信的标准机制。尽管它们仍然不能够相互进入对方的运行环境中,但它们已经可以相互发送信息来协同工作了。
广告商对此早就期盼已久,它们非常希望能把分散到同一个网页各个位置的旗帜广告整合起来,而从开发的角度来说,开发人员也一定会找到其他实际用途。例如,在Web页面上播放的网球比赛画面可以和左右两边的球员信息同步起来,这在HTML 1.0时代是难以想象的。
不过,可以发送信息、相互通信机制只是一个开始,下一个亟待解决的是通信协议的问题,因为至今还没有这方面的一个标准。只有为传递信息设立一个标准后,两个不同开发团队开发出来的Widget之间才有可能相互通信。换句话说,通信双方需要更多的标准词汇。
提高浏览器的
安全性
每个浏览器插件都是一个单独的应用程序,不同的浏览器插件是由不同的程序员按照不同的标准开发的,发布时间不同,安全模式也不同。很自然地,有些插件会比其他的更安全。随着浏览器中的插件越来越多,要跟踪每个浏览器插件中可能存在的安全漏洞越来越复杂。比如,你企业中去年年末某个时候的安全漏洞到底是出在插件还是浏览器,最后是通过升级浏览器而不是升级插件来解决的还是反过来,可能很难有人记得那么清楚。
把很多功能内置到HTML5而不是使用插件可以大大降低安全风险,避免与插件开发有关的多个环节出现问题,更可以防止有人故意利用插件中的API安装恶意代码。因为相对而言,Firefox、Chrome或IE浏览器等的安全性通常会经过更多的人(包括安全小组)的审计,如果安全小组认为某个浏览器安全,一般来说,其安全风险肯定要少得多。
不过,这里所说的安全性有所改善带有一定程度的主要臆测。这个世界总会有一些人把它们的聪明才智用到“邪道”上,他们完全可能利用HTML5的某种特性来从事一些恶意行为。只是现在没有人能够预测HTML5的新功能中到底可能隐藏着哪些危险。
简化Web开发
在一家Web软件开发公司工作的开发人员的话很有代表性,它简明扼要地阐述了HTML5可能带来的变化。他说:“我更喜欢HTML5,主要是因为它使我能够在一个统一的开发环境下进行开发,这个环境就是浏览器加JavaScript再加上DOM,而不必在Flash世界和HTML5的世界之间来回切换。未来只要掌握一门开发语言和一个工具集,就可以开发任何插件。”
他补充说,“我认为,对于用户而言好处也是很明显的,而现在Flash仿佛在互联网世界里另外创立了一片天地。”
的确,HTML5采用了统一的语言(JavaScript)、统一的数据模型(XML和DOM)和统一的表现规则(CSS)来表现文本、音频、视频和图形,对于开发者而言无疑的是非常理想的,基于一个统一的标准开发环境,工作肯定会简单不少。但要让一切都成为现实挑战仍然是巨大的,一个突出问题是工具的缺乏,现在HTML5的相关工具方面还很少。不可否认,Flash的流行与Adobe为Flash的开发提供了非常好用的工具密不可分。
链 接
HTML的演进历程
HTML全称是超文本标示语言(Hypertext Markup Language),是用来描述网页的一种规范。正是这些容纳在尖括号里的简单标签,构成了如今的 Web。
HTML的第一个官方版本是由IETF (互联网工程任务组) 推出的 HTML 2.0。后来,W3C 取代 IETF 的角色,成为HTML标准制订的组织,上个世纪90年代的后半叶,HTML 的版本被频繁修改,直到1999年的HTML 4.01,至此,HTML到达了它的第一个巅峰。
HTML在HTML 4.01 之后的第一个修订版本就是 XHTML 1.0,其中X代表 “eXtensible”。 XHTML 1.0 是基于HTML 4.01 的,并没有引入任何新标签或属性,唯一的区别是语法,HTML对语法比较随便,而XHTML则要求XML般的严格语法。后来,W3C又推出了XHTML 1.1。
对 W3C 而言,到了 HTML 4已经是功德圆满,他们的下一步工作是XHTML 2.0,希望将Web带向XML的光明未来。然而,来自Opera、Apple以及 Mozilla 的代表不满意W3C的工作,他们自发组织成立了超文本应用技术工作组,这就是WHATWG,他们致力于HTML5 规范。
在WHATWG致力于HTML5的同时,W3C继续他们的XHTML 2.0。不过,W3C在XHTML 2.0方面的工作慢慢地陷入困境,后来终止了XHTML 2.0的工作,并于2007年组建了一个新的HTML工作组,他们非常明智地选择了 WHATWG 的成果作为基础,致力于制订HTML5规范。
经过多年的酝酿,HTML5的草案于2008年发布,目前W3C正在对它进行进一步完善。现在,关于HTML5何时会正式成为标准还没有一个明确的说法。好消息是,2012年HTML5可能会被接纳为候选标准。不过,可以预料的是,HTML5无论何时能成为标准,HTML5要被所有浏览器提供商所接纳肯定是一个比较长期的过程。
网页配色实例:Web设计色彩速查表
一直希望自己对Web设计的色彩把握的更好些,所以手头上就备了一份图片版的配色表,对色彩的搭配有了很多的提高,今天发现了这套非常完整的Web版设计色彩速查表,相比图片版的来说就更容易实时学习了。
████ 粉红(#ffb3a7),即浅红色。别称:妃色 杨妃色 湘妃色 妃红色
████ 妃色 妃红色(#ed5736):古同“绯”,粉红色。杨妃色 湘妃色 粉红皆同义。
████ 品红(#f00056):比大红浅的红色(quester注:这里的“品红”估计是指的“一品红”,是基于大红色系的,和现在我们印刷用色的“品红M100”不是一个概念)
████ 桃红(#f47983),桃花的颜色,比粉红略鲜润的颜色。 (quester注:不大于M70的色彩,有时可加入适量黄色)
████ 海棠红(#db5a6b),淡紫红色、较桃红色深一些,是非常妩媚娇艳的颜色。
████ 石榴红(#f20c00):石榴花的颜色,高色度和纯度的红色。
████ 樱桃色(#c93756):鲜红色
████ 银红(#f05654):银朱和粉红色颜料配成的颜色。多用来形容有光泽的各种红色,尤指有光泽浅红。
████ 大红(#ff2121):正红色,三原色中的红,传统的中国红,又称绛色 (quester注:RGB 色中的 R255 系列明度)
████ 绛紫(#8c4356):紫中略带红的颜色
████ 绯红(#c83c23):艳丽的深红
████ 胭脂(#9d2933):1,女子装扮时用的胭脂的颜色。2,国画暗红色颜料
████ 朱红(#ff4c00):朱砂的颜色,比大红活泼,也称铅朱 朱色 丹色 (quester注:在YM对等的情况下,适量减少红色的成分就是该色的色彩系列感觉)
████ 丹(#ff4e20):丹砂的鲜艳红色
████ 彤(#f35336):赤色
████ 茜色(#cb3a56):茜草染的色彩,呈深红色
████ 火红(#ff2d51):火焰的红色,赤色
████ 赫赤(#c91f37):深红,火红。泛指赤色、火红色。
████ 嫣红(#ef7a82):鲜艳的红色
████ 洋红:色橘红(#ff0097) (quester注:这个色彩方向不太对,通常洋红指的是倾向于M100系列的红色,应该削弱黄色成分。)
████ 炎(#ff3300):引申为红色。
████ 赤(#c3272b):本义火的颜色,即红色
████ 绾(#a98175):绛色;浅绛色。
████ 枣红(#c32136):即深红 (quester注:色相不变,是深浅变化)
████ 檀(#b36d61):浅红色,浅绛色。
████ 殷红(#be002f):发黑的红色。
████ 酡红(#dc3023):像饮酒后脸上泛现的红色,泛指脸红
████ 酡颜(#f9906f):饮酒脸红的样子。亦泛指脸红色
████ 鹅黄(#fff143):淡黄色 (quester注:鹅嘴的颜色,高明度微偏红黄色)
████ 鸭黄(#faff72):小鸭毛的黄色
████ 樱草色(#eaff56):淡黄色
████ 杏黄(#ffa631):成熟杏子的黄色 (quester注:Y100 M20~30 感觉的色彩,比较常用且有浓郁中国味道)
████ 杏红(#ff8c31):成熟杏子偏红色的一种颜色
████ 橘黄(#ff8936):柑橘的黄色。
████ 橙黄(#ffa400):同上。 (quester注:Y100 M50 感觉的色彩,现代感比较强。广告上用得较多)
████ 橘红(#ff7500):柑橘皮所呈现的红色。
████ 姜黄(#ffc773):中药名。别名黄姜。为姜科植物姜黄的根茎。又指人脸色不正,呈黄白色
████ 缃色(#f0c239):浅黄色。
████ 橙色(#fa8c35):界于红色和黄色之间的混合色。
████ 茶色(#b35c44):一种比栗色稍红的棕橙色至浅棕色
████ 驼色(#a88462):一种比咔叽色稍红而微淡、比肉桂色黄而稍淡和比核桃棕色黄而暗的浅黄棕色
████ 昏黄(#c89b40):形容天色、灯光等呈幽暗的黄色
████ 栗色(#60281e):栗壳的颜色。即紫黑色
████ 棕色:棕毛的颜色,即褐色。1,在红色和黄色之间的任何一种颜色2,适中的暗淡和适度的浅黑。
████ 棕绿(#827100):绿中泛棕色的一种颜色。
████ 棕黑(#7c4b00):深棕色。
████ 棕红(#9b4400):红褐色。
████ 棕黄(#ae7000):浅褐色。
████ 赭(#9c5333):赤红如赭土的颜料,古人用以饰面
████ 赭色(#955539):红色、赤红色。
████ 琥珀(#ca6924):
████ 褐色(#6e511e): 黄黑色
████ 枯黄(#d3b17d):干枯焦黄
████ 黄栌(#e29c45):一种落叶灌木,花黄绿色,叶子秋天变成红色。木材黄色可做染料。
████ 秋色(#896c39):1,中常橄榄棕色,它比一般橄榄棕色稍暗,且稍稍绿些。2,古以秋为金,其色白,故代指白色。
████ 秋香色(#d9b611):浅橄榄色 浅黄绿色。 (quester注:直接在Y中掺入k10~30可得到不同浓淡的该类色彩)
████ 嫩绿(#bddd22):像刚长出的嫩叶的浅绿色
████ 柳黄(#c9dd22):像柳树芽那样的浅黄色
████ 柳绿(#afdd22):柳叶的青绿色
████ 竹青(#789262):竹子的绿色
████ 葱黄(#a3d900):黄绿色,嫩黄色
████ 葱绿(#9ed900):1,浅绿又略显微黄的颜色2,草木青翠的样子
████ 葱青(#0eb83a):淡淡的青绿色
████ 葱倩(#0eb83a):青绿色
████ 青葱(#0aa344):翠绿色,形容植物浓绿
████ 油绿(#00bc12):光润而浓绿的颜色。以上几种绿色都是明亮可爱的色彩。
████ 绿沈(#0c8918)(沉) :深绿
████ 碧色(#1bd1a5):1,青绿色。2,青白色,浅蓝色。
████ 碧绿(#2add9c):鲜艳的青绿色
████ 青碧(#48c0a3):鲜艳的青蓝色
████ 翡翠色(#3de1ad):1,翡翠鸟羽毛的青绿色。2,翡翠宝石的颜色。 (quester注:C-Y≥30 的系列色彩,多与白色配合以体现清新明丽感觉,与黑色配合效果不好:该色个性柔弱,会被黑色牵制)
████ 草绿(#40de5a):绿而略黄的颜色。
████ 青色(#00e09e):1,一类带绿的蓝色,中等深浅,高度饱和。3,本义是蓝色。4,一般指深绿色。5,也指黑色。6,四色印刷中的一色。2,特指三补色中的一色。
████ 青翠(#00e079):鲜绿
████ 青白(#c0ebd7):白而发青,尤指脸没有血色
████ 鸭卵青(#e0eee8):淡青灰色,极淡的青绿色
████ 蟹壳青(#bbcdc5):深灰绿色
████ 鸦青(#424c50):鸦羽的颜色。即黑而带有紫绿光的颜色。
████ 绿色(#00e500):1,在光谱中介于蓝与黄之间的那种颜色。2,本义:青中带黄的颜色。3,引申为黑色,如绿鬓:乌黑而光亮的鬓发。代指为青春年少的容颜。 (quester注:现代色彩研究中,把绿色提高到了一个重要的位置,和其它红黄兰三原色并列研究,称做“心理原色”之一)
████ 豆绿(#9ed048):浅黄绿色
████ 豆青(#96ce54):浅青绿色
████ 石青(#7bcfa6):淡灰绿色
████ 玉色(#2edfa3):玉的颜色,高雅的淡绿、淡青色
████ 缥(#7fecad):绿色而微白
████ 艾绿(#a4e2c6):艾草的颜色。偏苍白的绿色。
████ 松柏绿(#21a675):经冬松柏叶的深绿
████ 松花绿(#057748):亦作“松花”、“松绿”。偏黑的深绿色,墨绿。
████ 松花色(#bce672):浅黄绿色。(松树花粉的颜色)《红楼梦》中提及松花配桃红为娇艳 ██ ██
████ 蓝(#44cef6):三原色的一种。像晴天天空的颜色 (quester注:这里的蓝色指的不是RGB色彩中的B,而是CMY色彩中的C)
████ 靛青(#177cb0):也叫“蓝靛”。用蓼蓝叶泡水调和与石灰沉淀所得的蓝色染料。呈深蓝绿色 (quester注:靛,发音dian四声,有些地方将蓝墨水称为“靛水”或者“兰靛水”)
████ 靛蓝(#065279):由植物(例如靛蓝或菘蓝属植物)得到的蓝色染料
████ 碧蓝(#3eede7):青蓝色
████ 蔚蓝(#70f3ff):类似晴朗天空的颜色的一种蓝色
████ 宝蓝(#4b5cc4):鲜艳明亮的蓝色 (quester注:英文中为 RoyalBlue 即皇家蓝色,是皇室选用的色彩,多和小面积纯黄色(金色)配合使用。)
████ 蓝灰色(#a1afc9):一种近于灰略带蓝的深灰色
████ 藏青(#2e4e7e):蓝而近黑
████ 藏蓝(#3b2e7e):蓝里略透红色
████ 黛(#4a4266):青黑色的颜料。古代女子用以画眉。
████ 黛螺(#4a4266):绘画或画眉所使用的青黑色颜料,代指女子眉妩。
████ 黛色(#4a4266):青黑色。
████ 黛绿(#426666):墨绿。
████ 黛蓝(#425066):深蓝色
████ 黛紫(#574266):深紫色
████ 紫色(#8d4bbb):蓝和红组成的颜色。古人以紫为祥瑞的颜色。代指与帝王、皇宫有关的事物。
████ 紫酱(#815463):浑浊的紫色
████ 酱紫(#815476):紫中略带红的颜色
████ 紫檀(#4c221b):檀木的颜色,也称乌檀色 乌木色
████ 绀青 绀紫(#003371):纯度较低的深紫色
████ 紫棠(#56004f):黑红色
████ 青莲(#801dae):偏蓝的紫色
████ 群青(#4c8dae):深蓝色
████ 雪青(#b0a4e3):浅蓝紫色
████ 丁香色(#cca4e3):紫丁香的颜色,浅浅的紫色,很娇柔淡雅的色彩
████ 藕色(#edd1d8):浅灰而略带红的颜色
████ 藕荷色(#e4c6d0):浅紫而略带红的颜色
████ 苍色(#75878a):即各种颜色掺入黑色后的颜色,如苍翠(#519a73)████ 苍黄(#a29b7c)████ 苍青(#7397ab)████ 苍黑(#395260)████ 苍白(#d1d9e0)████ (quester注:准确的说是掺入不同灰度级别的灰色)
████ 水色(#88ada6):水红(#f3d3e7)████ 水绿(#d4f2e7)████ 水蓝(#d2f0f4)████ 淡青(#d3e0f3)████ 湖蓝(#30dff3)████ 湖绿(#25f8cb)████ 皆是浅色。
████ 深色淡色(#ffffff):颜色深的或浅的,不再一一列出。
████ 精白(#ffffff):纯白,洁白,净白,粉白。
████ 象牙白(#fffbf0):乳白色
████ 雪白(#f0fcff):如雪般洁白
████ 月白(#d6ecf0):淡蓝色
████ 缟(#f2ecde):白色
████ 素(#e0f0e9):白色,无色
████ 荼白(#f3f9f1):如荼之白色
████ 霜色(#e9f1f6):白霜的颜色。
▓▓▓▓ 花白(#c2ccd0):白色和黑色混杂的。斑白的 夹杂有灰色的白
████ 鱼肚白(#fcefe8):似鱼腹部的颜色,多指黎明时东方的天色颜色 (quester注:M5 Y5)
████ 莹白(#e3f9fd):晶莹洁白
████ 灰色(#808080):黑色和白色混和成的一种颜色
████ 牙色(#eedeb0):与象牙相似的淡黄色 (quester注:暖白)
████ 铅白(#f0f0f4):铅粉的白色。铅粉,国画颜料,日久易氧化“返铅”变黑。铅粉在古时用以搽脸的化妆品。 (quester注:冷白)
████ 玄色(#622a1d):赤黑色,黑中带红的颜色,又泛指黑色
████ 玄青(#3d3b4f):深黑色
████ 乌色(#725e82):暗而呈黑的颜色
████ 乌黑(#392f41):深黑;漆黑
████ 漆黑(#161823):非常黑的
████ 墨色(#50616d):即黑色
████ 墨灰(#758a99):即黑灰
████ 黑色(#000000):亮度最低的非彩色的或消色差的物体的颜色;最暗的灰色;与白色截然不同的消色差的颜色;被认为特别属于那些既不能反射、又不能透过能使人感觉到的微小入射光的物体,任何亮度很低的物体颜色。
████ 缁色(#493131):帛黑色
████ 煤黑象牙黑(#312520):都是黑,不过有冷暖之分。
████ 黧(#5d513c):黑中带黄的颜色
████ 黎(#75664d):黑中带黄似黎草色
████ 黝(#6b6882):本义为淡黑色或微青黑色。
████ 黝黑(#665757):(皮肤暴露在太阳光下而晒成的) 青黑色
████ 黯(#41555d):深黑色、泛指黑色
████ 赤金(#f2be45):足金的颜色
████ 金色(#eacd76):平均为深黄色带光泽的颜色
████ 银白(#e9e7ef):带银光的白色
████ 铜绿(#549688) ████ 乌金(#a78e44) ████ 老银(#bacac6):金属氧化后的色彩
附带:
国画用色
████ 银朱(#bf242a):呈暗粉色。
████ 胭脂(#9d2933):色暗红。用红蓝花、茜草、紫梗三种植物制成的颜料,年代久则有褪色的现象。
████ 朱砂(#ff461f):色朱红。用以画花卉、禽鸟羽毛。 (quester注:黄色成分微高于红色成分,色艳丽,需注意与背景色调和,多数情况下不大面积使用。)
████ 朱膘(#f36838):色橘红。明度比朱砂高,彩度比朱砂低。用以画花卉。
████ 赭石(#845a33):色红褐。用以画山石、树干、老枝叶。
████ 石青(#1685a9):色青,依深浅分为-头青、二青、三青。用以画叶或山石。
████ 石绿(#16a951):依深浅分为-头绿、二绿、三绿。用以画山石、树干、叶、点苔等。
████ 白粉(#fff2df):亦称胡粉,色白,有蛤粉和铅粉两种。用以画白花、鸟,或调配其他颜料使用。
████ 花青(#003472):色藏青。用以画枝叶、山石、水波等。用蓼蓝或大蓝的叶子制成蓝靛,再提炼出来的青色颜料,蓝绿色或藏蓝色。用途相当广,可调藤黄成草绿或嫩绿色。广花,颜料。即广东产的花青。 (quester注:微含红色成分,故与黄色调和后生成的绿色较为沉着)
████ 藤黄(#ffb61e):色明黄。用以画花卉、枝叶。藤黄:明黄色。南方热带林中的海藤树,常绿乔木,茎高达二十米,从其树皮凿孔,流出黄色树脂,以竹筒承接,干透可作国画颜料。 (quester注:亦含微量红色成分,有毒。和黑色配合时甚为醒目,多为危险警示色彩)
████ 赭石色(#845a33):暗棕色矿物,用做颜料
████ 雌黄(#ffc64b):矿物名。成分是三硫化二砷(As2S3)橙黄色,半透明,可用来制颜料。古人用雌黄来涂改文字,因此称乱改文字、乱发议论为“妄下雌黄”,称不顾事实、随口乱说为“信口雌黄”。
████ 雄黄(#e9bb1d):中药名。为含硫化砷的矿石。别名石黄、黄石。
████ 石黄(#e9bb1d):国画颜料,即雄黄。
████ 洋红(#ff4777):色橘红。用以画花卉。
古典文学常见词
鎏金:中国传统的一种镀金方法,把溶解在水银里的金子涂刷在银胎或铜胎器物上。
飞金 泥金 洒金:用金粉或金属粉制成的金色涂料,用来装饰笺纸或调和在油漆中涂饰器物。洒金一说是指带斑点的图案。
描金:为使器物美观而在其上用金银粉勾图、描绘作为装饰。
花黄:古代妇女的面饰。用金黄色纸剪成星月花鸟等形贴在额上,或在额上涂点黄色。
撒花:织物上的碎花图案。
云斑:在颜色比较淡的或半透明的材料上的暗黑的或无光泽的条纹或斑点(如在大理石上)。
云母纹:像云母断面及砂子闪烁光泽的纹理。
注: 在原文中,是没有把每个色彩的色彩值写上的,我感觉这样用起来会很不方便,用取色器获取的颜色也可能不准确,就在每个颜色名称后面一一标注了。
通过对web日志的挖掘来实现内容推荐系统
先说一说问题,不知道大家有没有这样的经验,反正我是经常碰到。
举例1,某些网站每隔几天就发邮件给我,每次发的邮件内容都是一些我根本不感兴趣的东西,我不甚其扰,对其深恶痛绝。
举例2,添加具有某功能的一个msn机器人,每天都有几次突然蹦出一个窗口,推荐一堆我根本不想知道的内容,烦不烦啊, 我只好将你阻止掉。
每一个观众只想看他感兴趣的东西,而不是一下与之无关的事物,那么如何才能知道观众的兴趣所在呢,还是数据挖掘,经过一番思考,终于有点思路,即根据用户 以往的浏览历史来预测用户将来的行为,也就是基于内容的推荐。
基于内容的推荐(Content-based Recommendation)是信息过滤技术的延续与发展,它是建立在项目的内容信息上作出推荐的,而不需要依据用户对项目的评价意见,更多地需要用机 器学习的方法从关于内容的特征描述的事例中得到用户的兴趣资料。在基于内容的推荐系统中,项目或对象是通过相关的特征的属性来定义,系统基于用户评价对象 的特征,学习用户的兴趣,考察用户资料与待预测项目的相匹配程度。用户的资料模型取决于所用学习方法,常用的有决策树、神经网络和基于向量的表示方法等。 基于内容的用户资料是需要有用户的历史数据,用户资料模型可能随着用户的偏好改变而发生变化。
基于内容推荐 方法的优点是:
1)不需要其它用户的数据,没有冷开始问题和稀疏问题。
2)能为具有特殊兴趣爱好的用户进行推荐。
3)能推荐新的或不是很流行的项目,没有新项目问题。
4)通过列出推荐项目的内容特征,可以解释为什么推荐那些项目。
5)已有比较好的技术,如关于分类学习方面的技术已相当成熟。
缺点是要求内容能容易抽取成有意义的特征,要求特征内容有良好的结构性,并且用户的口味必须能够用内容特征形式来表达,不能显式地得到其它用户的判断情 况。
要实现内容推荐系统总体来说要经过4个大的步骤:
1 搜集数据,即搜集用户的行为资料,其中也包括很多方法,根据我找到的资料与以往的经验来看,web日志可以作为我们的切入点,即我们的数据来源。
2 过滤数据,web日志中有很多无用的信息,我们要把这些无用的信息排除掉,而且要区分出用户和日志数据之间的联系。
3 分析数据,利用分类聚类技术分析出这些日志数据之间的关联性,以及这些日志数据和用户之间的关联性,这也是最重要的一步。
4 输出结果。
有了这个思路之后,我们可以着手做第一步,即日志数据的收集
我们知道,大多数的web服务器都是有自己的日志记录的,比如说apache安装之后有一个logs目录,其中就有它的日志文件,一般说来它有自 己的一个格式,比如说:
1浏览器所在主机的 IP 地址(ip);
2访问日期和时间(date-time);
3客户机与服务器通信所用的方法(methed,get or post);
4客户机请求访问页面的 URL;
5服务器返回的状态(status);
6客户端浏览器的类型;
但是这个日志文件有一些不能克服的问题,或者我不知道如何克服,那么我先说说我的疑问,首先,这个日志文件中记录的是ip地址,据了解,网络中有很多计算 机的ip地址是相同的,因为他们在一个统一的路由后面,这个比例可能达到25%。那么我们就无法根据ip地址来唯一确定一个用户。其次,一般的web服务 器中都会用多个应用,那么其他应用的访问信息对我们来说有可能是多余的。再者,web服务器的日志形式比较单一,灵活性不大,可定制的余地很小,在日志数 据中有效数据所占的比例较小。还有,一些静态文件的请求也会被web服务器记录下来,比如说js文件,css文件,还有图片文件,等等这些东西对内容推荐 来说都是无用的资源。
基于上面3点原因,我认为可以自定义日志数据。为了解决用户唯一性,我们让应用为每一个浏览器生成一个clientId保存在对应的浏览器上,这样该浏览 器只要访问网站,我们就可以确定这个浏览器的唯一性,当然我们仍然不能确定浏览器使用者的唯一性,但是我们可以更进一步,如果浏览器的使用者登陆网站的 话,我们就可以使用用户id来确定用户的唯一性,不过大多数网站用户可能在使用网站的时候并不会登陆,我也是这样,没有关系,即使使用clientId问 题也不会太大,随着社会的发展,计算机的拥有量逐渐增加,一般来说一个人只会使用一台固定的电脑,在公司里尤其是这样。所以我认为clientId的方案 是可行的,也许有人要问,别人的浏览器禁止了cookie怎么办,那么我只能说没有办法,不过还好事实是绝大多数人都没有这样做。
接下来我们可以定义一下我们所需要的日志数据的格式,比如这样,
ip,clientId,userId,url,datetime,get or post等等。
这样数据有效性会大大提高。
在得到较为有效的数据之后,我们还需要对这些数据进行再次过滤:
1 去掉一些非内容的url,这些数据也是无效数据,这些非内容的url需要我们自己手工的统计出来,然后和日志数据中的数据进行比对,将这些非内容数据从日 志数据中清除出去。
2 同时我们也需要把post请求从日志数据中清除出去,或者我们在记录日志的时候根本不应该把post请求记录下来。
经过以上步骤之后我们就可以开始第3个阶段了,统计每个用户的访问的url,对这些url进行访问,得到对应的html中所包含的数据,这些数据都是文 本,将有用的文本提取出来,然后对这些有用的文本进行聚类。这样就可以得到每个用户喜欢的几个类别。
聚类完成之后我们就可以开始分类了,即把最新的文章或者内容和对应的类别进行匹配,匹配成功之后,我们可以认为这个新文章或者内容可以推荐给对应的用户。
问题:以上的流程只适用于没有使用缓存的系统,但是一般大型的网站都会使用varnish,squid等等,使用它们之后我们就无法得到用户访问的日志数 据了,所以如果使用了varnish或者squid,我们不得不再次面对web服务器的日志数据。
在不考虑varnish或者squid的情况下,使用lucene+jamon+htmlparse基本就可以实现以上推荐系统。