天天看点

推荐60多个CSS GALLERY画廊网站

因为我个人平常就比较喜欢浏览Gallery站点,再加上这篇收集,总结一些小小的经验与大家分计和探讨,主要是做为一个收集展示画廊应该注意的一些地方:

求量同时求精。如果你想要被搜索引擎大量收录,想要更多的人知道你的网站,当然要从数量下功夫,但也不能乱收集。至少要在一定程序上保证收集的网站设计的质量。当然,这根本不算个问题,优秀的网站设计实在太多了,只怕你收不完。

良好的导航系统。收集的网站过多了,一个良好的导航就显得非常重要了,那些收录几千几万网站设计的画廊,却只是给个分页导航,我不知道这几千几万要了干嘛。通常,如果能做到按网站配色和内容进行分类,已经很不错了。

突出自己的网站个性。这适用于任何一个网站,画廊站点当然适用,特别是Gallery站点也是相当的多,而且有着其独特性: 相对于其它类型的网站注重搜索引擎,Gallery站点对”回头客”的比例更加的注重。说实话,要想Gallery站点的页面在搜索引擎获得良好的关键字排名不太现实。所以,塑造出自己的个性,抓住设计爱好者的眼球才是最重要的。

自己收集还是让用户提交。让用户提交当然是最圆满的,省时省力同时还容易建立人气。但要做到拥有大量的用户,那还真是相当的困难。

网站的设计。一个设计爱好者,到一个Gallery站点,就是为了享受视觉。所以,你收录很多优秀的设计同时,你网站本身的设计也是相当重要的,尤其是网站的整个配色基调,将影响到收录作品的视觉传达。最常见的Gallery配色要么使用白底显得清新,要么使用黑底更加凸现出收录作品。而似乎黑色背景让人在浏览时更加舒服。

缩略图。这也是一个很重要的部分。最常见的缩略图展示,要么就是截取所要收录的网站设计中最醒目的一部分设计截图进行展示。要么直接截屏,让用户能够直观的看到将要到达的网站的总体设计。

OK, 开始品尝帕兰为你准备的这些Gallery美食吧:)

<a href="http://www.cssdrive.com/" target="_blank">CSS Drive</a>

收录各种网页设计。含评级功能,设计技巧新闻栏目,拥有一个论坛和CSS菜单收录专项。主要按网站类型,网页布局和风格分类。

<a href="http://www.css-website.com/" target="_blank">CSS Website</a>

非常清新简单的一个CSS Gallery站点。每个收录的设计显示评级和留言数,可以通过色彩,收录日期和网站类型进行高级搜索。 

<a href="http://www.csselite.com/" target="_blank">CSSelite</a>

分类比较简单,按设计风格和网站类型。没有评级功能,单页有相关的网站设计展示,首页有一些来自其它网站最新的设计技巧文章链接。

<a href="http://www.cssbeauty.com/gallery/" target="_blank">CSS Beauty</a>

比较知名的网页设计资源站点CSS Beauty的Gallery子站点。没有评级,没有留言等据显示。非常单一的显示最新的20个收录设计,可以按日期归档进行查询。是比较清新简洁了,但同时意味着失去了一个良好的导航。

<a href="http://www.cssheroes.com/" target="_blank">CSS Heroes</a>

显示留言数和评级功能。按网站类型进行分类。黑色背景的Gallery站点在浏览时感觉很舒服,但同时会让人对所收录作品的优秀产生错觉判断,也就是说,一些可能并不太漂亮的设计,会凸现的很醒目。个人看法。

<a href="http://www.cssbloom.com/categories/css-gallery/" target="_blank">CSS Bloom</a>

博客一栏式的收录展示画廊,按网站类型和所使用的技术进行分类。帕兰个人不太喜欢这种类型的画廊,虽然站点缩略图比较大,但老需要滚屏,很麻烦。显示留言数和评级功能。

<a href="http://www.free-css.com/css-gallery.php" target="_blank">CSS Gallery (CO UK)</a>

一个英国的CSS画廊站点。没有评级,没有分类,不过却有XTHML和CSS验证功能。相信站长在收录时也是严格按照W3C的标准进行收集。另外,这个站点还设有其它一些非常有用的栏目,比如免费的CSS菜单,CSS使用教程,CSS布局等等。

<a href="http://www.cssheaven.com/" target="_blank">CSS Heaven</a>

<a href="http://www.cssgallery.ro/galerie.html" target="_blank">CSS Gallery (Ro)</a>

一个罗马尼亚的CSS画廊站点。包含评级功能和留言数显示,以及网站作者。没有发现分类功能。网站的整体设计趋于Web2.0风格,但个人还是不喜欢它的底色造成的视觉反差。

<a href="http://www.csszone.org/" target="_blank">CSS Zone</a>

按网站类型分类,有评级功能,还算不错。

CSS coosite

<a href="http://www.unmatchedstyle.com/" target="_blank">Unmatchedstyle</a>

分类相对来说笼统一点。不过网站整体设计还是比较优秀的,有利于浏览欣赏。同时提供一些来自其它网站的设计资源链接。

<a href="http://cssvault.com/gallery/" target="_blank">CSS vault</a>

有评级和留言功能。但是却是按日期存档进行分类。 我不知道这样的分类有多大意义,一个好的设计不在乎时间。

<a href="http://www.cssimport.com/" target="_blank">CSS import</a>

没有分类。不过可以按最热点击,最多浏览,名称和评级等进行排序浏览。

<a href="http://www.css-galleries.com/" target="_blank">CSS Galleries</a>

这是一个专门聚合其它CSS画廊站点收录作品的站点。比如我们上面提到的CSS Drive。但是没有分类,没有评级。还一直让我Stand by… 无语。

<a href="http://bestwebgallery.com/" target="_blank">Best Web Gallery</a>

来自Nick la的画廊站点,这应该是所有画廊站点里面最优秀之一了。按TAG标签分类,浏览布局可以切换为一栏式,两栏式以及含站点介绍信息的布局。鼠标浮动在站点上面时,会显示大的缩略图。不管从技术性还是收录网站的设计水平,都绝对是一流。就像Nick la说的那样,他的收录标准是: 一个高质量的设计=视觉+技术+创意。帕兰曾非常不自量力的提交自己的站点,结果… 呃,当然是可想而知了。

<a href="http://www.css20.com/" target="_blank">CSS Gallery 2.0</a>

网站设计比较清新。 含评级功能,有很多相关的最新设计技巧资源,比如Flash设计资源,CSS设计资源,设计工具资源等等。

<a href="http://www.cssleak.com/" target="_blank">CSS leak</a>

有评级功能。 有相关设计新闻。可以按热门评级,热门点击等进行排序浏览。可以按月或者是按网站配色进行浏览。

<a href="http://www.cssglance.com/category/gallery/number-of-columns/vcol2/" target="_blank">CSS Glance</a>

这也是一个比较优秀功能比较丰富的画廊站点。可以切换浏览布局,有评级和HTML校验功能。 最优秀的地方在于,它的分类非常详细,可以按网站所使用的程序,网站配色,网站所在国家,网站布局有几栏,网站内容,日期归档,布局技术甚至是菜单几格进行浏览。同时,支持标签搜索功能。推荐。

<a href="http://www.csstux.com/" target="_blank">CSS TUX</a>

一个充满圆角设计的CSS画廊站点。按网站类型和内容进行分类。看上去非常酷,不过导航系统还是欠缺了点。

<a href="http://www.cssbased.com/" target="_blank">CSS based</a>

含评级功能和提供一些相关的设计资源,但惟乎没有分类系统。

<a href="http://www.cssburst.com/" target="_blank">CSS Burst</a>

好像是一个上线不久的CSS画廊站点,收录的作品不多。不过都还算比较精致,网站的设计所制造出的视觉浏览体验也比较好。 但似乎同样缺乏一个良好的导航。

Best CSS Gallery

<a href="http://www.designshack.co.uk/" target="_blank">Deisgn Shack</a>

附加一些最新的设计信息。但同样没有良好的浏览导航。

<a href="http://css-warfare.com/" target="_blank">CSS Warfare</a>

含评级功能,按网站风格进行分类。

<a href="http://css-demo.com/" target="_blank">CSS Demo</a>

比较个性的CSS演示站点,但确实不实用。

CSS Galaxy

也是非常个性,只是网站缩略图小了点。按设计类型进行分类。

<a href="http://www.cssfill.com/" target="_blank">CSS FILL</a>

按网站类型进行分类,截取网页的很细一部分做为缩略图。 有点唬烂。

<a href="http://www.cssclip.com/" target="_blank">CSS Clip</a>

有评级功能。缩略图比较上,不过功能还是非常强大。收集的设计种类也比较多,可以按设计类型,网站配色等进行浏览。只是感觉这个画廊站眯的设计相对的拥挤了一点。

<a href="http://csscollection.com/" target="_blank">CSS Collection</a>

按网站内容进行分类的设计收集站点。

<a href="http://www.ceeses.com/" target="_blank">CeeSes</a>

有评级功能,网站整体比较清新。

<a href="http://galerie.crooco.com/index.php?p=galerie" target="_blank">CSS Galerie</a>

缩略图比例不太恰当,且排版过于拥挤。

<a href="http://csshazard.com/" target="_blank">CSS Hazard</a>

趋于收集非主流的个性设计。给人妖艳怪异的感觉,非常适合那些崇尚个性的朋友。另外 ,可以按网站配色标签进行浏览。

<a href="http://cssmania.com/" target="_blank">CSS Mania</a>

这个画廊站点设计总体来说比较清新,按网站内容进行分类。

CSS Reboot

主要按网站配色进行分类,不过最大的特点是,缩略图展示的区域比较多,可以很清楚的看出一个网站的设计。

<a href="http://cssprincess.com/" target="_blank">Prin CSS</a>

有评级功能,分类和标签结合的比较好,可以按网站配色,使用的技术,网站内容等来进行浏览。

<a href="http://cssremix.com/" target="_blank">CSS Remix</a>

这个CSS画廊站点也算是比较知名的了,我觉得它最大的特色就如同域名所指出的那样,混合,感觉似乎想要把所有站点拼成一幅图画似的。我个人不太喜欢这种全部挤在一起影响视觉判断的GALLERY站点,但其收录的资源确实相当的丰富,且质量都很高。

<a href="http://csssmoothoperator.com/" target="_blank">CSS SMOOTH OPERATOR</a>

分类过于单一,不过网站设计的挺个性的。

<a href="http://csslove.net/" target="_blank">CSSlove</a>

没有分类,没有评级,就显示个名称和缩略图,广告和其它Widget比主体内容还要多。

<a href="http://www.piepmatzel.de/" target="_blank">Piepmatzel</a>

百万格式式的网站设计收藏展示站点。像这样的网站有很多,怎么说呢,虽然缺乏良好的导航,详细的信息介绍,但这样的设计展示还是蛮有趣的。至少站长愿意牺牲网页打开速度可能流失的用户和本该属于广告位的空间,这样的站点更多趋于那些真心想要分享美好设计的朋友。

<a href="http://www.mostinspired.com/" target="_blank">Most Inspired</a>

这站点除了本身收集展示网站设计,同时还聚合其它热门的GALLERY站点的收集。

<a href="http://www.designsnack.com/" target="_blank">Design snack</a>

有评级功能,按网站内容进行分类。

<a href="http://www.cssimpress.com/" target="_blank">CSS impress</a>

按网站内容进行分类,有评级功能。整体设计比较清新,缩略图展示区域也比较多。

<a href="http://www.lightondark.com/sites/" target="_blank">Light on dark</a>

导航不够完善,但非常优秀。 我喜欢这个画廊站点的另一个原因是他所传达出来的概念,Light on dark。做为一个画廊站点,站点本身应该是绿叶,所收集的网站设计才是红花。这也跟帕兰一贯对设计的看法相同: 世界本是无色的,因为设计而变得丰富多彩。

<a href="http://screenfluent.com/" target="_blank">Screen Fluent</a>

收录近7000个优秀的网站设计。没有评级,没有好的导航。有Lightbox的预览功能。所以,有得必有失。

<a href="http://www.webcreme.com/" target="_blank">Web Creme</a>

这恐怕是我个人到目前为止最喜欢的“一行只展示一个作品”的画廊站点了。界面清新,缩略图品质和可预览区域也比较广。推荐。

<a href="http://styleboost.com/" target="_blank">Styleboost</a>

相对于其它Gallery站点强调的视觉感官欣赏。Styleboost更加注重对每个网页设计的介绍。同时,你可以在Styleboost进行注册,收录你喜欢的网站到你的帐户空间里面。

<a href="http://www.w3csites.com/" target="_blank">W3C Sites</a>

收录优秀且符合W3C标准的网站,附有XTHML校验功能。每个网站都有简短的描述介绍。支持用户注册,看上去注册的人还挺多,网站的大部分内容也是由用户提供。

<a href="http://www.refreshlinks.org.uk/" target="_blank">Refresh</a>

绝佳的画廊展示站点。 有评级功能的简短的收录设计描述。整个站点设计简洁美观大方。我最喜欢的是他们的Logo,非常的赞.

<a href="http://www.edustyle.net/" target="_blank">edustyle</a>

类似Digg的投票制度,这也是在这个名单面唯一的一个让你对网站设计进行赞同时也可以进行鄙视的网站。

<a href="http://www.designcreme.com/" target="_blank">Design Creme</a>

收录的设计还不是太多。 可以按标签和分类进行浏览。

<a href="http://www.designbygrid.com/" target="_blank">Design by Grid</a>

专门收集展示网格设计的GALLERY站点。还包括相关的日志,教程和资源。如果你像帕兰一样钟爱网格设计,那这个站点一定不能错过。

<a href="http://www.coolsitecollection.com/" target="_blank">Cool site Collection</a>

有评级功能,还行吧。

<a href="http://www.cartedup.com/sites/archive" target="_blank">Carted up</a>

本身就是网格设计的GALLERY站点,工整美观。Tag标签系统也利用的比较好,方便用户的过滤欣赏。

<a href="http://www.plasticpilots.com/" target="_blank">Plasticpilots</a>

分类比较详细,每个站点都有简短的描述。

<a href="http://www.inspirationking.com/" target="_blank">Inspiration King</a>

导航比较欠缺。

<a href="http://www.cssdump.com/" target="_blank">CSS Dump</a>

最后这个完全缺乏视觉设计的Gallery站点,只为你了向你说明一个道理: 如果你是一个设计爱好者,哪怕你完全不懂设计,只是喜欢欣赏,你想要展示分享自己发现的美好设计。那即使你使用WP的默认主题来收集,你同样可以体验分享的快乐。

OK,如果你知道其它优秀的Gallery画廊站点,也欢迎在些留言提出。

<a target="_blank" href="http://www.cnblogs.com/lhb25/p/must-read-links-for-web-designers-and-developers-volume-12.html">Web 前端工程师和设计师必读精华文章推荐</a>

<a href="http://www.cnblogs.com/lhb25//lhb25/archive/2011/07/28/html5-awesome-single-page-sites-inspiration.html" target="_blank">酷!15个精美的 HTML5 单页网站作品欣赏</a>

<a target="_blank" href="http://www.cnblogs.com/lhb25//lhb25/archive/2011/11/22/best-awesome-css3-animation-demos.html">炫!35个让人惊讶的 CSS3 动画效果演示</a>

<a href="http://www.cnblogs.com/lhb25//lhb25/archive/2012/03/02/30-mind-blowing-parallax-scrolling-effect-websites.html" target="_blank">赞!30个与众不同的优秀视差滚动效果网站</a>

<a target="_blank" href="http://www.cnblogs.com/lhb25//lhb25/archive/2012/01/13/25-outstanding-single-page-website-designs.html">靓å!25个优秀的国外单页网站设计作品欣赏</a>

<a target="_blank" href="http://www.cnblogs.com/lhb25//lhb25/archive/2011/08/09/awesome-html5-and-javascript-effects.html">帅!8个惊艳的 HTML5 和 JavaScript 特效</a>

<a href="http://www.cnblogs.com/lhb25//lhb25/archive/2011/06/27/35-exclusive-rainbow-colored-flash-websites.html" target="_blank">顶!35个很漂亮的国外 Flash 网站作品欣赏</a>

<a href="http://www.cnblogs.com/lhb25//lhb25/archive/2011/08/24/outstanding-admin-panels-part-one.html" target="_blank">哇!34个漂亮网站和应用程序后台管理界面</a>

推荐60多个CSS GALLERY画廊网站

<a href="http://www.yyyweb.com/go/web" target="_blank">本博客新站点 ◆ 前端里 ◆ 欢迎围观:)</a>

欢迎任何形式的转载,但请务必注明出处。