插图式主页

最近,网站设计有一个新的趋势。

很多网站的首页,完全以一张图片作为主题,文字信息很少,只有几个主要链接,就像一张插图。我把这种主页称为"插图式主页"(illustration web design)。

Tripwire Magazine对这种设计做了总结,下面就是一些实例。

你可以看到它们的视觉效果非常漂亮,对访问者产生很强的粘性。而且,非常突出重点,诉求很明确,有效地达到了设计目的。

我觉得,这种设计是未来的潮流。十年前,Google亮相,首页上就是一个搜索框,别的什么也没有。十年后,设计师们开始觉得,除了搜索框,再加上一个图片主题,似乎更好。

=========================

1. 2ammedia是典型的插图式主页,上部是菜单栏,下部是三个主要功能,中间的一大块都用来做宣传。


2. dibiconference是一个互联网会议的主页,除了菜单栏以外,只放了一个购票链接,非常醒目。


3. culinaria是一家礼仪服务公司,主页简单到就是一张图和一句话。


4. alexantuna也是一个这样的例子。


5. krojacevaskola(网页设计公司)将一张暖色的照片作为背景,然后以两个大色块突出主要信息。


6. Josh Hemsley的个人主页,直接以脸部照片作为背景,很酷啊。


7. Gil De Los Santos的个人主页,也非常简洁漂亮。


8. Mike Condrick的个人主页,以三个色块突出主要内容。


9. Aneta Langerova的主页也很漂亮,但是Blog内容放在这么小的框里,实在很不利于阅读。


10. Alley Pfannekuchen的主页设计,一眼就能让人对这家餐厅产生好感,而且明白它的主要特色就是现代感。


11. marina yachting的主页就是一张图片,几乎看不出这是一个游艇俱乐部的网页,内容过分简洁了。如果左上角的徽标放大到100%高度,效果应该会更好。


12. the ship and the sea是一张关于大海和航行的CD,左边那两个数字是售价,点击进入购买链接。这个设计非常有现代感和艺术气息。


13. kawa.lviv.ua是咖啡馆。


14. psdchimp是一个分割PSD格式图片的软件,主页非常简单,左边是功能介绍,右边是一个卡通图片。


15. kmirza是一个提供版权服务的个人网站,主页上用一行大字说明了服务特色。


16. people82很规范的设计和布局。


17. Jasno i Glasno是一对夫妻的Blog,采用了卡通样式。


18. joby的个人主页,主要用来找工作,相信任何一个雇主都会不由自主,点进去仔细看。


19. ColouringCode的特色是右上角的Logo,下一步点击哪里,一目了然。


20. 690design是设计公司的网站,很简洁地列出了主要业务。


21. Lucia Soto的个人主页,突出了个人的姓名。


22. Stone Skipper是一个iPhone游戏,只要提供一个App Store的链接就行了。


23. Logo Design Monster是Logo设计公司。


24. Less Cruise是一次游艇旅行活动,突出了活动主题,以及时间和地点。


25. Paul Ramirez的主页很酷,除了名字以外,就没有文字了。


26. shark lab是水族馆的网站,非常好地突出了上方那段文字,使得访问者非读不可。


27.Jeannie Web是一家女性设计公司。


28. bam是一家设计公司,主页比较简单,但是颜色的对比效果比较强烈。


29. Kinetic Shadows的这个主页,很aggressive(进攻性的)。


30. Pigeon and Pigeonette是一本图画书的主页。


31. Creative People(设计工作室)的主页图片很奇特,令人印象深刻。


32. Alex Abramov(设计师)的个人主页。


33. Eric Johansson的主页很有特色,底部有一个拉动条,建议自己动手去玩一下。


UPDATE 2010.6.26

cnbeta有一篇《2010网页设计趋势》的译文,很好地总结了这种设计趋势的9个特征。

1)采用印刷式设计;

2)更多地采用衬线字体;

3)采用大字号的标题;

4)采用多列布局;

5)配图越来越大;

6)更多地用图表传递信息;

7)采用简约的设计;

8)单页布局,用一个页面表示内容;

9)巨型的留白空间。

===================

P.S.

一个告示。

上周,Feedburner被屏蔽,而我的Feed托管在上面。导致国内访问者无法打开,或者在Google Reader中点击后,出现提示:"抱歉,发生意外情况,阻碍了 Google 阅读器完成请求。"

我原以为,大家都知道怎么处理,就没提这件事。现在发现,还是有好多朋友不知道怎么办。

那么,如果你属于上面的情况,可以看看我新加的一个页面《Feed订阅方法》

(完)

时间: 2024-10-09 20:01:26

插图式主页的相关文章

Frontpage2000中文教程:第三章 制作你的第一个主页(1)

frontpage|教程|中文  知道了一个网站的结构之后,你是否很想马上动手制作网站里面的网页?那好,我们本章就来学习如何制作. 首先我们运行Frontpage2000,并且打开一个站点.在打开站点之后我们就要在制作窗的编辑区里面开始工作了.如果你忘记了什么是制作窗或者什么是编辑区的话,你可以复习一下本教程的第一章. 如笔者在第一章所比喻的一样,网页就象一张白纸,该如何让它显得美观,华丽,关键是要看网页设计者自己.网页中少不了文字和图象,把文字和图象摆在自己希望的位置,一个网页就出来了.其实制

Frontpage2000中文教程:第三章 制作你的第一个主页(2)

frontpage|教程|中文  你可能实在是很厌恶上一节中所做的那个网页,因为实在是太"次"了!那好,我们接着学,争取更专业:)上一节当中我们做的网页(如图8),给人的第一感觉除了是"次"的要死以外就是凌乱. (图8) 网页就是这样,要想给人一种视觉上的冲击或是享受,你就必须会搭配文字与图片等等元素.就图8上面的这个网页来说吧,如果把文字和图片摆在中间的话,感觉还会好一些.但是我们要怎么样做才能更方便地把网页上的元素整齐地摆放好呢?这就要用到表格了.表格在网页中是

卓越SEO:Site网站主页不在首位分析与解决

前段时间比较忙,很久没有给大家带来好文章了,希望卓越SEO今天分享的SITE网站主页不在首位的解决办法能够给你带来实际的帮助.我写的文章是经过自己的亲身体验,结合实际恢复操作办法写的文章.希望大家能够顶我一下!!好了废话不再多说下面进入正题. 案例网站SITE主页消失经过 一是因为9月份服务器出现问题,全部数据丢失,不得不在文章中说下国外IDC,数据无备份,服务器硬盘坏了数据丢失用户承担全部责任.二是因为服务器数据丢失之后由于忙也没管过这个网站导致了.SITE域名不在首位的情况.排名从原本的第二

用Word打造自己的方便个性主页

  我使用的是Word2003! ①首先打开word2003,然后在左下方将视图设置为"Web 版式视图"; 用Word打造自己的方便个性主页 - Web 版式视图 ②然后在常用工具栏中的"插入表格"中拖一个3 x 3的表格出来; 用Word打造自己的方便个性主页 - 插入3 x 3的表格 ③将表格拖动设置到全屏幕大小; 用Word打造自己的方便个性主页 ④在最中间的表格中再插入一个表格; 用Word打造自己的方便个性主页 - 再次插入表格 ⑤在中间的小表格里面填写

PHP基于反射机制实现插件的可插拔设计详解_php技巧

本文实例讲述了PHP基于反射机制实现插件的可插拔设计.分享给大家供大家参考,具体如下: 说PHP和ASP等同的朋友们可以就此打住了,PHP支持反射,而且还是非常的强大.好了,我们开始今天的话题. 功能描述: 页面拥有一个主导航菜单,里头有默认连接若干. 插件统一存放在一个目录,插件载入后会自动在导航菜单中增加上自己所需的链接. 插件载入时可执行一定的操作. 动态增删插件无需改动代码. 最终效果: 首页,插件1,插件2 "首页"是系统自带的菜单项."插件1"和&quo

Facebook视频插广告会是个好生意吗

今年2月,Facebook重磅宣布正式推出视频中段插播广告,并与视频的生产方分成,原po主可获得55%的广告营收.两个月过去了,这一计划进展如何?用户体验是否友好?本期全媒派(qq_qmp)带来常驻洛杉矶的资深社交媒体观察记者Tim Peterson的一篇亲历测评. 我第一次在Facebook上遇到插播广告的时候,是在看一个叫"不穿裤子上法庭"的视频. 片子里讲的是肯塔基州法庭里的故事,由主张以摩登方式全方位解构新闻的新媒体网站Mic发布在其Facebook主页上.看这广告出现的架势,

广西自治区民政厅推出实景网络祭拜模式,为传统文化插上信息化翅膀

广西新闻网南宁讯 (记者贾经纬)网络祭拜虽然符合http://www.aliyun.com/zixun/aggregation/31612.html">绿色环保的理念,但模拟的墓碑.牌位还是让多数祭拜人员感觉缺乏情感.为推行节地.低碳.环保的祭祀新风,本月,自治区民政厅在国内首先推出实景网络祭拜模式,让祭拜这项中国古传统文化插上信息化的翅膀. "去年清明期间我在一家祭祀网站上帮爷爷建了个纪念馆,没过多久,纪念馆就不存在了",市民龙先生去年清明节在南宁值班,谈及在网上建纪

为电子商务插上社会化的翅膀(二):四字箴言

中介交易 SEO诊断 淘宝客 云主机 技术大厅 接昨天的话题为电子商务插上社会化的翅膀(一),今天开始写写PPT中最后一部分,电子商务网站(这里主要是针对网络零售商)如何实现社会化.也许现在很多电子商务网站或多或少都在做这个事情,或者有计划要做,而做的最多的事情是通过社会化媒体去做一些推广工作,今天我会比较全面的为大家介绍下电子商务网站如何实现社会化. 电子商务网站实现社会化的四字箴言 电子商务网站实现社会化,必须要内外兼修,而我提出的四字箴言添(特性),育(社区),接(关系),建(基地)也是从

联想智能插线板常见问题介绍

故障现象: 联想智能插线板常见问题. 解决方案: 1.联想智能插线板接入的电器有限制吗?   联想智能插线板可以接最大8A电流的设备,允许功率约2000W,如超过此功率可能引发联想过载保护器弹出.其中阻性负载(如电饭煲.电暖器.电烤箱.电压力锅.电热棒等大部分加热设备以及白炽灯.卤素灯)不允许超过2000W,感性负载(如电风扇.洗衣机.空调.油烟机等有电机设备以及荧光灯.节能灯)不允许超过800W,容性负载(台式电脑.电视机.电磁炉.微波炉等家用电器)不允许超过700W.   2.联想智能插线板