在網頁設計中,圖像映射(Image Map)就是在一張圖片的不同區(qū)域建立鏈接,指向不同的URL。圖片上的區(qū)域也稱為“熱點(hotspots)”。當單擊該熱點區(qū)域時,會觸發(fā)超鏈接,并跳轉到其他網頁或網頁的某個位置。圖像地圖是一種特殊的超鏈接形式,常用來在網頁設計時圖像中設置局部區(qū)域導航。
【操作步驟】
第1步,插入圖像,然后選中圖像,打開【屬性】面板,并單擊該面板右下角的展開箭頭,顯示圖像地圖制作工具。使用【指針熱點工具】、【矩形熱點工具】、【橢圓熱點工具】和【多邊形熱點工具】可以調整和創(chuàng)建熱點區(qū)域。
?【地圖】文本框:輸入熱點區(qū)域名稱,便于引用。
?【指針熱點工具】按鈕:調整和移動熱點區(qū)域。
?【橢圓熱點工具】按鈕:在選定圖像上拖動鼠標指針可以創(chuàng)建圓形熱區(qū)。
?【矩形熱點工具】按鈕:在選定圖像上拖動鼠標指針可以創(chuàng)建矩形熱區(qū)。
?【多邊形熱點工具】按鈕:在選定圖像上,單擊選擇一個多邊形,定義一個不規(guī)則形狀的熱區(qū)。單擊【指針熱點工具】按鈕可以結束多邊形熱區(qū)定義。
第2步,在【屬性】面板的【地圖】文本框中輸入熱點區(qū)域名稱。如果一個網頁的圖像中有多個熱點區(qū)域,必須為每個圖像熱點區(qū)域起一個唯一的名稱。
第3步,選擇一個工具,根據(jù)不同部位的形狀可以選擇不同的熱區(qū)工具,這里選擇【矩形熱點工具】,在選定的圖像上拖動鼠標指針,便可創(chuàng)建出圖像熱區(qū)。第4步,熱點區(qū)域創(chuàng)建完成后,選中熱區(qū)。
?【鏈接】文本框:可輸入一個被鏈接的文件名或頁面,單擊【選擇文件】按鈕可選擇一個文件名或頁面。如果在【鏈接】文本框中輸入“#”,表示空鏈接。
?【目標】下拉列表框:要使被鏈接的文檔顯示在其他地方而不是在當前窗口或框架,可在【目標】下拉列表框中輸入窗口名或選擇一個框架名。
?【替換】文本框:在該文本框中輸入所定義熱區(qū)的提示文字。在瀏覽器中當鼠標移到該熱點區(qū)域中將顯示提示文字??稍O置不同部位的熱區(qū)顯示不同的文本。
第5步,用【矩形熱點工具】創(chuàng)建一個熱區(qū),在【替換】文本框中輸入提示文字,并設置好鏈接和目標窗口。
第6步,以相同的方法分別為各個部位創(chuàng)建熱區(qū),并輸入不同的鏈接和提示文字,保存并預覽,這時單擊不同的熱區(qū)就會跳轉到對應的頁面中。
前面幾節(jié)介紹了網頁制作時單個鏈接的建立,而在一個網站里包含著形形色色的多個鏈接,如何安排和管理這些鏈接,關系到網站能否良好地運作。
在網站中建立清晰的鏈接,既提供給瀏覽者一個良好的訪問環(huán)境,也方便網站管理人員的管理與維護。為此,要考慮到以下幾點。
1、設計一個清晰的網站結構圖
首先要定位網站的主題,如個人網站、商業(yè)網站、知識類網站和娛樂類網站等,然后再來看這個網站要包含哪些內容,需要多少網頁文件??梢援嬕粋€草圖來理清思路。
2. 首頁上的鏈接要“有去有回”
不論網站的鏈接多么豐富,都要隨時給瀏覽者回到首頁的可能,使之不會在互聯(lián)網上迷失方向。
3. 給圖像鏈接做文字說明簡單的文字說明可以讓瀏覽者了解要鏈接的目標。為圖像鏈接做說明有兩種方法。
?把文字直接做在圖像上,成為圖像的一部分。
?把文字直接寫在【屬性】面板的【替換】文本框中。
這樣當鼠標指針指向圖像時,就會出現(xiàn)文字提示。
當前文章標題:如何在網頁設計中定義圖像映射
當前URL:http://mnamateurbaseball.com/news/wzzz/3072.html
上一篇:如何在網頁設計中定義電子郵件鏈接