1. 結構完整,可通過標準驗證
2. 標籤語義化,結構合理,比如role這個屬性,就是為了使標籤語義更明確的乙個屬性
3. 充分考慮到頁面在站點中的「作用和重要性」,並對其進行有針對性的優化
一、設計稿的分析
設計稿的分析是指對設計稿如何製作成頁面的分析,即哪一塊的內容可以做為公共的部分、哪一塊的內容結構可以如何實現等。對設計稿的分析能力可以劃分成下面的幾個階段:
1. 能分清設計稿中的公共與私有的部分。比如有的**頁面有一塊公共的區域,要弄清楚這塊區域的位置嗎,大小和實現方式,從seo的角度來講,不推薦用frame標籤。
補充一下框架的知識:
框架結構 框架結構,即幀結構(frame)網頁表現為乙個頁面內的某一塊保持固定,其它部分資訊可以通過滾動條上下或左右移動顯示,如左邊選單固定,正文資訊可移動,或者頂部導航和logo部分保持固定,其它部分上下或左右移動。我們的郵箱通常都採用框架建構。
框架型網頁的另乙個表現是,深層頁面的網域名稱通常不會在url中體現出來,即使進入深層子頁面,瀏覽器顯示出來的url仍然是主頁的url。
框架型**的優越性體現在頁面的整體一致性和更新方便上。尤其對於那些大型**而言,框架結構的使用可以使**的維護變得相對容易。但框架對搜尋引擎來說
2. 在1的基礎上對各部分的實現方式有乙個初步的方案(包括如何切圖、寫結構、寫樣式)
3. 在1的基礎上,準確的給出各部分的實現方案(包括如何切圖、寫結構、寫樣式)
4. 在3的基礎上,能同時考慮方案的擴充套件性、復用性及頁面效能(包括如何切圖、寫結構、寫樣式)
5. 在4的基礎上,考慮整站的結構分布(包括檔案分布、目錄結構)
這些考慮必須在寫頁面之前。
二、切圖
切圖是指將設計稿切成便於製作成頁面的。都有個誤區,覺得切圖就是把切出來,其實並不完全是這樣,還包括把切出來的合併到一起,怎麼切、從哪切才能將效能最大化,說「切圖是一門藝術」完全不為過。切圖也可以劃分成幾個階段:
1. 切成所需要的(如何將需要的部分切出來)
2. 在1的基礎上,對切出來的進行一些優化(包括壓縮檔案大小、選擇型別)
3. 在2的基礎上,規劃切出來的(包括檔案分布)
4. 在3的基礎上,考慮整體的效能(包括合併、壓縮檔案大小),比如圖示整合到乙個png裡面。
html和css的編寫
html和css的編寫是指將上面完成的內容,通過html和css的編寫,將設計稿轉換成web頁面最重要的一塊,也是我們所要重點掌握的內容,把它們放在一起,是因為它們相互的關聯性太強,html的寫法會影響到css的寫法,它又可以劃分成下面幾個階段:
1. 還原設計稿視覺效果,並通過標準驗證(html)
2. 在1的基礎上,實現多瀏覽器的相容(html)
3. 在2的基礎上,標籤語義化(html)
4. 在3的基礎上,選擇較優的實現方式(包括模組化結構,方便程式指令碼使用,html和css)
5. 在4的基礎上,考慮到擴充套件性、復用性和可維護性(html和css)
6. 在5的基礎上,考慮到整站的樣式分布(包括如何實現分布)
7. 在6的基礎上,樣式寫法的優化(包括技巧的應用)
職業定位解析
職業定位有什麼好處?職業定位有兩層含義 一 確定自己你是誰,你適合做什麼工作 二 告訴別人你是誰,你擅長做什麼工作。定位準確,你就會持久地發展自己。很多人事業上發展不順利不是因為能力不夠,而是選擇了並不適合自己的工作,很多人並沒有認真地思考一下 我是誰 我適合做什麼 也因為不清楚自己要什麼,而無法體...
職業定位與職業成功的關鍵。
要找到以上問題的最終答案,關鍵是要確定你的性格特徵 準確識別你的天賦,從而準確定位適合你的職業。下面介紹的最新的成功心理學研究成果,或許能給你一些啟發!成功職業指導中心運用成功心理學的理念和方法,應用人類對大腦的最新研究成果,結合優勢理論和美國權威的創新求職理論,總結出了一套系統的 可操作的職業定位...
頁面重構css技巧
1.如何讓文字在容器內垂直居中?1 方法 為容器新增line height屬性,使得line height的值等於容器的height。2 html view plain copy print html head meta charset utf 8 title 無標題文件 title style t...