今のきになるを今日はじめる

kyoayaのwebを中心にしたお勉強メモ

（6/14）html5の書き方で、実務で使えるmetaを作る1

今日やったこと マークアップ（CSS、HTML）

目的

これから、テストサイトを作るためにbaseが必要。 だけど、都度都度追加してくとマズイので、baseを最初に作ってみる。 のちのち共通化したいな。。php始めるのここからとかがいいな。

共通化を行なってhtmlの運用をスマートに！ | 株式会社アクトゼロ｜ソーシャルメディアマーケティング・訪日インバウンド施策

やったことリスト

  1. HTML5のコードの書き方の基本 | HTML5でサイトをつくろうとほんっとにはじめてのHTML5：[3] !DOCTYPE宣言をしようを読んでmetaタグのbase作ってみる
  2. Twitter Cardsを設定して自社サイト情報をツイートに出す2つの手順（OGP済みなら10分でOK） | 編集長ブログ―安田英久 | Web担当者Forumも参考にしてさらに実務ですぐ使えるレベルに作りこみ
  3. ほんっとにはじめてのHTML5：[42-1] link で外部CSSファイルの読み込み、グループ化をしようも参考にする

学んだこと

  • html5のこと
    • 宣言記述
    • metaの書き方
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>サイトのタイトル</title>
<meta name="keywords" content="Yahoo用の検索キーワード" />
<meta name="description" content="説明文" />

<meta name="viewport" content="width=device-width">//レスポンシブルするときとか


<link rel="stylesheet" type="text/css" href="xxxx.css"  />
<link rel="shortcut icon" href="img/xxx.png">
<link rel="apple-touch-icon" href="img/xxx.png">

<!-- OGP -->
<meta property="og:title" content="page_title書く" />
<meta property="og:type" content="web" />

<meta property="og:site_name" content="site_title書く" />
<meta property="og:description" content="シェア時のテキスト">
<meta property="og:url" content="シェア時のURL" />

<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@webtanforum">

<!-- Google Analytics -->
<script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
    ga('create', 'UA-#######-#', 'auto');
    ga('require', 'displayfeatures');
    ga('send', 'pageview');
</script>
 <!-- END Google Analytics -->


<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

</head>
<body>
 
//ここにサイトに表示するコンテンツ内容を記述
 
</body>
</html>