HTML+CSS 輕鬆入門之錨...LOGIN

HTML+CSS 輕鬆入門之錨點鏈接

什麼是錨點連結

HTML中的鏈接,正確的說法應該稱作"錨點",它命名錨點連結(也叫書籤連結)常用於那些內容龐大繁瑣的網頁,透過點擊命名錨點,不僅讓我們能指向文檔,還能指向頁面裡的特定段落,更能當作"精準連結"的便利工具,讓連結對象接近焦點。方便瀏覽者查看網頁內容。類似我們閱讀書籍時的目錄頁碼或章回提示。在需要指定到頁面的特定部分時,標記錨點是最佳的方法。

如何建立錨點連結

第一步:建立命名錨定

#若要建立命名錨記,請在Dreamweaver編輯視圖中,將遊標置於需要命名錨記的地方。選擇「插入記錄」工具列,選擇「命名定錨」選項。出現命名錨記對話框。

建立命名錨記對話方塊 在「錨記名稱」文字方塊中輸入錨記的名稱。一般錨記若在網頁頂部,可輸入top;錨記名不能含有空格,且不應置於層內。

第二步:連結到命名錨記

定義了錨記 後,就可以連結到命名的錨記了。選擇要從其建立連結的文字或圖像,例如文字「返回頂部」。在屬性面板「連結」文字方塊中輸入「#錨記名稱」, 如:「#top」。如圖2所示。

連結到錨記儲存網頁後按F12鍵預覽該網頁。當在瀏覽器中點選連結文字(回到頂端)時,網頁轉向命名錨記為「top」所在的行。

PS:若要連結到其他 文件中的名為「top」的錨記,格式為:檔案絕對路徑+檔案名稱#top。錨記名稱區分大小寫。

錨點連結對SEO的作用

#錨連結是一個非常重要的概念,在網頁中增加恰當的錨鏈接,會讓所在網頁和所指向網頁的重要程度有所提升,進而影響關鍵字排名。錨連結對SEO的作用主要體現在以下幾個方面:

對錨連結所在的頁面的作用

##正常來講,頁面中增加的連結錨連結都和頁面本身有一定的關係,因此,錨文本可以做為錨連結所在的頁面的內容的評估。例如:本篇文章中含有“SEO”的鏈接,那麼,說明本篇文章和SEO有一定關係。

對錨連結所指向頁面的作用

錨連結能精確的描述所指向頁面的內容,因此,錨連結能做為對所指向頁面的評估。

錨連結對關鍵字排名的影響

錨連結對於關鍵字排名的意義在於它可以讓內容頁隨機連結在一起,讓蜘蛛可以很好的抓取更多頁面,權重也能均勻的傳遞,同時增強頁面的相關性,最終提升網站的關鍵字排名。

錨定連結與超連結差異

一、關鍵字排名的差異。

如果說到關鍵字的排名差異。我們可以透過數字舉例子來說對百度排名的差異。假設我們做了一個錨文本的連結:例如我們做的是「站長網」這個關鍵字。如果這個外鏈叫百度收錄了。假設百度給這個連結的權重我們用阿拉伯數字表示。例如是5,那麼這個外鏈對站長網這個關鍵字的排名可能分配的是4,對我們網站的其他的關鍵字排名可能分配到。

二、對反鏈的區別

我們做SEO經常關注自己網站的反向連結,一般大家都是透過雅虎反鍊和百度domain來查詢自己的網站。如果我們做了錨文本的連結。叫雅虎收錄了,這個錨文本連結就可以透過雅虎反鏈查詢到。如果這個連結叫百度收錄了,我們透過百度domain查詢不到。如果我們做了一個網址連結,叫雅虎收錄了,我們可以透過雅虎反鏈查詢到,如果叫百度收錄了,我們透過百度domain也可以查詢。所以:錨文本的連結可以增加我們網站的雅虎反鏈的數量。不能增加百度domain的數量。網址連結可以增加我們網站的雅虎反鏈的數量,也可以增加百度domain的數量。


錨點連結實例:做一個回傳頂部的實例,程式碼如下:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>锚点链接</title>
</head>
<body>

		<a name="top">我们都一样</a>

		推开窗看见星星  一直守在夜空中<br>
		心中不免多了些暖暖的感动<br>
		一闪一闪的光  努力把黑夜点亮气氛如此安详<br>
		你在我的生命中是那最闪亮的星<br>
		一直在我深夜中守护着我们的梦<br><br>
		这世界那么大我的爱只想要你懂<br>
		陪伴我孤寂旅程<br>
		你知道我的梦你知道我的痛<br>
		你知道我们感受都相同<br>
		就算有再大的风也挡不住勇敢的冲动 <br><br>



		最美的太阳

		我的世界 因为有你才会美<br>
		我的天空 因为有你不会黑<br>
		给我快乐 为我伤心流眼泪<br>
		给我宽容 让我能展翅高飞<br>
		你的话你的泪 你的笑你的美<br>
		在我眼中胜过最美的玫瑰<br>
		抱着梦 往前飞 不逃避 不后退<br>
		你是我成功路上的堡垒<br>
		给我翅膀 让我可以翱翔<br>
		给我力量 是你让我变坚强<br>
		不怕受伤 因为有你在身旁<br>
		你的笑 你的泪 是我筑梦路上最美的太阳<br><br>



		明天过后<br>
		没有星星的夜空<br> 
		没有话题能补充 <br>
		太多承诺从指缝中溜走 <br>
		不敢奢求什么 <br>
		回忆将我们扣留 <br>
		一瞬间亲吻的时候 <br>
		一切就好像轮回般朦胧 <br>
		心动渐渐的失控 <br>
		是否两个人足够捕捉爱的镜头 <br>
		闭上了眼睛记得你的笑容 <br>
		幸福的从容将灵魂都掏空 <br>
		享受一分钟的感动 <br>
		是否爱上一个人不问明天过后 <br>
		山明和水秀不比你有看头 <br>
		牵着你的手,一直走到最后 <br>
		这一刻怎么回头 <br>




		明天过后<br>
		没有星星的夜空<br> 
		没有话题能补充 <br>
		太多承诺从指缝中溜走 <br>
		不敢奢求什么 <br>
		回忆将我们扣留 <br>
		一瞬间亲吻的时候 <br>
		一切就好像轮回般朦胧 <br>
		心动渐渐的失控 <br>
		是否两个人足够捕捉爱的镜头 <br>
		闭上了眼睛记得你的笑容 <br>
		幸福的从容将灵魂都掏空 <br>
		享受一分钟的感动 <br>
		是否爱上一个人不问明天过后 <br>
		山明和水秀不比你有看头 <br>
		牵着你的手,一直走到最后 <br>
		这一刻怎么回头 <br>






		<a href="#top">顶部</a>
</body>
</html>

當我們網頁內容很多的時候,我們一直往下看頁面,透過點擊回到頂部,從而直接到頁面的頭部

下一節
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>锚点链接</title> </head> <body> <a name="top">我们都一样</a> 推开窗看见星星 一直守在夜空中<br> 心中不免多了些暖暖的感动<br> 一闪一闪的光 努力把黑夜点亮气氛如此安详<br> 你在我的生命中是那最闪亮的星<br> 一直在我深夜中守护着我们的梦<br><br> 这世界那么大我的爱只想要你懂<br> 陪伴我孤寂旅程<br> 你知道我的梦你知道我的痛<br> 你知道我们感受都相同<br> 就算有再大的风也挡不住勇敢的冲动 <br><br> 最美的太阳 我的世界 因为有你才会美<br> 我的天空 因为有你不会黑<br> 给我快乐 为我伤心流眼泪<br> 给我宽容 让我能展翅高飞<br> 你的话你的泪 你的笑你的美<br> 在我眼中胜过最美的玫瑰<br> 抱着梦 往前飞 不逃避 不后退<br> 你是我成功路上的堡垒<br> 给我翅膀 让我可以翱翔<br> 给我力量 是你让我变坚强<br> 不怕受伤 因为有你在身旁<br> 你的笑 你的泪 是我筑梦路上最美的太阳<br><br> 明天过后<br> 没有星星的夜空<br> 没有话题能补充 <br> 太多承诺从指缝中溜走 <br> 不敢奢求什么 <br> 回忆将我们扣留 <br> 一瞬间亲吻的时候 <br> 一切就好像轮回般朦胧 <br> 心动渐渐的失控 <br> 是否两个人足够捕捉爱的镜头 <br> 闭上了眼睛记得你的笑容 <br> 幸福的从容将灵魂都掏空 <br> 享受一分钟的感动 <br> 是否爱上一个人不问明天过后 <br> 山明和水秀不比你有看头 <br> 牵着你的手,一直走到最后 <br> 这一刻怎么回头 <br> 明天过后<br> 没有星星的夜空<br> 没有话题能补充 <br> 太多承诺从指缝中溜走 <br> 不敢奢求什么 <br> 回忆将我们扣留 <br> 一瞬间亲吻的时候 <br> 一切就好像轮回般朦胧 <br> 心动渐渐的失控 <br> 是否两个人足够捕捉爱的镜头 <br> 闭上了眼睛记得你的笑容 <br> 幸福的从容将灵魂都掏空 <br> 享受一分钟的感动 <br> 是否爱上一个人不问明天过后 <br> 山明和水秀不比你有看头 <br> 牵着你的手,一直走到最后 <br> 这一刻怎么回头 <br> <a href="#top">顶部</a> </body> </html>
章節課件