引導(dǎo)頁(yè)制作教程

來(lái)源： | 時(shí)間：2010/1/7 10:53:48 |

（一）什么是引導(dǎo)頁(yè)？

引導(dǎo)頁(yè)又稱過(guò)場(chǎng)頁(yè)，當(dāng)你在IE上輸入你論壇地址確認(rèn)后，并不是一進(jìn)去就看到論壇的首頁(yè)而是先進(jìn)入一個(gè)過(guò)渡頁(yè)面，這個(gè)過(guò)渡頁(yè)面就是引導(dǎo)頁(yè)（一個(gè)非常個(gè)性的頁(yè)面），然后在引導(dǎo)頁(yè)上再選擇點(diǎn)擊：A）進(jìn)論壇、B）論壇音樂(lè)版、C）你的BLOG 、D）你其他網(wǎng)站、E）你的QQ空間、、、、、、讓瀏覽者去選擇
（二）引導(dǎo)頁(yè)的形式及內(nèi)容：

可以是文字、圖片、FLASH等。就目前出現(xiàn)的引導(dǎo)頁(yè)來(lái)看，有三種分類(lèi)方法

第一種按引導(dǎo)頁(yè)表現(xiàn)的形式，可以分為靜止的、動(dòng)畫(huà)的和動(dòng)靜結(jié)合的三類(lèi)。靜止的頁(yè)面與動(dòng)畫(huà)的頁(yè)面各有各的特點(diǎn)，靜止的頁(yè)需要在版式上，構(gòu)圖方面多加推敲，否則就會(huì)單調(diào)，乏味。動(dòng)畫(huà)的畫(huà)面時(shí)比較多見(jiàn)的，有動(dòng)畫(huà)的引導(dǎo)頁(yè)可以更讓人產(chǎn)生興趣，加深印象，動(dòng)畫(huà)的節(jié)奏、顏色、配音等都是重要的方面，稍有不慎，就會(huì)影響引導(dǎo)頁(yè)的效果。動(dòng)靜結(jié)合的，這一類(lèi)要求設(shè)計(jì)前要有充分的、清晰的思路，動(dòng)中有靜，靜中有動(dòng)，搭配合理，才能算的上好作品。

第二種按引導(dǎo)頁(yè)表現(xiàn)的內(nèi)容來(lái)看，可以分為文字的、圖片的和文字與圖片混合的三類(lèi)。文字的多是論壇的名稱和論壇的宣傳語(yǔ)，目的在于讓瀏覽者帶著論壇的理念進(jìn)入論壇的首頁(yè)。圖片類(lèi)的引導(dǎo)頁(yè)，是比較直觀地在瀏覽者頭腦里樹(shù)立論壇的主題。一般多為與論壇相關(guān)的圖片、作品、論壇文化象征性標(biāo)識(shí)。還有一類(lèi)也是最常見(jiàn)的一類(lèi)是文字與圖片混合出現(xiàn)的，這類(lèi)是通過(guò)抽象和形象雙重刺激瀏覽者的大腦，強(qiáng)化論壇主題，傳達(dá)論壇的文化，達(dá)到加深對(duì)論壇印象的目的。

第三種按引導(dǎo)頁(yè)的發(fā)揮的作用不同可以分為不同的類(lèi)別。引導(dǎo)頁(yè)可以提示瀏覽者通過(guò)更適合的方式瀏覽網(wǎng)頁(yè)；可以讓瀏覽者產(chǎn)生興趣，增加瀏覽量；也可以作為論壇文化的形象宣傳；發(fā)布引人注目的廣告；還可以引導(dǎo)瀏覽者進(jìn)入不同的功能區(qū)。

這里是采用的是在head里最前面加代碼，讓瀏覽者一進(jìn)論壇就跳轉(zhuǎn)到引導(dǎo)頁(yè)面index.htm上去的方法來(lái)解決的。？可能有人會(huì)問(wèn)了，你這樣不是每當(dāng)回論壇本身的首頁(yè)就會(huì)讀取css代碼而跳轉(zhuǎn)到引導(dǎo)頁(yè)面index.htm上去？？？回答是肯定的，不會(huì)（如果是那樣這個(gè)代碼也就沒(méi)什么實(shí)用價(jià)值了）。

因?yàn)檫@個(gè)代碼是有條件的！即：只對(duì)每次新開(kāi)的IE做1次跳轉(zhuǎn)，以后只要還是這個(gè)IE窗口就不再做跳轉(zhuǎn)了，實(shí)際上這一切都被代碼寫(xiě)入記錄在你電腦的cookies里的（用過(guò)后此代碼你就會(huì)領(lǐng)略他的強(qiáng)悍和神秘了）完整的代碼在下面。

核心條件跳轉(zhuǎn)代碼，里面的地址自已修改（此代碼放到論壇的頭部信息處）

<script language='javascript'> function getcookie(cookiestr){var str=cookiestr + '='; var returnvalue=''; if(document.cookie.length>0) {offset=document.cookie.indexOf(str); if(offset !=-1){offset+=str.length; end=document.cookie.indexOf(';',offset); if(end==-1) end=document.cookie.length; returnvalue=unescape(document.cookie.substring(offset,end)); } }return returnvalue;} function alerter(){if(getcookie('netsh')=='') {window.open ('你的引導(dǎo)頁(yè)地址，可以是附件地址',"_top"); document.cookie='netsh=yes';}} </script> <script>alerter()</script>

復(fù)制代碼

（三）引導(dǎo)頁(yè)的基本制作舉例

現(xiàn)在告訴大家如何制作引導(dǎo)頁(yè)：

1；用軟件（Dreamweaver）編輯一個(gè)網(wǎng)頁(yè)也就是你自己的引導(dǎo)頁(yè)，可以加圖片也可以加FLASH動(dòng)畫(huà)！
注意這里編輯的圖片或者動(dòng)畫(huà)地址須是網(wǎng)絡(luò)絕對(duì)地址，因?yàn)槲覀儧](méi)有空間！在這里大家可以先用PS
把圖片處理好后上傳到自己的領(lǐng)地得到絕對(duì)地址！
2；制作好的引導(dǎo)頁(yè)保存為.html結(jié)尾的網(wǎng)頁(yè)文件上傳到自己的領(lǐng)地，在后臺(tái)帖子------附件管理----找到上傳的網(wǎng)頁(yè)
得到絕對(duì)地址
3；然后配合發(fā)給大家的代碼，把代碼中的文字改成剛才得到的網(wǎng)頁(yè)絕對(duì)地址
4；把修改好的代碼放在其他頭部里面，記得一定是其他頭部里面，我看到很多教程都是寫(xiě)的備案里面，那樣是沒(méi)有效果的
Dreamweaver是現(xiàn)在最通用的網(wǎng)頁(yè)編輯軟件！大家不會(huì)用的話可以在論壇提出

以下是我整理的幾個(gè)簡(jiǎn)單引導(dǎo)頁(yè)代碼，大家可一做個(gè)修改！修改中文字就可以了！
方法：新建記事本------把以下代碼復(fù)制進(jìn)去（不要改變代碼的位置）------修改中文變成你自己的網(wǎng)址-------然后另存為網(wǎng)頁(yè)（也就是后綴名是.HTML的文件）

1）自動(dòng)引導(dǎo)型：

特點(diǎn)：每次在點(diǎn)擊你論壇地址后進(jìn)入引導(dǎo)頁(yè)作短暫停留后隨即自動(dòng)轉(zhuǎn)入你的論壇首頁(yè)

<html>
<head>
<meta http-equiv='Refresh' content='5;URL=http://www.aiyoai.cn/'>
<TITLE>::自動(dòng)引導(dǎo)頁(yè)::</TITLE>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-color: #000000;
}
body,td,th {
font-family: Comic Sans MS;
color: #FFFFFF;
}
.style1 {color: #FF0000}
-->
</style></head>
<body>
<div align="center">
<p align="left">　
<p>　</p>
<p>　</p>
<p align="center">　<img src="http://tfcnc.151.tofor.com/xp.gif" tppabs="http://tfcnc.151.tofor.com/xp.gif" width="176" height="220" /></p>
</div>
<div align="center" class="style6">
<p class="style9"><span class="style1">論壇載入中......</span></p>
<p> </p>
</div>
</body>
</html>