data属性を扱うならdatasetで楽ちん。（DOMおれおれAdvent Calendar 2015 – 17日目） | Ginpen.com
DOMおれおれAdvent Calendar 2015 – 17日目分 HTML5になって data-xxx という形の任意の属性を、あらゆるタグに書けるようになりました。属性なので getAttribute() とかで扱えるんだけど、それとは別に専用の dataset というものもあります。 var el; // => <div data-foo="123" data-sushi-type="roll" /> // 取得 console.log(el.getAttribute('data-foo')); // => "123" console.log(el.dataset.foo); // => "123" // 設定 el.dataset.foo = "Woof!"; console.log(el.getAttribute('data-foo')); // => "Woof!" //
Googleの検索結果にパンくずリストを表示させる方法！
Googleの検索結果には、通常ですと対象ページのURLが表記されますが、 Googleに対して、パンくず用の適したコーディングを行う事により、 リンク付のパンくずリストをGoogleの検索結果に表示する事が出来ます。 今回は、そんなパンくずリストの構築方法を解説します。 パンくずリストの効果 正しいパンくずリストのマークアップ 正しくマークアップされたか確認する パンくずリストの効果 Googleの検索結果では、通常ですと対象ページのURLが直接表示されます。 Googleの検索結果にパンくずリストを表示させると、単純に目立ってクリック率が上がる他、 正しいマークアップによる正しい情報をGoogleの検索エンジンに伝える事が出来るので、 SEO的にも有効です。 また、表示されたパンくずには、対象のページへのリンクも貼られますので、 検索結果から複数のページへ直接移動する事が出来、ユーザビ
構造化データを活用しよう！ - 2 つのアップデート
+1 ボタン 2 AMP 11 API 3 App Indexing 8 CAPTCHA 1 Chrome 2 First Click Free 1 Google アシスタント 1 Google ニュース 1 Google プレイス 2 Javascript 1 Lighthouse 4 Merchant Center 8 NoHacked 4 PageSpeed Insights 1 reCAPTCHA v3 1 Search Console 101 speed 1 イベント 25 ウェブマスターガイドライン 57 ウェブマスタークイズ 2 ウェブマスターツール 83 ウェブマスターフォーラム 10 オートコンプリート 1 お知らせ 69 クロールとインデックス 75 サイトクリニック 4 サイトマップ 15 しごと検索 1 スマートフォン 11 セーフブラウジング 5 セキュリティ 1
Google が Microdata による組織ロゴの意味づけに対応したそうなので
Google ウェブマスター向け公式ブログで紹介されていましたが、Microdata （schema.org） による、組織ロゴの意味づけをサポートし、組織を象徴する画像と Web サイトを関連づけることで、Google 検索結果で使用される組織ロゴの画像を指定できるようになったそうです。 ということで、実際に使用する場合のサンプルソースなど挙げてみようと思います。 組織のロゴの schema.org マークアップのサポートを開始しました ： Google ウェブマスター向け公式ブログ このたび、Google では組織のロゴについての schema.org マークアップのサポートを開始いたしました。このマークアップによって、組織を象徴する画像とサイトを結び付けることができます。ウェブマスターの皆様は、Google 検索結果で組織のロゴとして使用される画像を指定することができます。 組織のロ
組織のロゴの schema.org マークアップのサポートを開始しました
+1 ボタン 2 AMP 11 API 3 App Indexing 8 CAPTCHA 1 Chrome 2 First Click Free 1 Google アシスタント 1 Google ニュース 1 Google プレイス 2 Javascript 1 Lighthouse 4 Merchant Center 8 NoHacked 4 PageSpeed Insights 1 reCAPTCHA v3 1 Search Console 101 speed 1 イベント 25 ウェブマスターガイドライン 57 ウェブマスタークイズ 2 ウェブマスターツール 83 ウェブマスターフォーラム 10 オートコンプリート 1 お知らせ 69 クロールとインデックス 75 サイトクリニック 4 サイトマップ 15 しごと検索 1 スマートフォン 11 セーフブラウジング 5 セキュリティ 1
パンくずリスト（BreadcrumbList）のマークアップを追加する方法 | Google 検索セントラル | ドキュメント | Google for Developers
フィードバックを送信 コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 パンくずリスト（BreadcrumbList）の構造化データ ページに表示されるパンくずリストは、そのページがサイト階層内のどこに位置するかを示しており、ユーザーはサイトを効果的に理解し、移動できます。ユーザーは、パンくずリスト内の最後のパンくずから順番にさかのぼることで、サイトの階層内を 1 レベルずつ上に移動できます。 構造化データを追加する方法 構造化データは、ページに関する情報を提供し、ページ コンテンツを分類するための標準化されたデータ形式です。構造化データを初めて使用する場合は、構造化データの仕組みについてをご覧ください。 構造化データの作成、テスト、リリースの概要は次のとおりです。ウェブページに構造化データを追加するための手順ガイドについては、構造化データの Codelab
コーディングとSEOの概念が変わるかもしれない、Microdataについての概要 - kojika17
6月2日、Google、Microsoft、Yahoo!の検索大手3社が協力して、構造化データマークアップの標準化に乗り出しました。 長期的な最終目標は、幅広いフォーマットのサポートとしているようですが、まずはHTML5のMicrodataに集中するようです。 Microdataが新しいWebの歴史の礎の1つとなるかもしれません。 以前にも「MicrodataとMicroformatsの違いについて」取り上げましたが、今回は実際にMicrodataでどうなるのか、ご紹介致します。 Microdataとは何か？ マークアップ言語であるHTMLは「見出し(h1,h2,h3... )」「段落(p)」「リスト(ul,ol,li)」などの文章構造を示すことができても、「人の名前」「肩書き」「地域」などを示すことができません。 それらをHTMLでメタデータとして追加する方法のひとつとして、HTML5の
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
seo-matome.jp