網(wǎng)頁設(shè)計(web design，又稱為Web UI design，WUI design，WUI)，是根據(jù)企業(yè)希望向瀏覽者傳遞的信息(包括產(chǎn)品、服務(wù)、理念、文化)，進行網(wǎng)站功能策劃，然后進行的頁面設(shè)計美化工作。下面是小編帶來的有關(guān)網(wǎng)頁設(shè)計實驗心得，希望大家喜歡
通過這次實訓對這門課程的學習，做好網(wǎng)頁，并不是一件容易的事，它包括網(wǎng)頁的選題、 內(nèi)容采集整理、 圖片的處理、 頁面的排版設(shè)置、 背景及其整套網(wǎng)頁的色調(diào)等很多東西。
所以我得出一下總結(jié)：
一、 準備資料和挑選符合目的主題的合適素材
做網(wǎng)頁當然要收集、準備資料。在網(wǎng)上多轉(zhuǎn)轉(zhuǎn)，看到什么漂亮的網(wǎng)頁，把它保存起來， 作為以后自己設(shè)計主頁時的參考。另外，還包括搜集美化主頁可能要用到的各種材料，如背景、小動畫圖標等等。可以在硬盤上建一個文件夾，下分“圖片、聲音、動畫”等文件夾， 養(yǎng)成上網(wǎng)時看到有創(chuàng)意、新鮮的圖像，就按鼠標右鍵存入你硬盤相應(yīng)文件夾的習慣，時間一長就擁有了一個可觀的圖庫，等做網(wǎng)頁時隨手拈來或加以修改就成你自己的東西了。
二、 規(guī)劃好整個網(wǎng)站
主頁的設(shè)計應(yīng)以醒目優(yōu)先，應(yīng)該令人一目了然，切勿堆砌太多不必要的細節(jié)，或使畫面 過于復雜。切記，頁面給人的第一觀感最為重要!在網(wǎng)上到處瀏覽網(wǎng)站的人很多，如果你的主頁給人的第一印像沒有吸引力， 很難令他們深入觀賞， 而且他們恐怕再也不會訪問你的網(wǎng)站了。
三、 善用圖片，增強藝術(shù)效果
我記得老師說過網(wǎng)頁的迷人之處之一， 要算它上面能點綴許多漂亮的圖片。 精美的圖片設(shè)計，可以使自己的網(wǎng)頁增輝不少，令人過目不忘。圖片的內(nèi)容應(yīng)有一定的實際作用，切忌 虛飾浮夸，同時還要注
意與文字的顏色搭配。最佳的圖像集美觀與資訊于一身。
四、善于借鑒他人主頁制作中的設(shè)計技巧
由于在網(wǎng)上用瀏覽器瀏覽任何主頁時， 都能查看到該主頁制作時所編寫的絕大部分網(wǎng)頁編程源代碼。因此，如果想知道并掌握一些優(yōu)秀的主頁采用的設(shè)計技巧，試著將其源代碼 調(diào)出來仔細揣摩，并模仿著一步一步去實現(xiàn)。
最后感謝老師多日來的辛勤教導!
這兩個星期是我們的網(wǎng)頁設(shè)計實訓時間，這正是考驗我們實力的時候了。
經(jīng)過一個學期的網(wǎng)頁設(shè)計的學習，我們的專業(yè)基礎(chǔ)更加扎實了，我們對于自己的專業(yè)學習更加有信心了。一開始對于網(wǎng)站設(shè)計我是抱著好奇以及興趣認真地學習，剛開始接觸網(wǎng)頁設(shè)計會覺得很神奇，平時上網(wǎng)接觸到的網(wǎng)頁可以通過自己的努力來建成。一心想著設(shè)計一個美觀大氣的大網(wǎng)站，可以與其他網(wǎng)站媲美。對于我這種初學者，有這種天真的夢想促使我更努力的學習網(wǎng)頁設(shè)計。
平時老師授課，講解了有關(guān)網(wǎng)頁設(shè)計的理論知識以及實際操作的示范。網(wǎng)頁設(shè)計更著重于實際操作，我們在機房通過每次上課的學習運用，已經(jīng)有了一定的基礎(chǔ)。一開始我們都是看著別人的網(wǎng)站去模仿建設(shè)，到后來每個人在設(shè)計自己的網(wǎng)頁時都有自己的人個人風格，這就是網(wǎng)頁設(shè)計的樂趣。他不僅可以激發(fā)同學們的興趣，還可以把自己的風格更大膽地展示出來，是一個可以展示自我的空間，使我們更有成就感。
這兩個星期我們實訓課讓我們更清楚地認識到自己的建站水平。實訓任務(wù)是建立自己班級的網(wǎng)站，剛開始覺得兩個星期足夠我們?nèi)ソǔ梢粋€網(wǎng)站，但是我們都太高估我們自己了。一開始設(shè)計網(wǎng)站時不知道從何下手，之前老師上課講的知識一時不知道怎么靈活運用起來，我才發(fā)覺對我軟件功能的不太熟悉，除了基本的框架構(gòu)建，其他的設(shè)計都需要比較長的時間去思考以及翻查書本。但是同學們都很積極地向老師提問，把自己存在的問題一一的解決掉。雖然建立網(wǎng)站不是很順利，也只有這樣我們才可以正視自身，把平時半桶水的聽課方式給改掉。在這次的網(wǎng)站建設(shè)過程中，我發(fā)現(xiàn)自己對于知識不能靈活運用，不能巧妙地結(jié)合起來，對代碼的不熟悉，這更加是一個大問題。建站過程中會遇到代碼出錯，代碼位置寫錯之類的問題，當測試的時候出現(xiàn)了錯誤但是不能看懂出錯原因，只能靠網(wǎng)上搜索。因為對于這種程序的東西我會比較抗拒，從小就不喜歡思維性太強的學習，所以建站會遇到比較多這種問題，但是我只能積極去面對才能完成任務(wù)，畢竟這是我的專業(yè)，為了專業(yè)而專業(yè)，不能說不喜歡就不愿意去學，這次實訓我反省了自身的存在問題。我們建立網(wǎng)站的時候都發(fā)揮自己的創(chuàng)新力、想象力，用心地完成這個大項目。會遇到很多的問題，經(jīng)常因為一個細小的步驟而出錯，做動態(tài)網(wǎng)頁的時候會遇到更多類似的問題，通常都會花費我很多時間來解決出錯原因。打個比方，我會一個上午都在弄留言板，因為不知道出錯原因，當請教老師或是同學的時候才恍然大悟，原來是這么簡單的。當然，最終可以解決困難我還是很欣慰的。
當我真正建立起自己的網(wǎng)站的時候，我看著自己的作品非常地興奮，這是我用心血完成的只屬于自己的網(wǎng)站，特別地欣慰。因為過程的困難，我更加珍惜自己第一次的作品，做每一步都會小心翼翼，就像母親生怕會失去自己的孩子一樣，我就是這樣的感受。
我可以說網(wǎng)頁設(shè)計給了我很大的收獲，我是用我的熱情去學習，也是用我的真心去設(shè)計，屬于自己的東西永遠是最美好的。網(wǎng)頁設(shè)計不是用嘴巴就可以設(shè)計的，更需要的我們的堅持、創(chuàng)新、用心，才能收獲更大的勝利。
回顧這一個月來的實習生活是一件很值得紀念的事，這是我第一次在外實習，第一次在網(wǎng)上投簡歷能收到回復。對于我們這樣的藝術(shù)設(shè)計學生，我深刻的體會到單單是學校教的遠遠不夠，學校教的很籠統(tǒng)，很抽象，很大概，如果可以，我希望這個專業(yè)的師弟師妹們，有空多多到圖書館充實自己，靜下心來充分自學。在外實習前，第一件事是把自己賣出去，包裝自己，所以簡歷很重要，務(wù)必屬實，因為你有多少兩重，閱人無數(shù)的人事主管和老板在面試的交談中很快就能從你各方面行為和語言中找到答案。既然要面試，衣服當然要穿正裝，其實我也想的只是大二實習期沒有大三的三個月那么長，就那么一個月。這樣短期的工作其實根本沒有什么公司愿意招聘，所以我感覺到萬分榮幸能夠進到這一支專業(yè)的創(chuàng)業(yè)團隊，真的是一件了不起的事，而且這個崗位與我學習的和自己喜愛的科目對的很準，我自己也十分樂于這份工作。
記得剛開始的一個多星期，公司并沒有讓我馬上投入工作，因為當時對產(chǎn)品了解不熟悉，要從學校的圈子走出來到商業(yè)模式去還是有點顧慮，但是當你接觸到這商業(yè)化的東西，你會發(fā)現(xiàn)，學校的東西遠遠不足。所以一般公司會進行些培訓，很感激william楊，他提供了很多設(shè)計的書籍給我自學閱讀，可惜在我深刻讀完《瞬間之美--web界面設(shè)計如果讓用戶心動》(點擊跳到本人的讀書筆記)一書后，就再也很難抽取一點時間來閱讀了。
在接下來的這個月里，除了必要的培訓以熟悉公司及其產(chǎn)品知識外，我也開始忙碌起來，因為產(chǎn)品的第一個內(nèi)部版本需要再X月X日這個好日子發(fā)布。剛開始的兩個星期，因為對產(chǎn)品并不熟悉，一直以來在學校設(shè)計的作品都很“學?！钡巧虡I(yè)設(shè)計比較少，出頭設(shè)計的時候真的抓破頭腦，因為習慣了學校的生活，習慣了客戶給要求按照客戶的想法去做。至于什么叫很學校呢，就是一種填鴨式的，根據(jù)參考去模仿設(shè)計，然而在社會上涉及很多版權(quán)問題，所以商業(yè)上的設(shè)計基本上都是原創(chuàng)或者參考過后進行大幅度的提高審美設(shè)計，其次因為涉及商業(yè)利益，在商業(yè)的角度上，商業(yè)的資金來源是客戶，所以他們的需求來源于客戶，注重用戶感受的設(shè)計，是一個好設(shè)計。其實設(shè)計是件看起來簡單，但是操作起來卻感覺很漫長的一件事情，每一個細節(jié)自己不斷的琢磨推敲，自己就會讓工作時間變長，效率變低，卻又希望哪天能像那些設(shè)計家門隨心所欲的設(shè)計出自己喜歡，人們喜歡，客戶滿意的東西。設(shè)計來源與生活，應(yīng)用于生活，我還需要多多積累。
X月X日這個內(nèi)部版本中，我主要的工作就是設(shè)計界面，然后photoshop切圖，然后繼續(xù)傻傻的使用習慣的notepad2++手寫html和css。經(jīng)歷這樣的蠢事之后，我決定還是回到dreamweaver的懷抱，因為畢竟知識不夠強，在兼容性方面還需要有dreamweaver來實時的告訴我，以提高我的工作效率。期間william楊還多次與我熟悉，很感激他們都關(guān)心我，提醒我應(yīng)該有自己的就業(yè)方向，3年5年_年的計劃，說長不長說短不短的大學2年已經(jīng)過去了。我應(yīng)該有怎樣的人生，我有想過，但卻還沒如此認真的付出著。我想起老板那句，你喜歡設(shè)計?你覺得設(shè)計適合你嗎?我真的很需要考慮我的以后，但目前設(shè)計還是我喜歡的事情，我也愿意身心的投入到其中，有時候可以不必得到回報，只是為了滿足我小小的心靈。
當X月X日一過，為慶祝產(chǎn)品大賣，公司還組織爬山活動，然而平常我們在深山中休養(yǎng)學習的多，爬山的少。爬山是鍛煉毅力的一種好方法，工作之余不能忘了生活，忘了自然。這次高強度的爬山活動從下午3點一直爬到了晚上10點多才下到山腳，經(jīng)歷的時間之長，讓我感受到一個人在公司里，不僅要有強硬的專業(yè)知識，還需要強壯的身體支撐來效益公司，而下山mk的那段話，真的讓我感受到他們很關(guān)心我，因為畢竟他們都是過來人，謝謝他們的指導。
產(chǎn)品的初步版本確定之后，就要開始慢慢的改進了。william作為產(chǎn)品經(jīng)理，不僅要領(lǐng)導著整個團隊，還要協(xié)調(diào)工作的進度。他會制作出甘特圖，通知每個人需要做什么事情，大概需要多長時間來完成。在其中，我會不時的停滯，因為某些小bug會導致我去轉(zhuǎn)牛角尖，而這樣會導致拖慢整個進度，然而在這個環(huán)節(jié)，我學會的最多的事，做事情要分優(yōu)先級?？傮w要現(xiàn)出來，大方向，模糊地對，細節(jié)的錯，慢慢改。而那個定律資源一定了，時間也定了，只能減少的剩下特性。
從X月X日開始到_日，又是另一個版本的小跨越，一個星期里做的事并不多，除了不斷配合小楊完善頁面的重構(gòu)和美化工作，還要檢查最繁瑣的兼容性問題，心里知道很多房地產(chǎn)經(jīng)紀人使用的電腦基本上都是深度、雨林木風、電腦公司特別版的ghost系統(tǒng)，所以基本上都是ie6 ie7為主流的瀏覽器，兼容性方面的確在工作上成為一個重點。
_日的第二個小版本后，會議總結(jié)了3頁的分條建立修改文件，當看見滿是修改意見的一行行文字，寫上我負責的q，心理是有點擔心，是否能在期限內(nèi)完成工作，然而15日這次的爬山活動并沒有參加，因為我知道我應(yīng)該更加抓緊時間處理問題，一天下來最讓我自己感到滿意的是導航，親力親為的感覺，頗有成就感。一方面不僅要不斷的完善頁面的布局，一方面還要抽時間設(shè)計虎之翼公司的logo和網(wǎng)頁，他們真是替我捏了把汗似的，都有種壓力很大吧。我感覺還好吧，不過腦子真的要轉(zhuǎn)的很快了，因為沒有創(chuàng)作來源，讓我在上下班的途中朝思暮想的想著設(shè)計，充分利用上下班的塞車時間，不斷的觀看經(jīng)過車窗的各型各類的廣告來尋來創(chuàng)意來源。最后還是有驚無險的完成這些工作。除了這些工作，公司越來越多人了，剛進去的時候只有我和sandy，后來多了好多個人，很羨慕參數(shù)組，能有說有笑的工作，但是我這項工作，我不是一個人在戰(zhàn)斗。再后來，開始招聘銷售，因為產(chǎn)品到_號就要正式發(fā)布了，有點讓我走也走的不放心的感覺，要配合銷售展開小單張的宣傳。時至_日，才基本完成。
希望，我的能力能幫到公司，獻出我自己一份的力量。
從開始的實習，讓我體驗到這個暑假回會過得更有意義，會特別漫長特別充實。的確學習是一個漫長的過程，學習要耐得住寂寞的抵住誘惑。通過這次的實習，不僅讓我覺得我應(yīng)該改變自己的內(nèi)向，學會轉(zhuǎn)變與人主動交流，才能解決問題，讓我覺得設(shè)計還是不錯的，但是自己的專業(yè)真的很需要培養(yǎng)與加強，感覺到學校教的和自己學的遠遠不夠。而且在接下來的日子還要規(guī)劃好自己的未來，才能更好得在崗位上發(fā)揮自己的才能。
最后感謝dav給我這么一個機會，留在公司實習，公司不僅需要各類型的人才，更需要一個有堅定和遠見的老板;感謝william，看過頭像和手機桌面，女兒很可愛，想必是個和藹的爸爸，從一開始便覺得他是個很會閱人的hr，但后來才知道是pm，不過沒有變的，總是耐心地培養(yǎng)我，給我很多資料和很多網(wǎng)站，提高自己的審美和用戶體驗感受;感謝mk，認真的時候很認真，玩的時候還像個大孩子，喜歡和參數(shù)組交流時逗逗我，調(diào)劑我，這點我最喜歡了，因為有你們整個公司才顯得有活氣，沒有那么沉悶;感謝kevin，雖然接觸不多，感覺他很用心，是市場方面的主管，看的最多就是修空調(diào)，快遞要發(fā)票的時候，會為公司的財政斤斤計較，到后來q總q總得叫我，真不好意思呢;感謝小楊，能夠和你愉快的合作，如果可以我也想學jsp，后來小白走了，你又要一個人辛苦了;感謝adam，強硬的技術(shù)支持，我想沒有你這位核心人物為公司撐下一片藍天，可能我們這個產(chǎn)品就很難走下去了;謝謝一起在虎之翼公司里工作的所有工作人員。
我很喜歡你們,喜歡這樣的工作氛圍，謝謝你們!
真的是萬事開頭難啊，遇到了很多問題，比如：插入的圖片不符合規(guī)格，一下子把其他內(nèi)容的框架擠開;插入的層太多，大一點的就把小一點的給覆蓋掉了;插入的FLASH不能產(chǎn)生效果。總之問題一籮筐。實踐出真知，原來自己還有那么多欠缺的知識。于是回歸本源，先把課本上的東西弄通再談其他。然后又到圖書管里借了幾本網(wǎng)頁制作方面的書籍來參考。
在對基本知識有了詳細的了解之后，做起東西來就得心應(yīng)手多了，知道引導頁能過加映像之后，我決定為我的網(wǎng)頁設(shè)計一個引導頁。
然后是主頁和二級頁面的設(shè)置。要注意,網(wǎng)上只能使用JPG和GIF兩種圖象格式，其他諸如BMP和TIF等很通用的格式都不能用在網(wǎng)上,因為它們太大了,但可以用圖象軟件進行轉(zhuǎn)換，比如Office 97的照片編輯器。把準備在主頁上出現(xiàn)的圖象放進相應(yīng)的目錄里后.
在一步一步的邊學邊做的過程中，看著心中的東西一點一點的出來，真的很有成就感。雖然自己的網(wǎng)頁技術(shù)還差的遠，但是回顧一下這周真的學到了很多的東西。
網(wǎng)頁的調(diào)試
之前把作過的東西放到U盤里，發(fā)生過圖片顯示不出來的狀況，還好即使找到了解救的方法，把源文件和WEB頁面放到一起這樣就算路徑改變的話也不會影響頁面的效果。
一.網(wǎng)站的整體規(guī)劃
1.討論網(wǎng)站主題：因為自己對普羅旺斯很感興趣，于是就想到要是一下為心中的仙境設(shè)計一個旅游網(wǎng)站。
2.定位網(wǎng)站CI形象：旅游網(wǎng)站最重要的就是是瀏覽者產(chǎn)生想去親身體驗一下的共鳴。于是在網(wǎng)頁設(shè)計上面，根據(jù)普羅旺斯夢幻般的意境，我采用的是清新雋永的CI形象。使瀏覽者有賓至如歸的感受。
3.確定欄目和板塊：
1]首先要考慮整個網(wǎng)頁的長和寬，以及長度和寬度之間的比例。
2]其次就應(yīng)該考慮導航條的設(shè)置了。
3]正文的框架設(shè)置 (橫向因素和縱向因素交錯)
在瀏覽了很多精美的旅游網(wǎng)站之后，再結(jié)合自己的想法，我先在草紙上畫出了大體的欄目和板塊。
4.網(wǎng)站的整體風格和創(chuàng)意：建立一個浪漫的旅行網(wǎng)站，走映像派路線，目的務(wù)必使瀏覽者留下映像。
二.網(wǎng)頁制作的前期策劃與準備
1.資料的搜集：由于個人的愛好，我很早以前就收集了許多普羅旺斯的美圖，這次就方便多了。接著就搜集了一些有夢幻效果的網(wǎng)頁背景，F(xiàn)IASH源代碼、小圖標和一些GIF的動畫等。
2.熟悉制作工具軟件：
主頁制作的基本條件有：網(wǎng)頁設(shè)計實習總結(jié)
硬件：
一臺電腦(64MB以上內(nèi)存，當然越大越好啦);可以撥號上網(wǎng);如果你有條件的話,建議:配置掃描儀,這將大大方便圖像和文字的輸入;
軟件：
HTML編輯軟件：常用的有Frontpage、Hotdog等，本文重點介紹 Dreamweaver;
圖像處理軟件：常用的有Photoshop、flash、Fireworks 等;
文件上傳軟件：常用的有Cuteftp、WSftp等。
轉(zhuǎn)眼間，已到了期末，學習網(wǎng)頁設(shè)計這門課程也要結(jié)束了，雖然時間有點短，但是學過這個幾周以后我受益匪淺。
記得最初接觸dreamweaver的時候，我很茫然，因為剛接觸陌生的軟件心里會很害怕跟不上老師的進程。剛開始幾節(jié)課，老師講得比較基礎(chǔ)，還能跟得上，漸漸的老師授課的進程開始加速，有些跟不上了，需要下課后自己補上，問老師和周圍的同學。漸漸的，在老師的悉心教導下，我們開始熟悉這個軟件了。老師布置的第一個任務(wù)，要求做一個自我形象網(wǎng)站。由于學習的時間較短，老師只要求用PS做好模板即可，任務(wù)相對簡單。但也要求設(shè)計感強，色彩搭配和諧，并且盡可能的做成實用又符合實際的漂亮網(wǎng)頁。
第二個網(wǎng)頁設(shè)計老師要求相對較高，用dreamweaver做一個比較接近真實的網(wǎng)頁，還要做一個二級頁面。于是開始收集各方面的資料。確定了主題就開始布局了。最開始使用了一個表格，然后在表格內(nèi)進行拆分合并處理，接著就把通過ps處理出來一個版頭并且把修改過大小的圖片放進去了。
中間時預覽，問題出現(xiàn)了，發(fā)現(xiàn)版頭與下面的圖片文字之間出現(xiàn)了很大的一段距離，但是在軟件中已經(jīng)把距離縮小為0了，多次嘗試后沒有效果。最后想到可以另外再加一個表格，把版頭放在一個表格內(nèi)面，這樣問題就解決了。預覽是效果還不錯。但是總覺得首頁做得太普通，一次瀏覽學長做的網(wǎng)頁時，覺得他們的文字滾動窗口做得效果做得不錯，于是想借見一下。就決定把自己網(wǎng)站的左邊修改修改。復制了他的代碼，把上面的內(nèi)容修改成我的網(wǎng)站需要的文字。本以為可以輕松的完成，但是卻出現(xiàn)大問題了。
因為需要滾動的文字占的空間太大，把左邊的那部分表格全部占滿了，而在實際的網(wǎng)頁預覽中，這個有文字滾動的框只占了左邊Oeasy教你玩轉(zhuǎn)網(wǎng)頁設(shè)計瀏覽的工具建站程序三分之一，左邊有三分之二留白了。我就想可不可以把文字這樣一層層的放在上面，試了很多方法，在網(wǎng)站查了很多資料，可能因為沒有專業(yè)術(shù)語作為搜索的關(guān)鍵詞，查不到任何相關(guān)的資料，試過div標簽，試過不停的拆分表格，最后還是沒有效果。就這樣試著試著，突然想到了層這個概念。于是在布局中點擊了繪制層，結(jié)果成功了，經(jīng)過一些加工，終于成功的完成左邊的布局。印象還比較深刻的是插入聲音，記得老師曾經(jīng)給我們講過很多次怎樣插入聲音，可是等到自己做網(wǎng)頁的時候卻忘記了，于是問其他人，結(jié)果居然都忘記了，于是自己在百度上收。最后終于找到了一個可以使用的代碼，但是在加入聲音路徑時出現(xiàn)了問題。在屬性內(nèi)加入源文件，結(jié)果就是加不進去MP3的音樂文件，然后自己就嘗試加入了一個視頻，記下了路徑格式，然后照著這種格式寫下了指向聲音源文件的路徑，最后成功了。在設(shè)計過程中還出現(xiàn)了很多的問題，但通過看書，上網(wǎng)查詢，請教同學等方式，不斷的學習、解決、提高，設(shè)計出的網(wǎng)頁不論是外觀還是內(nèi)容，都在不斷的進步、改善?？梢哉f在自己動手，不斷實踐的過程中，網(wǎng)頁設(shè)計水平得到了很大的提高。熱情和執(zhí)著，我將來設(shè)計出的網(wǎng)頁會更加專業(yè)，更完善。
★ 2020學生心得