![網(wǎng)站的交互性設計_第1頁](http://file4.renrendoc.com/view/79e609aeb2df12b29aa52077d023e9f1/79e609aeb2df12b29aa52077d023e9f11.gif)
![網(wǎng)站的交互性設計_第2頁](http://file4.renrendoc.com/view/79e609aeb2df12b29aa52077d023e9f1/79e609aeb2df12b29aa52077d023e9f12.gif)
![網(wǎng)站的交互性設計_第3頁](http://file4.renrendoc.com/view/79e609aeb2df12b29aa52077d023e9f1/79e609aeb2df12b29aa52077d023e9f13.gif)
![網(wǎng)站的交互性設計_第4頁](http://file4.renrendoc.com/view/79e609aeb2df12b29aa52077d023e9f1/79e609aeb2df12b29aa52077d023e9f14.gif)
![網(wǎng)站的交互性設計_第5頁](http://file4.renrendoc.com/view/79e609aeb2df12b29aa52077d023e9f1/79e609aeb2df12b29aa52077d023e9f15.gif)
版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)
文檔簡介
畢業(yè)論文(設t)論文(設計)題目:網(wǎng)站的交互性設計目錄TOC\o"1-5"\h\z摘要1ABSTRACT2\o"CurrentDocument"第1章前言3\o"CurrentDocument"第2章開發(fā)工具和運行環(huán)境4\o"CurrentDocument"2.1網(wǎng)站設計的基本知識4Dreamweaver簡介4HTML簡介4CSS簡介5Photoshop簡介5\o"CurrentDocument"2.6網(wǎng)站運行環(huán)境5\o"CurrentDocument"第3章網(wǎng)頁布局與設計理念6\o"CurrentDocument"3.1網(wǎng)頁布局63.1.1網(wǎng)頁布局的基本知識63.1.2網(wǎng)頁布局的基本概念6\o"CurrentDocument"3.2設計理念63.2.1特色UI設計介紹63.2.2創(chuàng)意設計73.2.3頁面設計7\o"CurrentDocument"色彩8\o"CurrentDocument"思路8\o"CurrentDocument"第4章效果展示9Dreamweaver9\o"CurrentDocument"首頁9\o"CurrentDocument"一級頁面11Photoshop15首頁15一級頁面16\o"CurrentDocument"第5章網(wǎng)站的測試與維護17\o"CurrentDocument"第6章總結(jié)18參考文獻19致謝20摘要在現(xiàn)代社會的需求之下,一種新興的信息交流方式開始嶄露頭角并迅速獲得了廣大群眾的支持——交互式網(wǎng)站。交互設計致力于了解目標用戶和他們的期望,了解用戶在同產(chǎn)品交互時彼此的行為,了解“人”本身的心理和行為特點。這次我們所設計的課題就是介紹一款手機瀏覽器一一歐朋瀏覽器。歐朋瀏覽器是一款全球流行的手機瀏覽器,體積輕小而功能強大,以簡潔的界面設計和貼近中國用戶的社會化應用為主要特色[1。在這次設計中設計制作的就是歐朋瀏覽器官方網(wǎng)站。關(guān)鍵詞:Internet;交互設計;網(wǎng)站建設ABSTRACTUnderthedemandofmodernsociety,anewwayofcommunicationisemergingandquicklyobtainthesupportofthemasses,interactivewebsite.Interactiondesigniscommittedtounderstandtargetusersandtheirexpectations,tounderstandeachother'sbehaviorwhenusersinteractwiththeproduct,understandthepsychologicalandbehaviorcharacteristicsofthe"people"itself.Thistimewedesignthetopicistointroduceamobilephonebrowser-Europeanfriendsofthebrowser.Thefriendsofthebrowserisaglobalepidemicofmobilebrowser,lightandsmallvolumeandpowerful,withconciseinterfacedesignandclosetotheChinesesocialapplicationsasthemainfeatureoftheuser.Inthisdesignisthedesignofthefriendsofthebrowser'sofficialwebsite.Keywords:Internet;interactivedesign;Thewebsiteconstruction第1章前言在Internet飛速發(fā)展的今天,互聯(lián)網(wǎng)成為人們快速獲取、發(fā)布和傳遞信息的重要渠道,它在人們生活、娛樂、學習等各個方面發(fā)揮著重要的作用,因此網(wǎng)站建設在Internet應用上的地位顯而易見。談到聯(lián)網(wǎng)的計算機,就能想到它百納海川的資訊,可以在網(wǎng)絡的世界里找到自己想了解到的,自己想探索到的新知識,但是要想了解到這些資訊我們需要借助到一個工具,這就是我們每一個人都熟悉的瀏覽器。技術(shù)的進步,離不開知識的傳播。時代的需求就是我們的責任,我們要抓住信息時代的脈搏,互聯(lián)網(wǎng)上信息的查找又要通過瀏覽器的瀏覽來實現(xiàn),這次我們所設計的課題就是介紹一款手機瀏覽器一一歐朋瀏覽器。本課題主要從獲取良好用戶體驗方面研究網(wǎng)站的交互設計。網(wǎng)站的頁面與色彩搭配進行分析設計(頁面色彩、圖片的應用及版面策劃):確定頁面的整體一致性、美觀性、觀賞性和實用性并存。該網(wǎng)站介紹了歐朋服務、分享、新聞中心、論壇、下載等系列內(nèi)容的介紹,讓人們可以更快更好的了解、認識并下載歐朋瀏覽器。一個好的的網(wǎng)站通常要有以下幾個方面的特點:漂亮的設計、友好的界面、規(guī)范的結(jié)構(gòu)以及充實的內(nèi)容,另外還有一個不可忽視的關(guān)鍵就是良好的交互性⑵。網(wǎng)站的交互性通常是給用戶網(wǎng)頁瀏覽過程中良好體驗的一個非常重要的環(huán)節(jié),滿足用戶的瀏覽需求,對用戶的選擇作出“及時”的響應,是交互性網(wǎng)站設計的關(guān)鍵⑶。第2章開發(fā)工具和運行環(huán)境一個網(wǎng)站的制作必須要有開發(fā)工具和運行環(huán)境,它們是一個網(wǎng)站組成的重要因素之一。2.1網(wǎng)站設計的基本知識網(wǎng)站界面:也就是網(wǎng)站的外觀、整體感覺、網(wǎng)站整體架構(gòu)。網(wǎng)站程序:它代表網(wǎng)站的功能,技術(shù)含量。靜態(tài)網(wǎng)頁:在網(wǎng)站設計中,純粹HTML格式的網(wǎng)頁通常被稱為靜態(tài)網(wǎng)頁,早期的網(wǎng)站一般都是由靜態(tài)網(wǎng)頁制作的。動態(tài)網(wǎng)頁:動態(tài)網(wǎng)頁是與靜態(tài)網(wǎng)頁相對應的,也就是說,網(wǎng)頁URL的后綴不是htm、.html、.shtml、.xml等靜態(tài)網(wǎng)頁的常見形式,而以.asp、.jsp、.php、.cgi等形式為后綴,并且在動態(tài)網(wǎng)頁網(wǎng)址中有一個標志性的符號一“?”⑷。Dreamweaver簡介Dreamweaver是在網(wǎng)頁設計與制作領(lǐng)域中用戶最多、應用最廣、功能最強大的軟件,隨著Dreamweaver8的發(fā)布,更堅定Dreamweaver在該領(lǐng)域的地位。它集網(wǎng)頁設計、網(wǎng)站開發(fā)和站點管理功能于一身,具有可視化、支持多平臺和跨瀏覽器的特性,是目前網(wǎng)站設計、開發(fā)、制作的首選工具⑸。Dreamweaver是一種所見即所得的HTML編輯器,可實現(xiàn)頁面元素的插入和生成。或視化編輯環(huán)境大量減少了代碼的編寫,同時亦保證了其專業(yè)性和兼容性,并且可以對內(nèi)部的HTML編輯器和任何第三方的HTML編輯器進行實時的訪問。無論用戶習慣手工輸入HTML(標準通用標記語言下的一個應用)源代碼還是使用可視化的編輯界面,Dreamweaver都能提供便捷的方式使得用戶設計網(wǎng)頁和管理網(wǎng)站變得更容易。HTML簡介HTML(HyperTextMarkupLanguage),超文本標記語言,是一種專門用于創(chuàng)建Web超文本文檔的編程語言,它能告訴Web瀏覽程序如何顯示W(wǎng)eb文檔(即網(wǎng)頁)的信息,如何鏈接各種信息。使用HTML語言可以在其生成的文檔中含有其它文檔,或者含有圖像、聲音、視頻等,從而形成超文本⑹。標記語言是一種基于源代碼解釋的訪問方式,它的源文件由一個純文本文件組成,代碼中由許多元素組成,而前臺瀏覽器通過解釋這些元素顯示各種樣式的文檔。換句話說,瀏覽器就是把純文本的后臺源文件以賦有樣式定義的超文本文件方式顯示出來[7]。CSS簡介CSS是英語CascadingStyleSheets(層疊樣式表單)的縮寫,它是一種用來表現(xiàn)HTML或XML等文件樣式的計算機語言。CSS能夠真正做到網(wǎng)頁表現(xiàn)與內(nèi)容分離的一種樣式設計語言。相對于傳統(tǒng)HTML的表現(xiàn)而言,CSS能夠?qū)W(wǎng)頁中的對象的位置排版進行像素級的精確控制,支持幾乎所有的字體字號樣式,擁有對網(wǎng)頁對象盒模型的能力,并能夠進行初步交互設計,是目前基于文本展示最優(yōu)秀的表現(xiàn)設計語言⑻。級聯(lián)樣式表,它是用來進行網(wǎng)頁風格設計的。比如,如果想讓鏈接字未點擊時是藍色的,當鼠標移上去后字變成紅色的且有下劃線,這就是一種風格。通過設立樣式表,可以統(tǒng)一地控制HTML中各標志的顯示屬性。級聯(lián)樣式表可以使人更能有效地控制網(wǎng)頁外觀。使用級聯(lián)樣式表,可以擴充精確指定網(wǎng)頁元素位置,外觀以及創(chuàng)建特殊效果的能力⑼。Photoshop簡介AdobePhotoshop,簡稱PS,是由AdobeSystems開發(fā)和發(fā)行的圖像處理軟件。Photoshop主要處理以像素所構(gòu)成的數(shù)字圖像。使用其眾多的編修與繪圖工具,可以有效地進行圖片編輯工作。PS有很多功能,在圖像、圖形、文字、視頻、出版等各方面都有涉及M。2.6網(wǎng)站運行環(huán)境使用IE6.0以上版本,為最佳顯示效果。第3章網(wǎng)頁布局與設計理念頁面布局:對頁面的文字、圖形或表格進行格式設置。包括字體、字號、顏色紙張大小和方向以及頁邊距等。設計理念:是設計師在空間作品構(gòu)思過程中所確立的主導思想,它賦予作品文化內(nèi)涵和風格特點。優(yōu)秀的設計理念至關(guān)重要,它不僅是設計的精髓所在,而且能令作品具有個性化、專業(yè)化和與眾不同的效果mi。3.1網(wǎng)頁布局3.1.1網(wǎng)頁布局的基本知識首頁的設計是一個網(wǎng)站成功與否的關(guān)鍵。人們往往看到第一頁就已經(jīng)對你的站點有一個整體的感覺。是不是能夠促使瀏覽者繼續(xù)點擊進入,是否能夠吸引瀏覽者留在站點上,全憑首頁設計的“功力”了。對訪問者產(chǎn)生第一印象,要留下好的印象,必須干凈整潔、顏色不能過于多、條理要清楚[12]。3.1.2網(wǎng)頁布局的基本概念剛開始的時候,網(wǎng)頁在我們面前是一張白紙,需要創(chuàng)造出自己的設計方案。頁面尺寸:分辨率越高頁面尺寸越大。整體造型:我們在設計網(wǎng)站的時候一定要注意整體造型,形象要是統(tǒng)一的。圖片、文本:圖片和文本是網(wǎng)頁的兩大構(gòu)成元素,缺一不可,如何處理好圖片和文本的位置成了整個頁面布局的關(guān)鍵。3.2設計理念3.2.1特色UI設計介紹圖1天氣圖標如圖1所示:畫面呈現(xiàn)目前的日期,時間,天氣及溫度,文字及icon都是簡單的白色線條構(gòu)成,特別的地方在于背景的漸層不只是裝飾用的,在漸層的上方顏色代表著是目前天空的顏色,白天晴朗時天空是白色的,當天空開始下雨或是接近晚上時,顏色就會慢慢的改變,下方的顏色則是代表溫度,溫度越高色系越暖,完全將呈現(xiàn)的信息可視化,最多可以新增4個地區(qū),每個地區(qū)的天氣一目了然。圖2圖片圖標如圖2所示:深藍的天空下,在一道微笑曲線的高光滑過下,永遠綻放著一朵金黃色的向日葵,作為自然界太陽的象征,向日葵代表著樂觀與陽光,這跟Apple制作的所有宣傳中永遠都會有一張幸福的笑臉出現(xiàn)在每一個角落的拍攝理念完全一致。3.2.2創(chuàng)意設計創(chuàng)意是整個網(wǎng)站中的靈魂所在,首先制作網(wǎng)站的時候,需要思考這個網(wǎng)站的亮點在哪里、要主要突出那個部分等等,這個過程就是創(chuàng)意設計,創(chuàng)意設計是網(wǎng)站的主要因素之一[13]3.2.3頁面設計網(wǎng)頁設計包括視聽元素與版式設計兩項內(nèi)容:以主題鮮明、形式與內(nèi)容相統(tǒng)一、強調(diào)整體為設計原則;具有交互性與持續(xù)性、綜合性、版式的不可控性、藝術(shù)與技術(shù)結(jié)合的緊密性等,在明確了網(wǎng)頁藝術(shù)設計與網(wǎng)站主題的基礎(chǔ)上,更好的表現(xiàn)“美”和“功能”這一觀點[14]在頁面設計中,我主要采用了上下式,就拿產(chǎn)品頁來說,產(chǎn)品頁顧名思義就是介紹產(chǎn)品的頁面,在產(chǎn)品頁中我主要介紹了新一代歐朋瀏覽器,新一代歐朋瀏覽器有三個突出的優(yōu)點:精致設計、強勁內(nèi)核、更快更省,在做產(chǎn)品頁時,就利用這三個優(yōu)點進行詳細介紹新一代歐朋瀏覽器,利用圖片跟優(yōu)點的詳細說明,更好的介紹了新一代歐朋瀏覽器這一產(chǎn)品。3.2.4色彩在選色彩的時候,一點不能使用超過三個顏色,要主題鮮明,用顏色區(qū)分內(nèi)容,來達到你想要的效果。在本網(wǎng)站中,我主要采用了藍色、灰色、白色。底色采用了灰色,不會搶主題,起襯托的作用,白色是頂部導航條上下,跟灰色結(jié)合在一起,非常協(xié)調(diào),白色導航條部分不會顯得特別突出,讓人一看就知道上面跟下面是兩個部分,點擊白色的導航條,會在下面的灰色部分顯示所點擊的內(nèi)容,藍色是主要體現(xiàn)突出的信息,讓人一目了然,找到你想找的內(nèi)容,是一亮色,跟灰色白色結(jié)合在一起很搭配。3.2.5思路看其他網(wǎng)站的時候,有的時候會找不到想找的內(nèi)容、標題內(nèi)容不符合、主題不突出,結(jié)合這些,我就想做一個簡單明了的網(wǎng)站,讓人一看就找到想要的內(nèi)容,首先,先列出功能點,根據(jù)功能點劃出分類,一類放一起,然后起一個最能體現(xiàn)這一類的類名,類名搞定以后,將類名統(tǒng)一放在導航條的地方,并且根據(jù)主次關(guān)系調(diào)整他們的前后位置,這時導航條就出來了。導航條有了以后就是相關(guān)內(nèi)容了,我將導航條放在第一排,當你點擊導航條的某個類名的時候,會在下面灰色部分顯示你所幾點類名的相關(guān)信息,改信息中還會有選項卡供你點擊查看,上面導航條下面顯示內(nèi)容是最明了的方式,一眼就可以找到信息,用兩種顏色將他們隔開用于區(qū)分它們,不會產(chǎn)生它們是一體的錯覺。根據(jù)這些思路,制作了這個網(wǎng)站。第4章效果展示這一章節(jié)中,主要是制作的效果展示效果,第一節(jié)主要是使用Dreamweaver軟件進行網(wǎng)站的排版,第二節(jié)主要是使用Photoshop軟件進行網(wǎng)站的設計。Dreamweaver4.1.1首頁首頁是整個網(wǎng)站中最重要的,首頁做的好才能吸引人,以下是首頁的部分代碼編寫部分。/*公共部分*/*{margin:0;padding:0;font-family:"微軟雅黑";font-size:12px;}li{list-style:none;}img{border:none0;}a{text-decoration:none;}公共部分是整個網(wǎng)站中都需要的代碼部分,為了方便我把公共部分寫到了一個單獨的CSS文件里面,供下面的頁面調(diào)用。/*主導航*/.topBox{width:940px;overflow:hidden;margin:0auto;}.logo,.indexBoxli,.telli{float:left;}.logo{margin-top:11px;}.indexBoxa{width:75px;height:64px;line-height:64px;text-align:center;font-size:16px;}.indexBoxa:hover{background-image:url(images/ico_hong.png);background-repeat:no-repeat;background-position:center57px;}.topBoxa{display:block;text-decoration:none;color:#323232;}.index{background-image:url(images/ico_hong.png);background-repeat:no-repeat;background-position:center57px;}.tel{padding-top:24px;float:right;}.tela{display:block;background-repeat:no-repeat;width:22px;height:20px;font-size:16px;margin-right:7px;}.tel.call{width:65px;}.tel.weibo{margin-right:0;}.tel.sina{background-image:url(images/ico_sina.png);}.tel.sina:hover{background-image:url(images/ico_sinaH.png);}.tel.dou{background-image:url(images/ico_dou.png);}.tel.dou:hover{background-image:url(images/ico_douH.png);}.tel.ren{background-image:url(images/ico_renren.png);}.tel.ren:hover{background-image:url(images/ico_renrenH.png);}.tel.weibo{background-image:url(images/ico_weibo.png);}.tel.weibo:hover{background-image:url(images/ico_weiboH.png);}以上代碼部分是主導航的CSS部分,主導航需要是一個亮點,有亮點才能吸引大家去查看網(wǎng)站,上面的代碼主要是設置了屬性的樣式,比如:顏色寬度、圖片、位置等信息。<!--王導航--><divclass="topBox"><imgclass="logo"src="images/ico_logo.png”/><ulclass="indexBox"><li><aclass="index"href="index.html">首頁</a></li><li><ahref="product.html">產(chǎn)品</a></li><li><ahref="download.html">下載</a></li><li><ahref="gongsi.html">公司</a></li><li><ahref="luntan.html">論壇</a></li><li><ahref="help.html”>幫助</a></li><li><ahref="kaifa.html">開發(fā)者</a></li></ul><ulclass="tel"><li><aclass="call">手機版</a></li><li><aclass="sina"href="#”></a></li><li><aclass="dou"href="#”></a></li><li><aclass="ren"href="#”></a></li><li><aclass="weibo"href="#”></a></li></ul></div>以上代碼是主導航的內(nèi)容,跟上面的主導航CSS樣式相結(jié)合,才能夠顯示正確的效果,在主導航中設計了第一頁面的關(guān)鍵詞,能夠很好的查找你想要的內(nèi)容。如圖3所示,是主導航的CSS樣式和主導航內(nèi)容相結(jié)合的效果,樣式主要控制它們的樣子和顯示形式,內(nèi)容是顯示的什么內(nèi)容,兩者結(jié)合就是下圖樣子。舉例說明:左邊LOGO跟歐朋字樣是一張圖片,在內(nèi)容中可以看到我寫到<imgclass="logo"src="images/ico_logo.png”/>這句的代碼意思是插入一張圖片,類名為logo,地址src為images/ico_logo.png,首先這張圖片要在本站點中才行,如圖3所示:OOPERA歐月月首頁產(chǎn)品下載公司論壇幫助開發(fā)者手機版斜,圖3主導航4.1.2一級頁面除去首頁來說,一級頁面是最重要的信息,首頁做的好,才能打開一級頁面進行查看,如果一級頁面設計的不好,那么制作三級或四級頁面也就沒有什么意義了,以下是一級頁面的部分代碼編寫部分。.mianBox{padding-bottom:105px;}.bigBox{width:940px;margin:0auto;overflow:hidden;}.leftBox{width:290px;overflow:hidden;margin-right:35px;}.leftBox,.centerBox,.rightBox{float:left;}.leftBoxp{float:left;}.leftBoxh1{font-size:38px;line-height:69px;padding-top:23px;color:#333333;}.leftBoxp{line-height:24px;padding-top:24px;color:#777777;}.centerBoxp{line-height:24px;padding-top:24px;color:#777777;float:left;}.centerBox{width:290px;overflow:hidden;padding-top:92px;margin-right:35px;}.rightBox{width:290px;overflow:hidden;padding-top:92px;}.rightBoxp{line-height:24px;padding-top:24px;color:#777777;float:left;}.diBox{width:940px;margin:0auto;overflow:hidden;margin-top:69px;}.diText{overflow:hidden;float:left;margin-left:35px;}.ditu{float:left;}.shangTEXTh1{font-size:16px;line-height:23px;color:#333333;}.shangTEXTp{line-height:20px;margin-top:16px;color:#777777;margin-bottom:30px;}.diBox{width:940px;margin:0auto;overflow:hidden;}.xia01,.xia02{float:left;}.xia01,.xia02{font-size:14px;color:#333333;}.xia01,.xia02p{color:#777777;}以上代碼是一級頁面的主導航CSS樣式代碼,控制主導航的樣式效果。<!--主體--><divclass="mianBox"><divclass="bigBox"><divclass="leftBox"><h1>關(guān)于歐朋</h1><p>歐朋始于1994年,總部位于挪威奧斯陸,并在全球12個國家設有分公司,全球員工總數(shù)超過1000人。在中國,歐朋擁有本地化的技術(shù)、研發(fā)及市場運營團隊,專注于研發(fā)、推廣及運營歐朋手機瀏覽器。</p><p>歐朋始終以用戶的需求為中心,致力于為用戶提供簡潔、高速、流暢的上網(wǎng)體驗和服務,讓人們盡享舒適的移動生活。</p><p>我們的使命-讓人們能夠舒適的訪問個人化的信息每天通過移動互聯(lián)網(wǎng)連接在一起。</p><p>我們的愿景-讓人們享受舒適的移動互聯(lián)網(wǎng)生活。我們始終相信,移動生活之道,本應如此。</p><p></p></div><divclass="centerBox"><p>我們來自五大洲四大洋,我們都是干勁青年,我們的工程師睡到自然醒,投入起來經(jīng)常忘了睡覺的時間。我們市場創(chuàng)意瘋狂無限,腦子里都是稀奇古怪的東西。我們女產(chǎn)品經(jīng)理是搖滾控,抱著吉他做文檔,寫出來的東西一晃一晃。我們的設計師喜愛攝影,畫圖的時候要拍照片。</p><p>我們春天潛水,夏天風帆,秋天爬山,冬天滑雪,全年工作。</p><?>自由,熱誠,F(xiàn)UN。<br/>我們認為,工作之道,本應如此。</p></div><divclass="rightBox"><p>古語有云:有朋自遠方來,不亦樂乎。歐洲的歐,朋友的朋,歐朋是全球最流行手機瀏覽器——Opera瀏覽器的中文版本。歐朋瀏覽器秉承了Opera速度快、省流量、功能強大的優(yōu)點并為中國用戶精心設計及推出了本地化的優(yōu)質(zhì)服務,為用戶提供最佳的移動互聯(lián)網(wǎng)體驗。</p><p>我們的界面簡潔、自由、有格調(diào);<br/>我們的導航精準、快捷、有內(nèi)容;<br/>我們的微博好讀、方便、有生活;我們的新鮮事兒好玩兒、有趣、有故事。</p><p>歐朋始終以你的需求為中心,努力為你帶來便捷、舒心的瀏覽體驗,我們希望你和他都能享受舒適的移動互聯(lián)生活,每天通過互聯(lián)網(wǎng)聯(lián)系在一起。</p><p>我們覺得,瀏覽之道,本應如此。</p></div></div><divclass="diBox"><imgclass="ditu"src="images/ico_ditu.png”/><divclass="diText">
<divclass="shangTEXT"><h1>歐朋瀏覽器</h1><p>北京朝外大街乙6號朝外SOHOC座0931<br/>電話真lt;/p></div><divclass="xia01"><h1>市場合作</h1><p>marketing@</p></div><divclass="xia02"><h1>渠道合作<人1><p>channels@</p></div></div></div></div>以上代碼是一級頁面的內(nèi)容部分,這是公司頁面,介紹的是關(guān)于歐朋的信息,是一些公司的簡單信息,供大家查看。這兩段代碼的顯示效果如圖4所示:覘好199砰,總聊于挪茹聃,個國家設有分公司.全球員工總數(shù)超過覘好199砰,總聊于挪茹聃,個國家設有分公司.全球員工總數(shù)超過1000人在中國,歐朋擁有本地化的技術(shù)、研發(fā)及市場運營團隊?專主于研發(fā)、就庭營覽器.歐朋始終以用戶的需求為中心.致力于為用戶提供簡潔、高速、流暢的上網(wǎng)體驗和服務.讓人們盡享舒適的移動生活.我們的使命-讓人們能夠舒適的訪問個人化的信息每天通過移動互聯(lián)網(wǎng)蹈在一起.我們的愿昱-讓人們享受舒適的移動互底網(wǎng)生活.我。睛終相信,移動生活之道.本應如此。我們來目五大洲四大洋,我們都是干勁青年,我們的工程而睡到目然醒.投入起格常忘了睡覺的時間.我們市場創(chuàng)意瘋狂無限?腦子里都是糕奇古怪的東西.我們女產(chǎn)品經(jīng)理是挨滾控,抱若吉他做文檔.寫出來的東西一晃一晃。我們的設計1屈喜爰攝影,畫圖的時候要拍照片.我們春天潛水.夏天風帆.秋天爬山,冬天滑雪?全年工怕目由,熱誠,F(xiàn)UN.我OA為.工作之道,本應如此.古語有云:“有朋目遠方來.不亦樂手“?歐洲的饋“,朋地)"朋..歐朋是全球景流行手機瀏覽器一pera瀏菟器的中文版本.歐朋瀏覽器秉承了Ope”速度快、省流量功皤大的優(yōu)點并為中國用戶精心設計及推出了本地化的優(yōu)質(zhì)服務.為用戶提供景佳的移動互聯(lián)網(wǎng)體驗.我們的界面簡潔、目由、有格調(diào):我們的導航箱準,快捷.有內(nèi)容;我們的微博好讀、方便、有生活;我們的新鮮郭妍Uk有趣、有故事.歐朋始終以你的需求為中心,努力為你帶來敗、舒心的瀏覽體驗,我們希望你和他都能享受舒適的移動互聯(lián)曖.每起.我們覺得,瀏覽之道.本應如此.圖4公司頁舉例說明:<p>歐朋始于1994年,總部位于挪威奧斯陸,并在全球12個國家設有分公司,全球員工總數(shù)超過1000人。在中國,歐朋擁有本地化的技術(shù)、研發(fā)及市場運營團隊,專注于研發(fā)、推廣及運營歐朋手機瀏覽器。</p>這句代碼就是讓這段文字在一段中顯示,下面代碼是在這一段中字的高為24px,跟頂部具體為24px,顏色值為#777777、并且有浮動效果。.leftBoxp{line-height:24px;padding-top:24px;color:#777777;}.leftBoxp{float:left;}Photoshop4.2.1首頁首頁是整個網(wǎng)站中最重要的,首頁做的好才能吸引大家查看信息,以下是整個首頁的設計效果圖,如圖5所示:OPERA莒頁產(chǎn)品下就論壇開發(fā)者OPERA莒頁產(chǎn)品下就論壇開發(fā)者手機版仗立公可I:CVI歐朋7.0iPhone版新一代歐朋瀏由器你的安卓手機構(gòu)更出色!n歐朋Ute4.6瀏蛤多一點,再多一點圖5首頁此頁是整個網(wǎng)站的首頁效果,用PS軟件設計并制作出來的效果圖,首頁是最重要的頁面,設計一定要有創(chuàng)意,在頁面中我用了企業(yè)色藍色做了一個大的廣告放在上面,下面是歐朋的版本信息,讓人們第一眼就能夠看出這個網(wǎng)站的主要內(nèi)容信息。廣告我采用了藍色,比較醒目,讓你打開網(wǎng)站第一眼看到的就是這一廣告,廣告上有下
載跟歐朋瀏覽器手機顯示樣式,主要內(nèi)容都在該廣告中體現(xiàn)。4.2.2一級頁面除了首頁以外,一級頁面也占據(jù)著重要的地位。如果一級頁面設計的不好,那么制作三級或四級頁面也就沒有什么意義了,以下是一級頁面(示例)的設計效果圖,如圖6所示:OOPERA歐朋首頁產(chǎn)品OOPERA歐朋首頁產(chǎn)品下載公司論壇幫助開發(fā)者手機版關(guān)于歐朋歐朋始于1994年,總部位于挪威奧斯陸,并在全球12個國家設有分公司,全球員工總數(shù)超過1000A.在中國,歐朋擁有本地化的技術(shù)、研發(fā)及市場運營團隊,專注于研發(fā)、推廣及運營歐朋手機瀏覽器.歐朋始終以用戶的需求為中心,致力于為用戶提供簡潔、高速、流暢的上網(wǎng)體驗和服務,讓人們岸舒適郵動生活.我們來自五大洲四大洋,我們都是干勁青年,我們的工程師睡到自然醒,投入起來經(jīng)常忘了唾覺的時間.我們市場創(chuàng)意瘋狂無限,腦子里都是稀奇古怪的東西,我們女產(chǎn)品經(jīng)理是搖滾控,抱著吉他做文檔,寫出來的東西一晃一歐朋始于1994年,總部位于挪威奧斯陸,并在全球12個國家設有分公司,全球員工總數(shù)超過1000A.在中國,歐朋擁有本地化的技術(shù)、研發(fā)及市場運營團隊,專注于研發(fā)、推廣及運營歐朋手機瀏覽器.歐朋始終以用戶的需求為中心,致力于為用戶提供簡潔、高速、流暢的上網(wǎng)體驗和服務,讓人們岸舒適郵動生活.我們來自五大洲四大洋,我們都是干勁青年,我們的工程師睡到自然醒,投入起來經(jīng)常忘了唾覺的時間.我們市場創(chuàng)意瘋狂無限,腦子里都是稀奇古怪的東西,我們女產(chǎn)品經(jīng)理是搖滾控,抱著吉他做文檔,寫出來的東西一晃一晃.我們的設計師喜愛攝影,畫圖的時候要拍照片.古語有云:"有朋自遠方來,不亦樂乎”?歐洲的"歐",朋友的"朋",歐朋是全球最流行手機瀏覽器——Opera瀏覽器的中文版本.歐朋瀏覽器秉承了Opera速度快、省流量、功能強大的優(yōu)點并為中國用戶精心設計及推出了本地化的優(yōu)質(zhì)服務,為用戶提供最佳的移動互我們春天潛水,夏天風帆,秋天爬山,冬天滑雪,全年工作.我們的界面簡潔、我們的導皿準、我們?nèi)诓┖米x、自由、頗、方便、我們的使命-讓人們能夠舒適的訪問個人化的信息每天通過移動互聯(lián)網(wǎng)連接在一起.我們的新鮮事兒好玩Jb、<18調(diào);有內(nèi)容;有生活;有趣、有故事.自由,熱誠,F(xiàn)UN.我們認為,工作之道,本應如此我們的愿景-讓人們享受舒適的移動互聯(lián)網(wǎng)生我們始終相信,移動生活之道,本應如歐朋始終以你的需求為中心,努力為你帶來便捷、舒心的瀏覽體驗,我們希望你和他都能享受舒適的移動互聯(lián)生活,每天通過互聯(lián)網(wǎng)聯(lián)系在F我們覺得,瀏覽之道,本應如此.歐朋瀏覽器北京朝外大街乙6號朝外SOHOC座0931電話真場合作渠道合作marketing@channels@歐朋瀏竟器適用于安卓、塞班、黑莓、JAV瀚數(shù)干種手機,用手機快速安裝.新聞中心市場活動工作機會反燃向厥聯(lián)系我們Copyright02013歐朋保留所有權(quán)利.?歐朋瀏覽器超過2億月度在埃用戶.遍及全球217個國家和地區(qū).圖6公司頁這一頁面是一級頁面效果圖,是公司頁面,簡單介紹了關(guān)于歐朋的信息。圖6所示是一級頁面公司頁面的效果圖,該頁面主要是介紹了關(guān)于歐朋的信息,比如:歐朋起源時間、起源地、人數(shù)、歐朋宗旨、歐朋愿景、歐朋簡介等信息。下面是一個歐朋瀏覽器的地址、電話、傳真信息。該頁面將歐朋信息一一都列舉了出來,稱為公司頁。第5章網(wǎng)站的測試與維護一個網(wǎng)站制作完成后,在網(wǎng)站發(fā)布之前應進行嚴格的測試,以檢查各個鏈接是否正確,網(wǎng)頁是否正確,文字、圖像顯示是否正確等等。網(wǎng)站只有不斷更新才會有生命力,人們上網(wǎng)無非是要獲取所需信息,只有不斷提供人們所需要的內(nèi)容,才能有吸引力。網(wǎng)站應當經(jīng)常有吸引力的、有價值的內(nèi)容,讓人能經(jīng)常訪問。主要測試內(nèi)容有:服務器穩(wěn)定性、安全性。程序軟件的測試。網(wǎng)站兼容性測試,如瀏覽器、顯示器。根據(jù)需要的其他測試
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責。
- 6. 下載文件中如有侵權(quán)或不適當內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 2025年揭陽貨運從業(yè)資格證考題
- 2025年德州下載b2貨運從業(yè)資格證模擬考試考試
- 2025年商丘駕??荚囏涍\從業(yè)資格證模擬考試
- 電視臺合同范本(2篇)
- 電力服務績效合同(2篇)
- 山西省陽曲縣八年級地理上冊 第二章 自然環(huán)境 我們賴以生存的基本條件說課稿 晉教版
- 2024-2025學年五年級語文上冊第二單元5裝滿昆蟲的衣袋教案設計蘇教版
- 2024-2025學年高中歷史第四單元中國社會主義建設發(fā)展道路的探索第19課經(jīng)濟體制改革教案含解析岳麓版必修2
- 馬栗種子提取物片說明書
- 湘教版地理八年級下冊:9 建設《永續(xù)發(fā)展的美麗中國》 聽課評課記錄
- 招商銀行房地產(chǎn)貸款壓力測試
- 公文與公文寫作課件
- 車削成形面和表面修飾加工課件
- 運動技能學習與控制課件第七章運動技能的協(xié)調(diào)控制
- 節(jié)后復工吊籃驗收表格
- 基于振動信號的齒輪故障診斷方法研究
- 醫(yī)療器械分類目錄2002版
- DB11_T1713-2020 城市綜合管廊工程資料管理規(guī)程
- 氣管套管滑脫急救知識分享
- 壓縮空氣系統(tǒng)管道阻力計算
- 特種設備自檢自查表
評論
0/150
提交評論