`
阅读更多
网页栅格系统研究:960的秘密
PPT  见附件 :)
研究网页栅格系统前,来看一组数据:
网站 首页页面宽度 pixel Yahoo! 950 淘宝 950 MySpace 960 新浪 950 网易 960 Live Search 958 搜狐 950 优酷 960 AOL 960
备注:960 – 950 之间的为边缘margin宽度.

上面列举的都是Alexa全球排名前100的站点,它们的首页宽度为950px/960px. 除了微软的Live Search, 这些站点有个共同特点:页面结构较复杂,都可以认为是门户型网站。
再来看看Google, YouTube, Facebook, Flickr!, eBay等知名站点,它们的首页宽度没什么固定规律,共同的特点是:功能专一,页面结构相对简单。
根据上面的简单分析可以认为:当搭建页面结构复杂的门户型网站时,开发工程师们不约而同地都选择将页面宽度定为950px/960px.
这是一件很有趣的事情,为什么要选择这个宽度呢?这个宽度值究竟有什么魔力?
神奇的960
在 1024 x 768 的分辨率下,打开Firefox: 自然状态下,Firefox窗体的大小约为 974 x 650. 减掉左右两边7px的边框,网页的实际大小,高宽为 960 x 650.
一下是分析代码:
总滴来说就是:960 的组合最多


# -*- coding:utf8 -*-

#证明使用栅格系统设计网页时
#为何1024分辨率最佳网页宽度是960px

MaxWidth = 1024
group = {}

#总宽度
for width in range(2, MaxWidth):
    #记录可以正处width的宽度
    group[width] = []
    for gridWidth in range(2, width-1):
        #如果可以有整数个栅格
        if width % gridWidth  == 0:
            group[width].append(gridWidth)


lgroup = {}
for k in sorted(group):
    #print " * " * 30
    #print k
    #print len(group[k]),group[k]
    llen = len(group[k])
    if llen > 10 and k>=900 and k<=1000:
        lgroup[llen] = k
    
for k in sorted(lgroup,reverse= True):
    print " * " * 30
    print "len %s,width %s" % (k,lgroup[k])
    print group[lgroup[k]]
    
    
0
0
分享到:
评论

相关推荐

    KeilC51v612中文破解版(解压密码www.c51.cn)

    KeilC51v612中文破解版 解压密码:www.c51.cn

    Keil C51 V9.60a 原版

    《Keil C51 V9.60a:嵌入式开发的重要工具》 Keil C51 V9.60a 是一款专为8051微控制器设计的集成开发环境(IDE),由Keil Software公司开发。该版本发布于2019年5月28日,提供了一个强大的软件开发平台,对于嵌入式...

    JAVA手机游戏 诺基亚Nokia

    适用机型:NOKIA N70, N72, 6620, 3230, 6260, 6600, 6620, 6630, 6670, 6680, 6681, 6682, 7610, ...索尼爱立信 P990, P990c, P990i, W950, W950c, W950i, W958, W960i, M600, M608c, P1c, P3i, W960 8GB, G700, G900

    中链网友情链接平台终极版.rar

    有五次密码输入错误即禁止登入功能,避免了别人破解密码,保护了后台安全。   中链网源码优点: 1、经过SEO处理,大家搜索“友情链接平台”“友链平台”等多个相关关键词,中链网谷歌首页第三。 2、拥有了一些...

    磁条卡IC卡兼容加密机磁条卡命令集.doc

    交易主密钥分为三个版本(0-2),每个版本有32组,每组又包含10个密钥,总共提供了960个不同的交易主密钥。这样的设计是为了实现动态密钥轮换,增强安全性,减少单一密钥被破解的风险。 文档中提到的"FE E0 FE E0 ...

    5G时代信息通信网络安全与技术发展试题1.docx

    2. **流密码**:流密码的安全性主要取决于密钥流的随机性。如果密钥流能够保持高度随机,那么破解的难度会大大提高,从而保障通信的安全。 3. **DTX(Discontinuous Transmission)技术**:这是一种节省手机电池...

    文章管理系统

    纠正后台皮肤管理 高级模式中 界面框架主体(960px)项没保存到数据库的bug 5.前台内容页关键词替换,加入排除已有超连接或图片标签的内容替换 2012年07月06日 V2.6升级包 ★更新方式:admin文件夹改成你后台目录...

Global site tag (gtag.js) - Google Analytics