Home | Mirror | Search

第 13 章 頁面設計 Design

目錄

1. 頁面元素命名
2. XHTML+DIV+CSS
3. 頁面結構設計
3.1. Home page (首頁)
3.2. 導航爛
3.3. Left Bar
3.4. 區塊設計 Block
4. 表格
5. 圖片優化
5.1. onMouseOver/onMouseOut
5.2. 使用一幅圖片處理BLOCK四角
5.3. 圖片用背景圖代替 img 標記
5.4. 合併圖片
6. HTML嵌入圖片
7. 頁面內容安全
7.1. 禁止滑鼠右鍵
7.2. 禁止複製剪切 及粘貼
8. html,css 有效性檢查 Validation

最近幾年,隨着業界越來越關注XHTML+CSS的標準化設計,一個新興職業已經誕生,這就是“網站重構師”,這個新興職業人才緊缺,他們主要的職責是將HTML+Table+Javascript的架構向XHTML+CSS+Ajax遷移。

1. 頁面元素命名

		
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>恆信貴金屬報表系統</title>
    </head>
    <body>
    	<div id="header">
    		<div id="logo"></div>
    		<div id="banner"></div>
    		<div id="navigation"></div>
    	</div>
    	<div id="wrapper">
    		<div id="sidebar"></div>
    		<div id="content"></div>
    	</div>
    	<div id="footer">
    		<div id="footer-nav"></div>
    		<div id="copyright"></div>
    		<div id="legal"></div>
    	</div>
    </body>
<html>
		
		
comments powered by Disqus