Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Htmlのタグの話

1,254 views

Published on

HTML5勉強会のセッションでお話をした内容です。HTML5に限らず、HTMLのタグについての話をしてみました。

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Htmlのタグの話

  1. 1. Tagのお話 KOUSUKE (seven) INAMOTO Generalasahi
  2. 2. Hello! • 稲本浩介(稲本せぶん) • 30 • 株式会社ゼネラルアサヒ www.generalasahi.co.jp • Webディレクター、マークアップエンジニア • IA(Information Architect) • @sevenina • sevenstyleweb.com/blog
  3. 3. Tag タグとは、荷札、付箋といった意味の英単語。 あらかじめ定められた特殊な記法により文書に埋め込む形で記述される付加情報。 地の文とは別のレベルで解釈され、付加情報を埋め込む特殊な文字列などのことをタグと言
  4. 4. <hx> 見出しであることを表す <p> 段落であることを表す <img> 画像であることを表す <ul> 順不同のリストであることを表す <ol> 順序リストであることを表す <li> リストであることを表す <a> アンカーリンクであることを表す
  5. 5. <article> 内容が単体で完結しているセクションを表す <aside> 補足的な説明を表す <nav> Webサイトのナビゲーションリンクを配置するためのセクション <section> 汎用的なセクション <hgroup> 複数の見出しをひとまとまりにする <header> セクションのヘッダ <footer> セクションのフッタ <address> article/bodyに関する問い合わせ先アドレス
  6. 6. Design HTML document
  7. 7. NO ANSWER
  8. 8. THINK
  9. 9. <article> 内容が単体で完結しているセクションを表す <aside> 補足的な説明を表す <nav> Webサイトのナビゲーションリンクを配置するためのセクション <section> 汎用的なセクション <hgroup> 複数の見出しをひとまとまりにする <header> セクションのヘッダ <footer> セクションのフッタ <address> article/bodyに関する問い合わせ先アドレス
  10. 10. Design HTML document
  11. 11. EASY!!
  12. 12. Example
  13. 13. But…
  14. 14. a piece of source
  15. 15. Multi Source Your filter Multi Use
  16. 16. THINK
  17. 17. Think about Information Architecture
  18. 18. Sample
  19. 19. <header> <h1> <nav>
  20. 20. <section> <header> <div> <section> <div>
  21. 21. <footer> <div>
  22. 22. Multi Source Your filter Multi Used

×