在 twitter bootstrap裡面有一種元件類別叫做 media object,其樣式就是一個圖像在左邊,而相對應的文字敘述在右邊。這種樣式真的現在到處在哪邊都用的到,當然若使用一些框架,單純直接遵照規定使用撰寫即可,但是如果沒有使用框架,為了之後好維護我把我自己訂的一個樣板分享出來給大家。
Source Code: https://github.com/kvzhuang/public_html/blob/master/2013/media-object.html
相信有更好的做法,也很歡迎各位給予意見指教。
星期二, 6月 18, 2013
星期三, 6月 12, 2013
[html] difference between alt and title
最近在幫人上課,有人提到, alt以及 title的差別,我稍微整理了一下。
根據 W3C recommendation "alt"代表著 alternate text 當使用者的圖檔(img tag)如果無法讀取時,替代性會呈現的文字;或是表單輸入( input type="image"),以及 applet無法讀取時的替代文字。"alt" 在 W3C Markup Validation 是必要存在的屬性(感謝 Kuro Hsu補述)。
而 title則比較是提供提示型的資訊。例如游標移上去的提示訊息。
以 google search的 googlebot會比較以 "alt" 作為 SEO的搜索的資料。所以如果有想要被 Search Engine搜尋到的話,可以稍微注意一下 "alt" 屬性後面帶的值。
下方是測試 SEO的實驗內容而已,大家可以忽略。
http://lab.kvzhuang.net/test/2013/seo-test1.html http://lab.kvzhuang.net/test/2013/seo-test2.html
根據 W3C recommendation "alt"代表著 alternate text 當使用者的圖檔(img tag)如果無法讀取時,替代性會呈現的文字;或是表單輸入( input type="image"),以及 applet無法讀取時的替代文字。"alt" 在 W3C Markup Validation 是必要存在的屬性(感謝 Kuro Hsu補述)。
而 title則比較是提供提示型的資訊。例如游標移上去的提示訊息。
以 google search的 googlebot會比較以 "alt" 作為 SEO的搜索的資料。所以如果有想要被 Search Engine搜尋到的話,可以稍微注意一下 "alt" 屬性後面帶的值。
下方是測試 SEO的實驗內容而已,大家可以忽略。
http://lab.kvzhuang.net/test/2013/seo-test1.html http://lab.kvzhuang.net/test/2013/seo-test2.html
訂閱:
文章 (Atom)