|
|
7樓
樓主 |
發表于 2008-2-20 19:48:05
|
只看該作者
6．動態顯示歡迎詞 歡迎詞幾乎是每個網站必備的裝備之一，但天天看千篇一律的“歡迎光臨”之類的歡迎詞，任誰都會覺得厭煩的。所以我們要做個與眾不同的，能按具體情況具體分析的“智能型”歡迎詞^_^
具體方法：
在網頁HTML源文件的<body>和</body>之間的空白處點擊鼠標，輸入：
<Script language=”JavaScript”>
<!--
now=new Date(),hour=now.getHours()
if (hour<6){document.write("今天不上班？^_^")}
else if (hour<8){document.write("早上好！上班前記得吃早餐！^_^")}
else if (hour<12){document.write("不怕老板來檢查嗎？^_^")}
else if (hour<14){document.write("午餐吃得還好嗎？^_^")}
else if (hour<18){document.write("下午好!")}
else if (hour<22){document.write("不看電視，選擇上網是明智的！^_^")}
else if (hour<24){document.write("夜貓子,還不去睡？^_^")}
-->
</Script>
保存退出。看明白了嗎？其實原理很簡單，就是根據系統的時間，決定該用什么樣的歡迎詞，可以把時間的間隔分得更小一些，顯示的歡迎詞也可以更富有人情味。
7．解決亂碼 大陸地區和臺灣地區雖然都使用中文，但在電腦網絡上的編碼方式卻有很大的不同，前者使用的是GB2312碼（國標碼），而后者用的是BIG5碼（大五碼），兩者互相不兼容，這就使通過網絡在兩地之間交流變得很不方便，出現了亂碼的E-mail和網頁。要正確顯示兩種編碼不但要用戶的計算機安裝相關軟件，還要做相關設置，并且每次都要用手動切換，很不方便。其實，只要在網頁中加上一行代碼就至少可以避免每次手動切換的麻煩了。
具體方法：
在網頁HTML源文件的<head>和</head>之間的空白處點擊鼠標，輸入：
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
保存退出。這樣就可以強制瀏覽者用GB碼來看你的網頁，只要他的計算機安裝了相關的IE字符包就能正常顯示國標碼了。如果想顯示的是BIG5碼，只要把“gb2312”替換成“big5”就行了。
8．禁止使用鼠標右鍵
使用鼠標右鍵可以對所瀏覽的網頁做多項操作（比如保存圖片等），如果不想自己的網頁讓別人“共享”的話，可以把鼠標右鍵的功能屏蔽掉。
具體方法：
在網頁HTML源文件的<head>和</head>之間的空白處點擊鼠標，輸入：
<Script language=”JavaScript”>
<!--
function click(){
if(event.button==2){
alert(“你的鼠標功能挺多的嘛！^_^”)
}
}
document.onmousedown=click
</Script>
-->
保存退出。其中“你的鼠標功能挺多的嘛！^_^”可以替換成你想要顯示的警告信息。不過一定要把腳本加在<head>里，不然的話瀏覽者可以在網頁沒下載完前使用鼠標右鍵的。
9．自動彈出歡迎窗口 每次訪問都自動彈出歡迎窗口有可能會讓人心煩，但如果你覺得好就加上去。
具體方法：
在網頁HTML源文件的<body>標記里的空白處點擊鼠標，輸入：
onLoad= alert("你好，歡迎訪問！")
保存退出。其中“你好，歡迎訪問！”可以替換成別的歡迎詞。
10．自動彈出歡送窗口
和自動彈出歡迎窗口差不多。
具體方法：
在網頁HTML源文件的<body>標記里的空白處點擊鼠標，輸入：
onUnload= alert("再見，有時間再來啊！")
保存退出。其中“再見，有時間再來啊！”可以替換成別的歡送詞。
11．去除連接的下劃線 鏈接有下劃線是天經地義的事，但我們要改變它！
具體方法：
在網頁HTML源文件的<head>和</head>之間的空白處點擊鼠標，輸入：
<style>
a {text-decoration:none}
</style>
保存退出。其中的“none”可以替換成“underline”，就是顯示下劃線。
12．標題欄跑馬燈 網頁的垂直版面是“寸土寸金”的寶地，往往是訪客第一眼看到的內容，所以不能浪費在歡迎詞和不太重要的消息發布上，那么只好來“開發”標題欄了！^_^
具體方法：
在網頁HTML源文件的<head>和</head>之間的空白處點擊鼠標，輸入：
<Script language=”JavaScript”>
<!--
var msg = "內容豐富，經常更新，時有抽獎，敬請光臨！";
var speed = 300;
var msgud = " " + msg;
function titleScroll() {
if (msgud.length msgud = msgud.substring(1, msgud.length);
document.title = msgud.substring(0, msg.length);
window.setTimeout("titleScroll()", speed);
}
-->
</Script>
在網頁HTML源文件的<body>標記里的空白處點擊鼠標，輸入：
onload="window.setTimeout('titleScroll()', 500)"
保存退出。其中“內容豐富，經常更新，時有抽獎，敬請光臨！”就是滾動顯示的內容。
14．自動跳出別人的Frame（框架） 因為本身站點的內容太少，而把別人的網頁當成自己的，并顯示在自己網站的框架中的人還是大有人在的。如果你覺得這是對你勞動成果的不尊重，可以通過E-mail警告對方，也可以直接在自己的網頁里加一句代碼。
具體方法：
在網頁HTML源文件的<head>和</head>之間的空白處點擊鼠標，輸入：
<Script language=”JavaScript”>
<!--
if (top.location !== self.location) {
top.location=self.location;
}
-->
</Script>
保存退出。
或者在網頁HTML源文件的<head>和</head>之間的空白處點擊鼠標，輸入： <SCRIPT language="JavaScript">
<!--
if (parent.frames.length > 0) {
parent.location.href = location.href;
}
// -->
</SCRIPT>
保存退出。
15．網頁自動滾屏 在網頁HTML源文件的<head>和</head>之間的空白處點擊鼠標，輸入：
<Script language="JavaScript">
<!--
locate = 0;
function scroller()
{if (locate !=400 )
{locate++;scroll(0,locate);
clearTimeout(timer);
var timer = setTimeout("scroller()",3);timer;}
}
-->
</script>
在網頁HTML源文件的<body>標記里的空白處點擊鼠標，輸入：
onload="scroller()"
保存退出。其中“locate！=400”控制文件的長度，“setTimeout("scroller()",3);”控制滾動的速度。
16．為圖片加注釋
這不但適用于圖片，還可以針對網頁上所有的鏈接，在瀏覽者將鼠標放在圖片或鏈接上的時候自動顯示的一小段預先準備的文本，可以是對圖片本身的解釋，也可以告知鏈接通向哪兒。
具體方法：
打開網頁的HTML源文件，在<IMG>標記里加上：
alt=”image information”
保存退出。其中的“image information”替換為每個圖片的具體解釋。
如果是文字鏈接需要加注釋，在<a>標記里加上：
title=”link information”
保存退出。其中“link information”就是注釋內容。
17．顯示替代圖片
如果要顯示的圖片體積太大，可以用一個體積較小的圖片在原圖片位置先作替代性的顯示，使瀏覽者可以在先看到這些信息的同時，再等待原圖片的下載。
具體方法：
打開網頁的HTML源文件，在<IMG>標記里加上：
LOWSRC=”standin.gif”
保存退出。其中的“standin.gif”就是用來替換的圖片。
18．定義網頁的關鍵字
網頁的關鍵字（KEYWORD）是供搜索引擎（比如YAHOO、SOHU等）檢索的文字說明，搜索引擎根據用戶查找網頁時提交的搜索關鍵字和網頁所包含的關鍵字作比較，按照符合要求的程度不同而作相應的順序排列。很顯然，在網頁的關鍵字上做些文章就能明顯地改善網頁在那些著名的搜索引擎中的“地位”，從而增加網站的訪問率！所以，我總結了一部分搜索率較高的關鍵字供大家選擇使用：“性”（sex）、“音樂”（music or mp3）、“電影”（movie、film or video）、“新聞”（news）、“圖片”（picture or photo）、“明星”（star or art）、“軍事”（military）、“小說”（novel）、“交友”（friend or love）、“電腦”（computer or IT）、“招聘”（invite）…………另外關鍵字也不是一成不變的，例如去年“克林頓”（Clinton）也成了關鍵字呢！至于原因嘛~~相信我不說大家也明白^_^
記住，具體問題具體分析總是不會錯的，什么最熱門，關鍵字就用什么，但是也別編造些自己站點上沒有的“關鍵字”哦！因為即使別人上了一次當，讓你的記數器跳了一格，但他應該再也不會是你站點的訪客了！！！
其實，想用熱門的關鍵字和去騙人并沒有必然的聯系，就拿“克林頓”來說吧，你可以在使用它做關鍵字后，對你的網站也做少許的修改，真的只是“少許的修改”，因為筆者的建議是：收集、整理一些克林頓緋聞的相關報道（SINA上面有得是），做成一個專題報告就行了。這樣一來，既沒有騙人，又成功地把網友吸引來了，即使你的克林頓專題報告做得不怎么樣，但通過這個專題卻讓瀏覽者有機會看到你的站點上還有很多別的信息和資源。也就是把設立關鍵字作為一種提高訪問量的手段，建立相關專題作為橋梁，把潛在的訪客領到你的站點里來。
具體方法：
打開網頁的HTML源文件，在 標記里加上：
name=”keyword” content=”music, mp3, news, movie, photo, star”
保存退出。其中的“music, mp3, news, movie, photo, star”就是網頁的關鍵字，可以根據需要修改（可以使用中文信息），但是字母區分大小寫，長度以不超過255個字符為宜（因為即使為了面面俱到而加了上千個關鍵字，也會被搜索引擎的服務器刪除的，所以應該盡量簡潔明了，避免重復），每個關鍵字之間要用“，”分隔。
19．防止背景圖片滾動
當網頁的內容很長，需要使用滾動條來瀏覽的時候，背景圖片也會隨之滾動，好像和文字說明粘合在一起似的。這樣對于定位視線有些不良的影響，特別是色彩花哨的背景圖片，感覺則更不適。對此，我們可以將背景和文字說明相分離，浮動在瀏覽器窗口里。
具體方法：
打開網頁的HTML源文件，在標記里加上：
Bgproperties="fixed"
保存退出。
20．用wingdings字體作畫
wingdings字體可以讓普通的ASCII碼以一些簡單預定圖形的方式在瀏覽器里顯示，如果我們用Wingdings字體來替代部分圖片的話，必然將大大加快網頁的下載速度，因為只要看看HTML源文件就會知道網頁上的圖形只是一小段代碼而已。
雖然大多數的圖形都很簡單，但是還是可以起到一些作用的，比如用“*”的Wingdings字體*表示E-mail或信箱，用“（”的Wingdings字體(表示電話號碼，用“<” 的Wingdings字體<表示下載……具體應用就看大家的想象力了^_^
不過需要注意的是，IE對于Wingdings字體的支持很好，而Netscape可能會出現一些顯示上的問題。附錄部分Wingdings字體、ASCII碼和普通字體的對照表（見附錄1）。
21．網頁變換效果 只要搭配得當，這些變換效果會給訪客留下非常深刻的印象，即使是那些本來對你的站點沒興趣的訪客。特別是喜歡學習網頁制作的朋友，很可能就把你的網頁復制下來，以供學習研究之用。其實你不過是加了短短一段代碼而已^_^
網頁變換效果（Trans）共分四大類："進入網頁"（Page-Enter）、"離開網頁"（Page-Exit）、"進入站點"（Site-Enter）、"離開站點"（Site-Exit）。每一大類又分為25個小類，先用進入網頁效果來舉例說明：
進入網頁時的效果
1．混合效果 代碼如下：
<meta http-equiv="Page-Enter" content="blendTrans(Duration=1.0)">
2．盒狀收縮效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=0)">
3．盒狀放射效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=1)">
4．圓形收縮效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=2)">
5．圓形放射效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=3)">
6．向上擦除效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=4)">
7．向下擦除效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=4)">
8．向右擦除效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=6)">
9．向左擦除效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=7)">
10．垂直遮蔽效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=8)">
11．水平遮蔽效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=9)">
12．橫向棋盤式效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=10)">
13．縱向棋盤式效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=11)">
14．隨即分解效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=12)">
15．左右向中央縮進效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=13)">
16．中央向左右擴展效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=14)">
17．上下向中央縮進效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=16)">
18．中央向上下擴展效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=17)">
19．從左下抽出效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=18)">
20．從左上抽出效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=19)">
21．從右下抽出效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=20)">
22．從右上抽出效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=21)">
23．隨機水平線條效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=22)">
24．隨機垂直線條效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=22)">
25．隨機效果 代碼如下：
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1.0,Transition=23)">
現在讓我們來分析一下這些代碼，首先大家一定能看出這些代碼大多數地方很相似。事實上，雖然分類很多，但每個大類下的25個小類是分別對應相同的，并且用數字來標識，（除了混合效果 blendTrans(Duration=1.0)），所以不用對沒個大類一一舉例說明，只要把“Page-Enter”換為“Page-Exit”（離開網頁）、“Site-Enter”（進入站點）、“Site-Exit”（離開站點），就可以達到需要的效果了，同時記憶起來也比較方便。其中“Duration=1.0”可以設定每個周期的時間為多久，單位是秒（現在設置的是每周期1秒）。
需要注意的是四個大類的效果可以在一個網頁里同時設置，但每個大類只能設置一種效果。另外如果網頁是幀頁的話，也將無法顯示出效果。
22．網頁自動刷新 有時候為了讓瀏覽者看到最新的內容或是看到準備的特效等目的，而希望網頁能自動刷新。 具體方法： 打開網頁的HTML源文件，在<Head>里加上：
<Meta http-equiv=”progma” content=”no-cache”>
<Meta http-equiv=”expires” content=”wed,26 Feb 1997 10:10:10 GMT”>
保存退出。其中的“Refresh”表示要刷新網頁，“10”是延遲的秒數，“http://url”是你的網頁地址，秒數和網頁地址可以按需要更換。在更換網頁地址后還可以做到一項對于想做個網站的封面的朋友很有用的特效，就是讓網頁自動刷新，并轉到另一個網頁，既讓瀏覽者看到漂亮的網站封面，又省去了點擊才能進入站點的麻煩。
23．強制每次進入網頁都從WEB上下載
IE瀏覽器在下載完網頁后，會在本地硬盤上的臨時文件夾（Temporary Internet Files）里保存瀏覽過的網頁和圖片，以方便下次再訪問該網頁時可以從硬盤上讀取，進而加快瀏覽的速度。所以換個角度來看，想要每次進入網頁都從WEB上下載，只要使網頁不裝入訪客的硬盤就行了，或者說為網頁設定一個“過期”的日子，一旦過期就要從WEB上重新下載。
具體方法：
打開網頁的HTML源文件，在<HEAD>標記里加上：
<Meta http-equiv=”progma” content=”no-cache”>
<Meta http-equiv=”expires” content=”wed,26 Feb 1997 10:10:10 GMT”>
保存退出。其中“wed,26 Feb 1997 10:10:10 GMT”是一個已經過去的日子，把它當作過期的標準，無論是誰想要再瀏覽你的網頁都必須重新下載才行了。：P
24．利用標題欄做廣告 筆者認為最適合標題欄的工作是提示網頁自身的內容，可以讓瀏覽者一目了然，知道自己將看到什么樣的信息，以及為什么而等待。但做過站長的朋友一定知道事情并不象想象中那么簡單，因為一個稍具規模的個人站點一般都有100個以上的網頁，并會隨著時間的推移而迅速增長（當然這是針對勤奮負責的站長而言的^_^）。受到時間和精力的限制，不可能對每一個網頁都細致地總結一個標題，即使是有時間的閑人也可能會因一時的疏忽而忘了加標題。如果你用FP2000來做網頁，這時候就會在標題欄看到“new page 1”（這是FP2000自動為網頁加的標題），大大地破壞了網站的整體效果。如果做網頁用的是模版，結果可能更糟糕，貨不對板的情況會讓瀏覽者倒足胃口。
筆者也經常為這個問題而苦惱，有一次，頭被天上掉落的一重物擊中，瞬間眼前金星亂冒，伸手一抓，金星沒抓到，卻抓到一個點子：用模版做網頁前，先修改模版的標題為“歡迎光臨”之類的萬能歡迎詞，把標題欄顯示網頁內容的功能該成顯示歡迎詞。這樣一來，就不用為每個網頁分別做標題而煩惱了^_^
具體方法：
打開模版網頁的HTML源文件，把<title>和</title>之間的內容改為：
歡迎光臨XX的網站！^_^
保存退出。當然修改的內容可以挑自己喜歡的歡迎詞。 25．移動的字幕
可以動態地顯示消息，比靜止地發布更能吸引別人的眼球，一般用于簡單扼要的新聞報道、廣告用語等方面。除此之外，還有代碼簡潔明了，動態效果種類多，和無需使用JAVA的優勢，因為實現這一效果只需要加入一個HTML標識而已。
接著，我來舉些具體的實例幫助大家了解。
具體方法：
打開模版網頁的HTML源文件，把<body>和</body>之間加入：
<marquee>移動字幕的實例</marquee>
<marquee direction=”left”>從左向右移動字幕的實例</marquee>
<marquee direction=”right”>從右向左移動字幕的實例</marquee>
<marquee behavior=”slide”>一次性移動字幕的實例</marquee>
<marquee behavior=”scroll”>循環移動字幕的實例</marquee>
<marquee behavior=”alternate”>來回循環移動字幕的實例</marquee>
<marquee scrollamount=”10”>快速移動字幕的實例</marquee>
<marquee hspace=”20” vspace=”20” height=”50” width=”50%” bgcolor=”red” align=”top”>紅色背景移動字幕的實例</marquee>
保存退出。現在來解釋一下代碼的含義：
marquee是HTML的標識之一，用于實現文字的移動效果。IE4。0以上的瀏覽器才能正常顯示。
Direction設置文字移動的方向。取值為left（從左向右移動）或right（從右向左移動）。
Behavior設置文字移動的方式。取值為slide（一次性移動）、scroll（循環移動）和alternate（來回循環移動）。
Scrollamount設置文字移動的速度。
Hspace（水平空白）、vspace（垂直空白）設置文字周圍的空白區域。
Height（高度）、width（寬度）設置文字的寬度和高度。
Bgcolor設置文字的背景顏色。
只要使用搭配得當，即使是這樣一個小小的特效也能為你的網頁增色不少哦^_^
26．改變鼠標的形狀
在網頁上，鼠標平時呈箭頭形，指向鏈接時成為手形，等待網頁下載時成為沙漏形……這似乎是約定俗成的。雖然這樣的設計能使我們知道瀏覽器現在的狀態或是可以做什么，但這些好像還不能完全地滿足我們的需要。就拿鏈接來說，可以是指向一個幫助文件，也可以是向前進一頁或是向后退一頁，針對如此多的功能光靠千篇一律的手形鼠標是不能說明問題的。值得慶幸的是，CSS提供了多達13種的鼠標形狀，供我們選擇。
具體方法：
在任意一個鏈接的標識里加入：
style=”cursor:move”
保存退出。“style”是CSS的標記，“cursor:move”表示指向該鏈接時鼠標變成十字箭頭的形狀。其它還有12種不同的形狀將在附錄3里介紹。
27．消除網頁的邊距
做完一個網頁后往往會發現自己編寫的內容和網頁的邊界還保持著一些空白，主要發生在網頁的頂部和左邊，對于文字來說影響還不大，不過相對網頁的頂部的LOGO來說就顯得很難看了。但經過仔細地檢查后又沒有發現任何錯誤的HTML代碼，這是怎么一回事呢？
其實HTML的BODY標識符默認在網頁的頂部和左邊設置一些空白區域，來保持網頁的整潔，但我們不需要的時候也可以通過BODY標識把空白去掉。
具體方法：
打開網頁的HTML源文件，在標識里加上：
topmargin=”0” leftmargin=”0”
保存退出。這樣就消除了網頁的上邊界和左邊界的空白，如果需要增加留白也可以自己修改。 |
|
IP卡
狗仔卡
發表于 2008-2-20 19:43:21
QQ好友和群
QQ空間
收藏
轉播
分享
淘帖
支持
反對
分享到微信
提升卡
置頂卡
沉默卡
喧囂卡
變色卡
搶沙發
顯身卡
京公網安備 11010802025824號