芒果 » Color http://www.mangguo.org 这里不卖芒果，请另寻他处购买。 Mon, 06 Sep 2010 00:30:20 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 Web 设计与开发者必须知道的 15 个站点 http://www.mangguo.org/15-site-web-developer-and-designer-should-know/ http://www.mangguo.org/15-site-web-developer-and-designer-should-know/#comments Mon, 27 Jul 2009 16:00:32 +0000 芒果 http://www.mangguo.org/?p=2207 英文 Web 设计与开发资源非常丰富，之前芒果就介绍过 Web 开发工具箱，120 个 Web 开发工具（上）和 Web 开发工具箱，120 个 Web 开发工具（下）。当然，远远不止这些，以下是另外 15 个实用的 Web 设计开发类站点。

ColorCombos
配色是 Web 设计的首要大事，Color Combos 帮你预备了数千种配色方案，可以根据色调浏览选取。

LIpsum
Lorem Ipsum Text 是一中自造的，字典中不存在的单词，是在演示页面结构的时候，需要加文字的地方使用 Lorem Ipsum Text 填充可以避免用户因关注文字的意思而分神。Lipsum.com 可以帮你生成制定数目的 Lorem Ipsum 单词。

What the font?
有时候你对某个 Logo 感兴趣，想知道是拿什么字体做的，可以将 Logo 图片上传到这个网站，结果之准确会让你难以置信。

ConvertIcon
Favicon 越来越受欢迎，尤其随着 Firefox 的流行，Firefox 会将你站点的 Favicon 标志显示在标签上，也会显示于书签，Favicon 支持多种图形格式，比如 png，但 IE 并不支持 png，该站点可以帮助你将 png 等图片格式的 Favicon 转换成 IE 支持的 ico 格式。

BgPatterns
现代 Web 设计的趋势之一包括使用背景图案，BgPatterns.com 可以帮你设计背景图案，他们有大量可选的图案，可以按不同方式接合，还可以设置透明度。

HTML Encoder
如果你要在网站中显示 Web 代码，那将是非常烦人的事，你必须将诸如 < 一类的符号用编码表示，这个网站可以帮你做这些事情，只需将你的代码复制进去，他们会帮你生成可以直接使用的代码。还有 HTML Decoder 帮你做相反的事。

Xenocode Browsers
该网站非常有用，可以直接在站点中预览你的网站在 IE6，IE7，IE8，Firefox 2，Firefox 3，Google Chrome 以及 Opera 中的样子。唯一的不足是，不支持 Mac 和 Linux 环境下的浏览器。

Test Everything
这个网站包含了超过 100 中工具帮你测试几乎所有东西，如跨浏览器兼容，查 PR 值，甚至帮你验证代码。

Sprite Generator
CSS Sprites 在显著降低 HTTP 请求方面功不可没，但 CSS sprite 可不是个简单的技术，Sprite generator 可以帮你做这些繁复的工作，将你的图片打包成 zip 上传上去，他们会把你的图片组合成 sprite，还帮你生成 CSS 代码。

Buttonator
这个网站可以帮你设计漂亮的按钮。

Load Impact
这个压力测试站点可以帮你测试你的站点的抗压能力，如果你的某篇文章曾经上过 Digg 或 StumbleUpon 等网站的首页，你就会知道抗压测试多么重要。

IconFinder
这个网站收藏了大量来自网络的免费图标。

TypeTester
该站点可以帮你测试不同字体的显示效果。

CSS Tidy
这个站点可以帮你检查 CSS 代码，并修正其中的错误，比如，它可以发现你的 CSS 代码中最常见到重复设置问题。

Contact Forms Generators
自定义表单可以帮助你实现同访问者的互动，无需编程，就能快速生成访客反馈表单，甚至帮你生成邮件发送 PHP，ASP，Perl 代码。

英文原稿：15 sites web developers and designers should know | CatsWhoCode
翻译整理：Web 设计与开发者必须知道的 15 个站点 | COMSHARP

推荐阅读

© 2009 芒果 版权所有 | 固定链接 | 6 条评论 | 标签 , , , ]]> http://www.mangguo.org/15-site-web-developer-and-designer-should-know/feed/ 6 Web 开发与设计师速查手册大全（下） http://www.mangguo.org/web-development-and-designer-info-manual-part-two/ http://www.mangguo.org/web-development-and-designer-info-manual-part-two/#comments Thu, 09 Jul 2009 10:03:40 +0000 芒果 http://www.mangguo.org/?p=2065 在 Web 开发与设计师速查手册大全（上）中，介绍的主要是 Web 开发者常用速查手册，本文将着重介绍 Web 前端设计者常用速查手册。其中涉及颜色速查表以及 Adobe 众多设计工具的速查手册。

Color Codes

RGB Hex Colour Chart
这张 RGB 16进制颜色速查表刚好可以打印在整张 A4 纸上，包含216种所谓的 Web 安全色。下载 (PNG | PDF)

Color Reference Guide （配色表，下载 PDF）

Web Safe Color Chart (Web 安全色，下载 GIF)

HTML Colors Cheat Sheet (预览 | 下载)

RGB Values for Macbeth Color Checker（Macbeth 色卡之 RGB 色值，预览）

Dreamweaver

DreamWeaver CS4 Keyboard Shortcuts (PC)
DW PC CS4 版快捷键速查手册，下载(PDF)

Illustrator

Adobe Illustrator CS4 Shortcuts (Mac – PC)
Adobe Illustrator CS4 快捷键速查表。下载 (MAC PDF | PC PDF)

Indesign

Adobe InDesign CS4 Keyboard Shortcuts (Mac – PC)
Adobe InDesign CS4 快捷键速查表，下载 (MAC PDF | PC PDF)

Photoshop

Photoshop CS3 Keyboard Shortcut(Photoshop CS3 快捷键速查，下载 PDF)

Photoshop CS4 Shortcut Cheatsheets(Photoshop CS4 快捷键速查，下载 MAC PDF | PC PDF)

Brush Tool cheatsheetush Tool cheat sheet for Photoshop(Photoshop 笔刷速查手册，下载 PDF)

Adobe Photoshop Quick Reference Guide(Photoshop 速查手册，下载 PDF)

Black & White Cheatsheet For Photoshop （如何在 Photoshop 中处理黑白图,下载 PSD）

Photoshop Quick reference card (Photoshop 快速参考，下载 PDF)

Photoshop Lasso Tool Cheat Sheet(Photoshop 套索选择工具速查，下载 PDF)

Photoshop Toolbox Reference （Photoshop 工具箱参考手册，全部 Flash 格式教程，直接浏览）

Keys for using the Layers palette （层操作快捷键，直接浏览）

Flash

Flash CS4 Keyboard Shortcuts(PC and Mac)
Flash CS4 快捷键速查，下载 MAC PDF | PC PDF

ActionScript 3.0 Top Level Cheat Sheet
ActionScript 3.0 高阶速查手册，下载 PDF

转载自 Web 开发与设计师速查手册大全（下）| COMSHARP CMS

推荐阅读

© 2009 芒果 版权所有 | 固定链接 | 没有评论 | 标签 , ]]> http://www.mangguo.org/web-development-and-designer-info-manual-part-two/feed/ 0 COLOURlovers，创意颜色设计社区 http://www.mangguo.org/colourlovers-creative-color-design-community/ http://www.mangguo.org/colourlovers-creative-color-design-community/#comments Sun, 05 Jul 2009 01:41:25 +0000 芒果 http://www.mangguo.org/?p=2042 在 6 款在线配色工具一文中，芒果提到了一些实用的配色工具。

COLOURlovers 不只是单一的配色工具，它增强了用户的参与性，让用户来分享和主导颜色趋势。

从官方的介绍可知，COLOURlovers 是一款监测和影响色彩趋势的设计网站，为设计人员提供了丰富的颜色方案。无论是广告系列，产品设计，还是建筑艺术，COLOURlovers 都是一个汇集全世界创意颜色的地方。以颜色为主题，允许提交新闻、评论并阅读与颜色相关的文章和采访。

该网站的颜色资源非常丰富，值得去发现和找寻。对于了解当前的主流设计与颜色应用，将会受益匪浅。

中文版官方主页：zh-cn.colourlovers.com
英文版官方主页：www.colourlovers.com

推荐阅读

© 2009 芒果 版权所有 | 固定链接 | 3 条评论 | 标签 , ]]> http://www.mangguo.org/colourlovers-creative-color-design-community/feed/ 3 Whats Its Color，图片颜色提取工具 http://www.mangguo.org/whats-its-color-image-color-extract-tool/ http://www.mangguo.org/whats-its-color-image-color-extract-tool/#comments Wed, 01 Jul 2009 07:34:43 +0000 芒果 http://www.mangguo.org/?p=1991 使用芒果介绍的 Color Palette Generator，在线图片拾色工具，能更方便地实现图片拾色功能。当然，这款 Whats Its Color 与之相似，也提供图片颜色分析和提取服务。

所谓图片取色，即通过分析源图像，给出主要的色彩元素。Whats Its Color 能给出 10 种主要的颜色信息，与 Color Palette Generator 略有不同的是，还提供平均颜色的 16 进制代码。

同样提供 URL 和在线上传两种方式，支持 gif、jpg、jpeg、png 四种图片格式，可排除图片背景拾色。虽然功能单一，但对于创建专属的颜色方案，还是不错的选择。

工具主页：whatsitscolor.com

推荐阅读

© 2009 芒果 版权所有 | 固定链接 | 2 条评论 | 标签 , ]]> http://www.mangguo.org/whats-its-color-image-color-extract-tool/feed/ 2 Web 设计师工具集 http://www.mangguo.org/web-designer-tool-kit/ http://www.mangguo.org/web-designer-tool-kit/#comments Wed, 10 Jun 2009 11:39:08 +0000 芒果 http://www.mangguo.org/?p=1719 优秀的设计资源对于 Web 设计师而言至关重要。这篇文章是很早先的外文资料，详尽地罗列了较为实用的网络设计资源，值得分享。

DHTML AJAX Javascript

1. RO Scripts – 提供各种类型的脚本资源
2. HOT Scripts – 不同类别的丰富脚本集合
3. DHTML Goodies – 简单美观的 DHTML 和 AJAX 脚本示例
4. DHTML Site – 极酷的实用代码收集

AJAX 框架和 JS 特效

1. moo.fx – 易用性很强的轻量级 JavaScript 特效库，基于  protoype.js 框架或 mootools 框架
2. script.aculo.us – 易于使用，跨浏览器兼容的用户界面特效，全面优化你的 Web 应用程序
3. Moo Tools – 压缩，模块化，面向对象设计的 JavaScript 框架

免费图标

1. Yellow Icon - 资历深厚的界面设计工作室，作品精美
2. Fast Icon – 提供高质量免费图标资源
3. Icon Factory – 专业商业图标设计公司
4. Icon Archive – 丰富的分类图标库
5. Icon Finder - 芒果在 Iconfinder，专业图标搜索引擎中已作介绍，可详细参考
6. Icon Kits – 现成的低价通用图标
7. Icon Buffet – 免费图标，通用图标，自定义图标设计
8. Max Power – 免费图标资源收集

颜色工具

1. Color Schemer – 适合不同层次设计人员的专业颜色搭配工具
2. Color Lovers – 提供流行的配色方案趋势
3. Color Jack – 在线配色方案生成工具
4. Daily Color Scheme – 每日配色方案参考
5. Color Blender - 在线渐变色块生成器
6. Color Scheme Designer 3 - 网页设计开发提示，技巧和工具

其他在线资源

1. CSS Validator – W3C 的 CSS 验证服务
2. Napyfab – Ajax 加载动画效果
3. XHTML Validator W3C 的 XHTML 验证服务
4. SEO Moz – 快速获取搜索引擎优化的相关信息
5. EM Calculato – em 与 px 单位换算
6. Clean CSS - CSS 格式化与优化工具
7. CSS Type – 获得最佳屏幕呈现效果
8. Google Code Search – Google 代码搜索
9. Browser Shots – 不同浏览器环境的兼容性测试
10. Meta Tag Generator – 网页 Meta 信息生成器
11. Make Words – 提供域名注册建议
12. ROR Sitemap Generator – 强大的网站地图 (Sitemap) 生成器
13. Instant SQL Formatter – SQL 语句快速格式化
14. Font Tester – 在线字体测试服务
15. Poll Daddy – 免费创建在线投票，已被 WordPress 收购
16. Stripe Generator – Web2.0 设计者的最终工具
17. Smashing Magazine - 实用技巧，丰富的设计开发资源
18. Bittbox – 大量免费设计资源
19. Zamar – 在线文档格式转换
20. CSS Fly – 在线 CSS 编辑器

免费字体

1. Urban Fonts – 海量字体下载网站
2. Font Reactor – 免费字体共享服务
3. DaFont – 免费字体资源
4. Search Free Fonts – 方便的字体检索服务
5. 1001 Fonts – 超过 2000 种 TrueType 和 PostScript 字体库
6. Font Leech – 最好的免费字体收集博客

统计分析

1. Google Analytics – 谷歌分析，功能非常强大
2. Crazy Egg – 流量分析及网页设计可用性分析
3. Feedburner – RSS Feed 托管服务
4. reinvogorate – 提供流量追踪服务
5. W3 Counter – 免费流量统计服务
6. AW Stats – Web 日志分析工具
7. MyBlogLog – 博客数据分析服务
8. WebSideStory – 在线访问信息跟踪服务
9. Sitemeter – 老牌免费流量统计系统

英文原稿：The Web Designers Tool Kit | Dezinerfolio
翻译整理：Web 设计师工具集 | 芒果

推荐阅读

© 2009 芒果 版权所有 | 固定链接 | 4 条评论 | 标签 , , , ]]> http://www.mangguo.org/web-designer-tool-kit/feed/ 4 Color Palette Generator，在线图片拾色工具 http://www.mangguo.org/color-palette-generator-online-image-capture-tool/ http://www.mangguo.org/color-palette-generator-online-image-capture-tool/#comments Thu, 23 Apr 2009 16:21:20 +0000 芒果 http://www.mangguo.org/?p=1047 之前芒果介绍了 6 款在线配色工具，网页设计过程中，配色是非常关键的步骤，它可能直接决定了整体的协调和美观。当然，纯粹的颜色方案可以通过在线配色工具处理。可能需要协调图片和背景的颜色，使其色彩搭配更舒适。

Color Palette Generator 是一款功能简洁的在线图片拾色工具。允许通过输入图像 URL 或上传图像来自动生成与此图像匹配的调色板。这对于需要拾取图片颜色，并扩展为颜色方案的设计者而言，是非常实用的服务。

这款工具主要是通过对源图像进行分析，来提取主要颜色。调色板的颜色均给出相应的代码，方便于网页的整体配色。

除此之外，如果需要更多的配色方案，该工具主页推荐了 Color Hunter 网站，提供了较为丰富的配色资源，可根据提供的标签自助搜索。

Color Palette Generator 官方主页：http://www.degraeve.com/color-palette/

推荐阅读

© 2009 芒果 版权所有 | 固定链接 | 没有评论 | 标签 ]]> http://www.mangguo.org/color-palette-generator-online-image-capture-tool/feed/ 0 6 款在线配色工具 http://www.mangguo.org/6-online-color-matching-tool/ http://www.mangguo.org/6-online-color-matching-tool/#comments Tue, 21 Apr 2009 05:40:58 +0000 芒果 http://www.mangguo.org/?p=1022 网页配色看似简单，实则困难。没有良好的美术素养，要协调搭配网页颜色就显得比较吃力。芒果在此介绍一些实用的在线配色相关服务，使网页更符合视觉需求。

1. Kuler
来自 Adobe 的网络取色产品，是一款集调色、混色等工具于一身的 Web 应用程序。允许通过专业的配色系统创建自己的配色方案，并提供大量成熟的配色参考方案。全面支持 Creative Suite 4 软件套装。

2. Web Safe Colours
网页安全色是保证无偏差输出的色彩集合。网页设计中使用网页安全色，能防止浏览者看到的颜色和你看到的颜色偏差眼中的情况。

3. Color Schemer
颜色管理软件 Color Schemer Studio 的在线版本。专业配色工具，快速轻松地创建美观的颜色搭配方案。网页版本功能有缩减，但若需求不是很高的话简单的配色已经足够。

4. DailyColorScheme
提供多种配色方案，支持 Photoshop、Illustrator 等配色方案的下载，使你更方便地为网页配色。同时提供了 RSS 订阅功能。

5. Colortoy
Flash 形式的在线调色网站，使用 RGB 或者颜色代码生成相关颜色，支持颜色的随机拾取。

6. ColorJack
提供一张颜色表，只要鼠标停留在某个颜色块上，就会显示该颜色的配色参考方案。点击色块后进入具体方案，提供 HEX、RGB、HSV 等值。

推荐阅读

© 2009 芒果 版权所有 | 固定链接 | 没有评论 | 标签 , , ]]> http://www.mangguo.org/6-online-color-matching-tool/feed/ 0