用網(wǎng)站模板做網(wǎng)站是最簡(jiǎn)單的一種方式了，而且目前網(wǎng)上模板資源也比較多，找起來(lái)方便，找一個(gè)合適的模板，下載后用編輯軟件打開(kāi)頁(yè)面進(jìn)行編輯，修改自己想要的內(nèi)容，編輯器有很多，比如Dreamweaver，WebStorm等，當(dāng)然，你要是技術(shù)好，記事本也能行！然后說(shuō)點(diǎn)其他的，模板做網(wǎng)站的缺點(diǎn)和優(yōu)點(diǎn)：優(yōu)點(diǎn)：效率快，省事省時(shí)間，不用費(fèi)太多心思做設(shè)計(jì)及構(gòu)架等。缺點(diǎn)：靈動(dòng)性弱，想改個(gè)布局或者構(gòu)架比較繁瑣，或者添加一些自己想要的效果也不方便，更重要的是，模板做出來(lái)的東西，沒(méi)有設(shè)計(jì)在里面，不新穎！ps：模板也分很多種，有靜態(tài)的，動(dòng)態(tài)的，靜態(tài)的修改就比較簡(jiǎn)單了，動(dòng)態(tài)的修改比較繁瑣，再有數(shù)據(jù)庫(kù)之類(lèi)的，就更不好弄了！

步驟一、打開(kāi)Dreamweaver編輯器步驟二、新建html并把最基本的頁(yè)面屬性設(shè)置一下步驟三、插入表格并且設(shè)置表格屬性步驟四、以上例子是選擇了三行，在最上面的一行里插入網(wǎng)站或者logo，這里可以設(shè)計(jì)一張圖片第二行里可以加入你想加入的信件內(nèi)容第三行里輸入簽名和聯(lián)系信息，好啦，保存為想要的名字比如保存為：開(kāi)發(fā)信模板.htm步驟五、找到Foxmail的安裝路徑Foxmail\Template\New\文件夾，打開(kāi)template.ini文件，照著下面的修改配置步驟六、把做好的模板 例如開(kāi)發(fā)信模板.htm 放到如圖所示路徑下面步驟七、返回到foxmail信紙管理，看到（自己命名的）開(kāi)發(fā)信模板了吧，選中這個(gè)，然后把這個(gè)設(shè)為默認(rèn)。具體的操作方式可以參考：http://jingyan.baidu.com/article/92255446f48d4c851648f4a2.html怎樣在Foxmail里面制作html郵件模板_百度經(jīng)驗(yàn)！

步驟1 創(chuàng)建空白的HTML 5模版 首先，我們創(chuàng)建一個(gè)空白的模版，代碼很簡(jiǎn)單，如下所示：復(fù)制代碼步驟2 增加HTML 5新標(biāo)簽 HTML 5中新增加了不少標(biāo)簽，如： article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section在頁(yè)面模版中，我們需要確保每個(gè)區(qū)域都能正確地對(duì)齊，因此需要使用HEADER、 NAVIGATION、 CONTENT、 SIDEBAR和Footer這些標(biāo)簽。代碼如下所示：復(fù)制代碼讀者可能留意到這里使用的div id=”wrapper”，這個(gè)是稍候用來(lái)做meida query的時(shí)候調(diào)整全局CSS樣式調(diào)整用的 步驟3 往HTML 5標(biāo)簽中增加代碼 1）首先往標(biāo)題中增加如下代碼： 　Simple HTML5 Template 復(fù)制代碼2）往導(dǎo)航標(biāo)簽中添加如下代碼，這樣很方便地構(gòu)件了一個(gè)簡(jiǎn)單的頁(yè)面分類(lèi)導(dǎo)航： Home About Parent Page Child One Child Two with child Child One Child Two Child Three Child Three Contact 復(fù)制代碼3）使用標(biāo)簽來(lái)描述每一個(gè)要展示的內(nèi)容實(shí)體,比如要展示的是多篇文章列表,其中的每一篇文章的具體內(nèi)容就可以使用標(biāo)簽了。如下代碼所示： This is a title for post Richard KS 20th March 2013 Tutorials HTML5, CSS3 and Responsive 10 Comments Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s 復(fù)制代碼4）添加標(biāo)簽 HTML5提供的元素標(biāo)簽用來(lái)表示當(dāng)前頁(yè)面或文章的附屬信息部分，可以包含與當(dāng)前頁(yè)面或主要內(nèi)容相關(guān)的引用、側(cè)邊欄、廣告、nav元素組，以及其他類(lèi)似的有別與主要內(nèi)容的部分。根據(jù)目前的規(guī)范，元素有兩種使用方法：被包含在中作為主要內(nèi)容的附屬信息部分，其中的內(nèi)容可以是與當(dāng)前文章有關(guān)的引用、詞匯列表等。 在之外使用，作為頁(yè)面或站點(diǎn)全局的附屬信息部分；最典型的形式是側(cè)邊欄(sidebar)，其中的內(nèi)容可以是友情鏈接、附屬導(dǎo)航或廣告單元等。 代碼如下：Categories Category 1 Category 2 Parent Category Child One Child Two Grandchild One Grandchild Two Grandchild Three Child Three Category 3 Text Lorem Ipsum is simply dummy text of the printing and typesetting industry. 復(fù)制代碼5）加上最后的標(biāo)簽，代碼為： Copyright@ 2013 HTML5.com Privacy Policy - About Us復(fù)制代碼 步驟4 增加CSS樣式 首先創(chuàng)建一個(gè)空白的樣式，如下：[/code] 然后在http://necolas.github.com/normalize.css/中下載這個(gè)css,然后將其內(nèi)容復(fù)制到該空白的文件中代碼如下： [code]body {font-family: arial, sans-serif;font-size: 100%; /* best for all browser using em */padding:0;margin:0;}*, html { line-height: 1.6em; }article img { width:auto; max-width:100%; height:auto; }.sidebar a, article a, header a, footer a { color: #C30; }header a { text-decoration: none; }#wrapper {font-size: 0.8em; /* 13px from 100% global font-size */max-width: 960px; /* standard 1024px wide */margin: 0 auto;}/* css for */header { padding: 1em 0; margin: 0px; float: left; width: 100%;}header hgroup { width: 100%; font-weight:normal; }/* css for */nav { display: block; margin: 0 0 2em; padding: 0px; float: left; width: 100%; background-color: #181919;}nav ul ul {display: none;}nav ul li:hover > ul {display: block;}nav ul { padding: 0; list-style: none; position: relative; display: inline-table; z-index: 9999; margin: 0px; float: left; width: 100%;}nav ul:after {content: ""; clear: both; display: block;}nav ul li {float: left;}nav ul li:hover a {color: #fff;}nav ul li a { display: block; padding: 1em; font-size: 1.125em; color: #ccc; text-decoration: none; margin: 0px; background-color: #000; border-right: 1px solid #333;}nav ul li:last-of-type a {border-right: 1px solid transparent !important;}nav ul ul { background: #5f6975; border-radius: 0px; padding: 0; position: absolute; top: 100%; width: auto; float: none;}nav ul li:hover { background: #5f6975; color: #FFF;}nav ul ul li a:hover { background-color: #4b545f;}nav ul ul li {float: none;border-bottom: 1px solid #444240;position: relative;}nav ul ul li a {padding: 0.5em 1em;font-size: 1em;width:10em;color: #fff;}nav ul ul ul {position: absolute; left: 100%; top:0;}/* css for */section.content { width: 70%; float:left; }.content article { width:100%; float:left; padding: 0 0 1em; margin: 0 0 1em; border-bottom: 1px solid #ddd; }article .entry { clear:both; padding: 0 0 1em; }h1.post-title { font-size: 1.8em; margin:0; padding:0;}.entry.post-meta { color: #888; }.entry.post-meta span { padding: 0 1em 0 0; }.entry.post-content { font-size: 1.125em; margin:0; padding:0;}/* css for */aside.sidebar { width: 25%; float:right; }aside.sidebar ul { width:100%; margin: 0px; padding: 0px; float: left; list-style: none;}aside.sidebar ul li { width:100%; margin: 0px 0px 2em; padding: 0px; float: left; list-style: none;}aside.sidebar ul li ul li { margin: 0px 0px 0.2em; padding: 0px;}aside.sidebar ul li ul li ul li { margin: 0px; padding: 0px 0px 0px 1em; width: 90%; font-size: 0.9em;}aside.sidebar ul li h3.widget-title { width:100%; margin: 0px; padding: 0px; float: left; font-size: 1.45em;}/* css for */footer { width: 98%; float:left; padding: 1%; background-color: white; margin-top: 2em;}footer .footer-left { width: 45%; float:left; text-align:left; }footer .footer-right { width: 45%; float:right; text-align:right; }復(fù)制代碼步驟5 為移動(dòng)應(yīng)用使用@media query查詢(xún) 為了進(jìn)行響應(yīng)式設(shè)計(jì)，最佳的方案是使用@media query去進(jìn)行查詢(xún)，在上面的CSS代碼中添加如下代碼：/* ipad 768px */@media only screen and (min-width:470px) and (max-width:770px){body { background-color: red; } #wrapper { width:96%; font-size: 0.6875em; }section.content, aside.sidebar { width:100%; }}/* iphone 468px */@media only screen and (min-width:270px) and (max-width:470px){body { background-color: yellow; } #wrapper { width:96%; font-size: 0.6875em; }section.content, aside.sidebar { width:100%; }}復(fù)制代碼步驟6 增加jquery,modernizer和html5shiv到標(biāo)簽中 這里推薦使用Modernizr 和html5shiv，它們都是一個(gè)能在多種瀏覽器中通過(guò)運(yùn)行各種腳本兼容運(yùn)行支持大部分HTML 5標(biāo)簽的插件。我們將它們和jQuery庫(kù)放在標(biāo)簽前，代碼如下：0復(fù)制代碼

要領(lǐng)一：確定網(wǎng)站主題 做網(wǎng)站，首先必須要解決的就是網(wǎng)站內(nèi)容問(wèn)題，即確定網(wǎng)站的主題。美國(guó)《個(gè)人電腦》雜志(PC Magazine)評(píng)出了99年度排名前100位的全美知名網(wǎng)站的十類(lèi)題材：第1類(lèi)：網(wǎng)上求職；第2類(lèi)：網(wǎng)上聊天/即時(shí)信息/ICQ；第3類(lèi)：網(wǎng)上社區(qū)/討論/郵件列表；第4類(lèi)：計(jì)算機(jī)技術(shù)；第5類(lèi)：網(wǎng)頁(yè)/網(wǎng)站開(kāi)發(fā)；第6類(lèi)：娛樂(lè)網(wǎng)站；第7類(lèi)：旅行；第8類(lèi)：參考/資訊；第9類(lèi)：家庭/教育；第10類(lèi)：生活/時(shí)尚。我們可以參看上面的分類(lèi)，繼續(xù)細(xì)分。如果自己在某些方面有興趣，或掌握的資料較多，也可以做一個(gè)自己感興趣的東西，一者，你可以有自己的見(jiàn)解，做出自己的特色；二者，在制作網(wǎng)站時(shí)不會(huì)覺(jué)得無(wú)聊或者力不從心。興趣是制作網(wǎng)站的動(dòng)力，沒(méi)有創(chuàng)作熱情，很難設(shè)計(jì)制作出優(yōu)秀的作品。 對(duì)于內(nèi)容主題的選擇，要做到小而精，主題定位要小，內(nèi)容要精。不要去試圖制作一個(gè)包羅萬(wàn)象的站點(diǎn)，這往往會(huì)失去網(wǎng)站的特色，也會(huì)帶來(lái)高強(qiáng)度的勞動(dòng)，給網(wǎng)站的及時(shí)更新帶來(lái)困難。記?。涸诨ヂ?lián)網(wǎng)上只有第一，沒(méi)有第二！ 要領(lǐng)二：選擇好域名 域名是網(wǎng)站在互聯(lián)網(wǎng)上的名字。一個(gè)非產(chǎn)品推銷(xiāo)的純信息服務(wù)網(wǎng)站，其所有建設(shè)的價(jià)值，都凝結(jié)在其網(wǎng)站域名之上。失去這個(gè)域名，所有前期工作就將全部落空。 目前，做個(gè)人網(wǎng)站的很多都依賴(lài)免費(fèi)個(gè)人空間，其域名也是依賴(lài)免費(fèi)域名指向，如網(wǎng)易的虛擬域名服務(wù)，其實(shí)這對(duì)個(gè)人網(wǎng)站的推廣與發(fā)展很為不利，不光是它“適時(shí)”開(kāi)啟的窗口妨礙了瀏覽者的視線和好感，讓人一看就知道是個(gè)人網(wǎng)站，而且也妨礙了網(wǎng)頁(yè)的傳輸速度。所以，就我個(gè)人觀點(diǎn)來(lái)說(shuō)，首先花點(diǎn)錢(qián)去注冊(cè)一個(gè)域名，獨(dú)立的域名就是個(gè)人網(wǎng)站的第一筆財(cái)富，要把域名起得形象、簡(jiǎn)單、易記。 要領(lǐng)三：掌握建網(wǎng)工具 網(wǎng)絡(luò)技術(shù)的發(fā)展帶動(dòng)了軟件業(yè)的發(fā)展，所以用于制作Web頁(yè)面的工具軟件也越來(lái)越豐富。從最基本的HTML編輯器到現(xiàn)在非常流行的Flash互動(dòng)網(wǎng)頁(yè)制作工具，各種各樣的Web頁(yè)面制作工具，下面是幾款具有代表性的網(wǎng)頁(yè)制作器： （1）HTML編輯器。雖然HTML代碼復(fù)雜，編輯和調(diào)試要花費(fèi)大量的時(shí)間，但因HTML的穩(wěn)定性、廣泛支持性及可創(chuàng)建復(fù)雜的頁(yè)面效果，仍受高級(jí)網(wǎng)頁(yè)制作人員的青睞。就目前來(lái)說(shuō)，有眾多的編輯器供選擇，這些編輯器廣泛支持復(fù)雜頁(yè)面創(chuàng)建及高級(jí)HTML規(guī)范，使用較為普遍的有Hotdog等專(zhuān)業(yè)HTML編輯器。 （2）所見(jiàn)即所得的網(wǎng)頁(yè)編輯器。其中以Microsoft Frontpage為代表，它具有如Word一樣的操作界面，熟知Word功能的操作者，只要稍加培訓(xùn)就能輕松編制網(wǎng)頁(yè)。而且，F(xiàn)rontpage還能解析網(wǎng)頁(yè)的HTML源代碼，并提供了預(yù)覽支持。但Frontpage的一些特殊顯示功能并不能在其它非IE瀏覽器下實(shí)現(xiàn)。所以Frontpage是一款非常適合初、中級(jí)網(wǎng)頁(yè)制作人員使用的工具軟件。 （3）現(xiàn)在非常流行的 Macromedia公司出品的Flash互動(dòng)網(wǎng)頁(yè)制作工具。這是是一款功能非常強(qiáng)大的交互式矢量多媒體網(wǎng)頁(yè)制作工具。能夠輕松輸出各種各樣的動(dòng)畫(huà)網(wǎng)頁(yè)，它不需要特別繁雜的操作，也比JAVA小巧精悍！但它的動(dòng)畫(huà)效果、互動(dòng)效果、多媒體效果十分出色。而且還可以在Flash動(dòng)畫(huà)中封裝Mp3音樂(lè)、填寫(xiě)表單等；并且由于Flash編制的網(wǎng)頁(yè)文件比普通網(wǎng)頁(yè)文件要小得多，所以大大加快了瀏覽速度。這是一款十分適合動(dòng)態(tài)Web制作的工具。 另外，個(gè)人網(wǎng)站制作者還需了解W3C的HTML4.0規(guī)范、CSS層疊樣式表的基本知識(shí)、javascript、VBScript的基本知識(shí)。對(duì)于常用的一些腳本程序如ASP、CGI、PHP也要有適當(dāng)了解，還要熟練使用圖形處理工具和動(dòng)畫(huà)制作工具以及矢量繪圖工具，并能部分了解多種圖形圖像動(dòng)畫(huà)工具的基本用法，熟練使用FTP工具以及擁有相應(yīng)的軟硬件和網(wǎng)絡(luò)知識(shí)也是必備的。 當(dāng)然，互聯(lián)網(wǎng)還是一個(gè)免費(fèi)的資料庫(kù)。編制網(wǎng)頁(yè)需要多種多樣的按鈕、背景還有各種各樣圖形、圖片。如果這些都要靠自己完成，既浪費(fèi)時(shí)間又浪費(fèi)金錢(qián)，而且還需要強(qiáng)大的圖形、圖片制作技術(shù)。所以，為了省卻這些麻煩，網(wǎng)站制作者完全可以從網(wǎng)上下載各種精美實(shí)用的圖片、按鈕、背景等網(wǎng)頁(yè)素材。 要領(lǐng)四：確定網(wǎng)站界面 界面就是網(wǎng)站給瀏覽者的第一印象，往往決定著網(wǎng)站的可看性，在確定網(wǎng)站的界面時(shí)要注意以下三點(diǎn)： ①欄目與板塊編排 構(gòu)建一個(gè)網(wǎng)站就好比寫(xiě)一篇論文，首先要列出題綱，才能主題明確、層次清晰。網(wǎng)站建設(shè)初學(xué)者，最容易犯的錯(cuò)誤就是：確定題材后立刻開(kāi)始制作，沒(méi)有進(jìn)行合理規(guī)劃。從而導(dǎo)致網(wǎng)站結(jié)構(gòu)不清晰，目錄龐雜混亂，板塊編排混亂等。結(jié)果不但瀏覽者看得糊里糊涂，制作者自己在擴(kuò)充和維護(hù)網(wǎng)站也相當(dāng)困難。所以，我們?cè)趧?dòng)手制作網(wǎng)頁(yè)前，一定要考慮好欄目和板塊的編排問(wèn)題。 網(wǎng)站的題材確定后，就要將收集到的資料內(nèi)容作一個(gè)合理的編排。比如，將一些最吸引人的內(nèi)容放在最突出的位置或者在版面分布上占優(yōu)勢(shì)地位。欄目的實(shí)質(zhì)是一個(gè)網(wǎng)站的大綱索引，索引應(yīng)該將網(wǎng)站的主體明確顯示出來(lái)。在制定欄目的時(shí)候，要仔細(xì)考慮，合理安排。在欄目編排時(shí)需要注意的是： ●盡可能刪除那些與主題無(wú)關(guān)的欄目； ●盡可能將網(wǎng)站內(nèi)最有價(jià)值的內(nèi)容列在欄目上； ●盡可能從訪問(wèn)者角度來(lái)編排欄目以方便訪問(wèn)者的瀏覽和查詢(xún)；輔助內(nèi)容，如站點(diǎn)簡(jiǎn)介、版權(quán)信息、個(gè)人信息等大可不必放在主欄目里，以免沖淡主題。 另外，板塊的編排設(shè)置也要合理安排與劃分。板塊比欄目的概念要大一些，每個(gè)板塊都有自己的欄目。舉個(gè)例子：ENET硅谷動(dòng)力（www.enet.com.cn）的站點(diǎn)分新聞、產(chǎn)品、游戲、學(xué)院等板塊，每個(gè)板塊下面又各有自己的主欄目。一般來(lái)說(shuō)，個(gè)人站點(diǎn)內(nèi)容較少，只要分個(gè)欄目也就夠了，不需要設(shè)置板塊。如果有必要設(shè)置板塊的，應(yīng)該注意： ●各板塊要有相對(duì)獨(dú)立性； ●各板塊要有相互關(guān)聯(lián)； ●各板塊的內(nèi)容要圍繞站點(diǎn)主題； ②目錄結(jié)構(gòu)與鏈接結(jié)構(gòu) 網(wǎng)站的目錄是指建立網(wǎng)站時(shí)創(chuàng)建的目錄。例如：在用Frontpage建立網(wǎng)站時(shí)都默認(rèn)建立了根目錄和Images子目錄。目錄的結(jié)構(gòu)是一個(gè)容易忽略的問(wèn)題，大多數(shù)站長(zhǎng)都是未經(jīng)規(guī)劃，隨意創(chuàng)建子目錄。目錄結(jié)構(gòu)的好壞，對(duì)瀏覽者來(lái)說(shuō)并沒(méi)有什么太大的感覺(jué)，但是對(duì)于站點(diǎn)本身的維護(hù)，以后內(nèi)容的擴(kuò)充和移植有著重要的影響。所以建立目錄結(jié)構(gòu)時(shí)也要仔細(xì)安排，比如： ●不要將所有文件都存放在根目錄下。有網(wǎng)站制作者為了方便，將所有文件都放在根目錄下。這樣就很容易造成：文件管理混亂，搞不清哪些文件需要編輯和更新，哪些無(wú)用的文件可以刪除，哪些是相關(guān)聯(lián)的文件，影響工作效率；上傳速度變慢，服務(wù)器一般都會(huì)為根目錄建立一個(gè)文件索引，如果將所有文件都放在根目錄下，那么即使只上傳更新一個(gè)文件，服務(wù)器也需要將所有文件再檢索一遍，建立新的索引文件，很明顯，文件量越大，等待的時(shí)間也將越長(zhǎng)。 ●按欄目?jī)?nèi)容建立子目錄。子目錄的建立，首先按主欄目建立。友情連接內(nèi)容較多，需要經(jīng)常更新的可以建立獨(dú)立的子目錄。而一些相關(guān)性強(qiáng)，不需要經(jīng)常更新的欄目，例如：網(wǎng)站簡(jiǎn)介、站長(zhǎng)情況等可以合并放在一個(gè)統(tǒng)一目錄下。所有程序一般都存放在特定目錄，例如：CGI程序放在cgi-bin目錄，所有提供下載的內(nèi)容也最好放在一個(gè)目錄下，便于維護(hù)管理。 ●在每個(gè)主目錄下都建立獨(dú)立的Images目錄。一般來(lái)說(shuō)，一個(gè)站點(diǎn)根目錄下都有一個(gè)默認(rèn)地Images目錄。將所有圖片都存放在這個(gè)目錄里很是不方便，比如在欄目刪除時(shí)，圖片的管理相當(dāng)麻煩。所以為每個(gè)主欄目建立一個(gè)獨(dú)立的Images目錄是方便管理的。原因很簡(jiǎn)單，就是方便維護(hù)與管理。 其它需要注意的還有：目錄的層次不要太深，不要超過(guò)3層；不要使用中文目錄，使用中文目錄可能對(duì)網(wǎng)址的正確顯示造成困難；不要使用過(guò)長(zhǎng)的目錄，太長(zhǎng)的目錄名不便于記憶；盡量使用意義明確的目錄，以便于記憶和管理。 網(wǎng)站的鏈接結(jié)構(gòu)是指頁(yè)面之間相互鏈接的拓?fù)浣Y(jié)構(gòu)。它建立在目錄結(jié)構(gòu)基礎(chǔ)之上，但可以跨越目錄。形象的說(shuō)：每個(gè)頁(yè)面都是一個(gè)固定點(diǎn)，鏈接則是在兩個(gè)固定點(diǎn)之間的連線。一個(gè)點(diǎn)可以和一個(gè)點(diǎn)連接，也可以和多個(gè)點(diǎn)連接。更重要的是，這些點(diǎn)并不是分布在一個(gè)平面上，而是存在于一個(gè)立體的空間中。一般的，建立網(wǎng)站的鏈接結(jié)構(gòu)有兩種基本方式： ●樹(shù)狀鏈接結(jié)構(gòu)（一對(duì)一），這類(lèi)似DOS的目錄結(jié)構(gòu)，首頁(yè)鏈接指向一級(jí)頁(yè)面，一級(jí)頁(yè)面鏈接指向二級(jí)頁(yè)面。這樣的鏈接結(jié)構(gòu)瀏覽時(shí)，一級(jí)級(jí)進(jìn)入，一級(jí)級(jí)退出，條理比較清晰，訪問(wèn)者明確知道自己在什么位置，不會(huì)“不知身在何處”，但是瀏覽效率低，一個(gè)欄目下的子頁(yè)面到另一個(gè)欄目下的子頁(yè)面，必須回到首頁(yè)再進(jìn)行。 ●星狀鏈接結(jié)構(gòu)（一對(duì)多），類(lèi)似網(wǎng)絡(luò)服務(wù)器的鏈接，每個(gè)頁(yè)面相互之間都建立有鏈接。這樣瀏覽比較方便，隨時(shí)可以到達(dá)自己喜歡的頁(yè)面。但是由于鏈接太多，容易使瀏覽者迷路，搞不清自己在什么位置，看了多少內(nèi)容。 因此，在實(shí)際的網(wǎng)站設(shè)計(jì)中，總是將這兩種結(jié)構(gòu)混合起來(lái)使用。網(wǎng)站希望瀏覽者既可以方便快速地達(dá)到自己需要的頁(yè)面，又可以清晰地知道自己的位置。所以，最好的辦法是：首頁(yè)和一級(jí)頁(yè)面之間用星狀鏈接結(jié)構(gòu)，一級(jí)和二級(jí)頁(yè)面之間用樹(shù)狀鏈接結(jié)構(gòu)。關(guān)于鏈接結(jié)構(gòu)的設(shè)計(jì)，在實(shí)際的網(wǎng)頁(yè)制作中是非常重要一環(huán)，采用什么樣的鏈接結(jié)構(gòu)直接影響到版面的布局。 ③進(jìn)行形象設(shè)計(jì) 網(wǎng)站的設(shè)計(jì)可以從以下幾點(diǎn)出發(fā)： ●設(shè)計(jì)網(wǎng)站標(biāo)志(LOGO)。LOGO是指網(wǎng)站的標(biāo)志，標(biāo)志可以是中文、英文字母，也可以是符號(hào)、圖案等。標(biāo)志的設(shè)計(jì)創(chuàng)意應(yīng)當(dāng)來(lái)自網(wǎng)站的名稱(chēng)和內(nèi)容。比如：網(wǎng)站內(nèi)有代表性的人物、動(dòng)物、植物，可以用它們作為設(shè)計(jì)的藍(lán)本，加以卡通化或者藝術(shù)化；專(zhuān)業(yè)網(wǎng)站可以以本專(zhuān)業(yè)有代表的物品作為標(biāo)志。最常用和最簡(jiǎn)單的方式是用自己網(wǎng)站的英文名稱(chēng)作標(biāo)志，采用不同的字體、字母的變形、字母的組合可以很容易制作好自己的標(biāo)志。 ●設(shè)計(jì)網(wǎng)站色彩。網(wǎng)站給人的第一印象來(lái)自視覺(jué)沖擊，不同的色彩搭配產(chǎn)生不同的效果，并可能影響到訪問(wèn)者的情緒。“標(biāo)準(zhǔn)色彩”是指能體現(xiàn)網(wǎng)站型象和延伸內(nèi)涵的色彩，要用于網(wǎng)站的標(biāo)志，標(biāo)題，主菜單和主色塊。給人以整體統(tǒng)一的感覺(jué)。至于其它色彩也可以使用，但應(yīng)當(dāng)只是作為點(diǎn)綴和襯托，絕不能喧賓奪主。一般來(lái)說(shuō)，一個(gè)網(wǎng)站的標(biāo)準(zhǔn)色彩不超過(guò)3種，太多則讓人眼花繚亂。適合于網(wǎng)頁(yè)標(biāo)準(zhǔn)色的顏色有：藍(lán)色，黃/橙色，黑/灰/白色三大系列色。 ●設(shè)計(jì)網(wǎng)站字體。和標(biāo)準(zhǔn)色彩一樣，標(biāo)準(zhǔn)字體是指用于標(biāo)志，標(biāo)題，主菜單的特有字體。一般網(wǎng)頁(yè)默認(rèn)的字體是宋體。為了體現(xiàn)站點(diǎn)的“與眾不同”和特有風(fēng)格，可以根據(jù)需要選擇一些特別字體。制作者可以根據(jù)自己網(wǎng)站所表達(dá)的內(nèi)涵，選擇更貼切的字體。需要說(shuō)明的是：使用非默認(rèn)字體只能用圖片的形式，因?yàn)楹芸赡転g覽者的計(jì)算機(jī)里沒(méi)有安裝特別字體，那么辛苦設(shè)計(jì)制作便可能付之東流了。 ●設(shè)計(jì)網(wǎng)站宣傳語(yǔ)。也可以說(shuō)是網(wǎng)站的精神、主題與中心，或者是網(wǎng)站的目標(biāo)，用一句話或者一個(gè)詞來(lái)高度概括。用富有氣勢(shì)的話或詞語(yǔ)來(lái)概括網(wǎng)站，進(jìn)行對(duì)外宣傳，可以收到比較好的結(jié)果。 要領(lǐng)五：確定網(wǎng)站風(fēng)格 “風(fēng)格”是抽象的，是指站點(diǎn)的整體形象給瀏覽者的綜合感受。這個(gè)“整體形象”包括站點(diǎn)的CI（標(biāo)志，色彩，字體，標(biāo)語(yǔ)）、版面布局、瀏覽方式、交互性、文字、語(yǔ)氣、內(nèi)容價(jià)值等等諸多因素，網(wǎng)站可以是平易近人的、生動(dòng)活潑的也可以是專(zhuān)業(yè)嚴(yán)肅的。不管是色彩、技術(shù)、文字、布局，還是交互方式，只要你能由此讓瀏覽者明確分辨出這是你網(wǎng)站獨(dú)有的，這就形成了網(wǎng)站的“風(fēng)格”。 風(fēng)格是有人性的，通過(guò)網(wǎng)站的色彩、技術(shù)、文字、布局、交互方式可以概括出一個(gè)站點(diǎn)的個(gè)性：是粗獷豪放的，還是清新秀麗的；是溫文儒雅的，還是執(zhí)著熱情的；是活潑易變的，還是墨守成規(guī)的。 總之，有風(fēng)格的網(wǎng)站與普通網(wǎng)站的區(qū)別在于：在普通網(wǎng)站上你看到的只是堆砌在一起的信息，你只能用理性的感受來(lái)描述，比如信息量多少，瀏覽速度快慢等；在有風(fēng)格的網(wǎng)站上你可以獲得除內(nèi)容之外的更感性的認(rèn)識(shí)，比如站點(diǎn)的品位，對(duì)瀏覽者的態(tài)度等。 在明確自己想給人以怎樣的印象后，要找出網(wǎng)站中最有特色的東西，就是最能體現(xiàn)網(wǎng)站風(fēng)格的東西。并以它作為網(wǎng)站的特色加以重點(diǎn)強(qiáng)化、宣傳?？傊?，風(fēng)格的形成不是一次定位的，你可以在實(shí)踐中不斷強(qiáng)化、調(diào)整、改進(jìn)。 要領(lǐng)六：有創(chuàng)意的內(nèi)容選擇 好的內(nèi)容選擇需要有好的創(chuàng)意，作為網(wǎng)頁(yè)設(shè)計(jì)制作者，最苦惱的就是沒(méi)有好的內(nèi)容創(chuàng)意。網(wǎng)絡(luò)上的最多的創(chuàng)意即是來(lái)自于虛擬同現(xiàn)實(shí)的結(jié)合。創(chuàng)意的目的是為了更好的宣傳與推廣網(wǎng)站，如果創(chuàng)意很好，卻對(duì)網(wǎng)站發(fā)展毫無(wú)意義，那么，網(wǎng)站設(shè)計(jì)制作者也應(yīng)當(dāng)放棄這個(gè)創(chuàng)意。另外，主頁(yè)內(nèi)容是網(wǎng)站的根本之所在，如果內(nèi)容空洞，即使頁(yè)面制作地再怎樣精美，仍然不會(huì)有多少用戶(hù)。從根本上說(shuō)，網(wǎng)站內(nèi)容仍然左右著網(wǎng)站流量，內(nèi)容為王（Content Is King）依然是個(gè)人網(wǎng)站成功的關(guān)鍵。 要領(lǐng)七：推廣自己的網(wǎng)站 網(wǎng)站的營(yíng)銷(xiāo)推廣在個(gè)人網(wǎng)站的運(yùn)行中也占著重要的地位，在推廣個(gè)人網(wǎng)站之前，請(qǐng)確保已經(jīng)做好了以下內(nèi)容：網(wǎng)站信息內(nèi)容豐富、準(zhǔn)確、及時(shí)；網(wǎng)站技術(shù)具有一定專(zhuān)業(yè)水準(zhǔn)，網(wǎng)站的交互性能良好。一般來(lái)說(shuō)，網(wǎng)站的推廣有以下幾種方式： （1）搜索引擎注冊(cè)與搜索目錄登錄技巧 注冊(cè)著名的搜索引擎站點(diǎn)是在技術(shù)上推廣網(wǎng)站的第一步。注冊(cè)搜索引擎有一定的技巧，像AltaVista、搜索客這樣的搜索引擎，它自動(dòng)收錄提交的網(wǎng)址。另外，注意Meta的使用，不要提交分欄Frame頁(yè)面，大部分搜索引擎不識(shí)別Frame，所以一定要提交有內(nèi)容的Main頁(yè)面。 而像Yahoo、搜狐等搜索目錄網(wǎng)站采用手工方式收錄網(wǎng)址，以保證收錄網(wǎng)站的質(zhì)量，在分類(lèi)查詢(xún)時(shí)獲得的信息相關(guān)性比搜索引擎站點(diǎn)（靠Spider自動(dòng)搜索的）更強(qiáng)。由于搜索目錄網(wǎng)站收錄網(wǎng)站的人為因素相對(duì)較多，因此在提交網(wǎng)站時(shí)要注意遵守規(guī)則。如Yahoo要求注冊(cè)站點(diǎn)描述不超過(guò)25個(gè)單詞。在此要注意：將網(wǎng)址提交到最合適的目錄下面，要認(rèn)真詳細(xì)的介紹網(wǎng)站，千萬(wàn)不要有虛假、夸張的成分。 （2）廣告交換技巧 很多個(gè)人站點(diǎn)在相互廣告交換時(shí)都提出了幾個(gè)條件：第一，訪問(wèn)量相當(dāng)；第二，首頁(yè)交換。顯而易見(jiàn)，這種做法是為了充分利用廣告交換。以很多個(gè)人網(wǎng)站的經(jīng)驗(yàn)，當(dāng)與一個(gè)個(gè)人站點(diǎn)交換鏈接時(shí)，對(duì)方把網(wǎng)站的LOGO放到了友情連接一頁(yè)，而不是首頁(yè)時(shí)，很少有訪客會(huì)來(lái)自那里。通常在首頁(yè)，廣告交換才會(huì)有很好的效果。 （3）目標(biāo)電子郵件推廣 使用電子郵件宣傳網(wǎng)址時(shí)，主要有如下技巧：可以使用免費(fèi)郵件列表來(lái)進(jìn)行，只要你申請(qǐng)了免費(fèi)郵件列表服務(wù)，你就可以利用郵件列表來(lái)推廣你的網(wǎng)站；可以通過(guò)收集的特定郵件地址，來(lái)發(fā)送信息到特定的網(wǎng)絡(luò)群體，在特定網(wǎng)絡(luò)群體中推廣自己的網(wǎng)站；發(fā)送HTML格式的郵件，即使其內(nèi)容與接收者關(guān)系不大，也不會(huì)被被當(dāng)作垃圾信件馬上刪掉，人們至少會(huì)留意一下發(fā)送者的地址。不過(guò)，在進(jìn)行郵件推廣的時(shí)候要注意網(wǎng)絡(luò)道德。 要領(lǐng)八：支撐網(wǎng)站日常運(yùn)行 當(dāng)個(gè)人網(wǎng)站做到某一程度，就必須把賺錢(qián)提到議事日程上來(lái)，通常來(lái)說(shuō)，個(gè)人網(wǎng)站獲取資金通常有以下兩個(gè)渠道： （1）銷(xiāo)售網(wǎng)站的廣告位 要銷(xiāo)售網(wǎng)站的廣告位，一般來(lái)說(shuō)，每日的流量少于1萬(wàn)人次的網(wǎng)站在目前是不會(huì)吸引廣告主的。網(wǎng)站的專(zhuān)業(yè)性及商用性，以往的廣告經(jīng)驗(yàn)，技術(shù)以及設(shè)計(jì)要求等也會(huì)影響到廣告的銷(xiāo)售。 一般來(lái)說(shuō)，WEB廣告的收費(fèi)有三種方式： ①CPM (Cost Per Million/Thousand) 放一個(gè)廣告，它按每1,000人次來(lái)訪問(wèn)站點(diǎn)收費(fèi)。這方法對(duì)網(wǎng)站經(jīng)營(yíng)者最為合適，只要有人瀏覽該網(wǎng)頁(yè)，就得錢(qián)，不管訪問(wèn)者對(duì)廣告有無(wú)反應(yīng)——是否會(huì)看或點(diǎn)擊該廣告。 ②點(diǎn)透（Click-through） 通過(guò)Banner廣告點(diǎn)到了廣告商的站點(diǎn)，這才算數(shù)，廣告商青睞這個(gè)，他只為對(duì)自己廣告感興趣的人“套錢(qián)“。網(wǎng)站經(jīng)營(yíng)者就不合適了，據(jù)一些調(diào)查資料表明，只有3%的訪問(wèn)者會(huì)去“CLICK”廣告。 ③提成 (Commission) 根據(jù)訪問(wèn)者點(diǎn)擊位于你站點(diǎn)上廣告所帶來(lái)的銷(xiāo)售收入，從中跟做廣告的廠商分成，這種方法對(duì)于網(wǎng)站的經(jīng)營(yíng)者來(lái)說(shuō)，比上面兩個(gè)都更加冒險(xiǎn)。 通常的，個(gè)人網(wǎng)站的廣告收費(fèi)方法往往是第一、第二種方法的結(jié)合，站點(diǎn)和廣告商都可少冒點(diǎn)險(xiǎn)。 （2）與大型網(wǎng)站合作 另外，通過(guò)與大型網(wǎng)站合作，獲取經(jīng)費(fèi)，也可以維持個(gè)人網(wǎng)站的日常運(yùn)行。不過(guò)，個(gè)人網(wǎng)站很容易會(huì)成為商業(yè)網(wǎng)站的附屬品。 有時(shí)間和充沛的體力，再加上對(duì)新技術(shù)和技巧的學(xué)習(xí)和應(yīng)用，你就能為自己在網(wǎng)上建一個(gè)家了 參考資料： http://zhidao.baidu.com/question/6583649.html?fr=qrl3

明細(xì)頁(yè)是具體到某個(gè)文章頁(yè)面，列表是顯示多個(gè)內(nèi)容分類(lèi)的頁(yè)面。列表頁(yè)，例如：1文章一2文章二3文章三4文章四5文章無(wú)明細(xì)頁(yè)，就是到具體的內(nèi)容。比如文章一的詳細(xì)內(nèi)容就是一個(gè)明細(xì)頁(yè)。

123456789101112131415161718192021222324<style>.content>.name{font-size:16px; color:blue}.home{font-size:18px; color:red}#address{font-size:20px; color:gray}.btn>a,.btn>input{color:green;display:block;width:120px;height:60px}.btn>a:hover,.btn>input:hover{color:yellow;} </style> <DIV class="content" style="background:url('img.jpg')"><div class="name">我叫XXX</div><div class="home">我的家鄉(xiāng)XXX</div><div id="address">我在xxxx</div><div  class="btn"><a>確定</a><input type="button" value="確定"/></div></DIV>1 

eBay的html代碼其實(shí)蠻繁瑣的特別如果是開(kāi)了店我的建議是你請(qǐng)一個(gè)專(zhuān)業(yè)的網(wǎng)頁(yè)設(shè)計(jì)師幫你弄這樣你愛(ài)怎樣都可以我是自己弄的，超級(jí)麻煩，而且還要有自己的服務(wù)器空間光是給個(gè)代碼你是不可能解決問(wèn)題的想在ebay做生意，這點(diǎn)小錢(qián)還是不能省的ebay的商店，可以很多地方都不要，只留下頭然后每個(gè)頁(yè)面都讓專(zhuān)人設(shè)計(jì)，圖片全部鏈接去自己的服務(wù)器這樣就可以做任何你想要的設(shè)計(jì)效果請(qǐng)人做吧，這200分，就算是英鎊，都不見(jiàn)的能有人幫你做的好～花錢(qián)吧

模板只別人設(shè)計(jì)制作好的html文件,也可能包括psd文件,可以直接拿過(guò)來(lái)用,修改一下,變成你自己的東西,如果是DW里的模版的話,那就是你制作好的一個(gè)html頁(yè)面,設(shè)置成模板后,可以直接在其他有相同內(nèi)容的頁(yè)面里進(jìn)行調(diào)用，這樣做的好處是,修改一個(gè)模板文件,然后所有調(diào)用過(guò)此模版的文件都可以修改過(guò)來(lái). 庫(kù)的定義一般是:資料庫(kù) 資源庫(kù) 素材庫(kù),就是你平時(shí)積累的素材,可以放到固定的,自己定義的庫(kù)里去,下次用的時(shí)候很方便的就能找到,比如你有個(gè)圖片的素材庫(kù),庫(kù)可以在軟件里進(jìn)行操作,是個(gè)單獨(dú)的文件集合.比如flash里的庫(kù),就是放一些圖片素材,元件,影片剪輯之類(lèi)的東西.

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960<!--這個(gè)模版來(lái)自[最好模版-http://BestMoban.Com],需要模版請(qǐng)?jiān)L問(wèn)http://BestMoban.Com--><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>┆假想敵┆- 頹廢模板</title><script language="JavaScript" type="text/JavaScript"><!--function MM_reloadPage(init) {  //reloads the window if Nav4 resized  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();}MM_reloadPage(true);//--></script><style type="text/css"><!--BODY {    SCROLLBAR-FACE-COLOR: #3F2413;    SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF;    SCROLLBAR-SHADOW-COLOR: #ffffff;    SCROLLBAR-3DLIGHT-COLOR: #3F2413;    SCROLLBAR-ARROW-COLOR: #FFFFFF;    SCROLLBAR-TRACK-COLOR: #3F2413;    SCROLLBAR-DARKSHADOW-COLOR: #3F2413;    background-color: #FFFFFF;    background-image: url(bg.jpg);}--></style></head> <body><div id="Layer1" style="position:absolute; width:1000px; height:628px; z-index:1; left: 0px; top: 0px;">  <div align="center">    <p> </p>    <p> </p>    <p> </p>    <p> </p>    <p><img src="1.jpg" width="650" height="400" border="0" usemap="#Map2">      <map name="Map2">        <area shape="rect" coords="321,379,490,399" >http://www.mb8.cn</a></span>