平台型门户网站首页设计总结V1.0
说明：本文总结的是平台型门户网站的首页面设计经验，平台型网站重在撮合各方。还有一类是针对单一产品的门户设计，这种就是为了让用户购买这个产品，在设计上侧重点会有所不同，后续再逐步梳理。
设计目标
1. 说明清平台，是什么。考虑清楚，平台的定位、做什么领域的什么事儿。
2. 吸引住用户，有什么。平台面向什么角色，他们关注什么，平台给他们提供有什么价值、利益点。
3. 能试用功能，怎么用。比如能注册、登录；比如联系客服；比如能登录就试用体验。
设计要点
一、内容上，进行清晰划分
一般都有的：平台简介、平台优势、平台提供的服务（即什么产品/功能）、注册登录入口......
其他可以展示的：动态新闻、使用帮助、优秀案例、合作伙伴......
二、结构上，遵循三区布局
按照顶部菜单、内容区、底部区三层进行布局设计。
顶部菜单重点显示平台logo、名称和各项菜单，提供注册、登录入口。
底部区一般是公安网备号、copyright声明、友情链接、运营二维码、建设单位、技术支持单位等。
其中内容区为重点，一般包括banner和要展现的其他各项内容。
三、形式上，使用多变图文
背景分层
1. 顶部导航，白色背景。
2. 内容区，灰色或白色背景或灰白交替，要用浅色，加上一些同色系图片配蒙版做背景比较加分。
3. 底部区，一般是深色，黑色背景。
交互适度
整个页面滚动查看，单项内容按需选择静态展现、页签切换、图片轮播、卡片悬停等交互方式。
图文结合
（一）叠层
图片作为底层背景，上层是文字，banner位置这样用得多。
（二）并列
卡片式并列图文
图片式并列
（三）左右侧
一侧是图片或插图，一侧是文字或框文
一侧是文字页签切换，一侧是图文
（四）上下侧
上侧是文字页签，下侧是卡片或列表式图文
一些经验
1. 设计步骤，大致明确展现内容，就开始动手做，复用积累的组件，找合适的素材，找参考案例，尽快做起来，然后迭代优化。
2. 整体交互，门户一般以信息展现为主，用户登录后进入业务平台（打开新页签或原页签页面内容按登录后布局展现），可能就会涉及到操作和流程。
3. 图片搜集，使用iconfont查图标和插画，使用islide、觅图网搜背景图，背景图要清晰。
4. 首页背景，一般就是白色和灰色两种背景。
5. 内容宽度，宽度在1440以内，保障各类屏幕都能显示全内容。
6. 页面配色，颜色不会配，就用一个颜色的配色。
7. 元素间距，行间距等空隙留大一些，看着舒服，不要太挤、太窄。
平台型门户参考案例
附图：
優(yōu)網(wǎng)科技秉承"專業(yè)團(tuán)隊(duì)、品質(zhì)服務(wù)" 的經(jīng)營(yíng)理念，誠(chéng)信務(wù)實(shí)的服務(wù)了近萬(wàn)家客戶，成為眾多世界500強(qiáng)、集團(tuán)和上市公司的長(zhǎng)期合作伙伴！
優(yōu)網(wǎng)科技成立于2001年，擅長(zhǎng)網(wǎng)站建設(shè)、網(wǎng)站與各類業(yè)務(wù)系統(tǒng)深度整合，致力于提供完善的企業(yè)互聯(lián)網(wǎng)解決方案。優(yōu)網(wǎng)科技提供PC端網(wǎng)站建設(shè)（品牌展示型、官方門戶型、營(yíng)銷商務(wù)型、電子商務(wù)型、信息門戶型、微信小程序定制開發(fā)、移動(dòng)端應(yīng)用（手機(jī)站、APP開發(fā)）、微信定制開發(fā)（微信官網(wǎng)、微信商城、企業(yè)微信）等一系列互聯(lián)網(wǎng)應(yīng)用服務(wù)。
公安局備案號(hào)：
專屬顧問
