北藝大
網頁設計
台北藝術大學 – 網站架構介紹
網頁子選單、網站分頁連結、側邊欄導航
台北藝術大學 以承接教育部五年美感教育計畫的前提下,委任鵠崙製作計畫資訊網站,由於資訊種類相當繁複,需要展示的不只文字,也包含多媒體的圖片、影音等,因此在主選單上以學校提供的分類法規劃以子選單呈現,讓網站主選單不會因為過多內容導致使用者閱讀困難。
在每一個資訊主頁中均以分頁標籤的方式設計,將每一個子項目內容在同一頁面中就能快速切換,避免瀏覽者必須回到主選單才能找到相關頁面的狀況。
另外在單一文章頁面中也充分利用空白位置,加入該文章其他分類的側邊連結,基本上提供的就是在主要資訊內容區塊中就能直接抵達其他頁面的方式,即使資訊繁雜也不會造成瀏覽者找不到相關頁面的情形。
網頁元素設計理念
網格資訊區塊、表格資料展示
在本次學校網站設計案例中,大部分的內容都來自於不同的學生作品、活動公告、課程資訊等,以 WordPress 系統而言就是有許多不同分類的文章,因此在不同種類的文章類型,均設計不一樣的網格資訊區塊樣式,每一個分類都有自己的特殊設計,以避免長久瀏覽網頁時的視覺疲乏。
另外在活動報名與文獻資料以表格結合按鈕,讓複雜的資訊不需要分成過多頁面,讓使用者無止境的跳轉,只需要在固定的頁面中點選分頁,就能在自動生成的表格欄位中快速找到需要的資訊,並且直接點選對應的按鈕就能完成所需動作。
網站架設特色功能
漸層淡入動畫、懸浮標題特效、Youtube 影音嵌入
對於種類繁複的文章類型,我們在網站前台視覺上以漸層翻轉動畫以及懸浮標題特效兩種方式作為主要呈現樣式,除了作為分類識別,也讓網站整體有具有更生動的互動式回饋效果。
而對多媒體影音類型以嵌入方式處理,透過外連方式讓網站主機不需載入格式龐大的影音檔,透過第三方影音平台更能有效結合網站與社群媒體,讓瀏覽者能有更多元化的方式了解美感教育計畫內容。
想了解更多資訊內容嗎?歡迎立即聯繫鵠崙設計!