タグ

2013年5月31日のブックマーク (15件)

  • MicrodataとMicroformatsとRDFaとschema.org | kzakza

    schema.orgに興味を持ちながらも、 schema.orgが採用したmicrodataって何というレベルだったりします。実は私、MicrodataとMicroformats、RDFaをよく混同するヘタレだったりするので、自分用にちょっとまとめてみました。非常に簡易でしかも正しいのかわからないまとめであることはあらかじめに申し上げておきます。 ■Microdata HTML5で導入されたhtmlにメタデータを組み込む仕様で、以下のような感じでhtmlタグの中にitemtypeとかitempropなどの属性を埋め込んでメタデータを記述する。 <section itemscope itemtype="http://data-vocabulary.org/Person"> Hello, my name is <span itemprop="name">John Doe</span>, I a

    MicrodataとMicroformatsとRDFaとschema.org | kzakza
  • 目指すは「手で見るテレビ」、指に刺激を与え仮想形状を示す力覚提示装置や触覚ディスプレイ

    視覚に障害があると、「地図」のような2次元情報や「美術品」などの3次元情報を目から得ることができません。そういった人のために、仮想物体の形状を実物に近い感覚で伝えることができる力覚提示装置と、触れただけで図の重要な場所が分かる触覚ディスプレイを、NHKが開発しています。 展示項目16 2次元・3次元情報の触覚・力覚提示技術NHK技研公開2013 http://www.nhk.or.jp/strl/open2013/tenji/tenji16/index.html 目指すものを一言で表現すると「手で見るテレビ」 言葉では表現できない情報を触覚で伝えるものです。 まずは、「複数の刺激で仮想物体を再現する5点分布刺激型力覚提示装置」。指先の5点を刺激することで、実際に指で触れたときと同じような力覚を得られるという装置です。 従来の1点接触型の力覚提示装置はこんな感じ 装置の先に指をセットす

    目指すは「手で見るテレビ」、指に刺激を与え仮想形状を示す力覚提示装置や触覚ディスプレイ
    pink_dark
    pink_dark 2013/05/31
    温度や硬さ、質感などの情報を持たせるってことなのかな。アダルト業界がまっさきに導入しそうな気がする。
  • コーディングとSEOの概念が変わるかもしれない、Microdataについての概要 - kojika17

    6月2日、GoogleMicrosoftYahoo!の検索大手3社が協力して、構造化データマークアップの標準化に乗り出しました。 長期的な最終目標は、幅広いフォーマットのサポートとしているようですが、まずはHTML5のMicrodataに集中するようです。 Microdataが新しいWebの歴史の礎の1つとなるかもしれません。 以前にも「MicrodataとMicroformatsの違いについて」取り上げましたが、今回は実際にMicrodataでどうなるのか、ご紹介致します。 Microdataとは何か? マークアップ言語であるHTMLは「見出し(h1,h2,h3... )」「段落(p)」「リスト(ul,ol,li)」などの文章構造を示すことができても、「人の名前」「肩書き」「地域」などを示すことができません。 それらをHTMLでメタデータとして追加する方法のひとつとして、HTML5の

    コーディングとSEOの概念が変わるかもしれない、Microdataについての概要 - kojika17
  • フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か - IT戦記

    みなさん、こんにちは お元気ですか?僕は元気です。 さて 最近よく、「いいね!」ボタンや「ミクシィチェック」ボタンによって、ウェブページを紹介し合う文化が少しずつ定着してきたなーと思います。 そんな中で、今後重要になってくるんじゃないかと思われる OGP (Open Graph Protocol)と言われる仕様があります。今日はそのことについて書いてみたいと思います。 OGP? おーじーぴー??とはなんでしょうか。 OGP とは 簡単に言うと「このウェブページは何のことを書いているか」という情報を、プログラムから読める形で HTML に付加する記述方法のことです。 まあ、普通のウェブページは人間が読めばだいたい何のことが書いてあるか分かりますよね。 ですが、プログラムは人間ほど頭が良くないので、そのウェブページ内の文章だけではそのページが何のことについて書かれているページなのか正確に識別す

    フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か - IT戦記
  • タイトル

    February 07, 2013 12:12 カテゴリHTMLSNS ソーシャルネットワーク 【追記】SNSに掲載されたときはずかしくないようにOGPを設定しよう。 Posted by okappu Tweet OGPというのはThe Open Graph protocolの略でフェイスブックを始めmixiやGoogle+等のSNSとウェブページを連携させるための情報をコンピュータが読めるように記述したものです。 最近、よくサイトをみているとある、metaタグpropertyについてまとめ。 簡単にいうとfacebookなどのSNSで、サイト情報が表示する際に、 なぜ、このサイトこんな画像(サムネイル)なの? なぜ、こんな文章・説明文なの? ってことがないように、OGPを設定しておくとスマートになれるってことです。 基情報 <meta property="og:title" conte

  • これだけは知っておきたいOGP (Open Graph Protocol) | NEX.FM

    Life is too short to worry about laundryOGP (Open Graph Protocol)。 facebook、mixi、GREEなどのSNSで使われている共通の仕様のことだが、重要な役割を担っている割に、あまり知られていない。今後のソーシャル時代に備え、確実におさえておきたい事項に間違いないので紹介する。特にウェブ制作をしていたり、サイトにいいね!ボタンを設置している方には、すぐにでも導入をおすすめする。 OGPとは OGPを簡単に説明すると、「このウェブページは、こんな内容です」ということを明言するための仕様だ。 誰に明言しているかというと、それは例えばfacebookに、だ。 facebookでは、あるウェブページがいいね!された時に、 「○○さんがリンクについていいね!と言っています」 とウォール上に投稿されることになるが、これはOG

  • HTML5+RDFaについて

    このブログをHTML5に変更してみました。最近流行のFacebookのOGP(Open Graph Protocol)も設定しました。 HTML5に変更した理由は、OGP(Open Graph Protocol)を設置したときにvalidなHTMLにしたかったからなのですが、そもそもproperty属性はHTML5の属性ではなく、RDFaの仕様のようでした。勉強不足ですいません・・・。OGPを設置するにあたってHTML5にする必要はないようです。 ただしOGPを設置する場合、html要素に「xmlns:prefix」というネームスペースに対応した属性を設定する必要があります。FacebookのOGPに対応する場合は「prefix」に「og」を設定します。この設定はhtml5とかxhtmlには依存しません。 <html lang="ja" xmlns:og="http://ogp.me/ns

    HTML5+RDFaについて
  • Schema.org――SEOに役立つ構造化データの本流が決まったようだ | Moz - SEOとインバウンドマーケティングの実践情報 | Web担当者Forum

    この記事の内容はすべて筆者自身の見解であり(ありそうもないことだが、筆者が催眠状態にある場合を除く)、SEOmozの見解を反映しているとは限らない。 検索エンジンは時折、SEO業界にきまぐれな変化球を投げつけ、新しい小道具やアップデートで僕らをわくわくさせてくれる。ウェブページデザインにおける構造化データという分野にとって、6月2日もそういう日だった。 構造化データとはこの2年間引きこもり生活を送っていたのでもなければ、あちこちでリッチスニペットを目にしているはずだ。 検索結果に有用な情報が少しだけ加わることで、多くのサイトが並ぶオーガニック検索結果の中で自分のサイトの訴求力を高めてくれる。ウェブページに「構造化データ」を付加すれば、検索エンジンはそのデータを分析して、レシピ検索など多様な検索結果で利用する。 「構造化データ」というと難しそうだが、ここでいう構造化データをわかりやすく説明す

    Schema.org――SEOに役立つ構造化データの本流が決まったようだ | Moz - SEOとインバウンドマーケティングの実践情報 | Web担当者Forum
  • ちょっとしたメモ - The Web KANZAKI

    主にセマンティック・ウェブ黎明期のできごとや実験文書などについて書いたメモです。 HTML5+Microdataへの全面移行 (2012-09-21) 『セマンティックHTML/XHTML』例コードのテキストほか (2009-05-28) 『セマンティックHTML/XHTML』立ち読み用PDFの配布 (2009-05-18) 『セマンティックHTML/XHTML』予約開始 (2009-05-12) セマンティック・マーク付けようやく脱稿 (2009-04-05) FavikiとタグとDBpedia (2008-05-28) alt要素? (2008-05-21) metaprofのブロックレベル要素処理を強化 (2008-01-30) SKOSの新草案 (2008-01-29) HTML5はモジュール化しないの? (2008-01-23) SPARQLがW3C勧告に (2008-01-1

  • Microformats、RDFa、Microdataとschema.orgとリッチスニペット

    リッチスニペットや構造化データについて調べてたら、横断的に知る必要があると思ったのでそれらをまとめました。 Microformats、RDFa、Microdataからschema.org、リッチスニペットまで。 リッチスニペットや構造化データについて調べてたら、 横断的に知る必要があると思ったのでそれらをまとめました。 Microformats、RDFa、Microdataからschema.org、リッチスニペットまで。 タイトルうまくまとめられなかった… ※理解8割程度なので間違いありましたら指摘して頂けると助かります セマンティックWeb 通常のHTMLやXHTMLでは文書構造を表すことができますが、 個々の意味までは伝えることができません。 例えば以下のようなHTMLがあります。 &amp;lt;div&amp;gt; 私の名前は吉良吉影です。 &amp;lt;/div&amp;gt

    Microformats、RDFa、Microdataとschema.orgとリッチスニペット
  • セマンティック・ウェブに向かって

    セマンティック・ウェブに向かって はじめに セマンティック・ウェブ(semantic web)とは,Webの創始者ティム・バーナーズ=リー(Tim Berners-Lee)が提唱した将来型Webで,人間(だけ)でなく機械が読んで意味を理解できるようにしたものです。すでにいろいろな実現法が提案されていますが,ここではいわば漸進的に,今までのWebページに少しずつ意味的な側面を加えていく方法を考えます。 HTML5の機能を使って HTMLには最初から見出し h1,h2,… や引用 blockquote などといった意味的な要素があります。 人間にとっては,フォントを変えたり文字を大きくしたりすれば見出しであることがわかりますが,機械にそれを理解させるためには h1 のような要素が必要なのでした。 意味を表す仕組みはほかにもあります。 article HTML5で新設された <article>

  • Googleウェブマスターツールで、ブログ記事の構造化データを設定してみた :Heartlogic

    ブロガー/サイト運営者の友・Googleのウェブマスターツールにおいて、ブログ等の記事を構造化(=SEOで有利に!?)する書式が公開されていました。そこでさっそく、当ブログの記事を構造化してみました。 ウェブマスター ツール - ホーム 支援ツールを使って構造化を開始する 「構造化データ マークアップ支援ツール」にアクセスしてます。「記事」を選択し「URL」にブログのどこかの記事ページのURLを入力して、「タグ付けを開始」をクリックします。 ページが表示されたら、記事タイトル(名前)、記事の文など構造化したい範囲を選択し、右クリックして項目を選択します。 ひとまず、次の6項目を設定してみました。 名前 著者 公開日 画像 URL 記事の文 ページ上に表示されないデータについては[指定されていないタグを追加]をクリックし、適当に指定します。ひととおりタグの追加(構造化したいデータの指定)

  • ウェブマスターツールの「データハイライター」が日本語でも提供開始、イベント関連データを画面操作でタグ付けできる

    [対象: 中〜上級] Googleウェブマスターツールの「データハイライター」が日語を含む全言語で利用可能になりました。 昨年12月の公開時には英語版だけの提供でした。 データハイライターは、イベントに関するデータを実際のページを見ながら「タグ付け」できる機能です。 コンサートや演劇、スポーツなどのイベントの名称や日程、開催場所やチケット料金などの情報を簡単な操作で指定できます。 イベント情報は検索結果にリッチスニペットとして表示されることがあります(ナレッジグラフにも利用されるらしい)。 イベント関連データをGoogleに伝えるためには来ならば、イベントのための構造化マークアップ(schema.orgの例)を用いてHTMLのタグとしてソースに記述しなければなりません。 しかしデータハイライターを使えばHTMLタグを編集しなくてもウェブマスターツールからの画面操作で、ページのなかから、

    ウェブマスターツールの「データハイライター」が日本語でも提供開始、イベント関連データを画面操作でタグ付けできる
  • 「構造化データ マークアップ支援ツール」をGoogleが公開、HTMLベースでのタグ付けが可能に

    [対象: 上級] Googleは、構造化データのタグ付けを支援するために2つの機能を追加しました。 データハイライターがサポートする構造化データの追加 構造化データ マークアップ支援ツールの追加 データハイライターがサポートする構造化データの追加 データハイライターが新たに、7つのタイプのデータのタグ付けに対応しました。 これまでの「イベント」と合わせて8種類をサポートします。 記事 イベント 地域のお店やサービス レストラン 商品 ソフトウェア アプリケーション 映画 テレビ番組のエピソード こちらについては、公式アナウンスが出る前にすでにブログで取り上げています。 データハイライターが、商品やレストラン、記事などイベント以外のタグ付けをサポート開始 構造化データ マークアップ支援ツールの追加 データハイライターによるタグ付けは、ウェブサイトの構造化データのパターンをGoogleに伝えま

    「構造化データ マークアップ支援ツール」をGoogleが公開、HTMLベースでのタグ付けが可能に
  • 逆引きGoogle Apps Scriptリファレンス «

    このページは、Google Apps Script(GAS)逆引きリファレンスの目次です。 それぞれのページにはやや実用的なサンプルスクリプトと、構文、解説を掲載しています。サンプルスクリプトではただHello World!を表示するのではなく、ひと工夫加えて、少しでも実用的に、そしてGASで何ができるのか、少しでも知って頂けるように心がけています。 リファレンスページを作成している時点で正常に動作することを確認していますが、GASは日々進化しています。ひょっとすると上手く動かなくなっていることもあるかもしれません。その際はコメント欄にてお知らせ頂けましたら幸いです。その他、ツッコミ、質問、補足等お待ちしております。 Google Apps Scriptはものすごーく、強力なサービスだと思うのですが、日ではまだまだ注目されていません。このリファレンスが日での発展の一助になれば幸いです。

    pink_dark
    pink_dark 2013/05/31
    すごく分かりやすくて、使いやすい。