個人網站的設計與制作畢業設計(編輯修改稿)

　

【文章內容簡介】 進行版面設計時，將本站的幾個主要版塊的內容都濃縮在主頁的界面里，從而令用戶能快速的看到用戶所感興趣的內容，節省用戶瀏覽時間。圖42 主頁效果圖 網站字體網站字體(Font)設置是網站制作中設計師經常遇到的一個很關鍵的問題，每一個網站都應該仔細，認真地思考自己網站的字體，合適的網站字體能讓客戶對網站產生信賴感，產生一種權威感，而不合適的字體往往會使用戶產生一種排斥感，和低級感。網站的字體是一門學問，網站優化不能僅僅從技術角度去做，應該把網站自身的設計做好，只有這些好的基礎，網站的優化，推廣才會真正產生效果。網站設計中字體的使用原則： 。字體太多則顯得雜亂，沒有主題。 。因為版面是有限的，大字體占的版面太多也沒有什么效果。 。會讓瀏覽者眼花繚亂。 網站版塊本網站主要是根據用戶的需求制作的個人網站。用戶可以直接瀏覽該網站的所有內容，也可注冊用戶。內容包括：主頁、個人簡介、日志、留言板、圖片、管理等版塊。(如圖43所示)圖43 主頁導航界面就是網站給瀏覽者的第一印象，往往決定著網站的可看性，本站的主頁是通過“家”的感覺來呈現的，可以給瀏覽者一種溫馨的感覺，會感到幸福。而導航就是通過與相關版塊的聯系而制作的相關聯的形狀，更形象生動的表現了網站的生動活潑。構建一個網站就好比寫一篇論文，首先要列出題綱，才能主題明確、層次清晰。網站建設初學者，最容易犯的錯誤就是，確定題材后立刻開始制作，沒有進行合理規劃。從而導致網站結構不清晰，目錄龐雜混亂，板塊編排混亂等。結果不但瀏覽者看得糊里糊涂，制作者自己在擴充和維護網站也相當困難。所以，我們在動手制作網頁前，一定要考慮好欄目和板塊的編排問題。另外，板塊的編排設置也要合理安排與劃分。版塊比欄目的概念要大一些，每個版塊都有自己的欄目。 數據庫邏輯結構設計。：用戶注冊表、留言表、日志表、管理員表。下面分別介紹這幾個表的結構 表41 admin1編號字段說明數據類型1Id編號自動編號2name姓名文本3mima密碼數字4sex性別文本5shengri出生日期日期/時間6work職業文本7phone聯系方式數字8time時間日期/時間 表42 book編號字段說明數據類型1id編號自動編號2name姓名文本3sex性別文本4work職業文本5time時間日期/時間6liuyan留言內容備注7huifu回復內容備注8pinglun評論內容備注 表43 rizhi2編號字段說明數據類型1Id編號自動編號2rtitle標題備注3zuozhe作者文本4nei內容備注5riqi時間日期/時間6nr主要內容備注4. 管理員表表44 guanli編號字段說明數據類型1name管理員文本2password密碼文本第五章 系統的實現該系統的實現主要包含主頁，個人簡介，日志，圖片，留言和管理界面的制作。其中留言界面是很重要的，對與瀏覽頁面，提供了瀏覽和發布信息的功能。而留言就提供了交流和動態的感覺這樣就成了交互的功能。達到了溝通和交流的目的。所以，本設計最大的特點就是這個留言模塊，提供了交流的設計。 留言板的實現 留言板的主界面 完整的留言板具有發表留言和查看別人留言及評論留言的功能，下面有留言板頁面的效果圖。（如圖51所示）圖51 留言板效果圖 留言板主界面的制作“”,在右側的【應用程序】中【數據庫】的“+”在彈出的下拉列表中選擇【數據源名稱（DSN）】，在彈出的【數據源名稱（DSN）】對話框中，設置【連接名稱】為“conm”，【數據源名稱（DSN）】為“conm”，單擊右側的【測試】，會彈出【成功連接腳本】對話框，表示數據庫添加完成。（如圖52所示）圖52 連接數據源 【綁定】點擊“+”【記錄集（查詢）】，彈出【記錄集】對話框，在其中設置【連接】為“conm”，【表格】為“book”，【列】選擇【全部】，【排序】中選擇【id，降序】，并單擊【確定】。（如圖53所示）圖53 綁定記錄集 【插入記錄】—【表單】，在表單中插入4行3列的表格，將【記錄集】里的字段拖曳到相應的單元格中。然后在右側的屬性欄中選擇【服務器行為】點擊“+”【重復區域】，彈出【重復區域】對話框中設置【顯示】為“7”條記錄(根據個人喜好設置)，單擊【確定】。（如圖54所示）圖54 重復區域 ，選擇【插入】【數據對象】【顯示記錄計數】【記錄集導航狀態】，單擊【確定】。再選擇【插入】【數據對象】【記錄集分頁】【記錄集導航條】，【顯示方式】選擇【圖像】。（如圖55，圖56所示）圖55 記錄集導航狀態 圖56 記錄集導航條 【確定】，然后選中“評論”，點擊【服務器行為】單擊“+”選擇【轉到詳細頁面】，在【轉到詳細頁面】對話框中設置【詳細信息頁】為“”等，然后單擊【確定】。（如圖57所示）圖57 詳細頁設置 【Ctrl+S】保存操作，按F12，預覽效果。（如圖58，59所示）圖58 留言板效果圖 圖59 留言板效果圖 發表留言界面的制作 發表留言是為瀏覽者可以與管理進行交流的平臺，可以發表留言信息，然后在主界面上顯示。（如圖510所示）圖510 發表留言界面 “”，在網頁中插入表單，在表單中插入個4行2列的表格，并輸入文本，并且設置它們的“文本域”與數據庫中的字段相同。（如圖511所示）圖511 設置文本域 【綁定】點擊“+”【記錄集（查詢）】，彈出【記錄集】對話框，在其中設置【連接】為“conm”，【表格】為“book”，【排序】中選擇【id，降序】，并單擊【確定】。（如圖512所示）圖512 綁定記錄集 【服務器行為】點擊“+”【插入記錄】，彈出【插入記錄】對話框，在其中設置【連接】為“conm”，【表格】為“book”，【插入后，轉到】為“”，【表單元素】中設置相對應的字段，并單擊【確定】。（如圖513所示）圖513 插入記錄 ，按F12預覽效果。（如圖514所示）圖514 發表留言效果圖通過留言板的制作，希望瀏覽者瀏覽本站而了解我，與許久未聯系的朋友們交流，彼此交流愛好和興趣，留言板還可以與其他網絡上志同道合的朋友們互相交流，探討知識等。 后臺管理界面 在一個網站中，后臺管理是非常重要的，管理員可以通過后臺登錄，驗證成功后可以對網站進行信息的更新，留言的回復和系統的修改完善，所以一個好的網站需要有一個完善的后臺管理系統。 登錄界面在對系統進行管理之前，需要通過系統的身份驗證。本站中使用“”進行身份驗證。只有用戶名和密碼正確才可以進入管理界面，否則就會進入“”，登錄界面如圖515所示。圖515 登錄界面本系統只因為是Dreamweaver開發而成的，里面的代碼都是自動生成的。后臺登錄界面所需要的關鍵代碼如下：table width=26% height=91 borde