高性能WEB开发系列
http://www.blogjava.net/BearRui/archive/2010/04/26/web_performance.html
?
Web 设计与开发者必须知道的站点
ColorCombos?
http://www.colorcombos.com/?
配色是 Web 设计的首要大事,Color Combos 帮你预备了数千种配色方案,可以根据色调浏览选取。?
配色是 Web 设计的首要大事,Color Combos 帮你预备了数千种配色方案,可以根据色调浏览选取。?
LIpsum?
http://lipsum.com/?
Lorem Ipsum Text 是一中自造的,字典中不存在的单词,是在演示页面结构的时候,需要加文字的地方使用 Lorem Ipsum Text 填充可以避免用户因关注文字的意思而分神。Lipsum.com 可以帮你生成制定数目的 Lorem Ipsum 单词。?
What the font??
Lorem Ipsum Text 是一中自造的,字典中不存在的单词,是在演示页面结构的时候,需要加文字的地方使用 Lorem Ipsum Text 填充可以避免用户因关注文字的意思而分神。Lipsum.com 可以帮你生成制定数目的 Lorem Ipsum 单词。?
What the font??
http://new.myfonts.com/whatthefont?
有时候你对某个 Logo 感兴趣,想知道是拿什么字体做的,可以将 Logo 图片上传到这个网站,结果之准确会让你难以置信。?
有时候你对某个 Logo 感兴趣,想知道是拿什么字体做的,可以将 Logo 图片上传到这个网站,结果之准确会让你难以置信。?
ConvertIcon?
http://www.converticon.com/?
Favicon 越来越受欢迎,尤其随着 Firefox 的流行,Firefox 会将你站点的 Favicon 标志显示在标签上,也会显示于书签,Favicon 支持多种图形格式,比如 png,但 IE 并不支持 png,该站点可以帮助你将 png 等图片格式的 Favicon 转换成 IE 支持的 ico 格式。?
Favicon 越来越受欢迎,尤其随着 Firefox 的流行,Firefox 会将你站点的 Favicon 标志显示在标签上,也会显示于书签,Favicon 支持多种图形格式,比如 png,但 IE 并不支持 png,该站点可以帮助你将 png 等图片格式的 Favicon 转换成 IE 支持的 ico 格式。?
BgPatterns?
http://www.bgpatterns.com/?
现代 Web 设计的趋势之一包括使用背景图案,BgPatterns.com 可以帮你设计背景图案,他们有大量可选的图案,可以按不同方式接合,还可以设置透明度。?
HTML Encoder
现代 Web 设计的趋势之一包括使用背景图案,BgPatterns.com 可以帮你设计背景图案,他们有大量可选的图案,可以按不同方式接合,还可以设置透明度。?
HTML Encoder
http://www.opinionatedgeek.com/DotNet/Tools/HTMLEncode/Encode.aspx?
如果你要在网站中显示 Web 代码,那将是非常烦人的事,你必须将诸如 < 一类的符号用编码表示,这个网站可以帮你做这些事情,只需将你的代码复制进去,他们会帮你生成可以直接使用的代码。还有 HTML Decoder 帮你做相反的事。?
如果你要在网站中显示 Web 代码,那将是非常烦人的事,你必须将诸如 < 一类的符号用编码表示,这个网站可以帮你做这些事情,只需将你的代码复制进去,他们会帮你生成可以直接使用的代码。还有 HTML Decoder 帮你做相反的事。?
Xenocode Browsers
http://www.xenocode.com/browsers/?
该网站非常有用,可以直接在站点中预览你的网站在 IE6, IE7, IE8, Firefox 2, Firefox 3, Google Chrome 以及 Opera 中的样子。唯一的不足是,不支持 Mac 和 Linux 环境下的浏览器。?
该网站非常有用,可以直接在站点中预览你的网站在 IE6, IE7, IE8, Firefox 2, Firefox 3, Google Chrome 以及 Opera 中的样子。唯一的不足是,不支持 Mac 和 Linux 环境下的浏览器。?
Test Everything
http://tester.jonasjohn.de/?
这个网站包含了超过 100 中工具帮你测试几乎所有东西,如跨浏览器兼容,查 PR 值,甚至帮你验证代码。?
这个网站包含了超过 100 中工具帮你测试几乎所有东西,如跨浏览器兼容,查 PR 值,甚至帮你验证代码。?
Sprite Generator
http://spritegen.website-performance.org/?
CSS Sprites 在显著降低 HTTP 请求方面功不可没,但 CSS sprite 可不是个简单的技术,Sprite generator 可以帮你做这些繁复的工作,将你的图片打包成 zip 上传上去,他们会把你的图片组合成 sprite,还帮你生成 CSS 代码。?
CSS Sprites 在显著降低 HTTP 请求方面功不可没,但 CSS sprite 可不是个简单的技术,Sprite generator 可以帮你做这些繁复的工作,将你的图片打包成 zip 上传上去,他们会把你的图片组合成 sprite,还帮你生成 CSS 代码。?
Buttonator
http://spritegen.website-performance.org/?
这个网站可以帮你设计漂亮的按钮。?
这个网站可以帮你设计漂亮的按钮。?
Load Impact
http://loadimpact.com/?
这个压力测试站点可以帮你测试你的站点的抗压能力,如果你的某篇文章曾经上过 Digg 或 StumbleUpon 等网站的首页,你就会知道抗压测试多么重要。?
这个压力测试站点可以帮你测试你的站点的抗压能力,如果你的某篇文章曾经上过 Digg 或 StumbleUpon 等网站的首页,你就会知道抗压测试多么重要。?
IconFinder
http://www.iconfinder.net/?
这个网站收藏了大量来自网络的免费图标。?
这个网站收藏了大量来自网络的免费图标。?
TypeTester
http://www.typetester.org/?
该站点可以帮你测试不同字体的显示效果。?
该站点可以帮你测试不同字体的显示效果。?
CSS Tidy
http://csstidy.sourceforge.net/index.php?
这个站点可以帮你检查 CSS 代码,并修正其中的错误,比如,它可以发现你的 CSS 代码中最常见到重复设置问题。?
这个站点可以帮你检查 CSS 代码,并修正其中的错误,比如,它可以发现你的 CSS 代码中最常见到重复设置问题。?
Contact Forms Generators
http://www.tele-pro.co.uk/scripts/contact_form/?
自定义表单可以帮助你实现同访问者的互动,无需编程,就能快速生成访客反馈表单,甚至帮你生成邮件发送 PHP, ASP, Perl 代码。
自定义表单可以帮助你实现同访问者的互动,无需编程,就能快速生成访客反馈表单,甚至帮你生成邮件发送 PHP, ASP, Perl 代码。
10个给力的在线Web设计开发工具介绍
1.在线文本生成器?
BlindTextGenerator:对设计师来说,这是一个简单又好用的文本生成小工具。内含许多种字体,可设置字符的大小,数量,样式,段落的数量及对齐方式等,还可以很方便且精确地调节文本区块的大小。?
http://www.blindtextgenerator.com/lorem-ipsum?
Fillerati:很有设计感和风格现代的文本生成器。?
http://www.fillerati.com/?
2.CSS生成器?
Border Radius:没有比它更简单的了。进入网站在矩形一角的输入框里输入数值,就可以生成圆角矩形的CSS代码。?
http://border-radius.com/?
CSS3 Gradient Generator:超好用的CSS渐变代码生成器,也很容易上手。?
http://gradients.glrzad.com/?
Ultimate CSS Gradient Generator:熟悉Photoshop的话,对这款CSS渐变代码生成器会感到很亲切,当然它的功能也很强大。?
http://www.colorzilla.com/gradient-editor/?
CSS Tricks Button Maker:一个按钮CSS代码生成器,没说的,实在是太方便了!?
你可以自如定义按钮大小,颜色,边界半径,渐变,背景,边界,悬停,活动状态,设置好之后点击你的按钮,就可以拷贝CSS代码了。?
http://css-tricks.com/examples/ButtonMaker/?
3.排版工具?
Baseline CSS:对于包含大量文本的网站它是一个非常得力的工具。?
http://baselinecss.com/?
TypeTester:可以方便快捷地测试最佳字体排版的工具!提供三种方案对照,并有安全字体列表。当你找到了完美的设置方案,还可以获取相应的CSS。?
http://www.typetester.org/?
4.其它工具?
Favicon.cc:这是个用于生成通常出现在浏览器状态栏或浏览器标签上的小图标(用于识别一个网站)的工具。完成后只需下载.ico文件并把它拖到Web服务器根目录下即可。很快很方便。?
http://www.favicon.cc/?
JSONLint:简单易用的JSON验证器。只需把代码拷贝粘贴到文本区域即可。它甚至还可以支持仅输入网址(而不是代码)的验证。?
http://www.jsonlint.com/
BlindTextGenerator:对设计师来说,这是一个简单又好用的文本生成小工具。内含许多种字体,可设置字符的大小,数量,样式,段落的数量及对齐方式等,还可以很方便且精确地调节文本区块的大小。?
http://www.blindtextgenerator.com/lorem-ipsum?
Fillerati:很有设计感和风格现代的文本生成器。?
http://www.fillerati.com/?
2.CSS生成器?
Border Radius:没有比它更简单的了。进入网站在矩形一角的输入框里输入数值,就可以生成圆角矩形的CSS代码。?
http://border-radius.com/?
CSS3 Gradient Generator:超好用的CSS渐变代码生成器,也很容易上手。?
http://gradients.glrzad.com/?
Ultimate CSS Gradient Generator:熟悉Photoshop的话,对这款CSS渐变代码生成器会感到很亲切,当然它的功能也很强大。?
http://www.colorzilla.com/gradient-editor/?
CSS Tricks Button Maker:一个按钮CSS代码生成器,没说的,实在是太方便了!?
你可以自如定义按钮大小,颜色,边界半径,渐变,背景,边界,悬停,活动状态,设置好之后点击你的按钮,就可以拷贝CSS代码了。?
http://css-tricks.com/examples/ButtonMaker/?
3.排版工具?
Baseline CSS:对于包含大量文本的网站它是一个非常得力的工具。?
http://baselinecss.com/?
TypeTester:可以方便快捷地测试最佳字体排版的工具!提供三种方案对照,并有安全字体列表。当你找到了完美的设置方案,还可以获取相应的CSS。?
http://www.typetester.org/?
4.其它工具?
Favicon.cc:这是个用于生成通常出现在浏览器状态栏或浏览器标签上的小图标(用于识别一个网站)的工具。完成后只需下载.ico文件并把它拖到Web服务器根目录下即可。很快很方便。?
http://www.favicon.cc/?
JSONLint:简单易用的JSON验证器。只需把代码拷贝粘贴到文本区域即可。它甚至还可以支持仅输入网址(而不是代码)的验证。?
http://www.jsonlint.com/
?