課程設計報告：網(wǎng)頁設計與網(wǎng)站規(guī)劃

word文檔可自由復制編輯《網(wǎng)頁設計與網(wǎng)站規(guī)劃》課程設計報告題目：戀愛主義院系：信息技術學院組長：***組員：*********日期：河南中醫(yī)學院信息技術學院網(wǎng)站題目綜述戀愛，它是男女互相愛慕的行為表現(xiàn)。在不同時代有不同的定義，而在現(xiàn)代定義為兩個人基于一定的物質條件和共同的人生理想。在各自內心形成的對對方的最真摯的仰慕，并渴望對方成為自己終生伴侶的最強烈、最穩(wěn)定、最專一的感情，在遠古的母系社會、古代的父系社會，愛情的另一種體驗，并不是單純的一夫一妻制。但隨著社會的發(fā)展，愛情也在向文明的方向發(fā)展。而在當代大學生中，戀愛是一種很普遍存在的現(xiàn)象，不論是男生，還是女生，他們大多會選擇自己的戀愛對象，彼此有一個依靠，這個依靠不同于親情、友情，戀人之間相處更親密，更無話不談。戀愛又分為四個階段：1.初戀：剛剛進入戀愛階段，了解還不是很深入，還有一定的模糊感。2.熱戀：戀愛雙方看到的都是彼此的優(yōu)點，對周圍環(huán)境漠不關心，可以說雙方都已經(jīng)迷戀其中了。3.依戀：雙方在日常生活已離不開對方，離開一陣子都會覺得不順心、有一種心不安的感覺。4.平淡：戀愛雙方都已經(jīng)冷靜下來，留下的大部分是理性，而缺少了激情，需要進一步的理由來點燃愛情的火焰，比如說婚姻。很多情侶都是在這一環(huán)節(jié)沒走完的，當然，完成這一環(huán)節(jié)意味著下一步進入婚姻階段。現(xiàn)在我們建立的這個網(wǎng)站，就是有關于戀愛的，名為“戀愛主義”，主要是想通過這個網(wǎng)站，讓更多的人了解正確的戀愛觀，同時也可以分享一些戀愛感悟，讓人知道一些戀愛技巧，為自己的戀愛過程增添一些趣味。而且我們的網(wǎng)站多以文章為主，所以在最終成型的網(wǎng)站中，文章會占很大一部分內容。建設計劃2.1技術路線該課程設計中網(wǎng)頁代碼編輯和動畫制作使用的技術為XHTML、CSS、和JavaScript、Flash，代碼編輯涉及的軟件為AdobeDreamweaverCS4、圖片制作及修改涉及的軟件為AdobeFireworksCS4、動畫制作涉及的軟件為AdobeFlash。而開發(fā)環(huán)境為Windows7.。2.2開發(fā)計劃首先需要在小組內討論，共同制定網(wǎng)頁的框架結構，得出要做什么網(wǎng)頁，由此而開始設計各網(wǎng)頁的頁面，畫出草稿，然后再根據(jù)已設計出的網(wǎng)頁頁面，搜集資料（包括文字和圖片），并對資料進行整理及再次編輯，還要開始繪制banner以及l(fā)ogo，接著就要開始分工（下部分會有詳細的分工內容），代碼編輯和文字編輯要同時開始，在這個過程中會多次進行溝通，以避免代碼和文字、圖片的不相符，同時還要根據(jù)做的網(wǎng)頁，不時地添加或刪減原設計，盡量達到完美。還要將全部的網(wǎng)頁進行鏈接，然后要對網(wǎng)頁進行測試，使其能通過web標準測試，并盡可能在多個操作系統(tǒng)下能夠正常訪問，在多個手機系統(tǒng)下實現(xiàn)基本訪問，并能在多個瀏覽器下能夠正常表現(xiàn)。最后就是寫出課程設計報告。2.3人員分工2.3.1網(wǎng)站結構：***2.3.2頁面設計：***2.3.4資料搜尋：***2.3.5代碼編輯：***2.3.6文字編輯：***2.3.7圖片及動畫制作：***2.3.8課程設計報告：***網(wǎng)站結構與文件目錄3.1網(wǎng)站邏輯結構3.1.1網(wǎng)站欄目結構首頁首頁戀愛通告戀愛物語心靈脈搏櫻空斷點愛與成長心理測試戀愛短信、戀愛情書戀愛故事、戀愛詩詞、戀愛名句火花四濺、幸福花海斷橋殘雪、空釋戀空回味過去、品味現(xiàn)在、展望未來(測測你一生會愛幾個人！)3.1.2網(wǎng)站文件層次圖首頁首頁主頁導航動畫、文章、電影、戀愛通告、戀愛物語、心靈脈搏櫻空斷點愛與成長心理測試通過鏈接，轉到其他頁面3.2網(wǎng)站文件目錄首頁：文件均存在shouye中；戀愛通告：文件均存在lianaitonggao中；戀愛物語：文件均存在lianaiwuyu中；心靈脈搏：文件均存在xinlingmaibo中；櫻空斷點：文件均存在yingkongduandian中；愛與成長：文件均存在aiyuchengzhang中；心理測試：文件均存在xinliceshi中；其他頁面的文件也會存于相應的文件夾中網(wǎng)頁與關鍵元素設計理念4.1網(wǎng)站設計理念4.1.1設計風格本次的課程設計以“戀愛”為主題，整體風格走“清新”、“甜蜜”路線，不管是文字、圖片，還是動畫，都會以其為主，比如文字內容，會有戀愛短信、戀愛情書、戀愛故事、戀愛詩詞，同時也會有一些有關戀愛的感悟、技巧等，還會有戀愛的小測試；圖片方面，景和物會以“心”形和代表愛情（比如：玫瑰）東西或是兩兩相關的東西（比如：對戒）為主，人物則多用戀人牽手、擁抱，或是一眼就能看出兩人是戀人關系的圖片；動畫也會與其有關，這個會在下面詳細介紹。4.1.2色彩戀愛，給人的感覺是甜蜜、幸福、多姿多彩，所以我們的網(wǎng)站的色彩會以粉色為主，但同時也會輔以其他的淺色系的顏色，使網(wǎng)頁更加的繽紛多彩，雖然顏色多，但不會雜亂。每種顏色都有它獨特的意義，同時，不同的搭配也會有不同的效果，而我們就是要讓網(wǎng)頁看起來很舒服，不會有什么突兀的感覺。4.2關鍵元素設計理念4.2.1Logo我們的主題是“戀愛”，而logo也就與其有關，它是用“心”拼成的一個大的“心”。先打開Fireworks應用軟件，在畫布上劃出一個心，在色彩處理上，用彩色充滿，表示戀愛中的多姿多彩，然后，將這個心再粘貼、復制多次，再用它們重新拼成一個大的心，而這么多的心圍在一起，就是說戀愛時的男女雙方，要多用心呵護他們之間的愛情。4.2.2導航 導航共分為七項，分別是：首頁、戀愛通告、戀愛物語、心靈脈搏、櫻空斷點、愛與成長和心理測試。其中，戀愛通告是要“大膽說出愛”，“通告”的意義就在于此，所以這個欄目分為“戀愛短信”和“戀愛情書”；“戀愛物語”是說一些戀愛時的私語，包括“戀愛文章”、“戀愛詩詞”和“戀愛名句”；然后是“心靈脈搏”，“脈搏”會讓人想到跳動，從而聯(lián)想到活力、激情、陽光，所以這個欄目分為：“火花四濺”和“幸?；ê！?；戀愛中難免會有一些不愉快或者是不幸的結局，所以在“戀愛”的網(wǎng)站中也一定要有此類內容，“櫻空斷點”就是為此而設。櫻花會讓人看到一種凄美的愛情，“斷”又會讓人聯(lián)想到不美好的事，這就是這個欄目名稱的由來，它又包含了兩個子欄目“斷橋殘雪”和“空釋戀空”；還有“愛與成長”，在戀愛過程中，戀人攜手，一步步走來，總會有一些美好的回憶，同時也會有對未來的美好愿望，這個欄目就體現(xiàn)了這個含義，它包括：“回味過去”、“品味現(xiàn)在”和“展望未來三個子欄目；最后是“心理測試”，這個欄目的主要目的是為了放松，它比較有趣味，會通過一個小的測試測測你“與眾不同”的方面，當然，它并不一定真實，只是會用測試來達到讓人放松的目的，4.2.3首頁首頁共有六個模塊：簡短動畫、推薦文章、推薦電影、青春校園、愛情語錄、愛情散文。這六個模塊，每個都被分別框起來，框的樣式也不同，其中的色彩也不同，而首頁的背景又是白色，整體看起來，清新、簡單，又不失可愛。動畫Flash動畫的名稱是《一千零一個愿望》，它講述了一對戀人相識、相知、相戀的故事：動畫的開頭是一個女孩獨自走在車站內，接著，女孩想起了她和男孩相連的事---在一個冬天，男孩和女孩在網(wǎng)上相遇，他們開始相互傾訴，兩人慢慢熟悉起來，然后，兩人戀愛了，因為彼此，那個冬天不再寒冷。后來男孩因為一些事情，外出了，兩人的聯(lián)系少了，女孩漸漸感覺到了無比的寂寞，在經(jīng)過內心斗爭后，她踏上了尋找男孩的路。這個動畫看起來很簡單，但也精致，再加上音樂，整體看上去，很不錯。當打開首頁時，動畫就會開始播放，而在打開別的網(wǎng)頁時，它就會自動停止，直到再次回到首頁，《一千零一個愿望》的音樂就會再響起。電影在首頁中共推薦了五部電影，每部電影結局不同，有的痛失戀人，有的卻又事業(yè)、愛情雙豐收，無論如何，每一部都值得一看，下面選取了兩部做出介紹：《泰坦尼克號》---為了尋找1912年在大西洋沉沒的泰坦尼克號和船上的珍貴財寶——價值連城的“海洋之心”寶石，尋寶探險家布洛克從沉船上打撈起一個銹跡斑斑的保險柜，不料其中只有一幅保存完好的素描－一位佩戴著鉆石項鏈的年輕女子。這則電視新聞引起了一位百歲老婦人的注意,老人激動不已，隨即乘直升飛機趕到布洛克的打撈船上。原來她名叫羅絲·道森，正是畫像上的女子。她講述了一段動人的愛情故事：蘿絲在泰坦尼克號上，因不想嫁給未婚夫卡爾，于是準備跳海自殺，被剛好得船票，登上這座豪華巨輪的杰克所救。杰克帶她參加下等艙的舞會，給她畫像......他們兩人很快墜入情網(wǎng)，但是這份甜美的愛情還沒過多久，歷史上最重大的災難之一，泰坦尼克號的沉沒便發(fā)生了。他們剛剛萌生的愛情幼苗也歷經(jīng)生死的考驗。最后，杰克為了救羅絲，為她取暖，鼓勵她活下來，而自己卻凍死在寒冷的海水里。羅絲得救了，她從沒有忘記杰克，不僅僅是因為他們有一段凄美的愛情，還因為杰克給了她很多快樂，也給了她新的希望和未來……《律政俏佳人》：艾莉-伍茲過著無憂無慮的生活，可以說她是應有盡有。她是一個來自熱帶夏威夷的女孩，女大學生聯(lián)誼會會長，在她大學的日歷上她是“六月小姐”，但首先她是一個天生麗質的金發(fā)碧眼美女。艾莉正在與學校中最酷的男孩華納戀愛，并一心一意想做他的新娘----華納-亨廷頓三世夫人。但是，有一個問題使華納對艾莉的求婚欲說還休，那就是：艾莉除了金發(fā)碧眼的美貌外實在沒有什么可吸引人的。在洛杉磯艾倫-斯班林街對面長大對于某些人來說可能意謂著什么，但對東海岸貴族出身的華納一家人來說什么也算不上。因此，當華納打點行裝前往哈佛法學院與一個預備班的舊情人團聚時，艾莉明白了自身的不足。她也竭盡全力考進了哈佛大學，決定要贏回華納的心。但是法學院與她以前的舒適環(huán)境——池邊的草地、林蔭道實在是天壤之別。艾莉有生以來第一次必須進行一場戰(zhàn)斗----為了她心愛的人、為了她自己、也為了那些每天都無休止地承受著羞辱的金發(fā)碧眼美女。自從選擇律師的職業(yè)以后，艾莉積極刻苦進取，并用正義與社會中的種種丑惡現(xiàn)象作斗爭，最終在一次法庭上的精彩審問不僅使案件水落石出，也一舉成名，華納-亨廷頓三世再次向她說愛，但被她宛然拒絕，她要開始屬于她自己的新的生活。各網(wǎng)頁的功能描述5.1首頁功能：通過首頁，可以大致了解網(wǎng)站的結構及內容。首頁分為了banner、導航和主頁部分。其中主頁又分為六個板塊：推薦文章---共有六篇，每一篇都會有一幅圖片和一段簡潔的文章的介紹；簡短動漫---講述的一對在網(wǎng)上相識的戀人的故事；推薦電影---共有五部，分別是《泰坦尼克號》、《秋天的童話》、《羅馬假日》、《愛情故事》和《律政俏佳人》，這五部電影都有關于戀愛，而《泰坦尼克號》則又是一部人們不得不看的愛情大片，當點擊某一部電影時，就會出現(xiàn)該電影的介紹；青春校園---主要是一些青澀的校園戀愛故事；愛情語錄---多是名人對待戀愛或是愛情的觀點和經(jīng)典語錄；愛情散文---只看名字，也知道這是關于愛情的一些散文。而不論你想訪問那個網(wǎng)頁，或者是哪部分內容，這里基本上都有，可以任意訪問。5.2戀愛通告網(wǎng)頁“也許，你已有了男朋友（或女朋友），也許，你只有暗戀的對象，那么，請來這里，大聲說出你的愛！”這就是這個網(wǎng)頁最主要的功能，我們拽錄了一些表白短信和熱戀時的短信，還有情書，通過它們，可以感受到炙熱的愛意。在這里，你也許會回想起自己的告白，或者是被告白的欣喜、驚訝、害羞，那應該是一種很美好的回憶，哪能放在放在記憶的最深處呢？你也許還在暗戀某個人，那么看到這些，你還不行動起來，趕快去表白嗎？5.3戀愛物語網(wǎng)頁這個網(wǎng)頁的主要功能在于“分享”，分享別人的戀愛故事，分享古人的戀愛觀，分享千古以來的唯美名句。從這些故事和詩句中，我們可以看到一個雖沒有結局，但又美好回憶的唯美故事，可以知曉戀愛的四個階段，可以傾聽從古到今美好的聲音，“衣帶漸寬終不悔，為伊消得人憔悴”，可以看到為愛的付出，“你念或者不念我，情就在那里不來不去”，又讓人看到情的堅定……當然，如果你要寫情書，也可以參考一些這里的句子哦。5.4心靈脈搏網(wǎng)頁該網(wǎng)頁的功能是圖片欣賞。脈搏，這是一種跳動的感受，充滿活力，擁有激情，當然，最重要的就是，“心靈”中的濃濃愛意?？粗@些圖片，想象著，途中的主人公就是你和你的戀人，你們手牽著手，走在漫漫小路上，親親密密，偶爾，兩人慢慢靠近，甜言蜜語，想必，那是一種享受吧?；蛘?，你們來到?jīng)坝颗炫鹊拇蠛Ｇ?，讓他為你畫幅畫（讓她為你照張照片），一起制造回憶，當你們老的時候，再看到這幅畫（照片），那又是一種怎樣的感受呢?現(xiàn)在的你，在看到頁面上的這些圖片時，想到要進行一次愛的旅行了嗎？5.5櫻空斷點網(wǎng)頁戀愛都是美好、甜蜜的，但同時也會有一些不愉快或者悲傷的事發(fā)生，有的戀人會分手，那他們還會在一起嗎，還是會徹底放手呢？也有的人不珍惜眼前人，卻要追求一些不屬于他的東西，當他發(fā)現(xiàn)自己已經(jīng)錯過了真愛時，他又會怎樣做呢，是追回她，還是會選擇消失？當面對戀愛中的悲傷和痛苦時，你又會怎樣做呢？在這個網(wǎng)頁中，有觸動人心的文章，希望你可以在這里找到與你相似的情況，從他們的事情中得到借鑒。5.6愛與成長網(wǎng)頁每對戀人之間都會有一些美好的回憶吧，告白時的青澀、害羞，成為戀人時的開心、興奮，相戀時的甜蜜、依戀，這些都是美好的過去吧，而在正處于熱戀期的朋友們，又是否再回過去的同時，還對未來有一個清晰的計劃了呢？當你驀然回首時，當你仔細品味愛情時，當你思考兩人的未來時，就可以參考這個網(wǎng)站，它會帶給你一絲明悟的。5.7心理測試網(wǎng)頁瀏覽完前面全部的網(wǎng)頁后，你或許還停留在唯美名句中，或許還正在分享別人的喜悅，或許正在感傷，或許正在期望著未來。無論如何，到了這里，不要再想那些東西，這里是為了讓你放松的，通過一個小測試，你也許就能知道你將會愛上幾個人，當然，這只是小測試，并不需要當真，只希望測試完之后，你已不在糾結在前面的內容上了。網(wǎng)站測試報告WEB標準不是某一個標準，而是一系列標準的集合。網(wǎng)頁主要由三部分組成：結構（Structure）、表現(xiàn)（Presentation）和行為（Behavior）。對應的標準也分三方面：結構化標準語言主要包括XHTML和XML，表現(xiàn)標準語言主要包括CSS，行為標準主要包括對象模型（如W3CDOM）、ECMAScript等。這些標準大部分由W3C起草和發(fā)布，也有一些是其他標準組織制訂的標準，比如ECMA（EuropeanComputerManufacturersAssociation）的ECMAScript標準。符合WEB標準的網(wǎng)站應該主要由三部分組成：結構（Structure）、表現(xiàn)（Presentation）和行為（Behavior）。對應的網(wǎng)站標準也分三方面：結構化標準語言，主要包括XHTML和XML；表現(xiàn)標準語言主要包括CSS；行為標準主要包括對象模型（如W3CDOM）、ECMAScript等。這些標準大部分由W3C組織（什么是W3C組織）起草和發(fā)布，也有一些是其他標準組織制訂的標準，比如ECMA（EuropeanComputerManufacturersAssociation）的ECMAScript標準。6.1web標準測試1.連接測試2.數(shù)據(jù)庫測試3.瀏覽器測試4.平臺測試5.負載測試6.壓力測試7.整體界面測試6.1.1測試環(huán)境Web測試環(huán)境所需要的軟硬件包括：電腦一臺，JDK1.6，IE瀏覽器，F(xiàn)irefox瀏覽器等。6.2瀏覽器兼容性測試網(wǎng)頁設計瀏覽器兼容請測試軟件6.2.1測試環(huán)境IE7.瀏覽器IE8瀏覽器IE9瀏覽器Firefox瀏覽器Chrome.瀏覽器Opera.瀏覽器360瀏覽器.QQ瀏覽器6.2.2測試結果均可以在以上瀏覽器中打開。6.3操作系統(tǒng)兼容性測試對于每款被測軟件，我們都從軟件安裝、程序啟動、主要功能的使用以及軟件卸載等四個方面進行了詳細的測試和評估。在運行軟件安裝時，我們考察了被測軟件是否達到了如下要求：遵循用戶帳戶控制指南。為了滿足此要求，應用程序中包括的每個可執(zhí)行文件(帶，EXE擴展名)都必須有一個可定義其執(zhí)行級別的嵌入式清單，如果應用程序中只有少量功能需要管理權限(如應用程序需要配置防火墻時)，則應用程序的主進程必須仍然以標準用戶身份運行。必須將管理功能移到使用管理權限運行的獨立進程中。正確執(zhí)行版本檢查。除非最終用戶許可協(xié)議禁止在將來的操作系統(tǒng)上使用，否則應用程序不應在操作系統(tǒng)版本號增加的情況下無法運行。如果應用程序無法運行，則必須向用戶發(fā)送消息，并向日志寫入一條消息，然后正常退出。是否被提示存在已知兼容性錯誤。避免在安全模式下加載服務和驅動程序。驅動程序和服務不應在安全模式下運行，除非需要使用其進行系統(tǒng)的基本操作(如文件系統(tǒng)驅動程序)或用于診斷和恢復目的(如防病毒掃描程序)?！に袘贸绦虮仨毞戏撮g諜軟件聯(lián)合會提出的隱私準則。被視為惡意軟件或間諜軟件的應用程序將失去其徽標認證。·應用程序必須使用Windows安裝程序(MSl)或ClickOnce進行安裝?！贸绦驊J安裝到ProgramFiles或用戶的AppData文件夾中。對于每臺計算機安裝，用戶數(shù)據(jù)必須在首次運行時寫入，而不是在安裝期間寫入。由于在每臺計算機安裝期間安裝可能會提升到不同用戶帳戶權限，因此在安裝期間沒有正確的用戶位置來存儲數(shù)據(jù)?！ふ_配置程序包標識?！贸绦虿荒車L試安裝受保護的系統(tǒng)文件或注冊表項。如果應用程序要求采用更新版本的系統(tǒng)組件，則必須使用MicrosoftServicePack或包含該系統(tǒng)組件的Microsoft認可安裝程序包對這些組件進行更新?！な欠裨诎惭b結束后提示重新安裝提示?！ぐ惭b完畢后是否能夠正確運行。應用程序必須僅處理已知的預期異常，不能禁用"Windows錯誤報告"。如果在應用程序中出現(xiàn)了錯誤，則應用程序必須允許"Windows錯誤報告"報告此問題?！ぐ惭b完畢后UAC是否進行提示?！o并不必要的系統(tǒng)重啟要求。對于軟件卸載，我們會使用軟件自帶的卸載程序或者從控制面板的程序管理工具來卸載已經(jīng)安裝的被測軟件，并考察它們：·已安裝程序列表中是否刪除·安裝目錄是否被刪除·開始菜單、桌面、工作欄快速啟動部分是否已經(jīng)刪除掉相關快捷方式·注冊表中是否依然保留相關軟件的數(shù)據(jù)項6.3.1測試環(huán)境所有軟件的測試，均在如下配置的測試樣機上完成，其具體配置情況為：處理器：IntelCore2DuoE7400芯片組：IntelG45Express顯示卡：IntelGMAX4500HD硬盤：7200rpm，S-ATA顯示屏：22寸寬屏，1680x1050內存：4GBDDR3-1333所有軟件的測試，均在Windows7RTM(build7600)（以下簡稱Windows7）下完成。所有硬件驅動程序均使用Windows7自動識別并安裝的版本，以避免硬件官方驅動版本可能產(chǎn)生的潛在的兼容性問題。6.3.2測試結果操作系統(tǒng)兼容性完好6.4移動終端可用性測試1、狹窄布局在小屏幕上顯示大的web頁面仍舊需要一些信息視覺處理方法。目前一些瀏覽器采用狹窄布局作為默認查看模式，Opera將其稱為小屏幕渲染，NetFront將其稱為SmartFit，我們稱之為狹窄布局，因為整個內容的顯示窄且長，并且所有內容都做了簡化以符合屏幕寬度。我們對這一布局做過很多用戶研究，狹窄布局的主要好處就是文本容易閱讀，如果文本的寬度超過屏幕的寬度，用戶的閱讀就會很困難，雖然可以采取滾動的方法處理這一問題。不過根據(jù)我們的調查，狹窄布局仍有很多問題。最糟糕的就是為了符合屏幕寬度，一些大圖片被刪減，結果導致圖像細節(jié)丟失。第二個問題就是表格。如果有一行表格不與屏幕吻合，就會自動調至下一行。還有一點就是內容排序。如上圖，所有內容的顯示變得很長，所以用戶很難找到一些想要的內容，經(jīng)常需要在屏幕滾動時去尋找關鍵詞，這也就意味著滾動速度不能太快，結果看完所有內容會是一個非常漫長的過程。如果加快滾動速度，用戶又可能丟失一些重要信息。一個典型的Web頁面中，最左邊往往有很多鏈接，主要內容顯示在頁面中部。在狹窄布局中，用戶必須滾過這些鏈接，才能看到主體內容。不過在瀏覽一個網(wǎng)站時，這些鏈接多數(shù)情況下是不相關，用戶會變得很生氣。還有一個相關的問題就是，一個網(wǎng)站的任何頁面的上端往往很類似，用戶會弄不清楚自己在哪個頁面，所以如果這些鏈接中包含用戶已經(jīng)點擊過的，那么用戶很有可能再點擊這些鏈接。我們遇見過很多用戶由于這個問題而放棄閱讀，他們會說瀏覽器壞掉了。2、原始布局由于狹窄布局存在很多可用性方面的問題，所以很多瀏覽器還提供原始布局頁面模式，這很類似在PC上，讓用戶根據(jù)內容來選擇不同的視圖模式，原始布局中，大圖片細節(jié)和表格的效果會更好，同時如果用戶知道PC上的網(wǎng)站的結構，那么就很容易找到自己所需要的內容。當然原始布局并非什么問題都沒有。最糟糕的就是閱讀寬文本內容，會很費力。用戶每次都得向前向后拉動滾動條。另外由于頁面很大，所以需要滾動的地方也越多。3、理想布局很明顯，小屏幕移動終端上的頁面瀏覽仍需要很多改進和革新。如果想讓自己的網(wǎng)站在小屏幕上具有可讀性，可以遵守以下3個指導建議：避免那些一眼就能看出來的大物體；避免在圖片上使用小文本；頁面要輕化。6.4.1測試環(huán)境瀏覽器入口UI風格瀏覽器可用性交互頁面渲染緩存站點可用性結構內容布局6.4.2測試結果結構均可以布局核心網(wǎng)頁截圖7.1網(wǎng)頁截圖方法：打開所要截圖的網(wǎng)頁——鍵盤上prtscsysrg------開始-----附件----畫圖-----粘貼----保存到文件夾----打開fireworks軟件-----打開文件夾-----截圖-----保存圖片。7.2網(wǎng)頁截圖及其說明：此為網(wǎng)頁的中部，包括文字連接，圖片鏈接，以及視頻簡介的連接，以粉色為底，配以淺藍色的文字，多彩的圖片，從而顯現(xiàn)戀愛網(wǎng)頁的單純格調此為網(wǎng)頁的上半部分，導航，Logo，唯美的圖片，右上部分的心形圖案為Logo,超炫的“戀愛主義”藝術字效果，和導航的名字都讓人耳濡目染。從而體會到戀愛的那種唯美的畫面。大方而不失色調。此為網(wǎng)頁的一小部分，文字的鏈接與青春戀愛相關的主體文字，以及青春向上的積極的態(tài)度來面對生活，達到理性中的網(wǎng)站的積極樂觀的精神面貌愛情語錄重疊的文字放在首頁，讓瀏覽者一遍又一遍的去觸摸文字，從而在心靈之窗留下多彩而又不可忘卻的記憶愛情散文同“愛情語錄”相同，不同的文字下卻又偏重于同一理念，有用不同的文字表達，這樣，相得益彰，恰到好處，照應題目，又顯得整體布局大方，清晰此為Logo以及其背景圖片，首頁底色為粉色，配以紫色，從色彩角度來講，清麗卻又不失高貴典雅，顯得莊重，而心形的Logo多彩的色調，富有靈氣，與戀愛時刻的美妙心有靈犀格外地清麗圖片文字鏈接唯美的愛情宣言，滄海桑田的變遷，?？菔癄€的誓言，都似乎悄悄在戀愛的季節(jié)里生根發(fā)芽，與青春打馬走過的年華格格相應導航鏈接六個不同的詞匯包含了戀愛中的酸甜苦辣，簡單又不失華麗，又有著與愛戀中的感受息息相關的體味和那種對青春，生活的態(tài)度首頁的文字無連接在導航下面，你，我，他，象征著青春里的愛情，親情，友情三者風一般的掠過，有著怎樣的的意義，又有著怎樣的印痕，都成為我們每個人青春里的不能說的秘密子網(wǎng)頁首頁導航中的下拉菜單的連接一點點文字拼湊而來的卻又整齊地坐落在讀者的眼眶中，是一種享受子網(wǎng)頁首頁導航中下拉菜單的連接純純的文字，勾勒出來的畫面，讓人馬上回想起那些自己青春里走過的人，掠過的故事，更多的不是在讀而是在品味自己的青春子網(wǎng)頁首頁導航下拉菜單的連接可愛的圖片，讓我們更多的是來自視覺上的享受，無論從顏色，或者是勾勒出的圖像上，都似乎發(fā)生過一般子網(wǎng)頁首頁導航中下拉菜單的連接文字來說明，戀愛的境界圖片則展示不同境界的相同感受，或者說是一種自上而下的順暢子網(wǎng)頁首頁下拉菜單中的連接唯美的詩句，昭示古人的愛情觀，又有著多少可能和不可能的機會，才會曉得，該如何去體會蘊含在詞中的含義子網(wǎng)頁首頁導航中下拉菜單的連接斷橋殘雪，戀愛過的感受是刻骨銘心的，無論最后的結局如何，那種沉浸在其中的幸福是無法抹殺的子網(wǎng)頁首頁導航中下拉菜單的連接空釋戀空，走過，從青春的街角，我們彼此守望，卻有說不清道不明的錯覺，悲傷，快樂.........子網(wǎng)頁大樹下，我們自由的成長，那種無法表露的懵懂的心靈的無可代替的小小心結，都是走過青春里留下的奪目的財富子網(wǎng)頁與Logo的相似圖像，有著更加迷離的背景，心牽著心，好比青春里的故事，是你我主角的相互的變化，而令我們永遠也無法琢磨透的是那信譽新建的情思子網(wǎng)頁戀愛的季節(jié)，單車，成為了十分亮麗的風景線，不是孤孤單單的景，而是有著多少幸福在里面，到現(xiàn)在，也許經(jīng)歷過的人們都不曾hi忘記子網(wǎng)頁不可能所有戀愛的時刻都是幸福的，遇上了，愛上了，錯過了，結束了，便是一種幸福，慢慢的紅色格調是我對你的深深地祝福子網(wǎng)頁手拉著手并不走在大街上，也許，眼中只有彼此的身影，原來，世界是那么的渺小，卻充滿著你我的身影清晰的畫布，配上淡淡的藍天，誰會想到與戀愛有關，但是一點點仔細地觀察，整個畫面，都似乎要將我們挽留在那種畫面似的，那唯美的畫面，有著某種魔力，拉著我們，走進青春這道靜謐的風景之中。第三方組件與外部協(xié)助聲明文章來自以下幾個地方：文章閱讀網(wǎng)、小故事網(wǎng)、網(wǎng)絡收集、網(wǎng)絡轉載、新浪博客。圖片來來自：百度圖片、美圖秀秀材料庫。設計總結與心得體會由實驗可得出一點對代碼的認識，但是，依舊不能熟練的運用，其中包括對代碼的一些不是太清楚的認識，再加上記憶的不是十分的準確，所以在實驗中對實驗的書寫不是那么的準確，