網站使用iframe有幫助嗎?完整解析iframe優缺點

分享在 facebook
分享在 twitter
分享在 linkedin
分享在 email
分享在 print

iframe是常見的HTML語法,許多部落客都喜歡藉由iframe置入其他網頁內容,但近年卻越來越少人使用,究竟是為什麼呢?接下來我們將會解析iframe的完整資訊,並解釋為什麼iframe不再被網站管理者青睞的原因,讓你更瞭解iframe的優缺點。

 

iframe是什麼?

iframe即是HTML語法中的內嵌框架(inline frame),可以在一個網頁中建立獨立區域,將另一個網頁嵌入其中,使用時以<iframe>呈現。通常用在頁面中顯示社群網頁的資訊,如:

<iframe src=”http://www.xxxx.com/”>

</iframe>

常用的iframe屬性

<iframe src>:指定要嵌入的頁面網址。

<iframe height>:設定iframe區域的高度,以像素為單位。

<iframe width>:設定iframe區域的寬度,以像素為單位。

<iframe name>:設定該iframe的名稱。

<iframe sandbox>:可針對iframe內的內容增加限制,若無特別指定,則是啟用所有限制,或個別設置不同的限制條件,如以下4種常見項目:

  • <allow-forms>:允許該iframe提交表單。
  • <allow-orientation-lock>:在使用者透過行動裝置瀏覽頁面時,允許鎖定螢幕方向。
  • <popups>:允許彈跳視窗出現。
  • <allow-scripts>:允許該iframe可執行JavaScript。

iframe優點

使用iframe可以讓單一頁面擁有多樣內容,呈現來自其他網域的網頁內容,豐富網站瀏覽版面。

 

為什麼越來越少人使用iframe?解析4大iframe缺點

iframe缺點

雖然iframe可以增加網頁的豐富度,但因為以下4個缺點,使得越來越少人使用iframe。

1.增加載入速度

在頁面中使用iframe,將延阻onload事件的載入速度,佔據網頁讀取資源,使網站伺服器要額外花時間傳輸頁面內容。尤其越舊的瀏覽器,能同時加載的容量越少,建議採用JavaScript語法,動態添加iframe內容。

2.搜尋引擎演算法無法檢索

搜尋引擎在爬取網頁時,無法檢索由iframe嵌入的網頁內容,換句話說該區域將無法被搜尋引擎解讀。

3.嵌入頁面可能成為資安破口

利用iframe嵌入其他頁面內容,在無法確認他網頁面是否安全的情況下,很容易被不肖人士植入電腦病毒或木馬等惡意程式,增加資安破口。

4.影響使用者體驗

iframe嵌入的內容會擠壓本身頁面的版位,造成閱讀不易,且較少行動裝置可對應iframe內容,容易影響使用者體驗。

 

在Wordpress使用iframe,能幫助網站提升SEO表現嗎?

由於搜尋引擎的檢索機器人無法檢索iframe的內容,設置iframe其實對於網站SEO沒有實質影響,如要讓搜尋引擎訪問iframe,可以在robot.txt內設定,更新至網站後台,檢索機器人就會瞭解iframe內容來自其他頁面。

 

不使用iframe,也能讓網站呈現豐富內容|戰國策集團網站設計服務

在電子商務蓬勃發展的時代,不分大小企業都需要透過網站搶佔電商商機,而網站本身的設計與使用體驗將是影響顧客對企業的感官與信任感。戰國策集團投入網站領域已20年,以豐富的實務經驗,專業的網路技術,幫助您架設兼具視覺豐富與順暢實用的企業網站。

歡迎聯繫我們,為您製作優質網站!

Click Me