临沧网站按钮设计大小多少合适

A. 做交互设计时，按钮大小如何规范

做界面交互设计的时候，有个看似简单但依然容易引起撕逼的问题——按钮到底得做多大。无论是面对美术同学设计的各种精美小巧细如针尖的按钮，或是策划同学各种“加加加”的需求轰炸，还是老板“大大大”的呼喊，最终还是需要落地——按钮这玩意，多大才是大，多小才算小。这个时候，就需要一套设计规范和标准，但也要言之有理，让人心服口服地遵守。

本文就介绍一个简单快速的入门，让大家了解到按钮大小设计的逻辑，还有到底应该设多少大小的问题。

事先说明：本文介绍的每一节的课题，都是值得交互设计们深入研究的。本文从简单入手，讲究快速实用，摒弃容易混淆新人的长篇大论，但还是建议能查阅网上的相关资料，才能更加深入地了解这方面的知识，希望能帮助到大家。

1、菲茨定律（Fitts’s Law）

关于按钮到底做多大，有一个很牛逼的公式，称为菲茨定律：

其中：

MT=完成点击的时间，理论上来说越小越好

a、b 是变化参数，不知道有什么用

A = 起点到目标中心的距离，也就是手指移动到按钮的距离

W = 目标在运动轴线上的宽度，也就是按钮的大小

作为一个文科生对于任何数学公式都是拒绝的，有兴趣的同学可以网络详细研究。列出这个公式的目的是，让大家了解到，我们所谓的“按钮手感”，是由哪几个参数影响的。

不想研究这个公式的同学，可以直接看对这个公式的解读（翻译）：

1）按钮越大，越容易被点中（这个有点像废话）。

2）尺寸小的按钮，只要增大微小一点，对可点击性就增加很多。

对第二点的理解就是，按钮做得太小是很可怜的，牺牲任何东西都不能牺牲按钮大小

3）随着按钮的增大，可点性增幅降低

同样，一味无脑地增大按钮尺寸，并不能带来体验感的同样幅度的提升，差不多就好。

4）按钮过大，不会显着增加精度，但会降低速度

按钮过大带来的好处会越来越小，而且会带来另外新的问题——想象一下：拿着一个硕大无比如同桌子一样大小的手柄，肯定不如正常尺寸的好。

本节get：菲茨定律是一个很牛逼的定律，想深入研究可以看知乎上的一篇文章（传送门： https://zhuanlan.hu.com/p/25530956 ）。

2、不要废话直接给结论吧

菲茨定律是原理，但最终结论是什么呢，到底要设置多大的按钮呢，有很多讲交互的书籍，有各种答案：

ISO标准：

标准尺寸——19mm*19mm(mm是尺寸单位，毫米）

最小尺寸——9.5mm

最低标准——6.4mm

按钮和按钮之间最小间距——3mm

iOS（苹果）标准：

1倍率设备——44*44dp（dp表示像素，根据苹果设备屏幕，换算下来约7mm）

安卓标准：

48dp(约为7.4mm)

微软标准：

115dp（约为9mm）

看了这么多标准，是不是有点懵？

实际上，目前没有一个统一的标准，没有人可以解释为什么9mm的按钮会比8mm的按钮好，熟悉微积分的同学应该知道，一个平滑的曲线是可以无限分割的，没有那个“好”与“不好”的明显边界。

不过，现在界面都要求精细化，按钮都偏向往小了做，所以9mm~15mm就已经算得上是大按钮了，6mm~9mm是普遍喜欢的区域。但做人要有底线，最好不要再低于6mm了，而且细小的按钮加上过密的排布和微小的间距，会更加加重“误触的灾难”。

另外补充一句，特别是游戏，一些重要的入口，是不在这个体系之内的。相信大家对于很多手游内一个硕大的“play”或“开始游戏”按钮的印象都不会陌生吧。

本节get：

大按钮9mm~15mm

小按钮6mm~9mm

请尽量保持在这两个标准内

3、什么是PPI

当有人说最合适的按钮是XX像素时，那么这个人不是外行就是太懒。在移动设备上，不谈设备直接说像素（px）应该是多少多少，都是没有意义的。

打开网络，查看PPI的解释——PPI是Pixels Per Inch缩写，pixels per inch所表示的是每英寸所拥有的像素（pixel）数目。简单的说，每个手机的PPI都不一样，所以你的手机的6毫米（mm），和我的手机的6毫米（mm），是不一样的，也就是对应的像素值（px）也是不一样的。

所以PPI没什么玄乎的，就是把第2节的毫米（mm）转成像素（px）的媒介，计算方法也很简单，像素=PPI*毫米值*0.03937就可以了，当然也可以弄个高大上的公式：

实际工作中，建议大家把一些主流的设备上的都列出来，等到要做的时候再算就会很繁琐，而且事先列出来有助于时刻遵守，做得多了也就不用再一一对着看了，自然而然就会有意识地去遵守，有点像“肌肉记忆”。

另外，大家也会接触到一个DPI的概念，这两个概念非常类似，甚至有一些地方都混为一谈。网上介绍DPI和PPI区分的文章很多，有兴趣的同学可以自行寻找学习，但是有一点个人的建议：如果你是做手机游戏和软件的界面设计的，可以只关注PPI，而无视DPI，不然大量的信息充斥进来，很容易混淆。

那么如何知道设备的PPI呢，很简单直接网络，或者自己也可以算，参考我这个公式：

通过计算发现iPhoneX和官方公布的数值略有差距，可能全面屏采用了一套不同的算法。

另外再最后啰嗦一句，其实很多项目，都是只有一个“设计分辨率”的，也就是GUI设计的时候，只是以一个分辨率作设计，其他分辨率只是进行适配，不太可能每个分辨率都单独进行一套设计。目前游戏主流的设计分辨率是1334*750（iPhone6），或是1920*1080(Plus设备）。

本节get：

根据设备的PPI，把物理大小（mm）转成像素（px），才有实际操作设计的意义。

4、不同的位置对大小的影响

由于移动设备的小巧，所以其持握方式也会对按钮大小有要求，一般来说，离设备边缘的按钮应该设的更大一些，离设备越中间的按钮就可以放宽要求。

另外，如果是竖屏模式的游戏或软件，甚至是可以支持单手操作的，最好在这个基础上增加1mm左右。具体原因是：

横屏操作，和屏幕接触的主要还是大拇指指面，而横屏下，接触屏幕的很有可能是拇指指腹，从接触面积上来说，几乎少了一半。设置过iPhone指纹解锁的人应该知道，录入手指正面的指纹后，系统还需要我们录入指腹的指纹，这也是考虑到单手手持手机下，手指和指纹屏的接触情况。

5、其他解决办法

当然，规范是死的，实际情况还会有很多不得不违反规范的做法，为了让设计效果和实际体验折中妥协，我们还可以采取下列方法：

只牺牲一个维度（宽或高），也能达到较好的点按效果：

不怕小按钮，就怕小按钮扎堆，如果是并排密集的按钮，最好能预留出间距，防止误触：

上面那个3mm，放置在iPhone 8 Plus上对应的像素就是47，对应其他的设备也可以用上文介绍的方法计算出来。

让按钮的触控区域和按钮的实际尺寸脱钩，这个就需要程序做支持了，这是最一劳永逸的做法，可以应对各种不同的情况，但要注意一点：触控区域代替了按钮，执行响应的任务，那么触控区域本身就应该代替按钮，执行遵守上文所说的一系列规范了。

B. “UI设计”如何做好按钮设计的9个基本原则

按钮是任何用户界面当中（无论是桌面还是移动用户界面）必备的交互元素：甚至可以说，如果页面中没有一个按钮，整个页面设计将是不完整的。

接下来我们就来聊聊制定按钮规范时会遇到的一些问题，虽然只有普通按钮，但还是有很多细节值得我们思考学习。

大纲如下

1、 按钮的类型

2、 按钮的状态

3、 按钮的主次关系

4、 按钮的设计尺寸

5、 按钮的圆角

6、 按钮的文字

7、 按钮的样式一致

8、 按钮的色彩

9、 按钮的摆放位置

1、按钮的类型

按钮包括很多种，本文主要分享的是我们在设计中经常运用到的一些按钮类型。比如普通按钮、图标按钮、文字按钮、下拉按钮等等

2、按钮的状态

按钮的状态一般分为三种：正常态、不可点击状态、点击状态。

正常状态就不必多讲了。按压状态：我常用的一种方式是将按钮的不透明度改为80%- 85%:

不可点击状态，也推荐两种实现方式，一种是降低为30%的透明度，另一种是直接置灰:

3、按钮的主次关系

页面的内容信息可以通过文字的大小、颜色形成层级关系。同样按钮设计，我们可以在风格上进行区分，让主要按钮与次要按钮形成差异，达到层级结构的视觉提升，更好引导用户根据设定的轨迹进行操作。

4、  按钮的设计尺寸

4.1   合适的大小

按钮需要方便用户进行点击操作，如果用户点击失败或者误点到周边元素，就会带给用户不友好的体验。若是带有文本的按钮，只要文字大小不要小于极限值即 移动设备上 44 * 44 ，通常实现出来的按钮交互热区都会满足点击需求。

4.2 按钮的高度

每个平台都会有多种型号的按钮，我见过最多的可以分为5种：超大按钮、大按钮、中按钮、小按钮，超小按钮，这个可以根据自己平台的需要来制定多少种。每一种按钮都需要有一个特定高度，那么这个高度如何制定才比较科学呢？这里可以推荐一种方式，就是按钮的高度是文字的三倍左右，这样看起来会比较舒服：

4.2 按钮的宽度

在不同的页面中按钮的宽度是随机的，所以按钮的具体宽度我们需要具体的功能来设置。

比如在闲鱼 APP的登录页、购买页中，按钮的宽度都不是相同的。

5、  按钮的圆角

对于按钮边框来说，我们通常采用全圆角和小圆角居多，这样显得稳重大气。 一般我采用全圆角的圆角值等于按钮高度值的一半，而小圆角的圆角值通常控制在 1/4H（高度值的四分之一）以内。

同时要注意的一点是，在同一款产品中要保证所有按钮的  圆角比例是一致的，而不是圆角一致  。如果不同大小按钮的圆角都是一致的，那会显得非常别扭。

6、  按钮的文字

按钮文字和边框的设计要预留一定的留白，不要做“舍不得”的设计，使得按钮给人感觉很拥挤。如果你把控不好可以分析一些按钮的负空间获取经验，看看文字大小和负空间之间是否存在某种比例关系。找到这个比例关系运用到按钮设计中，也许会让你的设计显得更加成熟稳重。

建议按钮的文字一般  不要超过6个汉字  。

7、  按钮的样式一致

在同一页面中  按钮的样式要形成一致  ，不要给用户造成理解上的成本。

8、  按钮的色彩

颜色部分比较简单，一般会选用规范体系的颜色即可。但像红色或者橙色多为行动刺激作用，不适合在非品牌色的时候滥用。浅灰色或者低饱和度的色系会带有不可用、禁用、失效等属性，需要酌情选择。

9、  按钮的摆放位置

按钮的摆放位置通常要  结合用户的视觉感受、与用户操作习惯  进行摆放。

好了，以上就是关于按钮规范的分享，希望能帮助大家提供一些思路和灵感，欢迎交流！

C. 网页设计的页面尺寸标准

对于固定宽度的网站布局，设计师常用的分辨率有：760px、780px、920px、950px等，如今大尺寸、宽屏幕的显示器越来越多，越来越普及，有些设计师也开始采用1000px、1003px这样的分辨率。

页面最大化、满屏化的网站看着的确是舒服，但过高的分辨率在设计师显示器上合适，并不代表在浏览者的显示器上也合适。现在用的最多的分辨率还是1024*768，在这种分辨率下，含滚动条的页面最大宽度应不超过994px，所以一般页面宽度定位在990px以内比较适宜。

这一讲主要来说说网页设计的标准尺寸

一、在800*600分辨率下，页面宽度应在778px以内，这样不会出现横向滚动条，高度可以依据版面和内容而定。

二、在1024*768分辨率下，页面宽度应在1003px以内，如果仅一屏显示的'页面，高度在612px～615px之间，这样横向和纵向滚动条都不会出现。

三、在photoshop中做800*600分辨率下仅一屏的网页时，尺寸可以设为740*560左右。

页面标准按800*600分辨率制作，尺寸为778px*434px

页面长度一般不要超过三屏，宽度不宜出现横向滚动条为宜

每个标准页面为A4幅面大小，即8.5*11英寸

全尺寸banner为468px*60px，半尺寸banner为234px*60px，小banner为88px*31px

小图标的标准尺寸还有120px*90px、120px*60px等

每个非首页静态页面含图片字节不超过60K，全尺寸banner不宜超过14k

标准网页广告尺寸规格

1、120*120，这种广告规格适用于产品或新闻照片展示。

2、120*60，这种广告规格主要用于做LOGO使用。

3、120*90，主要应用于产品演示或大型LOGO。

4、125*125，这种规格适于表现照片效果的图像广告。

5、234*60，这种规格适用于框架或左右形式主页的广告链接。

6、392*72，主要用于有较多图片展示的广告条，用于页眉或页脚。

7、468*60，应用最为广泛的广告条尺寸，用于页眉或页脚。

8、88*31，主要用于网页链接，或网站小型LOGO。

BUTTON 120*60(必须用gif) 7K

215*50(必须用gif) 7K

通栏 760*100 25K 静态图片或减少运动效果

430*50 15K

超级通栏 760*100 to 760*200 共40K 静态图片或减少运动效果

巨幅广告 336*280 35K

585*120

竖边广告 130*300 25K

全屏广告 800*600 40K 必须为静态图片，FLASH格式

图文混排 各频道不同 15K

弹出窗口 400*300(尽量用gif) 40K

BANNER 468*60(尽量用gif) 18K

悬停按钮 80*80(必须用gif) 7K

流媒体 300*200

(可做不规则形状但尺寸不能超过300*200) 30K 播放时间小于5秒60帧(1秒/12帧)

网页中的广告尺寸

1.首页右上，尺寸120*60

2.首页顶部通栏，尺寸468*60

3.首页顶部通栏，尺寸760*60

4.首页中部通栏，尺寸580*60

5.内页顶部通栏，尺寸468*60

6.内页顶部通栏，尺寸760*60

7.内页左上，尺寸150*60或300*300

8.下载地址页面，尺寸560*60或468*60

9.内页底部通栏，尺寸760*60

10.左漂浮，尺寸80*80或100*100

11.右漂浮，尺寸80*80或100*100

以上几种说法可能有点小的出入，大家可以探讨一下。

IAB和EIAA发布新的网络广告尺寸标准

在这6种格式中，除了去年iab发布的4种“通用广告包”中的格式：160×600, 300×250, 180×150及728×90，还包括新公布的468×60 和120×600(擎天柱)2种。

D. 网页设计的尺寸大小是多少，宽度应该是多少

其实也没有硬性规定，但是为了兼容大多数浏览器一般是设置960px，随着现在浏览器分辨率的变化，已开始向着1000px,1200px宽度发展，例如淘宝(1000px）京东商城（1200px）。如果需要兼容不同浏览器尺寸，现在比较流行的做法是做成响应式的，即根据不同分辨率显示不同的尺寸，工作量也就随之增加了。貌似国内的大网站也没有使用。

E. 网页设计常用尺寸大小

网页设计常用尺寸大小

网页的.宽度

 现在比较流行的网页宽度是950px，网页两边留出少许白边，简洁又大方。 1024*768下，网页宽度保持在1002以内，如果满框显示的话,高度是612-615

之间.就不会出现水平滚动条和垂直滚动条。 网页设计中常用的广告尺寸

 BUTTON

120*60

215*50

 通栏

760*100

430*50

 超级通栏 760*100或者760*200 巨幅广告

336*280

585*120

 竖边广告 130*300 全屏广告 800*600 弹出窗口 400*300 BANNER 468*60 悬停按钮 80*80 流媒体

300*200

国际标准的网页BANNER大小规格  横幅广告(Banner)

文件大小：gif:14K/swf:16K

广告尺寸：468*60像素

广告位置：页面顶部

 按钮广告(Button)

文件大小：gif:6K/swf:8K

广告尺寸：170*60/120*60像素 广告位置：第一屏 第二屏

备注：触发式LOGO，弹出图片尺寸为160*160 文件大小gif:9K/swf:12K

弹出窗口广告(Pop up)

文件大小：gif:18K/swf:20K

广告尺寸：360*300像素

广告位置：第一屏

 通栏广告(Full collumn)

文件大小：gif:20K/swf:25K

广告尺寸：770*100像素

广告位置：第一屏 第二屏

 流媒体(Flash layer)

文件大小：swf:25K

广告尺寸：200*150像素

广告位置：第一屏

形式：浏览打开页面，该广告放映8秒后消失

 画中画(PIP)

文件大小：gif:20K/swf:25K

广告尺寸：360*300像素

广告位置：新闻最终页面

 浮动标识(Float box)

文件大小：gif/swf/flash<8k

广告尺寸：80*80像素

广告位置：第一屏右侧

 全屏收缩广告 (Full screen)

文件大小：gif:20K

广告尺寸：750*550像素

广告位置：第一屏

形式：打开浏览页面前该广告以全屏形式出现3-5秒，随后消失  擎天柱(Sky-scraper)

文件大小：gif:15K/swf:17K

广告尺寸：130*200像素

广告位置：第一屏 第二屏

 视频广告

文件大小：gif/swf/flash<8k

广告尺寸：300*250像素

广告位置：第一屏两侧

 文字链接(Text link)

规格：不超过10个汉字

广告位置：第一屏 第二屏

备注:文字链接长度以不折行为准

网页设计LOGO的标准尺寸

120×120 这种广告规格适用于产品或新闻照片展示。 120×60 这种广告规格主要用于做LOGO使用。 120×90 主要应用于产品演示或大型LOGO。 88×31

主要用于网页底部友情链接中的LOGO，或网站小型LOGO。 ;

F. 移动app设计时，按钮做多大尺寸

小按钮比大按钮更难于操控。当设计移动界面时，最好把可点击目标的尺寸做大一点，这样更利于用户点击。但这个“大”究竟需要多“大”，才能方便大多数用户呢？丝路教育小编相信很多移动开发者也非常想知道这个问题的答案，最后都在各平台的UI设计规范中找到了答案。

移动平台设计指导规范告诉了我们什么？

在苹果的《iPhone人机界面设计规范》中指出，最小的点击目标尺寸是44 x 44像素。微软的《Windows手机用户界面设计和交互指南》中建议使用34 x 34像素的尺寸，最小也要26 x 26 像素。诺基亚开发指南中建议，目标尺寸应该不小于1cm x 1cm或者28 x 28 像素。

尽管这些指导规范给我们列举了各平台下可点击目标的尺寸标准，但是彼此的标准并不一致，更无法和人类手指的实际尺寸相一致，他们的建议尺寸比手指的平均尺寸要小，这会影响触摸屏下对于点击目标的精准度。

小的点击目标会导致大问题

可点击目标尺寸太小，对于用户体验来说就非常糟糕，因为如果要更精确的触控。用户需要调整手指的操作方式，从指心操作，变为指尖操作，这样才能操作尺寸较小的目标。使用指心操作通常会整个覆盖操作对象，让用户无法分辨他们所要操作的目标，也无法收到操作过程中的视觉反馈，也就无法知晓，他们的操作是否有效。当用户不得不用指尖进行操作时，又出现了一个新问题，这种操作方式非常的慢，而且很吃力，体验很差。

问题不仅这些，目标的尺寸过小还会导致失误的触摸操作。因为尺寸小，所以容易拥挤在一起，用户容易触碰到附近的目标，导致运行结果非用户所愿。手指太大，目标尺寸太小，一根手指的宽度大概能覆盖两个目标的宽度。如果不按压到错误的位置，就会导致错误的操作。食指容易出错，但是拇指更容易出错。因为拇指更大、更笨拙。有时候用户会倾斜拇指，使用拇指的侧边进行操作，但是目标尺寸过小，依然失误频繁。

在移动用户的日常操作中，拇指的使用非常频繁。有时用户无法腾开两只手操作，只能用一只手握住手机，用拇指和食指操作。在这种场景下，用户的操作精度有限，就需要提高目标尺寸来避免操作错误，这就是所谓的友好的触控体验。

食指操作下的平均像素宽度

MIT触摸实验室的做了一项研究，以手指指尖作为调查，分析其感觉机能。研究发现，成年人的食指宽度一般是1.6——2 cm。转换成像素就是45——57 px，这比那些指导书上建议的宽度都要宽。

45——57 px的目标尺寸非常够用，用户可以将整个手指紧贴在目标上。在操作的过程中，用户也能看到目标的边缘。这样用户与控制对象之间的反馈与信息传达变的非常清晰，用户也能知晓他们的操作是否有效。因为尺寸大，定位更快，拖移也更方便。费茨法则中提到过，目标越小，操作耗时就越长。小目标减慢了用户的操作速度，因为需要用户集中精力去精准定位。手指大小的目标则不一样，这种目标给予用户足够的空间操作，容错率也很高。

拇指操作情况下的像素宽度

也有很多用户用拇指敲击屏幕上的目标。拇指比食指要宽，平均宽度大概在2.5cm，转换成像素是72 px。

72像素的实际使用效果很棒，更容易定位、操作的舒适感更好。同样可以看到操作目标的边缘。这意味着用户不用费力的调整手指，使用指尖去操作了。也不用倾斜拇指，用拇指侧面点击目标。

在《小型触摸设备上单手操作研究：关于拇指操作的目标尺寸》这篇文章中发现，目标尺寸的增加会降低失误操作的次数。更多的空间提供了更高的容错率和更精确的操作，同时因为大型的尺寸，目标的表现力也变强。

另外一篇《移动端触摸设计：关于目标选择的关键》中也表达了同样的看法。

手指大小的目标尺寸很理想，但也有特殊情况

将目标尺寸的大小，设置为跟手指大小相近，其中的好处不再赘述。但并不是适合所有的设计场景。在移动设备上，空间有限。这就意味着，如果每个目标的大小都很大，那么屏幕空间根本不够，就需要不断的翻页，这在体验上很糟糕。你需要测量屏幕尺寸，然后计算比例，搞清楚“在这种尺寸的屏幕上，合适的、最大的目标尺寸是多少？”倘若你按照手指大小进行尺寸调整，整个界面的比例很糟糕；再次按照比例调整后，最大的目标尺寸效果也不假，那么就只能使用指导规范上的建议尺寸了。

对于平板设备来说，情况就没有手机那么复杂，因为平板的空间更多。不用害怕没有空间去放置点击目标，空间足够，你可以非常悠然的通过提高尺寸来提高操作适用性。手机是最麻烦的，点击目标的尺寸非常不好拿捏。但正是因为手机的空间有限，容易操作失误，所以才需要设置真实手指大小的目标尺寸。设计师的挑战就在于，要想办法，让屏幕上大多数的目标，尺寸都跟手指大小一致。但也有好处，这迫使设计师设计时更注重功能性、风格更加极简。

为游戏应用设计拇指大小的点击对象

我们无法推测的问题是，用户使用你的应用时，是用食指操作更多？还是用拇指更多？因此，针对这一点，我们要非常细致的做调研，然后设置合理的目标尺寸。 然而，如果你的应用是一款游戏的话，大多数用户会使用拇指。这就是为什么很多游戏应用中，一些控件的尺寸一般有拇指那么大，这样用户就能更稳固的双手持握，更精准的操作。

结论

通过调整目标尺寸的大小，结合实际的应用情况，能够有效的提高移动端的适用性，同时提高用户体验。不管你的应用是游戏还是别的什么。触摸屏上的目标就是用来让用户点击的。如果用户需要去想“我该怎样去点击，才能完成精确的操作”，需要再交互前思考方法，需要调整操作方法，使用多种方法才能完成交互。这说明这款产品的交互设计是糟糕的。在这篇文章里，我抛出了个人的一些观点，在触摸即将成为操作方式的一统时代，如何打造友好的触控体验？这是我们将要面临的问题。期待更多的想法，以及更规范的标准。

感谢阅读！

看完这篇丝路提醒你只要记住2点，食指点击目标尺寸是44 x 44像素，拇指是72 x72像素。所以在画界面的时候，要注意这2个尺寸。

小技巧：在导出ICON的时候，假如你的ICON实际尺寸是32×32，那么你可以导出50x50PNG透明背景的ICON，重点是加了透明区域。这样就更方便点击了。

G. 网页设计中banner设计尺寸是多少

不同的环境下设置的尺寸都不一样

1、800*600下，网页宽度保持在778以内，就不会出现水平滚动条，高度则视版面和内容决定。

2、1024*768下，网页宽度保持在1002以内，就不会出现水平滚动条，高度则视版面和内决定。

3、在ps里面做网页可以在800*600状态下显示全屏，页面的下方又不会出现滑动条，尺寸为740*560左右。

4、1024*768 下网页的尺寸:width=955,height=600

800*600 下网页的尺寸:width=760,height=420。

5、一般分辨率在800*600的情况下，页面的显示尺寸为：780*428px，

分辨率在640*480的情况下，页面的显示尺寸为:620*311px，

分辨率在1024*768的情况下，页面的显示尺寸为：1007*600px。

(7)临沧网站按钮设计大小多少合适扩展阅读：

banner设计标准尺寸大全

Internet Advertising Bureau
(IAB，国际广告局)的"标准和管理委员会"联合Coalition for Advertising Supported Informatiln
and
Entertainment(CASIE，广告支持信息和娱乐联合会)联合推出了一系列网络广告宣传物的标准尺寸。

这些尺寸作为建议，提供给广告生产省和消费者，使大家都能接受。现在网站上的广告几乎都遵循IAC/CASIE标准。

1997年第一次标准公布

Num Size(pix) Name

1、468×60 全尺寸banner

2、392×72 全尺寸带导航条banner

3、234×60 半尺寸banner

4、125×125 方形按钮

5、120×90 按钮＃1或小图标

6、120×60 按钮＃2或小图标

7、88×31 小按钮或banner

8、120×240 垂直banner

2001年第二次标准公布

Num Size(pix) Name

1、120×600 "摩天大楼"形

2、160×600 宽"摩天大楼"形

3、180×150 长方形

4、300×250 中级长方形

6、240×400 竖长方形

7、250×250 "正方形弹出式"广告

IAB 将不再支持1997年第一次公布标准中的392×72形。

从banner自身的设计大小看

1、全尺寸banner横幅设计为468*60px，半尺寸banner为234*60px，小banner为88*31px，另外120*90，120*60也是小图标的标准尺寸。

2、页面长度原则上不超过3屏，宽度不超过1屏。

3、每个非首页静态页面含图片字节不超过60K，全尺寸banner不超过14K。

4、每个标准页面为A4幅面大小，即8.5*11英寸。

参考资料来源：网络-网页设计标准

H. 网页设计合适的页面尺寸是多少

网页设计选用的分辨率是72像素，使用的画布尺寸1920px*1080px。但是并不意味着在整个画布上进行设计，一般采用全屏展示和两侧留白的方式。
全屏展示，是整个网站看起来大气一些，但是布局要合理安排，不然看起来有些傻大的感觉。
两侧留白是为了适配不同电脑屏幕的尺寸，能够确保网站只是电脑站的时候一些笔记本电脑也能显示全面网站的内容区域，内容限时区域在好控制在1000px-1200px。

I. 移动APP设计时，按钮做多大尺寸

按钮是一个普通的设计元素,不过我们基本每天或多或少接触他。除了这个,由于按钮是一个在网页或者app上创造流畅的会话流体验的必不可少的元素,所以它值得我们为按钮这样最基本的元素提供最佳的体验做出努力.为按钮做些最佳实践，让按钮看起来像按钮。

想想如何达到设计沟通的可供性吧.用户是怎么理解一个按钮的呢?用形状和颜色是界面上的元素看起来像一个按钮.

Groupon 的登录页面关注于最主要的动作.

另外,丝路觉得手指点击的尺寸也是要在设计时仔细考虑的事情.按钮的大小在帮助用户分辨这些元素的过程中起到了决定性的作用.不同的平台提供了热区的最小尺寸的不同设计规范.MIT Touch Lab的研究结果表明手指接触面积平均为10-14mm之间,指尖平均为8-10mm,所以.最佳的热区尺寸应设定为10mmX10mm

位置和命令

按钮应放置在用户能够直接找到或者他有预期能看到的地方.例如,iOS UI 设计规范给明了按钮的合理位置.

按钮要执行的命令和位置的关系.按钮要执行的命令非常重要,特别是在出现成对的选项时(就像”上一个”和”下一个”).确保设计强调了最主要或者最重要的动作.

J. 网页设计，一般最少要设置多少高度

大概的高度为：

Window XP首屏大小580 px
Window 7 首屏大小710 px

具体原因如下：

• 一个网页的尺寸设置和浏览器与系统的尺寸大为相关，我们不可能满足所以用户的最佳尺寸，但我们能做的是让绝大多少用户感觉是最佳的。

• 系统分辨率统计：

对大于30W台客户端用户进行测试，得到的测试数据如下（数据来源于网络）：