新版学校主页设计思路与使用手册
- 格式：pdf
- 大小：1.20 MB
- 文档页数：11
新版学校主页设计思路与使用手册 信息化工作办公室
新版学校主页设计思路与使用手册新版学校主页设计思路与使用手册 信息化工作办公室
1 /11
为进一步提升学校主页的实用性、美观性、功能性，满足不同访问者的需求，学校于2016年暑假期间对主页进行了改版升级，现已正式上线试运行。新版主页作为校园综合门户网站，以“突出海洋类高校特色，宣传与服务相结合”为设计思想，力求体现学校办学精神和学术思想，展现我校师生的良好风貌，弘扬大海大人的精神品格。 一、新版主页设计思路 新版主页顺应目前国内外主流的全屏版面、大图轮播、导航跟随等趋势，网站布局采用扁平化、栅格式设计风格，便于信息分类和浏览；网站整体颜色以海洋蓝为主色调，并以高明度的灰白色相搭配。网站顶部横幅以海洋蓝为底色，配以浅色水纹图案，以此体现大海大“水”的精神。同时在网站顶部横幅及导航背景色，分别采用四种不同蓝色相搭配，以此体现我校“深蓝、湛蓝、蔚蓝、浅蓝”四个层次的人才培养特色。 二、新版主页与旧版的区别 新版在内容上的“不一样”主要体现在： （一） 网站导航 新版主页在导航栏目设置上，结合了高校门户网站内容分类趋势，同时又延续旧版网站的使用习惯，建设了八个一级栏目，分别为学校概况、教学单位、科学研究、人才培养、师资队伍、国际交流、新版学校主页设计思路与使用手册 信息化工作办公室
2 /11 图书馆以及公共服务。其中原“管理机构”内容归并到“学校概况”内，并更名为“组织机构”；“学报”归并到“科学研究”栏目内，“教学资源”归并到“公共服务”内。 在导航展现形式上，采用了“导航跟随”特效形式，将导航栏固定在网页顶部，随着页面的不断下拉，网站内容的不断变化，但导航条始终保持在当前浏览器的顶部。这样的设计，可以方便浏览者浏览网页，当需要进入导航中的某一栏目时，无需回滚至顶部，可直接在当前位置跳转。 （二）海大新闻 在新闻栏目设置上，将原有【海大要闻】和【校园快讯】合并为为【海大新闻】，并扩大了【海大新闻】栏目的版面篇幅。同时在展现形式上，增设头条及次头条，并采用封面图及摘要样式，使新闻信息获取更为直观，版面更清晰。 如需获取更多学校新闻资讯，您可通过栏目右上角，【进入新闻网】的快速链接，访问学校新闻网。 图2-1 海大新闻 新版学校主页设计思路与使用手册 信息化工作办公室
3 /11 （三）快速链接 学校新版主页以用户为中心，在功能设计中充分考虑不同身份用户对信息的需求，对用户进行分类，设计了教工、学生、校友基金、考生访客四个通道，采用扁平化图标按钮及文字相结合的形式，形成一站式服务平台。 图2-2 快速链接 1．教工通道 教工通道包括：办公自动化、校园邮件、财务管理、科研管理、站群系统、VPN登录、网络报修； 其中办公自动化、校园邮件、财务管理、科研管理均为旧版主页快速通道内容，可通过按钮直接访问所需应用。 新版学校主页设计思路与使用手册 信息化工作办公室
4 /11 新增应用包括站群系统、VPN登录、网络报修。 1）站群系统 站群系统为学校站群管理系统，各单位、各部门网站安全责任人及信息管理员可通过此按钮访问学校站群管理系统，登录并管理网站。 图2-3 站群系统 2）VPN登录 VPN系统可以在互联网上建立虚拟专用链路，连接到学校内部网络，使您在外网环境下对校园内部资源（如图书馆数字资源、学校主页公告、财务查询等）进行访问接入。 具体使用方法请访问学校信息化工作办公室网站新版学校主页设计思路与使用手册 信息化工作办公室
5 /11 （http://nic.dlou.edu.cn）【服务指南】栏目，下载“大连海洋大学VPN使用手册”，了解详情。 图2-4 VPN系统 3）网络报修 为了提高校园网络故障维护效率，给广大师生带来方便，信息化工作办公室暑期期间搭建了校园网络报修平台。如果您所在办公场所网络出现故障，可以借用他人计算机或个人手机，通过该按钮进入报修平台报修。 具体使用方法请访问学校信息化工作办公室网站（http://nic.dlou.edu.cn）【网络与信息业务】栏目内，查看“校园网络故障在线报修办法”，了解详情。 新版学校主页设计思路与使用手册 信息化工作办公室
6 /11
图2-5 网络报修平台 2.学生通道 学生通道包括：教务管理、学工系统、网络报修、资源下载。 其中【教务管理】为旧版主页快速通道内容，您可通过该按钮直接访问学校教务管理系统。 【学工系统】为我校学生工作管理系统。网络报修同教工通道“网络报修”相同，点击可进入网络报修平台。 新版学校主页设计思路与使用手册 信息化工作办公室
7 /11
图2-6 网络报修平台 【网络报修】与教工【网络报修】相同。 【资源下载】为学校影视资源网，网站为广大师生提供最新电影、电视剧、动漫等影视资源。 3.校友 【校友】包括：校友总会,链接至学校校友总会网站。 4.考生访客 【考生访客】包括：认识海大、招生信息、奖励资助、校园风光。 随着学校信息化建设的不断发展与完善，更多应用与信息将陆续上线，敬请期待。 新版学校主页设计思路与使用手册 信息化工作办公室
8 /11 （四）通知公告及学术海大 图2-7 通知公告及学术海大 【通知公告】在展现形式上，取消了原有的单行缩略列表样式，以蓝黑色彩相结合的双行字符展现。 【学术海大】不仅采用了双行字符的展现形式，同时在时间显示上大胆创新，采用日历形式展现，蓝灰结合，以顺应整体网站的色彩搭配。 （五）专题网站 图2-8 专题网站 新版学校主页设计思路与使用手册 信息化工作办公室
9 /11 【专题网站】取消了旧版网站纯文字按钮样式，而是采用图片文字相结合形式。在数量设置上，设定2版图文展现，与新闻头条及次头条封面图数量相呼应。 三、其他特点 新版主页浏览的最佳分辨率为1920*1080。同时为适应其他大小的分辨率，页面进行了响应式设计，页面可根据屏幕分辨率大小，自动调整显示状态。 同时，网页还能够在智能手机、平板电脑等移动终端上自适应，以呈现最佳效果。如图3-1所示。 图3-1 移动端页面效果 新版主页以简洁典雅的风格，配以海洋蓝为主体的色调，充分体现了学校建设“蓝色大学”的发展理念，在设计思想和技术上都有新的超越和突破。下阶段，信息化工作办公室将推进主页二级页面的开发与建设。在新版主页试运行阶段，欢迎广大师生、校友、社会各界新版学校主页设计思路与使用手册 信息化工作办公室
10 /11 提出宝贵意见，以便不断丰富主页的各项功能，提供更完善的服务。 信息化工作办公室 2016年8月24日
