WebアニメーションはLottieがオススメ！基本の使い方完全ガイド【2020年版】
最近のウェブサイト制作では、アニメーションがますます重要になってきています。 この記事は、Lottieの使い方をまとめた基本ガイドです。Lottieの魅力はもちろん、After EffectsへのAiファイルの読み込みやアニメーション作成、プラグインを利用したJSONファイルの書き出し、Webサイトでのアニメーション表示まで一連の流れをまとめています。 Lottieを利用すれば、手軽にそして軽量に動画を貼り付けることができるので、これまでアニメーションを試したことのないひとにもオススメです。 コンテンツ目次 1. Lottie（ロッティー）って何？ 2. Lottieを利用するメリットは？ 3. Lottieアニメーション作成手順ガイド 4. After EffectsへのAiファイルの読み込み 5. After Effectsでアニメーション作成 6. Lottie JSONファイルでア
商品情報のJSON表現について考えた - 岩本隆史の日記帳（アーカイブ）
キープリストで提供するリソースのURI キープリストというWebアプリを作ろうとしています。気になる商品（Amazonで扱っているもの）を放り込んでおけるサービスです。 以前の日記では、URIの設計について考えました。それからも断続的に考えていて、現在は以下のようにしようと思っています。 リソースURI トップレベルリソースhttp://keeplist.in/ 商品検索結果リソースhttp://keeplist.in/amazonsearch?q={キーワード}&format={html または json} 商品リソースhttp://keeplist.in/Item:{ASIN}.{html または json} 本当はもっとたくさんのリソースが必要ですが、書き込み可能なWebサービスの設計は高難度なので、まずは読み取り専用部分のみ考えることにします。 さて、『Webを支える技術』で紹介さ
【完全解説】構造化データ(schema.org)はJSON-LDで書こう！ | Adlib
今回は構造化データの書き方(特にJSON-LD)について説明します。 この記事をすべて見て理解すれば必ずJSON-LDを書けるようになります。「構造化データって何？」って思われている方の為にも構造化データとは何かという説明も含め書いていきます。 「何で「JSON-LD」をオススメしてるの？」って気になる方もいると思います。 最初に言ってしまうと、JSON-LDは他の「Microdata」や「RDFa」と違い導入がかなり簡単です。 また、HTMLのソースコードも見づらく汚すことがありません。 なので僕はJSOM-LDをオススメしています。 では、さっそく見て行きましょう。 １．構造化データって何？ まず「セマンティックWeb」という概念があります。 セマンティックWebとは？ Webページおよびその中に記述された内容について、それが何を意味するかを表す情報(メタデータ)を一定の規則に従って付
JSON-LDをschema.orgで使うときの注意点とよくある質問
[対象: 上級] 2週間ほど前に、JSON-LDを用いたschema.orgの記述方法を詳しく解説しました。 この記事では、そのフォローアップを兼ねてJSON-LDの注意点といただいた質問への回答を書きます。 JSON-LDの短所 schema.orgのシンタックスとしてJSON-LDを推奨しました。 しかしJSON-LDには短所もあります。 リッチスニペット非対応 JSON-LDによるschema.orgのマークアップは今のところリッチスニペットに対応していません（イベントは対応しているかもしれない）。 これがJSON-LDの最も”痛い”デメリットかもしれません。 schema.orgを含めて構造化データのいちばんのメリットはリッチスニペットと言っても過言ではないでしょう。 今後サポートする可能性はあるけれど、今の時点では約束できないとGoogleの人からコメントをもらっています。 【U
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
