12月版
目录
01引言
p.03
02注册新成员网站
p.04
03子网站的一致性
p.05
3.1科大页首/页尾范本
p.06
04网站结构/元素
4.1科大页首
4.1.1科大标志4.1.2附属单位4.1.3搜索功能4.1.4语言
p.12p.13-15p.16p.16
4.2网站内容
4.2.1内容新鲜度4.2.2网站导航4.2.3字体及大小4.2.4响应式网页设计4.2.5影像/图像/平面设计4.2.6视频4.2.7可供下载内容4.2.8方便打印4.2.9关于我们4.2.10联络信息
p.18p.18p.19p.19p.20p.20p.21p.21p.22p.22
香港科技大学网站指导
4.3科大页尾
05无障碍网页06网站安全07方便內地用家浏览08启用网站
8.1用户验收测试8.2网站表现追踪8.3搜索引擎的优化建议
09联络我们
4.3.1版权资料4.3.2隐私声明4.3.3网站地图4.3.4社交媒体图示
p.24p.24p.25p.25
p.26
p.27
p.28
p.30p.31p.32
p.33
01.引言
01.引言
香港科技大学网站指导
3 科大旗下网站采用统一形象 网站是整个科大与外界沟通最重要的媒介之
一。
通过网站，我们可以无时无刻与世界各地的公众和利益持份者联系及互动。
作为大学的一部分，科大旗下的各个网站都需要定期更新，保持界面得体美观，并采用统一的设计结构。
网页的浏览体验和导览设计等必须以用家为本，整体语调亦需贯彻科大形象。
我们利用Drupal建立了一个网站开发平台，其中包含了构建网站所需的功能与范本。
该平台已根据这份指导结合了所有必需的功能和组件。
所有科大网站均应使用该平台进行网站开发。
您仍然可以在网站、排版和多媒体方面运用创意，自由发挥，并向本校出版中心(MediaTechnologyandPublishingCenter,MTPC）及/或您指定的设计公司寻求协助。
您的网站后台部分则会由信息系统处（ISO）处理，网站服务器则会由资讯科技服务中心（ITSC）负责。
我们希望通过本指导，协助科大成员网站展现一致的观感，建立和提升本校的品牌形象。
如您对您所属的学院/办公室/单位/部门网站，或对本指导有任何疑问，欢迎随时发送邮件至brand@ust.hk，或致电2358-5967向公共事务处活动统筹及推广主管杨凯仪女士询问。
02.注册新成员网站
4 02.注册新成员网站 如果您有意向注册一个新的成员网站(yourwebsitename.UST.HK)，请先向资讯科技服务中心查询有关网络服务器托管(webserverhosting)及网域名称登记(domainregistration)事宜。
另外，为了避免使用者搜索到过期网站，所有网站注册时都会设置期限。
过期后，网站内容将会自动封存。
除非您提出延长网站寄存期限的请求，否则使用者将无法浏览网站。
在启用新网站之前，请将所有旧网址重新导向至新网站。
我们建议您在永久删除过期网站之前，先将旧网站内容存档备份。
公共事务处的职责是管理和执行品牌指导。
无论您是刚建立了或正计划建立新的成员网站，都请发送邮件至brand@ust.hk通知我们，我们将及时在学校网站更新或新增您的网站链接，成为官方认可网站之
一。
香港科技大学网站指导 03.子网站的一致性 03.子网站的一致性 香港科技大学网站指导
5 除了内部认证(internalauthentication)的网站外，所有对外的科大网站（即以ust.hk为域名的网站）都必須遵从本校的品牌及网站指导，保持统一设计风格，协助建立本校的整体品牌形象。
如果您的单位属于以下类别，您的官方网站必须采用科大的页首/页尾范本，拥有响应式设计(responsivewebdesign)，适用于各种尺寸的电子屏幕浏览。
另外，网站必须通过资讯科技中心的安全标准。
以下列出的成员网站类别，需要在下次改版网页时，采用科大Drupal平台。
•学院/课程办公室•学术机构•研究机构•学术部门•学术课程•研究中心/实验室•大学年度活动•大学项目•行政及学术支持单位 如果与外部组织合作，ust.uk旗下的成员网站应包含一个彩色的科大标志连接到www.ust.hk，商标语言需与页面语言保持一致。
如科大Drupal平台未能支援网站某些功能，则现行网站亦需满足基本的品牌元素要求，直到下次的网站改版周期展开为止。
这些网站需与ISO联络，共同处理与开发科大Drupal平台上的相关功能。
基本品牌元素包括有相应语言版本的彩色科大标志连结www.ust.hk，以及完整的科大页尾。
03.子网站的一致性 3.1科大页首/页尾范本
6 科大页首范本共有两款: 范本
一 如果您的网站采用全大写名称或使用自己的标志，请使用范本一(科大标志位于左边） -导航菜单(navigationmenu)建议位置：位置
A，B或C-右上角的全球图示(globalicon)仅适用于多语言网站-如果附属单位拥有自己的标志，可用标志代替单位名称，但尺寸不能大于科大标志-放置于科大标志旁的单位名称，必须使用科大指定字体(FuturaMedium)、 大小、字距、行距及颜色。
详情请参阅第14页 请点击此处预览科大页首范本。
AREACAREAA SCHOOLNAME/DEPARTMENTNAME SchoolName AAAAREAB AREAC 香港科技大学网站指导 SCHOOL/DEPARTMENTLOGO AREAA AREAB SchoolName AAA 03.子网站的一致性
7 3.1科大页首/页尾范本 AREAC AREAA SCHOOLNAME/DEPARTMENTNAME 科大页首范本共有两款： 范本
二 如果您的单位标志结合了科大标志(symbol)，请使用范本二（科大标志位于右边） SchoolName -导航菜单(navigationmenu)建议位置：位置
A，B或
C AAA -右上角的全球图示(globalicon)仅适用于多语言网站AREAB-如果附属单位拥有自己的标志，可用标志代替单位名称，但尺寸不能大于科大标志 AREAC SCHOOL/DEPARTMENTLOGO AREAA AREAB SchoolName AAA 香港科技大学网站指导 UNIVERSITYNEWSMAP&DIRECTIONS MOREABOUTHKUST ACADEMICDEPARTMENTSA–
Z LIFE@HKUST JOBS@HKUST FACULTYPROFILES LIBRARYABOUTHKUST 03.子网站的一致性 AREACAREAA SCHOOLNAME/DEPARTMENTNAME SchoolName AAA
8 AREAB 3.1 科大页首/AREAC页尾范本SCHOOL/ DEPARTMENTLOGO AREAA 科大页首范本的导航菜单中包含一个可扩展菜单，该菜单将连接到本校全新网站的相应页面
S。
choolName 请点击此处预览科大页首范本AREAB AAA AREACAREAA UNIVERSITYNEWSMAP&DIRECTIONS MOREABOUTHKUST ACADEMICDEPARTMENTSA–
Z LIFE@HKUST JOBS@HKUST FACULTYPROFILES SCHOOLNAME/DEPARTMENTNAME LIBRARYABOUTHKUST SchoolName AAAAREAB 香港科技大学网站指导 03.子网站的一致性 3.1科大页首/页尾范本 香港科技大学网站指导
9 科大页尾范本包含简化版的科大标志、隐私政策链接及网页地图链接。
位于页尾的简化版科大标志能够加深使用者对本校品牌的印象，与页首的科大标志拥有相同功能。
页尾范本亦应包含社交媒体图示，它们必须连接到贵单位的相应社交媒体账户。
如果贵单位没有相关社交媒体账户，请连接至以下科大社交媒体账户：
1.Facebook:/hkust/2.Instagram:/hkust/3.LinkedIn:/school/hkust/4.YouTube:/hkust5.微信： 请确保在转换网站语言后，能够显示出相应的标志。
所有科大标志必须连接到ust.hk网站。
如果您单位拥有其他的社交媒体账户，也欢迎您加入其反白标志作为链接。
请点击此处预览科大页尾范本。
请点击此处下载社交媒体图示范例。
04.网站结构/元素 10 04.网站结构/元素 香港科技大学网站指导 04.网站结构/元素香港科技大学网站指导 11 4.1科大页首 所有成员网站均需包含科大页首。
设计网站时，请谨记使用者通常预期某些关键网站元素 会出现在相同的位置。
04.网站结构/元素 4.1科大页首 4.1.1科大标志 12 •页首必须包含科大标志•科大标志必须连接到本校网站www.ust.hk•学院/部门/中心/办公室的移动端网站亦需满足以上两项要求•所有ust.hk必须以科大的形象标记(logomark)作为网址栏的favicon•请点击此处下载科大标志文件 香港科技大学网站指导 04.网站结构/元素 4.1科大页首 4.1.2附属单位 范例:学院 13 •所有附属单位（如学院/学科/部门/办公室/官方单位）必须使用科大标志，并于右边配上相应语言的单位名称 •当单位名称放置于科大标志旁边时，必须使用科大标志指定的字体样式，并全部使用大写。
当名称于科大页首范本的蓝色栏出现时，亦须按照此规定。
•如果附属单位拥有自己的标志，可以使用单位标志替代单位名称，但单位标志不能大于科大标志 •请点击此处下载科大标志文件 学院旗下单位 官方单位 香港科技大学网站指导 04.网站结构/元素 14 4.1科大页首 4.1.2附属单位 英文标志范例:
X •附属单位的名称必须使用科大标志指定字体(FuturaMedium)、大小、行距、字距和颜色。
请参照科大标志的文字大小比例、行距及字距，并垂直居中对齐（请参考本页范例） •请参考范例所示比例、行距、字距及空白位置•英文单位名称的排列必须在三行以内，每行最多五个单词•请点击此处下载科大标志文件 1/3X1/3X 每行最多五个单词 275px(w)275px(w) 香港科技大学网站指导 22pxUNIVERSITYUNIVERSITYUNIVERSITYOFFICE 26px OFFICEOFTHEUNIVERSITY 275px(w) 20px UNIVERSITYUNIVERSITYUNIVERSITYOFFICEUNIVERSITYUNIVERSITY 04.网站结构/元素 4.1科大页首 4.1.2附属单位 中文标志范例:
X 15 •附属单位的中文名称必须使用科大标志指定字体（黑体）、大小、行距、字距和颜色。
请参照科大标志的文字大小比例、行距及字距，并垂直居中对齐（请参考本页范例） •请参考本页范例所示的比例、行距、字距及空白位置 •中文单位名称必须限于一行，十五字以内 •请点击此处下载科大标志文件 1/2X1/2X中文字符间距：100 单行排列，十五字以内 香港科技大学网站指导 04.网站结构/元素 4.1科大页首 4.1.3搜索功能 4.1.4语言 16 网站使用者大多是为了寻找特定的资讯而访问网站，所以他们期望在网站中有搜索栏，以协助他们快速搜索内容。
您的网站必须拥有搜索功能，便于不同使用者可以简便快捷地在网站中找到他们想要的资讯。
除了使用本校官方语言英文以外，我们建议所有网站内容均提供繁体中文及简体中文版本。
为了让使用者有最佳浏览体验，网站的预设语言应与使用者浏览器的语言设定一致。
香港科技大学网站指导 04.网站结构/元素香港科技大学网站指导 17 4.2网站内容 学院/部门/中心/办公室可根据其自身需要设计网站内容。
在设计网站内容时，请注意以下重点元素，以协助建立与维持 本校的专业形象，这是作为科大一份子的责任。
另外，您亦应确保网站内容的质量， 并特别留意内容是否保持新鲜，以及功能是否方便用家。
04.网站结构/元素 4.2网站内容 4.2.1内容新鲜度4.2.2网站导航 香港科技大学网站指导 18 为了确保网站内容新鲜，我们建议成员网站插入本校网站的应用程式界面API（或插入带有标签的RSS），自动生成本校网站的分类内容，例如活动、新闻稿、最新消息等。
另外，在命名各个模块时，请避免使用一些会让使用者对内容及时性产生错误期待的字眼。
例如，如果内容部份并非经常更新，将该部分命名为“重点消息”会比“最新消息”或“新闻”更为恰当。
根据使用者族群分类确定网站浏览构架 根据主题分类确定网站浏览构架 根据使用者族群分类，来组织内容和导航方式，让使用者可以容易地找到他们想要的资讯 根据内容主题来组织网站的主选单。
使用清晰的内容分类及关键字，让使用者更易找到他们想要的资讯 内页路径导览列(BreadcrumbsTrail) 路径导览列显示使用者的浏览路径，方便他们追溯由主页到当前页面之间的浏览路径。
04.网站结构/元素 19 4.2网站内容 4.2.3字体及大小 为了确保科大所有成员网站的一致性，请在网站内文中使用Muli或Arial字体。
请参考本校品牌管理指导中有关字体(Typeface)的部分。
内文字体大小不能小于16像素，次级内文则为13至14像素。
4.2.4响应式网页设计 2017年的数据显示，有七成访问者使用移动端浏览科大网站。
随着如今移动设备的普及，大部分人都会使用智能手机或平板电脑设备浏览网站。
因此，所有成员网站的设计必须能够适应移动设备(mobileresponsive)。
请使用不同大小的电子屏幕，测试您的网站是否匹配，并确保主选单能在手机上清晰显示。
目前，有部分网页功能不能在移动设备上恰当显示，其中包括下拉式单选(dropdownmenu)等。
请避免使用此类功能，以免影响移动端网站使用者的体验。
另外，请规划清晰的内容及资讯呈现方式，确保使用者能找到所需的资讯。
现今普遍的个人电脑（PC及Mac）的屏幕大小平均为1366x768像素，将网站内容放置于浏览器中央，可让使用者更舒适地浏览和阅读内容。
如果您想快速测试网站的移动端兼容性，请点击此处。
香港科技大学网站指导 04.网站结构/元素 20 4.2网站内容 4.2.5影像/图像/平面设计 请参照以下有关图像的指导：•请使用GIF、JPEG或PNG图像文件格式•请使用像素为72dpi的数码照片•请使用小于2MB的图像文件，以便下载•请为图像加上有意思的替代文字［img中的alt属性］ 4.2.6视频 在网站加入多媒体内容时，请考虑文件大小，避免下载时间过长。
移动端网站应加入跳过视频的功能。
Flash元素在网页设计中已逐渐被淘汰，一些移动设备或较旧的电脑都无法支持。
假如必须使用Flash，请注意以下事项： •Flash动画必须以SWF格式嵌入HTML码中，并给不能支持Flash的浏览器附设下载指引 •为了降低对不支持Flash的移动设备和浏览器的影响，请在网页中Flash内容底下插入替代图像 香港科技大学网站指导 04.网站结构/元素 4.2网站内容 4.2.7可供下载内容 4.2.8方便打印 21 在网站中加入可供使用者加载的文件时，请避免使用可编辑的文件格式，如MSWord、MSPowerPoint或MSExcel等，除非该文件为免费工具。
请将文件转换成HTML或PDF格式。
如果您想了解建立PDF文件的详情，请参阅W3CPDFTechniquesforWCAG2.0。
本校支持环保，但为了方便需要打印网页的使用者，请确保网页方便打印，避免浪费纸张。
香港科技大学网站指导 04.网站结构/元素 4.2网站内容 4.2.9关于我们 4.2.10联络信息 22 请在网站中加入“关于我们”的部分，简单介绍您的学院/部门/中心/办公室，让使用者更容易了解网站性质。
请在网站中加入联络信息，列出相关单位的联络渠道，以便使用者查询或传达意见。
请安排职员负责处理这些查询及意见。
香港科技大学网站指导 04.网站结构/元素香港科技大学网站指导 23 4.3科大页尾 所有成员网站必须使用科大页尾。
04.网站结构/元素 4.3科大页尾 4.3.1版权资料 4.3.2隐私声明 24 请在网站中加入版权资料，保护网站内容。
版权资料必须以以下方式呈现：Copyright©TheHongKongUniversityofScienceandTechnology.AllRightsReserved.©版权属香港科技大学所有所有学院/部门/中心/办公室网站必须附有本校网站隐私政策声明的链接。
香港科技大学网站指导 04.网站结构/元素 4.3科大页尾 4.3.3网站地图 25 网站地图详列网站的构架，方便使用者找到想要浏览的分页。
即使使用者在浏览过程中迷失方向，也能容易地在页尾找到网站地图，重新定位。
请留意，XML格式的网站地图更利于搜索引擎读取内容。
4.3.4社交媒体图示 请将科大或您的学院/部门/中心/办公室的社交媒体图示放置于页尾，与内容清楚地分开。
香港科技大学网站指导 05.无障碍网页 26 05.无障碍网页 我们建议遵照无障碍网页倡议(WebessibilityInitiative，WAI)让不同能力的人士都能无障碍地使用您的网站。
最佳浏览设定建议 在网站中加入最佳浏览设定建议是一个很好的做法。
该建议通常会列明浏览器版本及任何必要的插件（plug-in）。
请避免使用过多插件，并请尽量使用普遍电子设备配备的常用插件。
ITSC的技术建议：所有新建立/改版/以CMS建立的网页，都应兼容常见的设备和网页浏览器，其中包括微软、苹果（MacOC及iOS）、Android及Linux平台上的MicrosoftExplorer、GoogleChrome、MozillaFirefox、Safari等。
香港科技大学网站指导 纯文字版本 请为网站建立纯文字版本，以供纯文字浏览器使用者使用。
ALT标记(tag) 请使用ALT标记为图像及多媒体内容加入文字说明，让不能查看图像或多媒体内容的使用者亦能接收内容资讯。
纯键盘浏览模式 为了方便无法使用鼠标的使用者，请确保即使仅使用键盘，您的网站仍能简易地操作。
如欲了解更多信息，请参阅「无障碍网页方案」：essibility.hk/zh-hant/ 06.网站安全 27 06.网站安全 所有成员网站必须为HTTPS(HyperTextTransferProtocolSecured)网站。
如果网站属于应用系统最低安全标准中的高危级别，需通过安全漏洞检查及修正——使用安全漏洞扫描工具检查网站系统。
如果扫描工具发现网站出现任何安全漏洞，网站拥有者必须立即修正，消除所有问题部分。
请向ITSC了解详情。
请点击此处查阅相关参考资料。
香港科技大学网站指导 07.方便內地用家浏览 28 07.方便大陆使用者浏览 一些常用的网站开发方式，并不一定适用于全部国家。
以中国大陆为例，部分网域如GoogleAPILibrary、GoogleFontLibrary和jQueryLibrary就未必任何时间都能访问。
如果网页的页首和内容包含这类网域的代码，就可能影响中国大陆使用者的浏览体验。
受制于中国大陆连接国际网络的带宽速度，繁忙时可能会出现网络堵塞，影响网页的加载速度。
以下列举一些使大陆使用者能更快加载网页的窍门：•减少加载外部链接插件库，改为直接本地加载脚本 科大旗下网站常用的外部链接插件库包括： GoogleAPILibrary/jsapi/ajax GoogleFontsLibrary//s/ jQueryLibrary/ 其他不能由中国大陆访问的网域可参考此处。
•使用异步（asynchronous）方式设计网页，让网页持续下载余下 的页面元素，而不会在遇到大陆无法访问的网址时完全停止加载•图片大小维持在1MB一下•简化网页设计，减少javascript、css、图片文件和插件数量 如欲了解如何使网页在大陆浏览得更快，请向ITSC服务处查询。
香港科技大学网站指导 08.启用网站 29 08.网站启用 香港科技大学网站指导 08.启用网站 30 8.1用户验收测试 请确保您的网站在正式启用之前，已通过用户验收测试(UsereptanceTest，UAT)。
UAT为网站测试过程中的最后一环，由真实使用者测试网站，确保它能在不同情况下，处理实际需求。
UAT是新开发网站在推出之前，需要通过的最后关键阶段之
一。
香港科技大学网站指导 08.启用网站 31 8.2网站表现追踪 启用后，我们建议您定期评估网站表现，以改善设计。
GoogleAnalytics等数据监察工具能协助您了解网站表现。
通过分析页面流量、使用者族群及行为等数据，您可以有效制定策略。
您必须获得网站表现报告或分析数据的存取权。
香港科技大学网站指导 08.启用网站 8.3搜索引擎的优化建议 32 为了让您的网站能更准确地接触到目标使用者，我们建议您提高网站的搜索引擎友善度。
搜索引擎优化是一项持续的工作，在新网站启用后亦应继续执行。
以下提供一些建议：•每个页面都必须拥有独一无二的标题，准确地交代页面内容。
标题必须简明扼 要，协助使用者了解页面主要内容。
•加入网站地图。
•使用元标签(metatags)；在元描述(metadescription)中只包含切题的关键字。
•由于搜索引擎会持续不断地读取（crawl）网站内容，因此保持内容新鲜和原创、 经常更新、运用多种关键字和词组等，都能让网站更吸引使用者及搜索引擎。
•为网站设计简单及合乎逻辑的导航方式；在每一个页面中都加上路径导览列 (breadcrumb)，能协助使用者更容易连接到网站内相关的部分及页面。
•制作清楚的404页面，解释网站出错原因，并提供其他相关网站/页面的链接。
•注意网页速度。
请特别留意会影响网页下载速度的因素，如图像和视频文件大 小。
您可以使用GooglePageSpeedService分析网站，获取提升网站表现建议。
香港科技大学网站指导 09.联络我们 09.联系我们 有关成员网站的品牌元素： 公共事务处品牌營銷 3469-2440|brand@ust.hk|https://pao.ust.hk有关网站后端开发： 信息系统处 23586240|issupprt@ust.hk|https://iso.ust.hk/ 香港科技大学网站指导 33 有关域名登记、服务器托管及网络安全： 资讯科技服务中心 23586188,23586200|help@ust.hk|https://itsc.ust.hk/有关网站的平面设计、图像及多媒体内容： 媒体科技及出版中心 23586807|mtpc@ust.hk|https://mtpc.ust.hk/ 公共事务处 ©版权属香港科技大学所有
3 科大旗下网站采用统一形象 网站是整个科大与外界沟通最重要的媒介之
一。
通过网站，我们可以无时无刻与世界各地的公众和利益持份者联系及互动。
作为大学的一部分，科大旗下的各个网站都需要定期更新，保持界面得体美观，并采用统一的设计结构。
网页的浏览体验和导览设计等必须以用家为本，整体语调亦需贯彻科大形象。
我们利用Drupal建立了一个网站开发平台，其中包含了构建网站所需的功能与范本。
该平台已根据这份指导结合了所有必需的功能和组件。
所有科大网站均应使用该平台进行网站开发。
您仍然可以在网站、排版和多媒体方面运用创意，自由发挥，并向本校出版中心(MediaTechnologyandPublishingCenter,MTPC）及/或您指定的设计公司寻求协助。
您的网站后台部分则会由信息系统处（ISO）处理，网站服务器则会由资讯科技服务中心（ITSC）负责。
我们希望通过本指导，协助科大成员网站展现一致的观感，建立和提升本校的品牌形象。
如您对您所属的学院/办公室/单位/部门网站，或对本指导有任何疑问，欢迎随时发送邮件至brand@ust.hk，或致电2358-5967向公共事务处活动统筹及推广主管杨凯仪女士询问。
02.注册新成员网站
4 02.注册新成员网站 如果您有意向注册一个新的成员网站(yourwebsitename.UST.HK)，请先向资讯科技服务中心查询有关网络服务器托管(webserverhosting)及网域名称登记(domainregistration)事宜。
另外，为了避免使用者搜索到过期网站，所有网站注册时都会设置期限。
过期后，网站内容将会自动封存。
除非您提出延长网站寄存期限的请求，否则使用者将无法浏览网站。
在启用新网站之前，请将所有旧网址重新导向至新网站。
我们建议您在永久删除过期网站之前，先将旧网站内容存档备份。
公共事务处的职责是管理和执行品牌指导。
无论您是刚建立了或正计划建立新的成员网站，都请发送邮件至brand@ust.hk通知我们，我们将及时在学校网站更新或新增您的网站链接，成为官方认可网站之
一。
香港科技大学网站指导 03.子网站的一致性 03.子网站的一致性 香港科技大学网站指导
5 除了内部认证(internalauthentication)的网站外，所有对外的科大网站（即以ust.hk为域名的网站）都必須遵从本校的品牌及网站指导，保持统一设计风格，协助建立本校的整体品牌形象。
如果您的单位属于以下类别，您的官方网站必须采用科大的页首/页尾范本，拥有响应式设计(responsivewebdesign)，适用于各种尺寸的电子屏幕浏览。
另外，网站必须通过资讯科技中心的安全标准。
以下列出的成员网站类别，需要在下次改版网页时，采用科大Drupal平台。
•学院/课程办公室•学术机构•研究机构•学术部门•学术课程•研究中心/实验室•大学年度活动•大学项目•行政及学术支持单位 如果与外部组织合作，ust.uk旗下的成员网站应包含一个彩色的科大标志连接到www.ust.hk，商标语言需与页面语言保持一致。
如科大Drupal平台未能支援网站某些功能，则现行网站亦需满足基本的品牌元素要求，直到下次的网站改版周期展开为止。
这些网站需与ISO联络，共同处理与开发科大Drupal平台上的相关功能。
基本品牌元素包括有相应语言版本的彩色科大标志连结www.ust.hk，以及完整的科大页尾。
03.子网站的一致性 3.1科大页首/页尾范本
6 科大页首范本共有两款: 范本
一 如果您的网站采用全大写名称或使用自己的标志，请使用范本一(科大标志位于左边） -导航菜单(navigationmenu)建议位置：位置
A，B或C-右上角的全球图示(globalicon)仅适用于多语言网站-如果附属单位拥有自己的标志，可用标志代替单位名称，但尺寸不能大于科大标志-放置于科大标志旁的单位名称，必须使用科大指定字体(FuturaMedium)、 大小、字距、行距及颜色。
详情请参阅第14页 请点击此处预览科大页首范本。
AREACAREAA SCHOOLNAME/DEPARTMENTNAME SchoolName AAAAREAB AREAC 香港科技大学网站指导 SCHOOL/DEPARTMENTLOGO AREAA AREAB SchoolName AAA 03.子网站的一致性
7 3.1科大页首/页尾范本 AREAC AREAA SCHOOLNAME/DEPARTMENTNAME 科大页首范本共有两款： 范本
二 如果您的单位标志结合了科大标志(symbol)，请使用范本二（科大标志位于右边） SchoolName -导航菜单(navigationmenu)建议位置：位置
A，B或
C AAA -右上角的全球图示(globalicon)仅适用于多语言网站AREAB-如果附属单位拥有自己的标志，可用标志代替单位名称，但尺寸不能大于科大标志 AREAC SCHOOL/DEPARTMENTLOGO AREAA AREAB SchoolName AAA 香港科技大学网站指导 UNIVERSITYNEWSMAP&DIRECTIONS MOREABOUTHKUST ACADEMICDEPARTMENTSA–
Z LIFE@HKUST JOBS@HKUST FACULTYPROFILES LIBRARYABOUTHKUST 03.子网站的一致性 AREACAREAA SCHOOLNAME/DEPARTMENTNAME SchoolName AAA
8 AREAB 3.1 科大页首/AREAC页尾范本SCHOOL/ DEPARTMENTLOGO AREAA 科大页首范本的导航菜单中包含一个可扩展菜单，该菜单将连接到本校全新网站的相应页面
S。
choolName 请点击此处预览科大页首范本AREAB AAA AREACAREAA UNIVERSITYNEWSMAP&DIRECTIONS MOREABOUTHKUST ACADEMICDEPARTMENTSA–
Z LIFE@HKUST JOBS@HKUST FACULTYPROFILES SCHOOLNAME/DEPARTMENTNAME LIBRARYABOUTHKUST SchoolName AAAAREAB 香港科技大学网站指导 03.子网站的一致性 3.1科大页首/页尾范本 香港科技大学网站指导
9 科大页尾范本包含简化版的科大标志、隐私政策链接及网页地图链接。
位于页尾的简化版科大标志能够加深使用者对本校品牌的印象，与页首的科大标志拥有相同功能。
页尾范本亦应包含社交媒体图示，它们必须连接到贵单位的相应社交媒体账户。
如果贵单位没有相关社交媒体账户，请连接至以下科大社交媒体账户：
1.Facebook:/hkust/2.Instagram:/hkust/3.LinkedIn:/school/hkust/4.YouTube:/hkust5.微信： 请确保在转换网站语言后，能够显示出相应的标志。
所有科大标志必须连接到ust.hk网站。
如果您单位拥有其他的社交媒体账户，也欢迎您加入其反白标志作为链接。
请点击此处预览科大页尾范本。
请点击此处下载社交媒体图示范例。
04.网站结构/元素 10 04.网站结构/元素 香港科技大学网站指导 04.网站结构/元素香港科技大学网站指导 11 4.1科大页首 所有成员网站均需包含科大页首。
设计网站时，请谨记使用者通常预期某些关键网站元素 会出现在相同的位置。
04.网站结构/元素 4.1科大页首 4.1.1科大标志 12 •页首必须包含科大标志•科大标志必须连接到本校网站www.ust.hk•学院/部门/中心/办公室的移动端网站亦需满足以上两项要求•所有ust.hk必须以科大的形象标记(logomark)作为网址栏的favicon•请点击此处下载科大标志文件 香港科技大学网站指导 04.网站结构/元素 4.1科大页首 4.1.2附属单位 范例:学院 13 •所有附属单位（如学院/学科/部门/办公室/官方单位）必须使用科大标志，并于右边配上相应语言的单位名称 •当单位名称放置于科大标志旁边时，必须使用科大标志指定的字体样式，并全部使用大写。
当名称于科大页首范本的蓝色栏出现时，亦须按照此规定。
•如果附属单位拥有自己的标志，可以使用单位标志替代单位名称，但单位标志不能大于科大标志 •请点击此处下载科大标志文件 学院旗下单位 官方单位 香港科技大学网站指导 04.网站结构/元素 14 4.1科大页首 4.1.2附属单位 英文标志范例:
X •附属单位的名称必须使用科大标志指定字体(FuturaMedium)、大小、行距、字距和颜色。
请参照科大标志的文字大小比例、行距及字距，并垂直居中对齐（请参考本页范例） •请参考范例所示比例、行距、字距及空白位置•英文单位名称的排列必须在三行以内，每行最多五个单词•请点击此处下载科大标志文件 1/3X1/3X 每行最多五个单词 275px(w)275px(w) 香港科技大学网站指导 22pxUNIVERSITYUNIVERSITYUNIVERSITYOFFICE 26px OFFICEOFTHEUNIVERSITY 275px(w) 20px UNIVERSITYUNIVERSITYUNIVERSITYOFFICEUNIVERSITYUNIVERSITY 04.网站结构/元素 4.1科大页首 4.1.2附属单位 中文标志范例:
X 15 •附属单位的中文名称必须使用科大标志指定字体（黑体）、大小、行距、字距和颜色。
请参照科大标志的文字大小比例、行距及字距，并垂直居中对齐（请参考本页范例） •请参考本页范例所示的比例、行距、字距及空白位置 •中文单位名称必须限于一行，十五字以内 •请点击此处下载科大标志文件 1/2X1/2X中文字符间距：100 单行排列，十五字以内 香港科技大学网站指导 04.网站结构/元素 4.1科大页首 4.1.3搜索功能 4.1.4语言 16 网站使用者大多是为了寻找特定的资讯而访问网站，所以他们期望在网站中有搜索栏，以协助他们快速搜索内容。
您的网站必须拥有搜索功能，便于不同使用者可以简便快捷地在网站中找到他们想要的资讯。
除了使用本校官方语言英文以外，我们建议所有网站内容均提供繁体中文及简体中文版本。
为了让使用者有最佳浏览体验，网站的预设语言应与使用者浏览器的语言设定一致。
香港科技大学网站指导 04.网站结构/元素香港科技大学网站指导 17 4.2网站内容 学院/部门/中心/办公室可根据其自身需要设计网站内容。
在设计网站内容时，请注意以下重点元素，以协助建立与维持 本校的专业形象，这是作为科大一份子的责任。
另外，您亦应确保网站内容的质量， 并特别留意内容是否保持新鲜，以及功能是否方便用家。
04.网站结构/元素 4.2网站内容 4.2.1内容新鲜度4.2.2网站导航 香港科技大学网站指导 18 为了确保网站内容新鲜，我们建议成员网站插入本校网站的应用程式界面API（或插入带有标签的RSS），自动生成本校网站的分类内容，例如活动、新闻稿、最新消息等。
另外，在命名各个模块时，请避免使用一些会让使用者对内容及时性产生错误期待的字眼。
例如，如果内容部份并非经常更新，将该部分命名为“重点消息”会比“最新消息”或“新闻”更为恰当。
根据使用者族群分类确定网站浏览构架 根据主题分类确定网站浏览构架 根据使用者族群分类，来组织内容和导航方式，让使用者可以容易地找到他们想要的资讯 根据内容主题来组织网站的主选单。
使用清晰的内容分类及关键字，让使用者更易找到他们想要的资讯 内页路径导览列(BreadcrumbsTrail) 路径导览列显示使用者的浏览路径，方便他们追溯由主页到当前页面之间的浏览路径。
04.网站结构/元素 19 4.2网站内容 4.2.3字体及大小 为了确保科大所有成员网站的一致性，请在网站内文中使用Muli或Arial字体。
请参考本校品牌管理指导中有关字体(Typeface)的部分。
内文字体大小不能小于16像素，次级内文则为13至14像素。
4.2.4响应式网页设计 2017年的数据显示，有七成访问者使用移动端浏览科大网站。
随着如今移动设备的普及，大部分人都会使用智能手机或平板电脑设备浏览网站。
因此，所有成员网站的设计必须能够适应移动设备(mobileresponsive)。
请使用不同大小的电子屏幕，测试您的网站是否匹配，并确保主选单能在手机上清晰显示。
目前，有部分网页功能不能在移动设备上恰当显示，其中包括下拉式单选(dropdownmenu)等。
请避免使用此类功能，以免影响移动端网站使用者的体验。
另外，请规划清晰的内容及资讯呈现方式，确保使用者能找到所需的资讯。
现今普遍的个人电脑（PC及Mac）的屏幕大小平均为1366x768像素，将网站内容放置于浏览器中央，可让使用者更舒适地浏览和阅读内容。
如果您想快速测试网站的移动端兼容性，请点击此处。
香港科技大学网站指导 04.网站结构/元素 20 4.2网站内容 4.2.5影像/图像/平面设计 请参照以下有关图像的指导：•请使用GIF、JPEG或PNG图像文件格式•请使用像素为72dpi的数码照片•请使用小于2MB的图像文件，以便下载•请为图像加上有意思的替代文字［img中的alt属性］ 4.2.6视频 在网站加入多媒体内容时，请考虑文件大小，避免下载时间过长。
移动端网站应加入跳过视频的功能。
Flash元素在网页设计中已逐渐被淘汰，一些移动设备或较旧的电脑都无法支持。
假如必须使用Flash，请注意以下事项： •Flash动画必须以SWF格式嵌入HTML码中，并给不能支持Flash的浏览器附设下载指引 •为了降低对不支持Flash的移动设备和浏览器的影响，请在网页中Flash内容底下插入替代图像 香港科技大学网站指导 04.网站结构/元素 4.2网站内容 4.2.7可供下载内容 4.2.8方便打印 21 在网站中加入可供使用者加载的文件时，请避免使用可编辑的文件格式，如MSWord、MSPowerPoint或MSExcel等，除非该文件为免费工具。
请将文件转换成HTML或PDF格式。
如果您想了解建立PDF文件的详情，请参阅W3CPDFTechniquesforWCAG2.0。
本校支持环保，但为了方便需要打印网页的使用者，请确保网页方便打印，避免浪费纸张。
香港科技大学网站指导 04.网站结构/元素 4.2网站内容 4.2.9关于我们 4.2.10联络信息 22 请在网站中加入“关于我们”的部分，简单介绍您的学院/部门/中心/办公室，让使用者更容易了解网站性质。
请在网站中加入联络信息，列出相关单位的联络渠道，以便使用者查询或传达意见。
请安排职员负责处理这些查询及意见。
香港科技大学网站指导 04.网站结构/元素香港科技大学网站指导 23 4.3科大页尾 所有成员网站必须使用科大页尾。
04.网站结构/元素 4.3科大页尾 4.3.1版权资料 4.3.2隐私声明 24 请在网站中加入版权资料，保护网站内容。
版权资料必须以以下方式呈现：Copyright©TheHongKongUniversityofScienceandTechnology.AllRightsReserved.©版权属香港科技大学所有所有学院/部门/中心/办公室网站必须附有本校网站隐私政策声明的链接。
香港科技大学网站指导 04.网站结构/元素 4.3科大页尾 4.3.3网站地图 25 网站地图详列网站的构架，方便使用者找到想要浏览的分页。
即使使用者在浏览过程中迷失方向，也能容易地在页尾找到网站地图，重新定位。
请留意，XML格式的网站地图更利于搜索引擎读取内容。
4.3.4社交媒体图示 请将科大或您的学院/部门/中心/办公室的社交媒体图示放置于页尾，与内容清楚地分开。
香港科技大学网站指导 05.无障碍网页 26 05.无障碍网页 我们建议遵照无障碍网页倡议(WebessibilityInitiative，WAI)让不同能力的人士都能无障碍地使用您的网站。
最佳浏览设定建议 在网站中加入最佳浏览设定建议是一个很好的做法。
该建议通常会列明浏览器版本及任何必要的插件（plug-in）。
请避免使用过多插件，并请尽量使用普遍电子设备配备的常用插件。
ITSC的技术建议：所有新建立/改版/以CMS建立的网页，都应兼容常见的设备和网页浏览器，其中包括微软、苹果（MacOC及iOS）、Android及Linux平台上的MicrosoftExplorer、GoogleChrome、MozillaFirefox、Safari等。
香港科技大学网站指导 纯文字版本 请为网站建立纯文字版本，以供纯文字浏览器使用者使用。
ALT标记(tag) 请使用ALT标记为图像及多媒体内容加入文字说明，让不能查看图像或多媒体内容的使用者亦能接收内容资讯。
纯键盘浏览模式 为了方便无法使用鼠标的使用者，请确保即使仅使用键盘，您的网站仍能简易地操作。
如欲了解更多信息，请参阅「无障碍网页方案」：essibility.hk/zh-hant/ 06.网站安全 27 06.网站安全 所有成员网站必须为HTTPS(HyperTextTransferProtocolSecured)网站。
如果网站属于应用系统最低安全标准中的高危级别，需通过安全漏洞检查及修正——使用安全漏洞扫描工具检查网站系统。
如果扫描工具发现网站出现任何安全漏洞，网站拥有者必须立即修正，消除所有问题部分。
请向ITSC了解详情。
请点击此处查阅相关参考资料。
香港科技大学网站指导 07.方便內地用家浏览 28 07.方便大陆使用者浏览 一些常用的网站开发方式，并不一定适用于全部国家。
以中国大陆为例，部分网域如GoogleAPILibrary、GoogleFontLibrary和jQueryLibrary就未必任何时间都能访问。
如果网页的页首和内容包含这类网域的代码，就可能影响中国大陆使用者的浏览体验。
受制于中国大陆连接国际网络的带宽速度，繁忙时可能会出现网络堵塞，影响网页的加载速度。
以下列举一些使大陆使用者能更快加载网页的窍门：•减少加载外部链接插件库，改为直接本地加载脚本 科大旗下网站常用的外部链接插件库包括： GoogleAPILibrary/jsapi/ajax GoogleFontsLibrary//s/ jQueryLibrary/ 其他不能由中国大陆访问的网域可参考此处。
•使用异步（asynchronous）方式设计网页，让网页持续下载余下 的页面元素，而不会在遇到大陆无法访问的网址时完全停止加载•图片大小维持在1MB一下•简化网页设计，减少javascript、css、图片文件和插件数量 如欲了解如何使网页在大陆浏览得更快，请向ITSC服务处查询。
香港科技大学网站指导 08.启用网站 29 08.网站启用 香港科技大学网站指导 08.启用网站 30 8.1用户验收测试 请确保您的网站在正式启用之前，已通过用户验收测试(UsereptanceTest，UAT)。
UAT为网站测试过程中的最后一环，由真实使用者测试网站，确保它能在不同情况下，处理实际需求。
UAT是新开发网站在推出之前，需要通过的最后关键阶段之
一。
香港科技大学网站指导 08.启用网站 31 8.2网站表现追踪 启用后，我们建议您定期评估网站表现，以改善设计。
GoogleAnalytics等数据监察工具能协助您了解网站表现。
通过分析页面流量、使用者族群及行为等数据，您可以有效制定策略。
您必须获得网站表现报告或分析数据的存取权。
香港科技大学网站指导 08.启用网站 8.3搜索引擎的优化建议 32 为了让您的网站能更准确地接触到目标使用者，我们建议您提高网站的搜索引擎友善度。
搜索引擎优化是一项持续的工作，在新网站启用后亦应继续执行。
以下提供一些建议：•每个页面都必须拥有独一无二的标题，准确地交代页面内容。
标题必须简明扼 要，协助使用者了解页面主要内容。
•加入网站地图。
•使用元标签(metatags)；在元描述(metadescription)中只包含切题的关键字。
•由于搜索引擎会持续不断地读取（crawl）网站内容，因此保持内容新鲜和原创、 经常更新、运用多种关键字和词组等，都能让网站更吸引使用者及搜索引擎。
•为网站设计简单及合乎逻辑的导航方式；在每一个页面中都加上路径导览列 (breadcrumb)，能协助使用者更容易连接到网站内相关的部分及页面。
•制作清楚的404页面，解释网站出错原因，并提供其他相关网站/页面的链接。
•注意网页速度。
请特别留意会影响网页下载速度的因素，如图像和视频文件大 小。
您可以使用GooglePageSpeedService分析网站，获取提升网站表现建议。
香港科技大学网站指导 09.联络我们 09.联系我们 有关成员网站的品牌元素： 公共事务处品牌營銷 3469-2440|brand@ust.hk|https://pao.ust.hk有关网站后端开发： 信息系统处 23586240|issupprt@ust.hk|https://iso.ust.hk/ 香港科技大学网站指导 33 有关域名登记、服务器托管及网络安全： 资讯科技服务中心 23586188,23586200|help@ust.hk|https://itsc.ust.hk/有关网站的平面设计、图像及多媒体内容： 媒体科技及出版中心 23586807|mtpc@ust.hk|https://mtpc.ust.hk/ 公共事务处 ©版权属香港科技大学所有
声明：
该资讯来自于互联网网友发布，如有侵犯您的权益请联系我们。
相关文章
