前端观察 » 网站 http://www.qianduan.net 专注于网站前端设计与前端开发 Wed, 08 Feb 2012 05:05:28 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 30个非常华美的网站设计 http://www.qianduan.net/30-extremely-colourful-website-designs.html http://www.qianduan.net/30-extremely-colourful-website-designs.html#comments Mon, 19 Oct 2009 14:55:19 +0000 神飞 http://www.qianduan.net/?p=11441 中文：30个非常华美的网站设计
译自：30 Extremely Colourful Website Designs
版权所有，转载请注明出处，多谢！

我编辑了一个使用全彩色的最佳网站展示列表。这些网站很好的使用了色彩以使它们出类拔萃，最重要的是让它看起来很漂亮。这些网站中使用的阴影、渐变和色盘让它们引人注目。建议点击图片访问网站亲自体验一下这些网站。它们中的一些交互设计也是很棒的！另外，如果你发现了某个很好的中文网站设计，请通过评论提交个我们，多谢。

Calypso Park

Calypso Park

Pixele

Pixele

Peminoz

Peminoz

Colour Pixel

Colour Pixel

Mbdizajn

Mbdizajn

Life Lab

Life Lab

Arkix

Arkix

Yeahstyledg / Freelancer

Yeahstyledg / Freelancer

Cotton Seed Oil Tour

Cotton Seed Oil Tour

Raduceuca

Raduceuca

Navigant Consulting

Navigant Consulting

Daguia

Daguia

Casio Exlim

Casio Exlim

Albert Lo Design

Albert Lo Design

Havaianas

Havaianas

Razorbraille

Razorbraille

Actionhead Studios

Actionhead Studios

Design Slurp

Design Slurp

Gisele Jaquenod

Gisele Jaquenod

Icff

Icff

I Love Colors

I Love Colors

Marcos Xotoko

Marcos Xotoko

Beautiful 2

Beautiful 2

Bart

Bart

Foehn

Foehn

Make Photoshop Faster

Make Photoshop Faster

Will Portifolio

Will Portifolio

Team Tsok

Team Tsok

Feed Stitch

Feed Stitch

Visit Cascadia

Visit Cascadia

]]> http://www.qianduan.net/30-extremely-colourful-website-designs.html/feed 3 40多个很有创意的单页网站设计 http://www.qianduan.net/more-than-40-very-creative-one-page-website-design.html http://www.qianduan.net/more-than-40-very-creative-one-page-website-design.html#comments Fri, 13 Feb 2009 02:53:07 +0000 神飞 http://www.qianduan.net/?p=4944 看看一个设计师在一个单独的页面中能做些什么是件很有趣的事情。有的时候，单页网站可以传达比多页网站更多的信息。单页网站设计适用于没有太多内容的情况。有的设计师使用页签(tabs)、折叠(accordion)效果来在一个页面中展现更多的信息。作品集网站常常是单页网站的一个完美例子，它可以让访问者很容易的看到内容。非作品集网站根据需求也将很有意义。

貌似单页网站可以让设计师自由的创作比传统的多页网站更独特的东东。或许是因为你只需要让它们在一个页面上实现就行了……

现在让前端观察带你欣赏一下这40个很有创意的单页网站设计吧：

1) Alessandro Cavakllo

40+ impressive Single Page Websites

2) Gotta Get To FOWA

40+ impressive Single Page Websites

3) Yura Sklyar

40+ impressive Single Page Websites

4) Basil Galoo

40+ impressive Single Page Websites

5) Fabiano Meneghetti

40+ impressive Single Page Websites

6) Ayush Sara

40+ impressive Single Page Websites

7) Deaxon

40+ impressive Single Page Websites

8) Alexandru Cohaniuc

40+ impressive Single Page Websites

9) Edit Studios

40+ impressive Single Page Websites

10) James Lai Creative

40+ impressive Single Page Websites

11) Red+White Sale

40+ impressive Single Page Websites

12) Tomas Pojeta

40+ impressive Single Page Websites

13) New Media Production

40+ impressive Single Page Websites

14) Brian Murchison

40+ impressive Single Page Websites

15) Stanislav Krofta

40+ impressive Single Page Websites

16) Tvrdek

40+ impressive Single Page Websites

17) Feelwire

40+ impressive Single Page Websites

18) luke stevens

40+ impressive Single Page Websites

19) Cpeople

40+ impressive Single Page Websites

20) Pikaboo

40+ impressive Single Page Websites

21) Rzmota

40+ impressive Single Page Websites

22) tomatic

40+ impressive Single Page Websites

23) Giat Creative

40+ impressive Single Page Websites

24) Marius Roosendaal

40+ impressive Single Page Websites

25) SOFA Designs

40+ impressive Single Page Websites

26) Daniel Stenberg

40+ impressive Single Page Websites

27) Chris Spooner

40+ impressive Single Page Websites

28) Tyler Finck

40+ impressive Single Page Websites

29) We Bleed Design

40+ impressive Single Page Websites

30) Delegu Studios

40+ impressive Single Page Websites

31) Designed by Dave

40+ impressive Single Page Websites

32) Portfolio de Guillaume Pacheco

40+ impressive Single Page Websites

33) Color Pixel

40+ impressive Single Page Websites

34) Jason Reed Web Design

40+ impressive Single Page Websites

35) Lonely Tweet

40+ impressive Single Page Websites

36) Maurivan Luiz

40+ impressive Single Page Websites

37) Just Dot

40+ impressive Single Page Websites

38) NerdoPlex

40+ impressive Single Page Websites

39) Sroown

40+ impressive Single Page Websites

40) Stage 5 Studio

40+ impressive Single Page Websites

41) Veeboo Labs

40+ impressive Single Page Websites

42) Zach Klein

40+ impressive Single Page Websites

]]> http://www.qianduan.net/more-than-40-very-creative-one-page-website-design.html/feed 2 15个粉色系网站欣赏【WA】 http://www.qianduan.net/15-pink-wa-department-web-site-to-appreciate.html http://www.qianduan.net/15-pink-wa-department-web-site-to-appreciate.html#comments Fri, 09 Jan 2009 15:20:53 +0000 神飞 http://www.qianduan.net/?p=3519 15个漂亮的粉色系网站收集，希望能给你提供参考……

cssprincess.com

CSS Princess

 

simplycreative.com

SimplyCreative

thinkpinkstudio.com

ThinkPink Studio

zecco.com

Zecco

3dshop.cz

3Dshop

draftmedia.de

Draftmedia

encina.se

Encina Creative

hyperdog.se

HyperDog

venusmed.com

Venus Medical Beauty

en.eyeka.com

Eyeka

aurea.es/lang/en/

Aurea

daleharris.com

Dale Harris

telia.dk

Telia

minusfive.com

Minusfive

stonewall.co.za

StoneWall

]]> http://www.qianduan.net/15-pink-wa-department-web-site-to-appreciate.html/feed 0 22个很棒的美国旅游网站 http://www.qianduan.net/22-great-american-travel-sites.html http://www.qianduan.net/22-great-american-travel-sites.html#comments Fri, 09 Jan 2009 13:47:18 +0000 神飞 http://www.qianduan.net/?p=3442 让我们来继续看看美国旅游网站，本文收集并探讨了美国各州用于旅游的网站设计。这些网站中的许多看起来要比他们的政府网站看起来更美观。当然，并不是所有的网站都是出类拔萃的，这些是最好的一批。

1. Ohio

Discover Ohio

2. Utah

utah

3. Rhode Island

rhode

4. Pennsylvania

penn

5. New Hampshire

newhampshire

6. Idaho

idaho

7. Tennessee

tennessee

8. Wisconsin

wisconsin

9. Washington

washington

10. Maine

maine

11. Oregon

oregon

12. North Dakota

northdakota

13. South Dakota

southdakota

14. Illinois

illinois

15. Missouri

missouri

16. Texas

texas

17. Virginia

virginia

18. Georgia

georgia

19. Massachusetts

mass

20. New York

newyork

21. Kentucky

kentucky

22. Hawaii

hawaii

总体趋势

纵观这些网站，我们能发现一些共性：

  • JQuery 或 Flash动画头部
  • 大图片背景
  • 图片辅助布局
  • 合理的空白，看起来不拥挤
  • 鲜明的对比色彩

你见过很棒的国内旅游网站设计吗？我希望什么时候中国的政府也能真正重视信息化建设，很好的利用网络来宣传自己的特色。

]]> http://www.qianduan.net/22-great-american-travel-sites.html/feed 0 12个网站代码技巧 http://www.qianduan.net/12-site-code-skills.html http://www.qianduan.net/12-site-code-skills.html#comments Sat, 06 Dec 2008 18:18:14 +0000 神飞 http://www.qianduan.net/?p=524 漂亮的代码是漂亮网站的基础，优秀的 CSS 只存在与同样优秀的 HTML 之上，干净的，语义的 HTML 代码让一个网站更健壮。本文讲述了12个实现干净 Web 设计代码的技巧，适合于任何从事 Web 设计的人。

1. Strict DOCTYPE

要做就做对的。不管是 HTML 4.01 还是 XHTML 1.0，它们都提供 Strict 模式，使用 Strict 模式可以保证我们的代码不隐藏任何错误。

参考资料:

2. 字符集声明，特殊字符进行编码处理

字符集声明应当放在 <hea> 部分的最前面，以便让浏览器知道如何显示网页中的所有内容，包括标题。另外，一些特殊字符，如 & 最好用 &amp; 代替，这是一种最安全的方法。

参考资料:

3. 恰当的缩进

缩进不会影响网页的渲染，但会明显改善阅读源代码时的体验。缩进没有特定的规则，但始终保持一致是个好习惯。

参考资料:

4. 将 CSS 和 JavaScript 放在外部文件中

将 CSS 和 JavaScript 放在外部文件中引用，不仅减低单个网页的尺寸，而且意味着其它网页也可以共用这些代码，另外，浏览器的缓存机制可以很好地降低对相同代码的重复下载。

5. 正确地嵌套 Tag 标签

如下图，第一行代码中，<h1>标签嵌套在 <a>标签中，尽管多数浏览器会正确渲染，但这不是好的习惯， 标签是 block 对象，而 是 inline 对象，inline 对象不应该容纳 block 对象。

6. 消除不必要的 <div>

<div> 常被滥用（尤其在我们现在所处的 DIV+CSS 神话中 – 译者），人们希望把任何东西都放在 <div> 中以便为它们分配 CSS 式样，这种滥用会导致的臃肿。

参考资料:

7. 使用更好的命名规则

如下图，Cat 的 CSS 类被命名为 red italic，暗示着 Cat 使用红色斜体，如果你想将 Cat 改成兰色的粗体呢？

8. 尽量使用 CSS 控制文字的排版

如下图所示，不要直接使用大写，用 CSS 对这些文字排版方面的格式进行控制，这样会更灵活。

9. 为 <body> 分配独立的 class/id

为 body Tag 分配一个独立的 class/id，可以很好地定位页面中任何对象，因为页面中所有对象都位于 body 中。

参考资料:

10. 验证

无需多言，你应当尽可能对网页的代码进行验证，尽管有些代码错误浏览器能自动更正，但有些错误是会带来不好的后果的，尤其当你位于 Strict 模式下。即使什么都不为，看到那个绿色的 W3C 验证标志至少可以让自己舒服一些。

W3C 验证是否通过并不一定要什么拘泥，Web 设计中存在更多的考量，只拘泥 W3C 验证结果，可能影响一些更重要的因素，比如，IE6 在 W3C 标准方面存在不少 BUG，如果你为了100%通过 W3C 验证而宣布自己的网站不支持 IE6，至少在国内会得不偿失的 – 译者

参考资料:

11. 合理的结构次序

将网页结构保持一个合乎逻辑的次序。

12. 尽你所能

如果你从零开始写，保持以上的原则当然要容易的多，如果要修改旧的代码，将会很痛苦，一些 CMS 系统拙劣的编码会让你陷入泥沼，或者你的网站规模宏大要改动的东西太多，不管怎样，始终保持良好的习惯非常重要。

]]> http://www.qianduan.net/12-site-code-skills.html/feed 4