- 網(wǎng)頁(yè)設計課程設計報告心得體會(huì ) 推薦度:
- 相關(guān)推薦
網(wǎng)頁(yè)設計課程心得體會(huì )
網(wǎng)頁(yè)設計課程心得體會(huì )1
做出一個(gè)好的網(wǎng)頁(yè)一般都離不開(kāi)dreamweaver,flash,photoshop這三個(gè)軟件,當然,還可以用到其他一些輔助軟件就會(huì )加快網(wǎng)頁(yè)的設計了,比如:
SothinkDHTMLMenu,Sothink_Logo_Maker等軟件,這些軟件不僅可以快速開(kāi)發(fā)出導航,logo等,而且很漂亮,美觀(guān)。
制作網(wǎng)頁(yè),首先是確定主題,每一版塊都有其個(gè)性的色彩,清晰明了,便于閱讀瀏覽,大致分幾部分,每一部分又分幾小部分,內容比較充分,多樣。內容精彩豐富,簡(jiǎn)潔明快,語(yǔ)言風(fēng)趣,通俗易懂。頁(yè)面可愛(ài)清爽。
而我們這次的實(shí)習就是用這幾款軟件來(lái)設計,主要使用div+css來(lái)布局,避開(kāi)傳統的table(表格)布局
DIV+CSS的網(wǎng)頁(yè)布局對SEO的好處一、不存在表格的嵌套問(wèn)題:很多“網(wǎng)站如何推廣”的文章中稱(chēng),搜索引擎一般不抓取三層以上的表格嵌套,這一點(diǎn)一直沒(méi)有得到搜索引擎相關(guān)的官方證實(shí)。我的幾項實(shí)驗結果沒(méi)有完全出來(lái),但根據目前掌握的情況來(lái)看,Spider爬行Table布局的頁(yè)面,遇到多層表格嵌套時(shí),會(huì )跳過(guò)嵌套的內容或直接放棄整個(gè)頁(yè)面。
使用Table布局,為了達到一定的視覺(jué)效果,不得不套用多個(gè)表格。如果嵌套的表格中是核心內容,蜘蛛(Spider)爬行時(shí)跳過(guò)了這一段沒(méi)有抓取到頁(yè)面的核心,這個(gè)頁(yè)面就成了相似頁(yè)面。網(wǎng)站中過(guò)多的相似頁(yè)面會(huì )影響排名及域名信任度。
DIV+CSS的網(wǎng)頁(yè)布局對SEO的好處二、精簡(jiǎn)的代碼使用DIVCSS布局,頁(yè)面代碼精簡(jiǎn),這一點(diǎn)相信對XHTML有所了解的都知道。觀(guān)看更多的HTML教程內容。
代碼精簡(jiǎn)所帶來(lái)的直接好處有兩點(diǎn):一是提高蜘蛛(Spider)爬行效率,能在最短的時(shí)間內爬完整個(gè)頁(yè)面,這樣對收錄質(zhì)量有一定好處;二是由于能高效的爬行,就會(huì )受到蜘蛛(Spider)歡迎,這樣對收錄數量有很大好處。
而DIV+CSS布局基本上不會(huì )存在這樣的問(wèn)題,從技術(shù)角度來(lái)說(shuō),XHTML在控制樣式時(shí)也不需要過(guò)多的嵌套。這雖然沒(méi)有得到確認,但還是建議使用Table布局的朋友們,在設計時(shí)盡可能的不要使用多層表格嵌套,SEOer(seo工作者們)們在文章中說(shuō)明了這一點(diǎn),相信他們也不是沒(méi)有依據。
DIV+CSS的網(wǎng)頁(yè)布局對SEO的好處三、對搜索引擎的排名基于XTHML標準的DIV+CSS布局,一般在設計完成后會(huì )盡可能的`完善到能通過(guò)W3C驗證。截止目前沒(méi)有搜索引擎表示排名規則會(huì )傾向于符合W3C標準的網(wǎng)站或頁(yè)面,但事實(shí)證明使用XTHML架構的網(wǎng)站排名狀況一般都不錯。
DIV+CSS的網(wǎng)頁(yè)布局對SEO的好處四、提高網(wǎng)頁(yè)的訪(fǎng)問(wèn)速度:DIV+CSS布局較Table布局減少了頁(yè)面代碼,加載速度得到很大的提高,這在蜘蛛(Spider)爬行時(shí)是非常有利的。過(guò)多的頁(yè)面代碼可能造成爬行超時(shí),蜘蛛(Spider)就會(huì )認為這個(gè)頁(yè)面無(wú)法訪(fǎng)問(wèn),影響收錄及權重。
真正的SEOer(seo工作者們)不只是為了追求收錄、排名,快速的響應速度是提高用戶(hù)體驗度的基礎,這對整個(gè)搜索引擎優(yōu)化及營(yíng)銷(xiāo)都是非常有利的。換一個(gè)角度拋開(kāi)DIV+CSS對SEO的有利影響。單獨來(lái)講這種div+css布局也是很有益的,可以說(shuō)是實(shí)下是最流行的網(wǎng)頁(yè)布局方式。當然div+css布局也有不完善的方面。
總之Div+css布局的優(yōu)勢如下:
由于將大部分頁(yè)面代碼寫(xiě)在了CSS當中,使得頁(yè)面體積容量變得更小。相對于表格嵌套的方式,DIV+CSS將頁(yè)面獨立成更多的區域,在打開(kāi)頁(yè)面的時(shí)候,逐層加載。而不像表格嵌套那樣將整個(gè)頁(yè)面圈在一個(gè)大表格里,使得加載速度很慢。
頁(yè)面體積變小,瀏覽速度變快,這就使得對于某些控制主機流量的網(wǎng)站來(lái)說(shuō)是最大的優(yōu)勢了。由于使用了DIV+CSS制作方法,在修改頁(yè)面的時(shí)候更加容易省時(shí)。根據區域內容標記,到CSS里找到相應的ID,使得修改頁(yè)面的時(shí)候更加方便,也不會(huì )破壞頁(yè)面其他部分的布局樣式。
DIV+CSS最重要的優(yōu)勢之一:保持視覺(jué)的一致性;以往表格嵌套的制作方法,會(huì )使得頁(yè)面與頁(yè)面,或者區域與區域之間的顯示效果會(huì )有偏差。而使用DIV+CSS的制作方法,將所有頁(yè)面,或所有區域統一用CSS文件控制,就避免了不同區域或不同頁(yè)面體現出的效果偏差。
我們都知道網(wǎng)站做出來(lái)是給瀏覽者使用的,對瀏覽者和瀏覽器更具親和力,DIV+CSS在這方面更具優(yōu)勢。由于CSS富含豐富的樣式,使頁(yè)面更加靈活性,它可以根據不同的瀏覽器,而達到顯示效果的統一和不變形。
好的網(wǎng)頁(yè),也離不開(kāi)photoshop,前面我也說(shuō)了,flash的制作所需要的圖片都要在photoshop中事先PS好的。那么photoshop的作用就顯得很重要了,網(wǎng)頁(yè)中的flash都僅僅是一小部分,圖片占的分量還是比f(wàn)lash要大的,故好的
photoshop技術(shù),那么PS出來(lái)的圖片就會(huì )顯得更好,這樣網(wǎng)頁(yè)的檔次也會(huì )隨著(zhù)上升。這次的網(wǎng)頁(yè)設計,因為是仿照一張圖片,那么就要求我們要懂得photoshop中的切片工具的使用。切好片后,還要獲取圖片的背景色。這樣我們又得掌握吸管工具的使用了。切片過(guò)程中要注意的就是圖片的大小要控制在一個(gè)像素以?xún)。所以我們需要先放大,然后才?lái)控制切片線(xiàn)的位置。
從制作網(wǎng)頁(yè)過(guò)程中,我學(xué)到了新的美化網(wǎng)頁(yè)的方法,運用了更多以前未運用的技巧。這使我學(xué)到了更多的知識,并且為我自己在制作網(wǎng)頁(yè)這方面積累了一些經(jīng)驗。這些將是我人生中的一次重要的經(jīng)歷,將是我今后走上社會(huì )后的一筆巨大的財富。這次實(shí)習的收獲對我來(lái)說(shuō)有不少,我自己感覺(jué)在知識、技能等方面都有了不少的收獲?傮w來(lái)說(shuō)這次是對我的綜合素質(zhì)的培養,鍛煉和提高。這兩周的學(xué)習實(shí)習中我在老師的指導下以大量明晰的操作步驟和典型的應用實(shí)例,教會(huì )我們。使更豐富全面的軟件技術(shù)和應用技巧,使我們真正對所學(xué)的軟件融會(huì )貫通。當前的軟件的功能日趨復雜,不學(xué)到一定的深度和廣度是難以在實(shí)際工作中應付自如的。因此反映出學(xué)習的還不夠,缺點(diǎn)疏漏。需在加以刻苦鉆研及學(xué)習,不斷開(kāi)拓視野,增強自己的實(shí)踐操作技能,為以后能做出出色的網(wǎng)頁(yè)。
網(wǎng)頁(yè)設計課程心得體會(huì )2
現在,計算機和網(wǎng)絡(luò )已經(jīng)深入到了我們生活中的方方面面,也已經(jīng)成了生活中不可缺少的一部分,網(wǎng)絡(luò )成了我們獲取知識和信息的一種便捷工具,現在的網(wǎng)民也在不斷的增多,所以,了解和學(xué)習網(wǎng)絡(luò )知識是我們作為一名大學(xué)生迫切所需的。我通過(guò)這一學(xué)期的學(xué)習,對網(wǎng)頁(yè)設計有了初步的認識和了解,并基本掌握了Dreamweaver的應用。
在學(xué)習了網(wǎng)頁(yè)設計的同時(shí),我更加深入的了解了關(guān)于計算機和網(wǎng)絡(luò )的知識;趯τ嬎銠C基礎與C語(yǔ)言的基本掌握,學(xué)習網(wǎng)頁(yè)設計的基礎部分便顯得較為輕松。雖然如此,在設計過(guò)程中依然出現了很多的問(wèn)題,但通過(guò)看書(shū),上網(wǎng)查詢(xún),等方式,不斷的學(xué)習、解決、提高,設計出的網(wǎng)頁(yè)不論是外觀(guān)還是內容,都在不斷的進(jìn)步、改善?梢哉f(shuō)在自己動(dòng)手,不斷實(shí)踐的過(guò)程中,網(wǎng)頁(yè)設計水平得到了很大的提高。
通過(guò)對網(wǎng)頁(yè)設計書(shū)籍的翻閱,我學(xué)習到了一些關(guān)于建設網(wǎng)站和制作網(wǎng)頁(yè)的知識,在實(shí)踐查閱資料時(shí),對flash也有所了解。我還了解了一些基礎的網(wǎng)絡(luò )技術(shù)。通過(guò)學(xué)習,我對計算機有了更深層次得到了解,也有了更濃厚的興趣。尤其是對網(wǎng)頁(yè)制作的過(guò)程與一些技巧手法更有了另外一番了解,對網(wǎng)頁(yè)制作的基礎知識也有了一定的掌握。在這個(gè)過(guò)程中,我同樣認識到網(wǎng)頁(yè)設計不是一門(mén)學(xué)科的獨秀,而是多種課程的綜合,他是Flash、Fireworks等網(wǎng)頁(yè)軟件的綜合應用。
下面闡述一下我在設計我的網(wǎng)站時(shí)的一些關(guān)于網(wǎng)頁(yè)設計的見(jiàn)解。在具體的制作時(shí)我了解到一個(gè)優(yōu)秀的網(wǎng)頁(yè)設計應該具備一些基本原則。
首先,要確定網(wǎng)頁(yè)設計的內容,一個(gè)優(yōu)秀的風(fēng)站要有一個(gè)明確的主題。整個(gè)網(wǎng)站圍繞這個(gè)主題,也就是你在網(wǎng)頁(yè)設計之前要明確你這個(gè)網(wǎng)站有什么目的,用來(lái)做什么,所有頁(yè)面都是圍繞著(zhù)這個(gè)內容來(lái)制作,有了明確的內容對排名有很重要的作用;其次,要了解你網(wǎng)站所在行業(yè)的'客戶(hù),及你的網(wǎng)頁(yè)屬于哪個(gè)類(lèi)別。用戶(hù)是一個(gè)網(wǎng)站成敗的關(guān)鍵,如果用戶(hù)要花很多時(shí)間進(jìn)入你網(wǎng)站很有可能用戶(hù)會(huì )立即關(guān)掉你網(wǎng)站,或者你網(wǎng)站操作很不方便用戶(hù)也會(huì )馬上離開(kāi),這種網(wǎng)站是很失敗的設計,只會(huì )讓用戶(hù)失望的離去。
在完成以上的基本內容之后網(wǎng)頁(yè)的基本框架便成形成了。下面要開(kāi)始的便是優(yōu)化工作。
內容是整個(gè)網(wǎng)頁(yè)的核心。在網(wǎng)頁(yè)設計之前必須明確網(wǎng)頁(yè)的內容安排。優(yōu)秀網(wǎng)頁(yè)設計是要建立在平凡的基礎上的。然后在具體的規劃一個(gè)網(wǎng)頁(yè)時(shí),可以用樹(shù)狀結構先把每個(gè)頁(yè)面的內容大綱列出來(lái),尤其要制作一個(gè)大的網(wǎng)站(有很多頁(yè)面)的時(shí)候,特別需要把這個(gè)架構規劃好,也要考慮到以后可能的擴充性,免得做好以后又要一改再改整個(gè)網(wǎng)站的架構,很浪費時(shí)間和財力。大綱列出來(lái)后,還必須考慮每個(gè)頁(yè)面之間的鏈接關(guān)系。是星形,樹(shù)形,或是網(wǎng)形鏈接。這也是判別一個(gè)網(wǎng)站優(yōu)劣的重要標志。鏈接混亂,層次不清的站點(diǎn)會(huì )造成瀏覽困難,影響內容的發(fā)揮?蚣芏ㄏ聛(lái)了,然后開(kāi)始一步一步有條理,有次序地做來(lái),就胸有成竹得多,也會(huì )為主頁(yè)將來(lái)發(fā)展打下良好的基礎。下一步,就以動(dòng)手制作具體內容了,題材選定,框架選定,接下來(lái)就開(kāi)始往主頁(yè)里面填內容。
如果是個(gè)人主頁(yè),有能力的人完全可以靠自己來(lái)創(chuàng )作所有的內容。大部分人的方法是:從報紙,雜志,光盤(pán)等媒體中把相關(guān)的資料收集整理,再加上一定的編輯后就可以了。另外一個(gè)好的方法是從網(wǎng)絡(luò )上收集,您只要到搜索引擎上查找相應的關(guān)鍵字,就可以找到一大堆的資料。在準備材料的時(shí)候我們可以用一些小的動(dòng)畫(huà)和動(dòng)態(tài)圖片,Flash提供了功能齊全的繪圖和編輯圖形工具?梢灾苯釉诰庉媴^里繪畫(huà),編輯修改非常靈活,它的另一大特點(diǎn)是“交互性”強。在動(dòng)畫(huà)播放時(shí),可以用鼠標或鍵盤(pán)對動(dòng)畫(huà)的播放進(jìn)行控制,效果可以很直觀(guān)的反映出來(lái)。然后是開(kāi)始正式制作主頁(yè)。通過(guò)Dreamweaver作為制作軟件,只需要用到軟件中的一些基本的功能:圖片插入和對齊設置;文字的格式、顏色、背景顏色的設置等就可以制作出一個(gè)簡(jiǎn)單的網(wǎng)頁(yè)。
總體來(lái)說(shuō),通過(guò)這個(gè)學(xué)期對網(wǎng)頁(yè)設計的學(xué)習,有收獲也有遺憾。但是,我已經(jīng)邁入了網(wǎng)頁(yè)設計的大門(mén),只要我再認真努力的去學(xué)習,在今后的閑余時(shí)間學(xué)習制作網(wǎng)頁(yè)的更多知識以實(shí)現自身技能的提高,我堅信將來(lái)設計出的網(wǎng)頁(yè)會(huì )更加專(zhuān)業(yè),更加華麗,使它最終成為自己的一項技能。