WebサイトにSNSシェアボタンを設置する方法のまとめ - Qiita
ソーシャルシェアボタンの設置方法のまとめです。GoogleアナリティクスによるSNSボタン押下数の効果測定やFacebookでキャッシュクリアしないと正しく出なかったりする件の対処法、ogpタグなど、いくつかハマったものの解決方法も併せて記載しています。 ■ ソーシャルボタンの表示サンプル ■ シェアしたときの表示サンプル（google+の例） 1.対応しているSNS 本記事で対応しているSNSは以下です。 Facebook（※いいねボタンではなくシェアボタンです） Twitter Line Google+ はてブ 2.シェアボタンを実装する前にやること シェアボタンを実装する前に、以下の内容を検討して下さい。 メタタグやogpタグが適切に記載されているか？ → ないと魅力半減です。 GoogleアナリティクスでKPI測定するか？ → シェアボタン押された回数計測できます 2.1 メタタグ
すべてのページに"meta description"を入れる必要はあるのか、Googleが回答│SEOトレンド情報
SEOをOEMする専門企業 フリープラス > SEOトレンド情報 > “Meta description”の重複が起きるなら、入れないほうがマシ 今日の Google Webmaster Help の動画のテーマは”Meta description”です。 質問は「全てのページに Meta description を入れる必要はあるのかい？」です。 重複させるくらいなら・・・ この動画の中で、 Googleのスパムチームの Matt Cutts 氏はこう言っております。 「Meta descriptionが各ページ個別化していることはもちろんいいし、なんならMeta descriptionが重複しているよりもMeta descriptionが入っていないほうがマシだ。事実、僕（Matt Cutts 氏）のブログもMeta description入ってないしね。」 さて、それでは
SEOだけで満足できない人のためのmetaタグ情報まとめ (後編)
SEOだけで満足できない人のためのmetaタグ情報まとめ (前編) 「http-equiv編」 このエントリは上記のエントリの続きです。前回のエントリでは触れなかった、metaタグのname属性を持つものについてまとめたいと思います。metaタグの中で一番有名ともいえる、「meta name="keywords"」(キーワード)や「meta name="description"」(概要)もこちらに含まれます。 meta name (name属性)とは メタデータとはそもそも「文章の中身ではなく、HTML文章そのものについてのデータ」を記述するところです。前編のhttp-equivで出てきた「content-type」や「content-language」も「このHTMLの文字コードはUTF-8」だとか「日本語の文章である」と指定して、ユーザーエージェント*1に情報を与えているわけです。当然
METAタグリファレンス
METAタグはHTML文の<head>～</head>間に挿入し、HEADタグ要素ではサポートされない付加的情報の記載をします。META要素はプロパティとその値の指定の組み合わせで使用されます。プロパティには「http-equiv」、「name」があり、値の指定は「content」で行います。他にもプロパティ値の解釈に用いるべきスキームの名前を示す「scheme」というプロパティもありますが、あまり一般的ではありません。METAタグは幾つ入れても構いませんが、使用しなくても特に問題はありません。また、ブラウザによっては対応していないものもあります。 文字コード（MIMEタイプや文字符号化方法）を指定するときに使われます。文字コードがSJIS(シフトJIS、通常WindowsシリーズやMacintoshで使われる日本語)の場合は上記のように書きます。これを入れることにより文字化けがなくなりま
Googleスニペットを大解剖！ » SEO Japan
無料で資料をダウンロード SEOサービスのご案内 専門のコンサルタントが貴社サイトのご要望・課題整理から施策の立案を行い、検索エンジンからの流入数向上を支援いたします。 無料ダウンロードする ＞＞ グーグルの検索結果で表示されるサイトの説明文、つまりスニペットについて詳しく解説した記事。なんとなく知っているようで知らないことも意外と多い（または勉強したけど忘れた）スニペット。再確認に一読してみては？ — SEO Japan 今回は、グーグルのスニペットを、文書の日付からキーワード・イン・コンテキスト（Keywords in Context / KWIC）、省略記号、スニペット内のアンカーリンクに至るまで、すべて解剖してしまうつもりだ。 しかし、その前に、スニペットと言う用語を定義しておく。グーグルはスニペットをタイトルの後に続き、URLおよびキャッシュされたリンクを先行する「ウェブページの
スマートフォン対応でよく使うhtml、css、javascriptのまとめ
スマートフォン(ios、android)向けのウェブサイト・ウェブアプリを作る際に個人的によく使うhtml、css、javascriptの備忘録。 html関連 headタグ内での設定<!-- //デバイスサイズにあわせて表示領域を変更する --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- //電話番号のリンクを無効化 --> <meta name="format-detection" content="telephone=no"> <!-- //ホーム画面用アイコン --> <link rel="apple-touch-icon" href="icon.png"> <!-- //ホーム画面用アイコンの光沢を無効化する --> <link rel="apple-touch-icon
フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か - IT戦記
みなさん、こんにちは お元気ですか？僕は元気です。 さて 最近よく、「いいね！」ボタンや「ミクシィチェック」ボタンによって、ウェブページを紹介し合う文化が少しずつ定着してきたなーと思います。 そんな中で、今後重要になってくるんじゃないかと思われる OGP （Open Graph Protocol）と言われる仕様があります。今日はそのことについて書いてみたいと思います。 OGP? おーじーぴー？？とはなんでしょうか。 OGP とは 簡単に言うと「このウェブページは何のことを書いているか」という情報を、プログラムから読める形で HTML に付加する記述方法のことです。 まあ、普通のウェブページは人間が読めばだいたい何のことが書いてあるか分かりますよね。 ですが、プログラムは人間ほど頭が良くないので、そのウェブページ内の文章だけではそのページが何のことについて書かれているページなのか正確に識別す
今更正規化タグ（rel="canonical"）についてまとめてみた | ヘヴィメタルSEO
2011年7月20日2016年3月20日 対策ページ以外が上昇してくる対応策として話題に上がっていたので、 復習がてらまとめてみました。 そもそも正規化タグとは？ 重複コンテンツを防ぐという用途で旧ヤフー、グーグル、そしてMSNが2009年から サポートし始めたタグです。 旧ヤフーにおいてはものの見事に無視され、正規化崩れをおこして、 ほぼ役にたっていなかったわけですが… <link rel="canonical" href="http://www.example.com/" /> ■用途 a) 重複コンテンツの防止 b) 重複URLの防止 www.有り無し、index.html有り無しの統一 c) パージネーション？ページネーション？ ひとまとまりのコンテンツが複数のページにまたがった際に利用 下記Googleが推奨する方法のようです。 全部のコンテンツが載ったページを作成し、パージネー
意外に知らない、robots meta タグの7つの正しい使い方
[レベル：初級] 今日は、検索エンジンのロボットの動きを制御する「robots meta タグ」の記述の仕方について説明します。 robots meta タグにはいくつか種類がありますが、一般的によく使われる、noindex・nofollow・noarchiveの3つのrobots meta タグに関しては以前に詳しく説明しています。 十分に理解していないと思えば、併せて読んでください。 ちなみに日本のYahoo!では、noydir の robots meta タグはサポートが終了しています。 なお原則的にGooglebotを対象にした話なので、他の検索エンジンのロボットでは違う動きをするかもしれません。 1. 複数の属性値はまとめられる 属性値が複数あるときは、ひとまとめにできます。 <meta name="robots" content="noindex" /> <meta name=
コピペできるDOCTYPE宣言とエトセトラ @ WWWPArtisan
Web制作で主に使用されるHTML4.01、XHTML1.0、XHTML1.1、HTML5の(XML宣言と)DOCTYPE宣言、head要素内の各要素をまとめてコピペできるようまとめました。 HTML 4.01 Strict DTD <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Language" content="ja"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Style-Type" content="tex
meta要素について
meta要素とは、ウェブページの性質や管理情報などのウェブページ自体の情報であるメタデータを指定するための要素だ。meta要素の属性では、メタデータのプロパティ名、値、形式などを指定できる。著作者やキーワードなどをメタデータのプロパティ名として、プロパティ名に対する実際の情報を値に記述する。これらの情報はもちろんbody要素の内容としても書けるが、それでは閲覧者は理解できてもユーザーエージェントは理解できない。meta要素は、ブラウザやロボットなどのユーザーエージェント自身も理解できる形で様々な情報を提供したり、その動作を指示したりできる要素なわけだ。といっても、積極的に利用されてるメタデータってのはそんなにないけどな。 meta要素の属性 下記以外に、汎用属性のlang属性とdir属性が使用可能だが使うことはまずないでしょう。 name="メタデータのプロパティ名"name属性には、au
メタタグmeta要素 :検索エンジン最適化で順位アップ ::SEO塾(情報サイト)
メタタグキーワード キーワードタグは、Googleでは重要ではないが、Yahoo!ではインデックスされている。 キーワードタグでは、5つほどキーワードを記述しておく。 <meta name="keywords" content="キーワードA,キーワードB,キーワードC,キーワードD,キーワードE"> メタタグrobots 以下の記述で、OKはインデックス可、NOはインデックス不可。 <meta name="robots" content="index,follow"> このページはOK このページからのリンク先ページもOK 同じ効果：<meta name="robots" content="all"> <meta name="robots" content="index,nofollow"> このページはOK このページからのリンク先ページはNO <meta name="rob
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
