专题页设计.pdfVIP

专题页设计 首屏高度、主题文字、光环境、人物抠图、内容组织、挑选素材 首屏高度 不同的操作系统 ，不同的分辨率，不同的浏览器 首屏高度不一样 不同分辨率及浏览器的首屏高度 分辨率/浏览器 IE6 IE8 遨游 360 火狐 平均 WINXP 600 596 567 574 584 584 （1024*768） WINXP 732 728 699 706 716 716 （1440*900） WINXP 856 852 823 830 840 840 （1280*1024） WIN7 590 586 557 564 574 574 （1024*768） WIN7 722 718 689 696 706 706 （1440*900） WIN7 846 842 813 820 830 830 （1280*1024） 不同分辨率用户的占比情况 首屏高度低于等于 580像素 的有 116786 个人，占 44.64% ； 首屏高度低于等于 720 像素的有 216227 个人，占 82.64% ； 首屏高度低于等于 800像素 的有 241420 个人，占 92.27% ； 首屏高度低于等于 900 像素的有 259174 个人，占 99.06% ； 不同分辨率用户的占比情况 建议将最主要的信息显示在580PX高度的范围以内。 标题是否醒目 标题文字足够醒目吗？ 标题文字足够醒目吗？ 通过把图片去色来查看标题是否醒目。 标题文字足够醒目吗？ 专题的主文字传达的是页面最主要信息，需要足够醒目，所以要有整个页面最大的对比度。 标题文字足够醒目吗？ 去色后主文字总是有最大的明暗对比,并且最主要信息始终保持在第一屏内显示完全。 标题文字足够醒目吗？ 深色的底上面可以选用浅色亮色的文字， 反之，浅色的底上可以选用深色的文字以获得最大的 对比。 标题文字足够醒目吗？ 标题是页面的视觉焦点要足够显眼。 大小 ：主次画面对比，避免通体平均。 明暗 ：看看去色后设计稿的样子是否还足够显眼。 光环境 图片的光环境一致吗？ 大家说说看 光环境对比 图片的光环境 几个人物素材的光环境调整到了一致，就好像他们本身就是站在一起一样。 图片的光环境 在页面中人物左侧的黄色高光部分跟页面左上角撒下的光辉对应，造成真实的融入感。 光环境的调整 原图是张很普通的照片，由于逆光脸部偏暗。于是给他叠加了三个图层。一个顶部的白光提亮整 体。左侧的蓝光和右侧的红光，让人物与背景更加融合。调整了光的页面整体效果好了很多。 环境光总结 • 色温色调：所有素材（色彩）都会被周围 环境光影响，用的时候注意调整统一。 • 光照 ：注意主光源（环境光）的类型，位 置。契合页面环境。 抠图