轉(zhuǎn)眼間，已到了期末，學(xué)習(xí)網(wǎng)頁設(shè)計這門課程也要結(jié)束了，雖然時間有點(diǎn)短，但是學(xué)過這個幾周以后我受益匪淺。
記得最初接觸dreamweaver的時候，我很茫然，因為剛接觸陌生的軟件心里會很害怕跟不上老師的進(jìn)程。剛開始幾節(jié)課，老師講得比較基礎(chǔ)，還能跟得上，漸漸的老師授課的進(jìn)程開始加速，有些跟不上了，需要下課后自己補(bǔ)上，問老師和周圍的同學(xué)。漸漸的，在老師的悉心教導(dǎo)下，我們開始熟悉這個軟件了。老師布置的第一個任務(wù)，要求做一個自我形象網(wǎng)站。由于學(xué)習(xí)的時間較短，老師只要求用PS做好模板即可，任務(wù)相對簡單。但也要求設(shè)計感強(qiáng)，色彩搭配和諧，并且盡可能的做成實用又符合實際的漂亮網(wǎng)頁。
第二個網(wǎng)頁設(shè)計老師要求相對較高，用dreamweaver做一個比較接近真實的網(wǎng)頁，還要做一個二級頁面。于是開始收集各方面的資料。確定了主題就開始布局了。最開始使用了一個表格，然后在表格內(nèi)進(jìn)行拆分合并處理，接著就把通過ps處理出來一個版頭并且把修改過大小的圖片放進(jìn)去了。
中間時預(yù)覽，問題出現(xiàn)了，發(fā)現(xiàn)版頭與下面的圖片文字之間出現(xiàn)了很大的一段距離，但是在軟件中已經(jīng)把距離縮小為0了，多次嘗試后沒有效果。最后想到可以另外再加一個表格，把版頭放在一個表格內(nèi)面，這樣問題就解決了。預(yù)覽是效果還不錯。但是總覺得首頁做得太普通，一次瀏覽學(xué)長做的網(wǎng)頁時，覺得他們的文字滾動窗口做得效果做得不錯，于是想借見一下。就決定把自己網(wǎng)站的左邊修改修改。復(fù)制了他的代碼，把上面的內(nèi)容修改成我的`網(wǎng)站需要的文字。本以為可以輕松的完成，但是卻出現(xiàn)大問題了。
因為需要滾動的文字占的空間太大，把左邊的那部分表格全部占滿了，而在實際的網(wǎng)頁預(yù)覽中，這個有文字滾動的框只占了左邊Oeasy教你玩轉(zhuǎn)網(wǎng)頁設(shè)計瀏覽的工具建站程序三分之一，左邊有三分之二留白了。我就想可不可以把文字這樣一層層的放在上面，試了很多方法，在網(wǎng)站查了很多資料，可能因為沒有專業(yè)術(shù)語作為搜索的關(guān)鍵詞，查不到任何相關(guān)的資料，試過div標(biāo)簽，試過不停的拆分表格，最后還是沒有效果。
就這樣試著試著，突然想到了層這個概念。于是在布局中點(diǎn)擊了繪制層，結(jié)果成功了，經(jīng)過一些加工，終于成功的完成左邊的布局。印象還比較深刻的是插入聲音，記得老師曾經(jīng)給我們講過很多次怎樣插入聲音，可是等到自己做網(wǎng)頁的時候卻忘記了，于是問其他人，結(jié)果居然都忘記了，于是自己在百度上收。
最后終于找到了一個可以使用的代碼，但是在加入聲音路徑時出現(xiàn)了問題。在屬性內(nèi)加入源文件，結(jié)果就是加不進(jìn)去MP3的音樂文件，然后自己就嘗試加入了一個視頻，記下了路徑格式，然后照著這種格式寫下了指向聲音源文件的路徑，最后成功了。在設(shè)計過程中還出現(xiàn)了很多的問題，但通過看書，上網(wǎng)查詢，請教同學(xué)等方式，不斷的學(xué)習(xí)、解決、提高，設(shè)計出的網(wǎng)頁不論是外觀還是內(nèi)容，都在不斷的進(jìn)步、改善。可以說在自己動手，不斷實踐的過程中，網(wǎng)頁設(shè)計水平得到了很大的提高。熱情和執(zhí)著，我將來設(shè)計出的網(wǎng)頁會更加專業(yè)，更完善。
本學(xué)期的網(wǎng)業(yè)設(shè)計課程，開展了動態(tài)思維訓(xùn)練教學(xué)活動，對于我們學(xué)生來說，可以激發(fā)學(xué)習(xí)興趣，調(diào)動學(xué)習(xí)的自覺性，自己動腦、動手，動口，運(yùn)用網(wǎng)絡(luò)資源，結(jié)合教材及老師的指導(dǎo)，通過自身的實踐，創(chuàng)作出積聚個人風(fēng)格、個性的個人網(wǎng)頁?？傮w來說，整個學(xué)期的學(xué)習(xí)過程，我學(xué)會了很多知識，雖然過程比較艱辛，但在INTENET領(lǐng)域中，有了一個展示自我的空間，我覺得很開心、很有成就感。
一、充分發(fā)揮動手能力
作為網(wǎng)頁設(shè)計的初學(xué)者，我對網(wǎng)頁設(shè)計非常感興趣，一心想設(shè)計出一個美觀、實用、內(nèi)容豐富的個人網(wǎng)頁。本學(xué)期的教改方案由以前學(xué)生單純接受知識變?yōu)橹鲃訁⑴c教學(xué)活動。在這樣的壓力和動力下，通過自己動手、動腦，通過網(wǎng)絡(luò)資源，老師的指導(dǎo)，在不斷發(fā)現(xiàn)問題和解決問題的過程中學(xué)到了很多知識，也增強(qiáng)了我的創(chuàng)作能力和動手能力，在網(wǎng)頁設(shè)計過程中，從構(gòu)思到設(shè)計、完善、維護(hù)，整個過程我都全身心投入，使我真正學(xué)到了網(wǎng)頁設(shè)計的知識。
二、在設(shè)計過程中不斷提高網(wǎng)頁設(shè)計水平
在本次網(wǎng)頁設(shè)計中，我不僅學(xué)到了很多關(guān)于網(wǎng)頁設(shè)計方面的知識，也從中學(xué)會了關(guān)于網(wǎng)絡(luò)、編程等方面的知識。我從最初開始運(yùn)用FrontPage設(shè)計網(wǎng)頁，到后來運(yùn)用Dreamweaver、Flash、Fireworks等網(wǎng)軟件設(shè)計網(wǎng)頁，完善網(wǎng)頁。在這個過程中，我通過自學(xué)教材、上網(wǎng)查詢，學(xué)習(xí)了Dreamweaver、Flash、Fireworks等網(wǎng)頁軟件的應(yīng)用，學(xué)會了管理、維護(hù)自己的站點(diǎn)，以及一些簡單動畫、控件的制作等等。在設(shè)計過程中也出現(xiàn)了很多的問題，但通過看書，上網(wǎng)查詢，請教老師等方式，不斷的學(xué)習(xí)、解決、提高，設(shè)計出的網(wǎng)頁不論是外觀還是內(nèi)容，都在不斷的進(jìn)步、改善?？梢哉f在自己動手，不斷實踐的過程中，網(wǎng)頁設(shè)計水平得到了很大的提高。
三、不足之處
由于平時工作比較繁忙，學(xué)習(xí)時間比較少，對于網(wǎng)頁設(shè)計軟件的強(qiáng)大功能運(yùn)用得還不夠。在網(wǎng)頁設(shè)計過程中，由于沒有網(wǎng)頁制作代碼的知識，所以在設(shè)計時也遇到了很多麻煩，有時插入一個特效腳本也是很麻煩。在網(wǎng)頁制作過程中，想提高設(shè)計水平，想有個理想的`網(wǎng)頁，必須學(xué)會代碼的運(yùn)用，我將在以后的學(xué)習(xí)過程中不斷加強(qiáng)這方面的學(xué)習(xí)，希望老師能簡單介紹一下代碼，讓我也對它有個初步的認(rèn)識，以后再加強(qiáng)學(xué)習(xí)也才會有所提高。
總體來說，通過今次的對網(wǎng)頁設(shè)計的學(xué)習(xí)，有收獲也有遺憾、不足的地方，但我想，我已經(jīng)邁入了網(wǎng)頁設(shè)計的大門，只要我再認(rèn)真努力的去學(xué)習(xí)，去提高，憑借我對網(wǎng)頁設(shè)計的熱情和執(zhí)著，我將來設(shè)計出的網(wǎng)頁會更加專業(yè)，更完善。也希望老師在今后的日子里多指導(dǎo)。
一連上了兩個星期的網(wǎng)頁實訓(xùn)課，可以說學(xué)到很多以前沒有學(xué)到的東西。雖然在大一的時候我們的專業(yè)出開設(shè)了網(wǎng)頁設(shè)計課，但感覺這兩個星期學(xué)到的遠(yuǎn)遠(yuǎn)比以前學(xué)一個學(xué)期的要多，要豐富。
每一天都有新的內(nèi)容要學(xué)，讓人感覺很興奮，很高興，恨不得馬上就把它給學(xué)會。通過這次實訓(xùn)使我更熟練掌握Dreamweaver、Flash、Fireworks、Photoshop等軟件的功能和應(yīng)用。不但如此，更增加了同學(xué)間的友誼，陪養(yǎng)了彼此間的團(tuán)結(jié)。
在這期間，每一天老師都會發(fā)一些素材和實訓(xùn)給我們，首先是網(wǎng)頁素材的準(zhǔn)備，在網(wǎng)上查看一些網(wǎng)頁背景和背景顏色搭配，讓我了解到網(wǎng)頁的顏色不能多過3種色彩。接下來的幾天再結(jié)合自己的網(wǎng)頁來進(jìn)行策劃，在做首頁之前，先用圖紙把網(wǎng)頁的結(jié)構(gòu)畫出來，內(nèi)容和結(jié)構(gòu)都想清楚用Fireworks把網(wǎng)頁設(shè)計出來，再切割圖片，把它們導(dǎo)成Html格式在Dreamweaver中進(jìn)行進(jìn)一步的編輯。
我們的網(wǎng)站主要是圍繞宿舍而展開的一串活動、人物等，宿舍給我們一種很溫馨、很快樂的感覺，所以我們決定將這次的網(wǎng)頁名叫funnyroom。主題確定好了，那么分工出就明確了，我們組有三個人，兩個人負(fù)責(zé)找素材，另一個美術(shù)好的'就負(fù)責(zé)網(wǎng)頁的頁面設(shè)計，但是我們始終不是學(xué)美術(shù)方面的，所以色彩方面搭配的不是很好，后來采用了色彩比較清新自然的綠色來作為首頁的主色調(diào)，讓人第一眼看上去就有難忘的感覺。而從第二頁開始就采用粉色為主色調(diào)，讓人可以感受到我們的主題，因為首頁和其它的顏色不一樣，所以我們就把首頁當(dāng)作是過渡頁，第二頁開始才是網(wǎng)頁的內(nèi)容。為了增加網(wǎng)頁的新鮮感和活潑感，還適當(dāng)在添加一些透明flash和一些網(wǎng)頁特效。在這實訓(xùn)的時間里面，我們分工合作，共同努力，對網(wǎng)頁反復(fù)調(diào)試和修改，特別是對于Fireworks軟件不那么熟悉，有很多的實例都要看過老師的演示才會明白，不過這也恰恰讓我學(xué)到更多。雖然中途難不免會有因為意見的不合而發(fā)生一些小小的爭吵，但我覺得不影響我們的網(wǎng)頁設(shè)計，反而會因為這些不同的意見而重新學(xué)到更多的知識。
風(fēng)塵仆仆的來到了大連，來參加匯博組織的HTML5培訓(xùn)，從HTML5基礎(chǔ)講起，起初并不以為然，想這HTML這個平常上課也經(jīng)常接觸到的東西，但是聽完第一堂課后，后面的興趣越來越濃厚，尤其是講到HTML5的新特性時候，講到canvas畫布時候，突然感覺HTML的功能遠(yuǎn)遠(yuǎn)超出了我的.想象，超出了我的預(yù)期，當(dāng)自己做完第一個實例的時候，就想以后一定要把這個充滿未來潛力的東西傳到學(xué)校，學(xué)生一定會感興趣。當(dāng)老師簡單講完CSS和JS時候，然后將HTML5+CSS+JS結(jié)合起來的時候，就感覺這是個強(qiáng)大無比的組合，不次于使用C#在VS平臺上實現(xiàn)的功能。尤其是其在游戲和動畫上的效果，使得頁面可以輕松拋棄Flash的枷鎖也同樣能夠?qū)崿F(xiàn)強(qiáng)大的動畫效果。
最后一天Intel的老師講到如何將HTML5的APP上傳到不同平臺的應(yīng)用商店時候，這時候就更感到自己學(xué)到的東西有意義了。不像以前單純教學(xué)，為了完成教學(xué)任務(wù)而教學(xué)，通過應(yīng)用的上傳，可以更加鼓勵學(xué)生的積極性，激發(fā)他們的學(xué)習(xí)動力，嗯，不錯的思路，把這個思路用在教學(xué)上，一定能有所收獲，學(xué)生一定能感興趣。
這次培訓(xùn)對于自己在今后教學(xué)過程中提出了一個新的思路，我們的教學(xué)可以找到學(xué)生的興趣點(diǎn)，像歐美國家教育環(huán)境那樣能夠激發(fā)出學(xué)生自身的興趣，而這個激發(fā)就需要我們老師和企業(yè)共同想辦法能為學(xué)生由被動學(xué)習(xí)變?yōu)橹鲃蛹ぐl(fā)資深興趣去學(xué)習(xí)。這才是最重要的，才能培養(yǎng)出高質(zhì)量人才。總之，感謝Intel，感謝微軟，感謝匯博給我們提供了這次培訓(xùn)，期待下次培訓(xùn)。
HTML5在網(wǎng)頁開發(fā)上，賦予網(wǎng)頁更好的意義和結(jié)構(gòu)，更加豐富的標(biāo)簽將隨著對RDFa的，微數(shù)據(jù)與微格式等方面的支持，構(gòu)建對程序、對用戶都更 有價值的數(shù)據(jù)驅(qū)動的Web。北京恒泰博遠(yuǎn)軟件開發(fā)公司對HTML5的解釋是，為開發(fā)者提供了一個跨平臺的移動apps開發(fā)方案，并且該方案具有很好的擴(kuò)展 性和靈活性。
由目前it行業(yè)使用html5開發(fā)app來看，如今國內(nèi)使用html5開發(fā)app應(yīng)用技術(shù)尚有欠缺，因為在手機(jī)開發(fā)app上，html5應(yīng)用只有兩種方法，要不就是全使用HTML5的語法，要不就是僅使用JavaScript引擎。
JavaScript引擎的構(gòu)建方法讓制作手機(jī)網(wǎng)頁游戲成為可能。由于界面層很復(fù)雜，已預(yù)訂了一個UI工具包去使用。
純HTML5手機(jī)應(yīng)用運(yùn)行緩慢并錯漏百出，但優(yōu)化后的'效果會好轉(zhuǎn)。盡管不是很多人愿意去做這樣的優(yōu)化，但依然可以去嘗試。
HTML5手機(jī)應(yīng)用的最大優(yōu)勢就是可以在網(wǎng)頁上直接調(diào)試和修改。原生應(yīng)用的開發(fā)人員可能需要花費(fèi)非常大的力氣才能達(dá)到HTML5的效果，不斷地重復(fù)編碼、調(diào)試和運(yùn)行，這是首先得解決的一個問題。
學(xué)習(xí)H5我們不需要過度的關(guān)注細(xì)節(jié)，五柳先生的“不求甚解”的態(tài)度就很好，遇到能想起來，用到明白來源，不用作為擴(kuò)展知識。
其次，H5的設(shè)計起點(diǎn)就是從實用出發(fā)的，也就是說很多特性都是怎么方便就怎么來。所以我們可以關(guān)注我們感興趣的技術(shù)，但是開發(fā)的時候還是不要特意的使用H5，能用到而且兼容性也不錯就用，用不到也不要“畫蛇添足”，比如163郵箱就有用到nav標(biāo)簽等，但是如果自己不是很精通H5或者是沒必要重構(gòu)就不要去把一些東西改為H5的，比如編寫JS的時候特意的用WebWorker，這就很不好!除非我們很明確的知道，這就是針對移動端這種基本上全面支持H5的Browser設(shè)計開發(fā)的功能。
最后，H5技術(shù)不復(fù)雜，它從來都不是什么新技術(shù)，只是HTML的延續(xù)，我認(rèn)為的H5包括如下三點(diǎn)：
(1)改進(jìn)及增強(qiáng)的HTML屬性，新頁面可以嘗試使用。
(2)增強(qiáng)了的JS交互接口：WebWorker、WebStorage、Web DB、Offline Application、Geolocation、Canvas，可以說H5和JS相互增強(qiáng)更上一層，但是還是要小心使用!
(3)CSS3：改進(jìn)增強(qiáng)CSS功能，讓頁面效果更絢麗，開發(fā)更簡單，尤其是“移動先行”的現(xiàn)代互聯(lián)網(wǎng)網(wǎng)頁設(shè)計理念能讓“響應(yīng)式設(shè)計”越來越簡單、流行，甚至出現(xiàn)了很多框架，比如bootstrap。
學(xué)習(xí)方法：
學(xué)習(xí)HTML這類的標(biāo)記語言，我們需要從四個方面入手：
(1)語法：即怎樣的書寫格式是Browser接受和支持的，HTML技術(shù)的語法很簡單，只要注意大小寫在HTML、XHTML、H5中的'一些細(xì)節(jié)不同就可以了。
(2)元素：也就是標(biāo)簽，這個就靠經(jīng)驗和記憶了，不求甚解多用就好。但是有一點(diǎn)，系統(tǒng)的學(xué)習(xí)和雜亂記憶的不同點(diǎn)就是：系統(tǒng)的學(xué)習(xí)會把元素分類。這樣方便記憶、對比和使用，能讓我們盡量減少不必要的錯誤嵌套。一般會把HTML標(biāo)簽分為文檔結(jié)構(gòu)標(biāo)簽、文本格式標(biāo)簽、字符格式標(biāo)簽、列表標(biāo)簽、鏈接標(biāo)簽、表格標(biāo)簽和表單標(biāo)簽這8類，有些標(biāo)簽不實用就不用看了。
(3)屬性：知道每類標(biāo)簽都有什么屬性，一般來說學(xué)習(xí)方法是知道有什么屬性，然后了解下哪些標(biāo)簽不支持這些屬性。其實，除了name、id、class、style外很多元素屬性我們都很少用，涉及到格式的屬性，我們都用CSS來代替了。這也是H5推薦的做法，那些屬性在H5中都被廢棄了，比如background屬性。
(4)其他：其他的東西就是去了解一些額外的知識：歷史背景、關(guān)聯(lián)技術(shù)、深入技術(shù)，比如XML、DTD，甚至是Browser對頁面的解析、渲染過程，DOM樹的構(gòu)建、Render Tree的構(gòu)建過程，來幫助我們學(xué)習(xí)、開發(fā)高效頁面?！罢n外知識”多了，自然就能做到“他強(qiáng)由他強(qiáng)，清風(fēng)拂山崗”的境界了。
學(xué)習(xí)計算機(jī)技術(shù)，千萬不能沉迷外家功夫!