青岛网站建设公司,青岛网站制作公司-奈薇建站网
建站咨询热线:0532-8878113113165158935 
知识普及 » 高品质的网页设计:实例与技巧

高品质的网页设计:实例与技巧

奈薇网页设计 2020-05-22 20:19发表
阅读次数 1043
  “高品质”是所有人追求的目标,在网页设计的世界中也不例外。不过何为“品质”,如何判断一项设计的品质是好还是坏?笔者恰好有一套找出网页设计中品质焦点的方法。一旦你了解到如何判断一项高品质的设计究竟好在哪里,你就掌握了让自己的设计更趋完美的大量技巧。

  接下来我会给大家列一些要点,并附上相应的例子,与大家分享一下我在别人的网页设计中寻找“高品质”的过程。

  01.留白

  在好的网页设计中我最留意的是那些对设计元素之间留白的聪明运用。留心不同内容区块之间的间距和排列方式,能让你的设计的整体感官大不一样,从而提升设计的品质。

  我觉得处理好留白的关键是从整体上感知设计元素。把设计稿缩小观看会是个好办法。

  出色的留白处理的实例

  Good.is

  页面整洁而有开放感,全都得益于设计师对文字和图像之间留白量的准确把握。

  DigitalMash

  在大空白上展示的元素往往更具吸引力。DigitalMash的网站创造了极佳的亲和力。

  CreaticaDaily的大量空白

  优秀的留白运用又一次让网页内容成为焦点。每篇文章中都有大量内容,不过该站点的设计师们并不惮于给这么多内容之间填上大量留白。并不是说你的文字不够多,就不能用很多留白。

  Postbox上也有很多空白

  仔细观察Postbox的网站,你能看到边缘处的留白应该如何处理。它的方框边缘有60像素的边内留白。听起来似乎挺大的,实际看起来效果却好极了。

  留白时的错误

  大家在设计留白时的最常见问题就是各个区块的内容到边缘距离太小。不论你的设计多么有风格,如果你硬要把东西塞得紧紧的,这些风格连同设计的品质,就都流失了。

  留白不够的例子

  我们已经看到PostBox的网站那些大留白创造了多么动人的效果,所以下面我们修改一下它的页面,看看减少留白会是什么效果:

  品质感明显下降了。留白的影响就有这么大。

  高效控制留白的技巧

  各种不同情况下,留白要求都不尽相同。你需要不断训练自己,做到对留白所能带来的改变时刻心中有数,从而有效地利用留白满足设计需求。这要靠个人感觉的,不过都能从实践中锻炼出来。

  使用网格辅助设计

  利用网格当然能帮助你理解元素之间的空白。

  不断尝试

  不断尝试—失败—尝试,直到找到最佳方案。

  留白并不是浪费空间

  空白并不总是等着你去填充的。

  没错,少就是多

  与其用尽心思填满某个区域,不如就把它留空,只保留至关重要的信息就好。

  02.像素级的完美

  有一个方法能够看出某人在完成一项网页设计时是否真的用心了。有时候创造奇迹的就是一些小细节,一些别人几乎无法察觉的细节。我所说的“像素级的完美”就是指在线条、边缘和边框描边上仔细推敲。与其就用一条单一的线,不如多加一些细节。细节可以是细微的渐变,也完全可以只是一条1像素宽的细线(用作表现阴影或高光)。有了这些细节,你的设计会大不一样。有些设计师在这方面特擅长:CollisTa’eed,DavidLeggett以及WolfgangBartelme.

  像素级完美细节的实例

  Envato的细节鉴赏

  下图的Example1(例子1)中,绿色内容框的边缘有一条更亮的绿色线。而Example2处,区块内边缘有柔和的渐变阴影,而边缘之上还有一像素的白色描边。这做法非常聪明,用阴影来强调高光。后面的绿色区域有非常柔和细微的光影效果,有助于将注意力吸引到下面的白色区块中那清新脆爽的细节上去。尽管这种做法并不是总能让设计看起来更加精致,不过它们的确能帮助你赋予设计以三维的真实感。于是设计元素就成了镶嵌在页面上的宝石,而不是平铺在上面的一张毫无动感的纸。

  yuhou.cn上的细节

  DavidLeggett对于如何制造单像素顶边条有很深的理解。他最近重新设计的tutorial9集合了很多非常棒的像素化技巧。Example1处你能看到,他是如何仅仅通过添加一条1像素的高光,而将导航标签变得更有质感。Example2处使用的技巧则更多了。相机图标的投影,下方白色区域的阴影与高光,以及导航条上的1像素高光。

高品质的网页设计:实例与技巧相关标签:网站开发网站申请网站搭建申请网站
相关热点推荐
网页设计中排版与布局基
手机网站的SEO优化该
网站设计的思考之网站的
青岛网站建设基础知识
网站流量语汇 增加网站
青岛网站制作的公司哪家
极简主义网站设计:寓丰
网站改版有了新的方法?
网页设计配色应用实例剖
浅谈企业网站建设的黄金
影响青岛网站建设排名的
青岛高端定制网站价格
浅谈如何提高网站PR值
网页设计中“点”的视觉
让设计散发文化韵味
视觉设计在网站制作上的
网页布局设计:注册登录
CSS选择符详解
从精简导航谈小型网站的
网页布局设计基础
你对网站的未来是怎么样
论个人站长之出路
什么是最好的正文字体
网页的栅格系统设计
网页顶尖设计师的思考与
网站改版内容
改变首页需要慎重考虑
页面空白空间的魅力
做网站一定要知道的定律
企业建网站的必要性
网站建设中的版面设计
网站怎么才能让goog
真正成功的关键IP是坚
一个好的网站应具备哪几
花卉行业网站建设
站在用户的角度来设计网
中小企业行之有效的网络
什么样的网站效果才是客
企业建立网站的最佳时机
青岛网站设计中关于al
奈薇建站网青岛网站建设公司/青岛网站制作公司,专业提供"气质"型网站建设及精美网站制作服务,同时欢迎各地网站建设公司、网站制作公司代理我们的奈薇建站系统共同发展

热点地区:青岛网站建设价格 青岛即墨网站制作公司 开发区信息港 山东在线门户
  • 备案号
  • 鲁ICP备13010283号
建站咨询热线0532-88781131 15166683288 13963906391
版权所有© BangJianZhan.Com & Nev.Cn 青岛网站建设/网站制作公司
青岛雨后网络科技有限公司 - 青岛市市北区福州北路90号,景泰尚都6层
已经为您服务了
160个月 11