Placeholder Image

字幕表 動画を再生する

AI 自動生成字幕
  • (upbeat music)

    (アップビート・ミュージック)

  • - [Jen] Google's preferred methodology

    - Jen] Googleが推奨する方法論

  • for structured data is through JSON-LD.

    の構造化データには、JSON-LDを使用しています。

  • Not only is this information useful for webpages

    この情報は、ウェブページに役立つだけでなく

  • it's becoming important for home devices

    ホームデバイスの重要性が増している

  • like Alexa and Google Home.

    AlexaやGoogle Homeのように。

  • Even if you're not a JavaScript person

    JavaScriptが苦手な方でも

  • writing the JSON-LD document

    JSON-LD文書の作成

  • is a relatively straight forward thing to do.

    は、比較的簡単にできることです。

  • First of all, let's get our JSON-LD into the webpage.

    まず、JSON-LDをウェブページに取り込みましょう。

  • This form of JavaScript may be embedded

    この形式のJavaScriptは埋め込むことができます

  • in the head of your document,

    をドキュメントの先頭に追加してください。

  • or just before the slash body tag.

    またはスラッシュボディタグの直前。

  • Either is fine, but it should not be linked to a file

    どちらでも良いが、ファイルとの連動はしない方が良い

  • as you might do for other JavaScript in your document, why?

    ドキュメント内の他のJavaScriptにするのと同じように、なぜですか?

  • Because the JSON-LD is specific to this page only.

    JSON-LDはこのページだけに特化したものだからです。

  • In other words, if you have 100 pages on your website

    つまり、Webサイトに100ページある場合

  • and you want every page to have structured data

    で、すべてのページに構造化データを持たせたい場合

  • then you'd have to embed a JSON-LD script

    の場合、JSON-LDスクリプトを埋め込む必要があります。

  • on every one of those 100 pages individually.

    その100ページのひとつひとつに

  • It's not possible to have a single central JSON-LD document

    一元的なJSON-LDドキュメントを持つことはできない

  • and then link to it from other pages

    で、他のページからリンクさせる

  • as you might want to do with other JavaScript.

    他のJavaScriptと同じように。

  • The content's different on every page.

    ページごとに内容が違うんです。

  • Let's also take a quick peek at our restaurant schema

    レストランのスキーマも少し見てみましょう。

  • at schema.org.

    をschema.orgに追加しました。

  • The fastest way to get started is just to scroll

    一番手っ取り早いのは、スクロールすることです。

  • to the very bottom of this page.

    をクリックすると、このページの一番下に表示されます。

  • And let's look at example number two.

    そして、2番目の例を見てみましょう。

  • Click on the JSON-LD tab

    JSON-LDタブをクリックします

  • and this will give you some sample opening code.

    をクリックすると、オープニングのサンプルコードが表示されます。

  • So we're going to go ahead and copy this

    そこで、これをコピーしてきます。

  • mark up here as a starting point,

    は、ここを起点にマークアップしてください。

  • just go ahead and copy that.

    をコピーしてください。

  • And then we're going to paste this right here

    そして、これをここに貼り付けます。

  • into the head of the document.

    をドキュメントの頭に入れてください。

  • If you prefer to paste it

    貼り付けを希望する場合

  • just above the slash body tag, that's fine also.

    のように、bodyタグのスラッシュのすぐ上に記述してもかまいません。

  • I like the head,

    ヘッドがいいんです。

  • since this is data that's describing the document

    これは、ドキュメントを記述しているデータなので

  • just like the metatags do in this particular situation.

    この特殊な状況下でメタタグがそうであるように。

  • So obviously this is not the information for Nadia.

    だから、明らかにNadiaのための情報ではない。

  • Let's go on ahead and make some changes to this,

    このまま先に進んで、少し変更してみましょう。

  • and we can add some additional information as well.

    というように、いくつかの情報を追加することができます。

  • Note that this starts with the @context property here.

    ここでは、@contextプロパティで始まることに注意してください。

  • It's telling you it's going to go to schema.org

    schema.orgに移動することを伝えています。

  • and look for the restaurant type

    をクリックし、レストランの種類を探します。

  • in order to derive the information that's inside

    中の情報を導き出すために

  • of this piece of code.

    このコード片の

  • It'll give us a name, we'll have to type that out,

    名前が表示されるので、それを入力する必要があります。

  • Nadia's Garden Restaurant.

    ナディアズ・ガーデン・レストラン

  • We may not want to include some of these things.

    中には入れたくないものもあるかもしれません。

  • If you wanted to include a description

    説明を入れる場合は

  • you could certainly copy and paste that on in,

    をコピーして貼り付ければ、確かにそうなりますね。

  • like just to demonstrate here,

    のように、ここでデモを行います。

  • you can also get rid of things.

    また、モノを処分することもできます。

  • You can add things as well.

    物も追加することができます。

  • The order here as always is not really all that important.

    この順番はいつも通り、それほど重要ではありません。

  • I'm going to add an email,

    メールを追加する

  • just make sure that you follow the same sort of syntax

    同じような構文であることを確認してください。

  • that you see on a other lines here.

    のように、他の行に表示されます。

  • So email in quotes followed by a colon

    そのため、引用符で囲んだ後にコロンで囲んだメール

  • and then inside of that nadiasgardenrestaurant@gmail.com.

    で、その内側には[email protected]

  • And then make sure you put a comment

    そして、必ずコメントを入れてください

  • after each one of these, except for the very last one.

    は、最後の1つを除いて、それぞれの後にあります。

  • For our opening hours, we are going to have

    営業時間については

  • TU to SU, Tuesday to Sunday, and then we can have a time

    TUからSUへ、火曜日から日曜日へ、そして、時間を

  • and this will be something like 1730,

    で、これは1730といったところでしょうか。

  • to, whatever it was I said before 2200.

    に、2200年前に言ったことが何だったのか。

  • We can have a phone number, 1234567890.

    1234567890という電話番号を用意することができます。

  • And of course we have a menu,

    もちろん、メニューもありますよ。

  • this menu is got a different URL,

    このメニューは別のURLで表示されます。

  • it's Nadia's-garden.com/menu.html.

    Nadia's-garden.com/menu.html です。

  • And then there's some things that we know we are missing

    そして、自分たちに足りないとわかっているものもあります

  • because we saw when we ran our information

    というのも、私たちが情報収集に努めた結果

  • through the structured data markup tool

    構造化データマークアップツールによる

  • and the testing tool in the micro data chapter

    とマイクロデータ編にあるテストツール

  • we know that Google looks for things like serves cuisine

    Googleが料理などを検索することは知っています。

  • and that type of information as well.

    といった情報も提供しています。

  • So you can add that if you wish

    だから、あなたが望むなら、それを追加することができます

  • just remember to put a comma.

    カンマを入れるのを忘れないように。

  • And so we could say serves cuisine, American.

    そして、料理はアメリカ料理と言えるでしょう。

  • No comma after the very last one on the list of these.

    これらのリストの一番最後のものの後にカンマがない。

  • And of course this isn't a list of all the properties

    もちろん、これはすべてのプロパティをリストアップしたものではありません

  • but this is enough to get you started

    が、これだけあれば十分です。

  • with how you would go about coding your own JSON-LD file.

    を使用して、独自のJSON-LDファイルをコーディングする方法について説明します。

  • You can see the form that the syntax is taking

    構文が取っている形を見ることができます。

  • and you can see how to choose properties

    をクリックすると、プロパティを選択する方法が表示されます。

  • and values from the schema.org website.

    と schema.org ウェブサイトにある値を使用します。

  • (upbeat music)

    (アップビート・ミュージック)

(upbeat music)

(アップビート・ミュージック)

字幕と単語
AI 自動生成字幕

ワンタップで英和辞典検索 単語をクリックすると、意味が表示されます

A2 初級 日本語

HTMLチュートリアル - JSONLD文書の書き方 (HTML Tutorial - Writing a JSONLD document)

  • 0 0
    Summer に公開 2022 年 11 月 16 日
動画の中の単語