IWARE官网改版纪录(上) ,南宁建站公司。
历年官网
随历史更迭与技术不断更进,IWARE自1996年成立21年来共历经6次改版,进入网站时光机就可看到历年的网站面貌。前两期的网站则是还有保存着:2010年、2013年。每次改版都有主要的目标,这次的目标有几个:1. 网页资讯简明让使用者可以一目了然,容易找到想要知道的资讯。2. 带入IWARE团队特色,大量使用内部拍摄的照片。3. 鼓励所有同事一同参与这项改版计画,提供部落格专区的文章。
改版主要分以下几个层面做纪录:规画面、设计面、程式功能面、SEO、行销面
一、规划面
- 开设专案线上google试算表
针对每个专案都会开设一个google试算表让内部同仁共同编辑及了解目前最新的进度及资讯。所有跟专案相关的资讯,即使是外连到其他地方都会整理在试算表中,确保分散在各处的资讯都可以方便被找到。运用试算表单可以增设很多个页籤的功能,IWARE官网改版的页籤项目包含:网站蒐集、架构、时程、相关连结、定位与优势、构想、版面规划、程式功能、SEO注意事项…。
-
发散构想阶段
在初期阶段我们看了很多网站,大家提出自己喜欢的网站并说明喜欢的原因为何,此阶段没有任何侷限,大家分享喜欢的网站风格与特效,然后从中初步订定IWARE要走的风格方向。
-
定位与优势讨论
定位与优势的讨论由设计部主管Gary带领大家一起发想,找出IWARE的主要定位与优势,再由此衍生出Slogan。
-
专业分工
有别于以往内部专案都由特定几个同仁包办大部分工作进行,这次的官网改版聚集了大多数同仁一起进行,依据每个人的专业特长,将官网改版的工作做以下的分配:摄影/Ringo、设计/Katie、前端/Karen, Trista、程式/Bye、文案/Ryan、SEO/小蛋, Ryan、系统/Advan。
-
时程规划
时程方面为考量尽量不要耽误到手上进行的客户案件,且以品质为最优先考量,所以将整个时程拉长,将两个礼拜定为一个时间阶段提供手上的进度。
-
部落格徵稿
部落格专区以往都由行销同仁Ryan一位撰写,这次改版则请大家针对自己有兴趣的主题投稿,使部落格主题更加多元与专业,也达成全员一起参与IWARE网站经营的想法。
二、设计面
-
LOGO
在Logo方面由三位设计师Katie, Ringo, Midori 进行提案,共设计出6款LOGO,再由全体同仁票选出一个做为IWARE LOGO。
最后决定的IWARE LOGO!也询问了其他部门的意见,有同事认为这个LOGO对老人家也比较亲切,一眼就能辨识出了~
-
IWARE实景摄影
实景拍摄主要由设计部门的Ringo主摄,动作指导则由Gary带活动主题诱导大家产生生动的表情。以往的官网都使用图库中的图片作为素材,有时会跟其他家撞图,也感受不出IWARE的实际情景。因此这次的改版我们想让浏览者能透过IWARE人事物照片,更能感受到IWARE带出的氛围。
-
版面设计
主视觉设计是由IWARE的资深设计师Katie操刀完成。设计中隐藏了许多小巧思,像是作品集中隐藏了同仁插画像、团队分工是以工作讨论的插画做表现,随处都可以见到IWARE同仁的身影喔。
-
前端设计
前端方面由Karen和Trista共同完成,这次改版运用了蛮多前端插件,包含:Slider-pro、Slick、SmoothDivScroll、Waypoints、Lazyload等套件。另外针对架构和效能的提升都有特地的优化。在架构的部分依据html5语意标籤,将<h>标籤置放重点语句,然后使用chrome的插件 HTML5 outliner 做检查;<a>标籤带title属性;<img>带alt属性,让搜寻引擎了解图片内容。重视这些语意标籤都有助于SEO优化,提升搜寻排名。在效能提升方面则运用了CDN、减少Http Request数量、压缩图片、在静态资源的 HTTP 标头中设定到期日或最长使用期限等方式加快使用者浏览网站的速度。