Web设计中的黄金分割[译]

作者:被遗忘 时间:2009-02-20 13:41:00 

数学是优美的. 听上去有点奇怪? 当我第一次开始设计的时候,我确信如此。数学如此刻板乏味。你可能会惊讶的发现,最美观的设计,艺术作品,物体,甚至人都有数学上的共同点。尤其是黄金分割,也被称为神之比例,希腊字母表示其为 Φ (phi). 本教程会剖析一个网站的布局,以及如何对其黄金分割

网页骨架

这些是web页面的主要元素。有很多不同的方法去组织它们,但是这种布局也许是最常用的。

Container

所有的web页面都用一个container,主要是为了同一个目的:去包含一些页面元素,然而这个方法实现各有不同。例如,body标签或者是最常用的div。甚至于过去常用的table(不要使用table作为你的container,这是一个破方法)。想想container作为你房子的外墙,里面包含卧室,厨房,起居室等等。
container的类型:
Liquid: 根据浏览器宽度填充。
Fixed: 指定的宽度,并不会根据浏览器宽度改变。

Header

header并不真的是一个特定的元素,尽管某些人会认为它是。它更多是用在涉及到你放置你的logo,导航栏,tagline的web页面顶层的地方。许多人更愿意把这些元素包含在一个div里以方便使页面样式和内容分离。header会被视为一个container,所以它有两种类型选择,就是上文提到的 liquid 或 fixed 。

Logo

你的logo是你的身份和品牌。最常用的是把logo放在你header的左上角。我们的阅读习惯是,从左往右,从上至下,所以你的log应该放在访问者第一眼能看到的地方。

Navigation

页面导航是最重要的元素之一;你的访问者需要用它来使用你的站点。 它应该是容易被找到且易用的,这就是为什么大多数的人把它放在header部分,最少也是在页面顶端附近的原因。
navigation类型:
Horizontal: 水平显示,被称为‘navigation’
Vertical: 垂直显示,被称为‘menu’

标签:web设计,黄金分割,设计
0
投稿

猜你喜欢

  • asp 类型转换函数大全第1/2页

    2011-04-07 11:06:00
  • Python实现爬取知乎神回复简单爬虫代码分享

    2023-03-23 19:00:10
  • Python 3.8新特征之asyncio REPL

    2023-10-08 02:59:58
  • Anaconda 离线安装 python 包的操作方法

    2021-08-11 22:38:27
  • 一波神奇的Python语句、函数与方法的使用技巧总结

    2023-05-12 19:48:41
  • wxPython窗口的继承机制实例分析

    2023-03-04 15:55:47
  • Python 数据结构之旋转链表

    2021-05-04 15:39:28
  • javascript获取选中的文本的方法代码

    2024-05-03 15:07:58
  • 一文带你熟悉Go语言中函数的使用

    2023-07-13 08:22:23
  • Select 控件Combox加强版(IE Only)

    2008-07-23 13:26:00
  • Python 异之如何同时运行多个协程详解

    2023-11-27 12:47:23
  • [hta]一个定时重启或关闭计算机的小工具

    2007-10-17 12:02:00
  • 使用PyCharm安装pytest及requests的问题

    2023-01-17 13:10:46
  • 简单了解python装饰器原理及使用方法

    2023-11-02 11:55:02
  • ASP内置对象Request和Response用法详解

    2007-09-14 10:35:00
  • python实现本地图片转存并重命名的示例代码

    2021-08-01 16:33:46
  • 国内常用的js类库大全(CDN公共库)

    2024-05-11 10:23:29
  • python 实现多维数组(array)排序

    2022-03-26 07:35:48
  • python tkinter中的锚点(anchor)问题及处理

    2021-05-06 23:53:16
  • SQLServer数据库中开启CDC导致事务日志空间被占满的原因

    2024-01-18 01:41:39
  • asp之家 网络编程 m.aspxhome.com