個人網站設計說明書

設計理念

小金個人網站設計說明書過現(xiàn)代網頁制作技術，把有關個人信息通過網站形式公布到互聯(lián)網，借此到達與外界互聯(lián)互通的目的。就網站本身而言，力求主題清楚，構造明白，美觀而不失大方?？傮w框架頁面布局本站點頁面設計簡明，分上中下三個局部，位置大小固定。頁面統(tǒng)一布局，承受模板頁作為框架，選取背景圖片統(tǒng)一風格。最上邊是時，對應的分標題下全部可選工程彈出，此時可以用鼠標做出選擇。和協(xié)調內容顯示。功能模塊的三個模塊，包括：個人信息、消遣〔興趣愛好、聯(lián)系方式等模塊。關于個人信息又分為三局部，個人檔案信息、日記局部和相冊。個人目形式展現(xiàn)附帶日記記錄時間，由于日記可能較多所以供給分頁功能；相冊局部是對現(xiàn)實瞬間的撲捉與記錄，以照片形式展現(xiàn)，承受自過提交相關信息到達和站主的溝通。具體設計說明圖1 站點整體文件樹形名目站點名稱：myweb主要文件夾：flash、images、music、Scripts、Templateswelcome.htm、index.html、dangan.html、riji.html、xiangce.html、yinyue.html、donghua.html、liuyan.htmldaohang.csslogininput.cssbj.css、mm_css_menu.js圖2 檔案頁面關于檔案頁設計說明<scriptlanguage=“JavaScript1.2“type=“text/javascript“src=“mm_css_menu.js“></script><styletype=“text/css“media=“screen“>@importurl(“./daohang.css“);body{background-image:url(images/bj2.jpg);overflow-y:hidden;background-repeat:no-repeat;}此局部引用固定格式，通過對.js文件的引用到達動態(tài)處理效果，屬于框架的一局部。<tablewidth=“800“height=“138“border=“0“><tr><tdwidth=“20“height=“24“> </td><tdwidth=“704“> </td><tdwidth=“62“> </td></tr><tr><td> </td><td><pclass=“STYLE2“>昵稱：小金<br/>年齡：23<br/>星座：摩羯座<br/>血型：A型<br/></p><pclass=“STYLE2“>職業(yè)：學生<br/>愛好：小說,網絡,設計,音樂,旅游<br/>誓言：愛我所愛,無怨無悔<br/>,給人以歡快給自己歡快!</p><pclass=“STYLE2“>QQ：1297015012<br/>Email：“mailto:jinyingleipds@qq“jinyingleipds@qq</p><pclass=“STYLE2“>人生信念：簡簡潔單,做歡快自己!</p><pclass=“STYLE2“><br/></p><pclass=“STYLE2“><br/></p><p><br/></p></td><td> </td></tr><tr><td> </td><td> </td><td> </td></tr></table>成文字錄入與位置固定。圖3 日記頁面關于對日記頁設計說明<divid=“apDiv5“><tablewidth=“581“border=“0“cellspacing=“2“><tr><tdwidth=“29“height=“37“> </td><tdwidth=“33“height=“37“> </td><tdwidth=“10“> </td><tdwidth=“304“> </td><tdwidth=“107“> </td><tdwidth=“72“> </td></tr><tr><td> </td><td width=“33“height=“30“><imgsrc=“images/01.jpg“width=“30“height=“30“/></td>

<td> </td><td><spanclass=“STYLE4“><ahref=“rj1.html“>完善生活</a></span></td><td><divalign=“right“class=“STYLE4“>2015-7-16</div></td><td> </td></tr>…… /*局部同格式內容省略*/<tr><tdheight=“23“colspan=“6“> </td></tr></table></div>以上局部是日志主題頁面的，div與table編號排版與日記主題和時間顯示功能。圖4 相冊頁面關于相冊的設計說明<objectclassid=“clsid:D27CDB6E-AE6D-11cf-96B8-444553540000“……<paramname=“flash_component“value=“ImageViewer.swc“/><paramname=“movie“value=“flash/xiangce.swf“/><paramname=“quality“value=“high“/><paramname=“FlashVars“value=“……(1).jpg”,”flash/01……(11).jpg”,”flash/01</object>相冊局部將照片集轉化為FLASH格式進展自動播放，也可以手動掌握按鈕進展快速掃瞄。音樂頁面設計

圖5 音樂頁面<tablewidth=“800“height=“138“border=“0“><tr><tdwidth=“20“height=“24“> </td><tdwidth=“704“> </td><tdwidth=“62“> </td></tr><tr><td> </td><td><pclass=“STYLE2“>歌曲名字：未知</p><pclass=“STYLE2“>歌手名字：未知</p><pclass=“STYLE2“><embedsrc=“music/music.wma“width=“338“height=“45“></embed></p><pclass=“STYLE2“>下載的，忘了，不記得了，</p><pclass=“STYLE2“>小金間或會健忘的，呵呵！不過呢，這首音樂很好聽哦，試試吧，信任你肯定會寵愛！<br/></p><p><br/></p></td><td> </td></tr><tr><td> </td><td> </td><td> </td></tr></table>音樂頁面主題是TABLE 標簽，內嵌播放標簽<embedsrc=“music/music.wma“width=“338“height=“45“></embed>。動畫頁面設計

圖6 動畫頁面<objectclassid=“clsid:D27CDB6E-AE6D-11cf-96B8-444553540000““://download.macromedia/pub/shockwave/cabs/flash/swflash.cab#version“codebase=“://download.macromedia/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0“width=“500“height=“326“><paramname=“movie“value=“flash/497.swf“/><paramname=“quality“value=“high“/><embedsrc=“flash/497.swf“quality=“high““://adobe/shockwave/download/download.cgi?P1_Prod_Ver“plugins=“://adobe/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash“type=“application/x-shockwave-flash“width=“500“height=“326“></embed></object>object來實現(xiàn)對動畫媒體的引用。圖7 留言頁面關于留言頁面設計說明<divid=“apDiv3“><tablewidth=“800“border=“0“cellspacing=“5“><tr>……</tr><formid=“form1“name=“form1“method=“post“action=““><tr>……<label><inputname=“textfield“type=“text“class=“l(fā)ogininput“id=“textfield“/></label></tr><tr>……</tr></form><label> ……</label></td></tr></table></div>在留言板