Web设计中体现出来的浓重的苹果风格

知更鸟
知更鸟
站长
2318
文章
0
粉丝
Web前端710,418阅读模式

优雅的设计贯串苹果所有的产品,也包括网站,不仅苹果自己的网站,世界上有无数模仿苹果的网站设计,然而是什么构成了苹果式网站设计风格?浅淡 的配色,大 面积留白,清晰统一的导航,雅致的图标,还有,拒绝使用 Flash,本文分析了 Web 设计中苹果风的构成元素,并提供了大量苹果风 Web 设计案例供大家欣赏。

苹果风构成元素

浅色系与微妙的渐变色

Web设计中体现出来的浓重的苹果风格-图片1

留白,留白

Web设计中体现出来的浓重的苹果风格-图片2

清晰明快的字体

Web设计中体现出来的浓重的苹果风格-图片3

产品图片充满美感

Web设计中体现出来的浓重的苹果风格-图片4

雅致的图标

Web设计中体现出来的浓重的苹果风格-图片5

干净整洁的网格布局

Web设计中体现出来的浓重的苹果风格-图片6

清晰,友好,一致的导航

Web设计中体现出来的浓重的苹果风格-图片7

产品功能的介绍结合非常出色的图片,视频

Web设计中体现出来的浓重的苹果风格-图片8

小而清晰的字体

Web设计中体现出来的浓重的苹果风格-图片9

靠明显的对比效果引起注意

Web设计中体现出来的浓重的苹果风格-图片10

简洁的指南

Web设计中体现出来的浓重的苹果风格-图片11

不使用 Flash

Web设计中体现出来的浓重的苹果风格-图片12

苹果风 Web 设计欣赏之一:苹果家族 Apple Developer

Web设计中体现出来的浓重的苹果风格-图片13

Apple Store

Web设计中体现出来的浓重的苹果风格-图片14

Apple Mac

Web设计中体现出来的浓重的苹果风格-图片15

Apple iPhone

Web设计中体现出来的浓重的苹果风格-图片16

Apple Support

Web设计中体现出来的浓重的苹果风格-图片17

苹果风 Web 设计欣赏之二:仿苹果家族 1. Panic Coda
这是一个非常受欢迎的 Mac 代码编辑器

Web设计中体现出来的浓重的苹果风格-图片18

2. AteBits
简单就是美

Web设计中体现出来的浓重的苹果风格-图片19

3. Cultured Code
漂亮的图标贯串始终,对内容的组织很有效

Web设计中体现出来的浓重的苹果风格-图片20

4. Mac Rabbit
灰白色系黑渐变,雅致的图标

Web设计中体现出来的浓重的苹果风格-图片21

5. Twelve South
非常漂亮的产品图片,苹果产品图片

Web设计中体现出来的浓重的苹果风格-图片22

6. Metalabs
虽然表面上不是很苹果,但骨子里。BTW,这就是据说
被 Mozilla 的一款产品的 UI 所抄袭的设计 (译者注)

Web设计中体现出来的浓重的苹果风格-图片23

7. Version App
很黑,但仍然很苹果

Web设计中体现出来的浓重的苹果风格-图片24

8. IconDock

Web设计中体现出来的浓重的苹果风格-图片25

9. Acrylic Apps

Web设计中体现出来的浓重的苹果风格-图片26

10. Billings App
深得苹果精髓的设计,大产品图 + 灰白蓝色系 + 大小对比强烈的字体

Web设计中体现出来的浓重的苹果风格-图片27

11. Postage

Web设计中体现出来的浓重的苹果风格-图片28

12. Bohemian Coding

Web设计中体现出来的浓重的苹果风格-图片29

13. Checkout App

Web设计中体现出来的浓重的苹果风格-图片30

14. Nprinting

Web设计中体现出来的浓重的苹果风格-图片31

15. PostBox Inc

Web设计中体现出来的浓重的苹果风格-图片32

16. Symphony CMS

Web设计中体现出来的浓重的苹果风格-图片33

17. Invoice Machine

Web设计中体现出来的浓重的苹果风格-图片34

18. Icon Designer

Web设计中体现出来的浓重的苹果风格-图片35

19. Transmission Apps

Web设计中体现出来的浓重的苹果风格-图片36

20. 280 Slides

Web设计中体现出来的浓重的苹果风格-图片37

本文国际来源

本站文章大部分为原创,用于个人学习记录,可能对您有所帮助,仅供参考!

weinxin
我的微信
微信号已复制
版权声明
本站原创文章转载请注明文章出处及链接,谢谢合作!
 
知更鸟
评论  7  访客  4  作者  1
    • Surpet
      Surpet 4

      抢到沙发了
      激动

      • capls
        capls 0

        测试图片留言
        [img]http://www.google.com.hk/intl/zh-CN/images/logo_cn.png[/img]

        • aimi
          aimi 0

          不知道怎么设计类苹果的网页,感觉很好看,但是自己又不会做

          • GMiPad
            GMiPad 0

            想设计苹果类网页联系我们吧!GMiPad光迈图象科技有限公司,致力于App应用程序开发,苹果风格网站设计,为您提供上百种类苹果风格网站模板挑选!随时恭候您的大驾!http://www.gmipad.com

          匿名

          发表评论

          匿名网友
          :?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

          拖动滑块以完成验证