IWARE官網改版紀錄(上)
歷年官網
隨歷史更迭與技術不斷更進，iWare自1996年成立21年來共歷經6次改版，進入網站時光機就可看到歷年的網站面貌。每次改版都有主要的目標，這次的目標有幾個：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對老人家也比較親切，一眼就能辨識出了~
.jpg)
-
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 標頭中設定到期日或最長使用期限等方式加快使用者瀏覽網站的速度。
IWARE官網改版紀錄(下) 會再接續著介紹程式功能、SEO和行銷等層面!
