当前位置: 首页 > 网络学院 > 设计教程 > 设计理念 > 避免使用水平滚动条

设计理念
网站常见错误
如何让你的业务在10天之内失败
网站设计的7个要点
图片真的比文字更胜一筹吗?
规模扩张与你的站点
网站设计的十大错误
网站设计准则
确保网站的加载速度
创建具有友好性的研究型网站
htaccess 简易教程
Htaccess简介
在你的网页链接和图片中使用“Title”标签
测试你的网站开发者
设计搜索引擎亲睐的网站
创建真正的logo
使用框架来优化网站设计
10条设计/行销准则
XHTML和样式表
网站模仿
迅速提高你的销售业绩

设计理念 中的 避免使用水平滚动条


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-03-01   浏览: 1860 ::
收藏到网摘: n/a

What you see is not always what you get at least with the standard screen sizes. Many new web designers will assume that if they are designing for an 800x600 screen that their web page tables should be 800 pixels wide. If you tried it, and you have to horizontally scroll to read your page content, I'm sure you were pretty frustrated. Don't worry, it has happened to all of us.

在标准尺寸的显示器下,你看到的内容并不总是你要寻找的内容。许多刚开始工作的网络设计者可能会想:如果为800x600分辨率的显示器设计网页,那么网页的宽度应该是800像素。如果这样做,你必须要水平滚动网页才能浏览网页的全部内容。你肯定很失望,不用担心,我们每个人都碰到过这样的情况。

A good rule to follow is to subtract 30 pixels from the width of your table to accommodate the screen size.

你可以遵循一个规则:网页宽度减少30像素,让这个页表出现在电脑屏幕上。

Avoid_Horizontal_Scroll_Bars




Horizontal bar example(水平滚动条)

Example:
例如:

800x600 Screen = Table Width 770
1024x768 Screen = Table Width 994

800x600
分辨率的显示器,页表宽度为770像素;1024x768分辨率的显示器,页表宽度为994像素。

Note: If all four margins (top, left, right, and bottom) are set to 0, substract 25 from the width and 150 from the height of your table . So, the max width and page fold would be

注释:网页四边的空白部分(上、下、左、右)设为零,页表的宽度减少25,高度减少150,那么页表的宽度和折叠页面分别为

  • 800x600: 775px; Page fold: 450px
  • 1024x768: 999px; Page fold: 618px

Above, I showed only two resolutions because you should never design your website for resolutions higher then 1024x768. The majority of users today use either 1024x768 or 800x600 resolutions. If you design for resolutions higher than this, you can guarantee that almost all of your users will have to deal with ugly horizontal scroll bars.
Learn how to design for all screen resolutions.

上面,我只提到两种分辨率,因为你不会为高于1024x768分辨率的显示器设计网站。现在大多数用户显示器的分辨率为1024x768800x600,但如果你想为更高分辨率的显示器设计网站,那么几乎全部用户都要使用水平滚动条了。你可以在网上学习各种分辨率下的网站设计。

That's it!

就是这样!

评论 (0) All

登陆 | 还没注册?