网页底部的版权信息_可能是最全面的网页设计基础知识全攻略!

一、网页设计是什么?

网页设计(web design,又称为Web UI design,WUI design,WUI),是根据企业希望向浏览者传递的信息(包括产品、服务、理念、文化),进行网站功能策划,然后进行的页面设计美化工作。作为企业对外宣传物料的其中一种,精美的网页设计,对于提升企业的互联网品牌形象至关重要。 

网页设计一般分为三种大类:功能型网页设计(服务网站&B/S软件用户端)、形象型网页设计(品牌形象站)、信息型网页设计(门户站)。设计网页的目的不同,应选择不同的网页策划与设计方案。

网页设计的工作目标,是通过使用更合理的颜色、字体、图片、样式进行页面设计美化,在功能限定的情况下,尽可能给予用户完美的视觉体验。高级的网页设计甚至会考虑到通过声光、交互等来实现更好的视听感受。

网页设计主要以Adobe产品为主,常见的工具包括FW、PS、FL、DW、CDR、AI等,其中DW是代码工具,其他是图形图像和FL动画工具。还有最近几年Adobe新出的EdgeReflow、EdgeCode、Muse。

6fc618064abbd4088c2b0fbcef65bd18.png

a03b66be00aeba8c82e5f14d0023355b.png

ec6438c66b0f8a871a2776bf46728f33.png

57c3994bfd884a6f2c7b8af2fe6a2d1c.png

f7dd52432d94a4aa4c54246f9308ddc8.png

4571a1b57fc6043008bc0ccaad8482cf.png

c67b2d824dfe188ffefe65234eed8e6e.png

9cf61879ef6dbc9d018976eae02f5980.png

8c17c82f8c02a0d2429f7a8adb4a9f98.png

e5f187201cd32ad55c63cdb20400d96f.png

6a0887bbb447bb6ee390a43b64fc4e10.png

45a319133042f1282fc6547b1cc3e659.png

e7a12cb4a0001a6a3ab49e63d4cdb5f1.png

5107722c37019dfcabf883fcd062f897.png

0dd482155b89a3bcf45cc65897692f8c.png

17eb0a8f50d8e4d3f0b2fd9377682ebc.png

da5a540532992ec30c83577a144663c1.png

f474e65e50a020b3f588605d41733746.png

c5d6a7e264021616db7991e24093af24.png

4cb1c8bd62785982d83c0a2d39a2b773.png

e864b102111de1fcf4d84e5f1e229c4f.png

cb7f1dec290d0039e61e0123aac8fd64.png

8be1b1eb0c4a9124942060f22b3e9bb2.png

10a55555b266bc197c742209bafd3ad7.png

5. Footer

在网站具体的页面设计中,底部会有一个区域我们称之为 footer。一般 footer 的颜色都会比上边内容区域要暗,因为 footer 的信息在逻辑的级别上是次要的。footer 区域的主要功能是版权声明、联系方式、友情链接、备案号等信息。在设计时一定要降级处理,不要让 footer 变得特别明显。

88d7935787efd4f1bebdf06b47482a93.png

2628063b21158d5397379a8108baa2c0.png

5691fe9b8720aef6924328c08c200147.png

67229e481a4e887f21a7f7934ff15d88.png

a81cf9b2da35f71be1d82715dd27c3c2.png

9fba1d05b93e43957fb12209b11e1938.png

27399e2d86bc24c0f43546efa4e26689.png

50be1e7c3280b6fb621b6fd36e8c2012.png

38000ba18a2592326cd9766a9649a65b.png

2b67b0887519b42d7bc91e01adbedd66.png

a127c6283a34aa8e2253f98d33380a17.png

1becfbbd2b13cb31f0e1ae610325a41b.png

9a194ed678311630db15b73eaf0ca202.png

a8d04f3118ca258284a5839239f1fda6.png

无论您面对的项目是 To C 的还是 To B 的网站产品,我们都应该首先确立设计风格 > 寻找设计素材 > 建立情绪板 > 完成视觉稿 > 切图标注 > 建立视觉规范 > 进行项目走查。

如果设计一般网站的页面,可以按照1920 X 1080px尺寸设计。每屏高度900px,字体使用宋体12px、无和微软雅黑 14-20、Windows LCD。Banner 尽量满屏,但是图片需要按照4:3或16:9等比例来设计。做网站时可以建立栅格以更好地进行自适应和响应式布局,我们也要为超链接和按钮设计不同的相应鼠标的状态;另外我们也可以多多尝试在网站设计中加入视差滚动、雪碧图动画等好玩的交互。

如果设计手机端的页面,可以按照750X1334PX尺寸设计。字体使用苹方24PX以上、锐利。英文字体使用SF UI。按钮和点击区域需要大于88PX方便手指点击。并且头部需要预留出微信或浏览器的导航区域。

公众号回复以下“关键词”即可得到相应的链接

XD

CAD

AE

看图王

墨刀

C4D

Cutterman

蓝湖

InDesign

photoshop

illustrator

Dreamweaver

Sketch

cdr

Axure

b5cb981ad69bcd367d894176af820d27.png

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值