网站设计并非受限于某种固定风格或必须包含系统级导航栏和工具栏的制式要求,这给予了设计师极大的灵活性。然而,这种灵活性有时也会让设计师感到无所适从。因此,在设计网站之前,与前端开发人员充分沟通,明确所使用的尺寸、字体、交互方式等至关重要,这样可以避免后期出现不必要的误会。
由于网页尺寸与用户所使用的屏幕大小密切相关,而用户屏幕的种类繁多且难以一一统计,我们的设计稿主要需考虑主流用户的分辨率,其他分辨率则通过适配方式解决。最新版Photoshop的Web预设尺寸为我们提供了宝贵的参考,如常见尺寸(1366x768px)、大网页(1920x1080px)等。在进行网站设计时,建议以主流的分辨率如1920x1080px为基础,因此网站宽度通常设定为1920px,而屏幕高度则大约为900px,这是因为1080px需要减去浏览器头部和底部的空间。内容安全区域则一般设定为1200px(或1000px / 1400px),这样的尺寸设计相对标准。当然,在设计网页前,务必告知前端开发人员相关设计尺寸,因为他们在适配方式和后续配合方面拥有更多话语权。
网站上的文字通常由前端工程师在代码中重新编写。这些文字在浏览器上的渲染效果受到系统和浏览器的影响。例如,在苹果电脑和Windows系统电脑上看到的文字效果可能会有所不同。鉴于Windows系统的用户占据主流地位,即使我们使用苹果电脑进行网页设计,也应确保网页在Windows系统上的显示效果与我们的设计稿一致。否则,即使我们完成了精美的设计稿,程序员也可能无法将其还原成我们期望的样子。
字号大小的选择同样重要。网页的显示区域限制了文字不能过大,一般来说,网站设计中的文字大小应控制在12-20像素之间。字号不能小于12px,因为更小的字号无法清晰显示中文的复杂笔画。同时,由于奇数字号的文字表现和适配效果较差,我们应选择偶数字号进行设计。总结来说,文字推荐使用宋体、大小为12px、渲染方式选择无。对于稍大一些的字体,推荐使用微软雅黑、大小为14-20px、渲染方式选择Windows Lcd或锐利。此外,英文和数字应使用Arial字体,渲染方式选择无。
金秋10月大放价,建站推广无门槛优惠,名额有限,现在合作另有好礼相赠!点击领取优惠