如何避免成都网站制作网页设计中的常见问题,提升用户体验?
- 内容介绍
- 相关推荐
先聊聊为什么大家老是踩坑
说实话, 很多成都的公司做网站,跟逛夜市一样热闹,却忘了把用户放在第一位。
你想啊,页面卡得像老牛车,颜色配得像彩虹糖,点进去根本找不到想要的东西。
哈哈,这种体验谁受得了那个?
咱就是说这些“坑”其实都能提前防范,只要在设计前多想想用户的感受。
响应式布局——别让手机用户掉进黑洞
宽度写死的灾难
很多人爱用固定宽度,比如width:1200px。
不对不对,这样在手机上就只能横着滚动,看得眼睛都疼,背后.…。
改成百分比或者使用弹性盒子吧。
换个角度看.… 你懂的,用媒体查询把不同屏幕下的布局给调好。
触控目标太小
按钮只有几像素宽,那叫一个“点不到”。
建议最小触控区域保持44px×44px,这样手指才能舒服点。
别忘了留足留白,让页面看起来不挤压。
图片和多媒体——别让它们拖慢你的页面
图片未压缩直接搬运
有些同事直接把原图搬进去,后来啊页面加载慢到让人抓狂。
先用工具压缩到合适体积,再尺寸裁剪。
如果是背景图,还可以考虑使用WebP格式,更省流量,也是没谁了。。
懒加载忘记加
懒加载可以让页面先渲染可视区内容,再逐步加载下方资源。
先聊聊为什么大家老是踩坑
说实话, 很多成都的公司做网站,跟逛夜市一样热闹,却忘了把用户放在第一位。
你想啊,页面卡得像老牛车,颜色配得像彩虹糖,点进去根本找不到想要的东西。
哈哈,这种体验谁受得了那个?
咱就是说这些“坑”其实都能提前防范,只要在设计前多想想用户的感受。
响应式布局——别让手机用户掉进黑洞
宽度写死的灾难
很多人爱用固定宽度,比如width:1200px。
不对不对,这样在手机上就只能横着滚动,看得眼睛都疼,背后.…。
改成百分比或者使用弹性盒子吧。
换个角度看.… 你懂的,用媒体查询把不同屏幕下的布局给调好。
触控目标太小
按钮只有几像素宽,那叫一个“点不到”。
建议最小触控区域保持44px×44px,这样手指才能舒服点。
别忘了留足留白,让页面看起来不挤压。
图片和多媒体——别让它们拖慢你的页面
图片未压缩直接搬运
有些同事直接把原图搬进去,后来啊页面加载慢到让人抓狂。
先用工具压缩到合适体积,再尺寸裁剪。
如果是背景图,还可以考虑使用WebP格式,更省流量,也是没谁了。。
懒加载忘记加
懒加载可以让页面先渲染可视区内容,再逐步加载下方资源。

