我设计的网络应用程序主要供同事和客户使用(不是PDA,手机等).随着越来越多的用户配备16:9型屏幕,传统的屏幕布局不再符合人体工程学.
例如,长垂直导航栏可能不完全适合,或者可能需要滚动复杂形式才能移动到下一个输入字段.
你是如何应对这种发展的？你是在水平展开还是坚持旧的布局？这不是一个真正的问题吗？
UPDATE
感谢所有的答复.我发现它们很有用.以下是我想到的一些想法:
我认为4:3格式可能仍然是最广泛使用的,但我希望能够改变.
此外,我在公司访问的大多数用户都将其所有窗口最大化(真的!),因此调整浏览器大小以适应内容的想法并没有帮助.
就我而言,大多数网络应用程序涉及搜索和显示信息或数据输入(其中一些可能涉及大型和复杂的表单).它主要是我关注的数据输入应用程序.也许AJAX和Tabbed控件可能是一种前进的方式.
Oskar Duvebo.. 14
当我们看到宽屏应用时,大多数情况下,分辨率刚刚超过了电路板.1024x768笔记本电脑转1280x800,1600x1200显示器转1920x1200等等.垂直尺寸仍可照常使用.
我应该更新这个答案,以适应人们在网上冲浪的方式,地点和方式的变化.我倾向于在一定程度上具有流畅性的响应式设计,但是由于媒体查询和其他有用的技术,设计师可以更好地控制演示文稿的重新流动,同时仍然能够适应任何视图/屏幕尺寸.
当可用视图小于某个限制时调整和折叠内容,并将文本保持在最大线宽但扩展和重新排列其他元素是我开始做的事情.
这不仅限于将网站缩小到移动设备,而且还可以将元素调整到高清电视上的全屏浏览器上,或者只是在较小的平板电脑上填充和看起来很好,其尺寸类似于上网本.
我仍然没有亲自理解使用传统的"流体"布局,其中中心文本列可以毫不犹豫地扩展到2000像素,除了在Web 应用程序中,您要显示数据类似excel的数据或大图像而不是实际文字内容.就个人而言,我偶然发现太多这样的网站,其边距也太小,如果我扩大浏览器,即使在1920宽度范围内,边距也不会增加,而且仍然太小 - 设计师给我带来了不舒服的余量我无法通过浏览器的开发工具^^更改网站的CSS来解决这个问题
对我来说,响应式设计的第一步是采用我喜爱的臭名昭着的960px固定宽度,并在视野较小时分三步调整.这使得在较小的设备上一直到手机屏幕都很愉快.然而,我目前面临的挑战是将设计范围扩大到1200px左右,因为我的品味太过宽,而另一个元素需要重新流动 - 但很多网站都没有任何内容可供使用......
当我们看到宽屏应用时,大多数情况下,分辨率刚刚超过了电路板.1024x768笔记本电脑转1280x800,1600x1200显示器转1920x1200等等.垂直尺寸仍可照常使用.
我应该更新这个答案,以适应人们在网上冲浪的方式,地点和方式的变化.我倾向于在一定程度上具有流畅性的响应式设计,但是由于媒体查询和其他有用的技术,设计师可以更好地控制演示文稿的重新流动,同时仍然能够适应任何视图/屏幕尺寸.
当可用视图小于某个限制时调整和折叠内容,并将文本保持在最大线宽但扩展和重新排列其他元素是我开始做的事情.
这不仅限于将网站缩小到移动设备,而且还可以将元素调整到高清电视上的全屏浏览器上,或者只是在较小的平板电脑上填充和看起来很好,其尺寸类似于上网本.
我仍然没有亲自理解使用传统的"流体"布局,其中中心文本列可以毫不犹豫地扩展到2000像素,除了在Web 应用程序中,您要显示数据类似excel的数据或大图像而不是实际文字内容.就个人而言,我偶然发现太多这样的网站,其边距也太小,如果我扩大浏览器,即使在1920宽度范围内,边距也不会增加,而且仍然太小 - 设计师给我带来了不舒服的余量我无法通过浏览器的开发工具^^更改网站的CSS来解决这个问题
对我来说,响应式设计的第一步是采用我喜爱的臭名昭着的960px固定宽度,并在视野较小时分三步调整.这使得在较小的设备上一直到手机屏幕都很愉快.然而,我目前面临的挑战是将设计范围扩大到1200px左右,因为我的品味太过宽,而另一个元素需要重新流动 - 但很多网站都没有任何内容可供使用......
作为用户和设计师,我讨厌固定宽度的网站.许多网站可以变得流畅,但不是因为它是"简单的出路".然后遵循适合(双关语)的各种合理化来支持该视图.
Newsflash:短线长度是早期报纸研究的一个神话.有关详细信息,请参阅此摘要并做出自己的判断.
非常宽的线可能对某些人来说是不可读的(我个人认为这个问题并不多),但是有300列的固定布局也是如此,每条线大约有8到10个字.
我一直试图通过查看网站的人口统计信息(例如,通过Google Analytics)来设计合理的大小调整,并查看谁会访问...
如果你想一想,16:9的屏幕并没有真正垂直限制.根据我使用这些显示器的经验,它们的原始分辨率通常为1920x1080.垂直空间仍然大于大多数分辨率(1024x768,1280x1024等).
然而,我开始编写液体布局来处理水平空间.一些网页设计师喜欢坚持960px的固定宽度.这一切都取决于您尝试向用户呈现的内容.
以下是我作为用户推荐的一些原则,但也作为网页设计师和开发人员:
尽量避免水平滚动.大多数人都有一个只能向一个方向工作的鼠标滚轮.水平滚动通常被认为非常恼人.垂直滚动现在通常是可以接受的.
列大小在很长的段落中很重要.我通常建议大约15-20个单词的宽度,但随意尝试.来自alphadogg的链接是一个有趣的读物,但我不得不说在Web开发中很难用"英寸"这个词.单词或字符可能是更好的衡量标准,这使我进入下一个项目:
使用相对单位表示宽度.这使您可以在大多数情况下将宽度保持在一定数量的单词.
有用的提示:相对单元的问题是页面可以扩展超过页面的宽度.您可以通过在css中指定max-width属性(大约90%左右)来控制大多数浏览器.因此,当某人的显示器上的文字很大时,他们仍然不必水平滚动.
同样,建议不要简单地在大多数情况下将内容流式传输到浏览器宽度的100%.而且我认为随着显示器的增大,无论如何,你会看到更少的人最大化浏览器窗口.
除了其他评论......
大多数用户还没有使用宽屏显示器.更重要的是,许多使用宽屏显示器的用户没有最大化其Web浏览器.
京公网安备 11010802040832号 | 京ICP备19059560号-6 