網(wǎng)站風(fēng)格隨著時(shí)代的發(fā)展逐漸形成創(chuàng)意概念化設(shè)計(jì)，學(xué)生在首次接觸網(wǎng)頁設(shè)計(jì)的時(shí)候往往可以通過網(wǎng)站的主題探索到網(wǎng)站架構(gòu)和文案設(shè)計(jì)，網(wǎng)站架構(gòu)是整個(gè)網(wǎng)站設(shè)計(jì)的靈魂，可以以微妙的語言告知受眾網(wǎng)站的總體方向，而網(wǎng)站的內(nèi)容設(shè)計(jì)就成了關(guān)鍵，這時(shí)網(wǎng)站的架構(gòu)設(shè)計(jì)、版式設(shè)計(jì)、色彩設(shè)計(jì)與交互設(shè)計(jì)就是考驗(yàn)學(xué)生是否掌握基本設(shè)計(jì)原理的依據(jù)，換種說法也就是網(wǎng)站的內(nèi)容和價(jià)值是怎么執(zhí)行落地的。學(xué)生在實(shí)踐調(diào)研的時(shí)候，對不同文化背景、不同行業(yè)，或同一行業(yè)不同企業(yè)、部門等進(jìn)行多維度展開，他們的品牌特色、品牌文化、產(chǎn)品定位、宣傳方向等都有各自的特點(diǎn)，架構(gòu)設(shè)計(jì)自然會(huì)各成體系。通過學(xué)生們的實(shí)踐案例可以發(fā)現(xiàn)，并不是所有的主題都只有首頁、關(guān)于我們、企業(yè)背景、產(chǎn)品中心、特色板塊、聯(lián)系我們、信息反饋等欄目，更多的同學(xué)會(huì)根據(jù)自己自己選題的文化特點(diǎn)重新斟酌網(wǎng)站架構(gòu)欄目，也就是導(dǎo)航欄目的名稱，從而讓受眾能加深對主題網(wǎng)站的印象。
在《網(wǎng)頁設(shè)計(jì)》課程HTML，CSS及Javascript的學(xué)習(xí)中，許多學(xué)生面對交互設(shè)計(jì)實(shí)踐工作時(shí)，會(huì)出現(xiàn)項(xiàng)目內(nèi)容的需求與溝通，操作實(shí)踐環(huán)節(jié)難以鏈接或交互行為錯(cuò)誤等問題。HTML、CSS樣式是網(wǎng)頁設(shè)計(jì)課程中各種前端技術(shù)操作的基礎(chǔ)，各種細(xì)節(jié)的設(shè)置決定網(wǎng)頁設(shè)計(jì)視覺與交互效果的創(chuàng)意特色。html，head，title，body，div，p等元素的代碼設(shè)置是基礎(chǔ)，ul, li, h1、 h2、h3......, form,button,table,th,td等屬性的設(shè)置是網(wǎng)頁設(shè)計(jì)前端樣式的要點(diǎn)。
例如實(shí)例1：(Table)標(biāo)簽的屬性設(shè)置，Width表示表格的寬度，常用的單位是像素值或百分比;Height表示表格的高度，常用的單位像素值或百分比;Align 表示表格在頁面的水平擺放位置，一般設(shè)定的取值為left、center 、right;Background表示表格的背景圖片;Bgcolor表示表格的背景顏色;Border表示表格邊框的寬度，常用的單位是像素;Bordercolor表示表格邊框的顏色設(shè)置。例如實(shí)例2：網(wǎng)頁設(shè)計(jì)實(shí)例中banner廣告條的視覺切換的交互效果，其設(shè)計(jì)思路可以簡單進(jìn)行分析，首先，div+css布局視覺設(shè)計(jì)部分的內(nèi)容，如果只顯示一幅視覺圖像，可以定義圖像數(shù)組，并且進(jìn)一步在代碼區(qū)定義定時(shí)器的函數(shù)。其次，根據(jù)實(shí)踐項(xiàng)目需要演示的視覺圖像數(shù)目，再一次定義視覺圖像按鈕組。也就是通過路徑實(shí)現(xiàn)實(shí)例化圖像數(shù)組——切換圖像功能——寫入定時(shí)器——清除定時(shí)功能——鼠標(biāo)懸停圖像選擇——鼠標(biāo)離開自動(dòng)播放實(shí)現(xiàn)，后續(xù)可以把動(dòng)作綁定到span的視覺圖像按鈕上。 |
訪問手機(jī)版網(wǎng)站
聯(lián)系我們
公安機(jī)關(guān)備案號：61011602000152