タグ

ブックマーク / www.itti.jp (3)

  • ウェブサイトにInstagramを表示させたり、投稿を連動させるベストな方法

    InstagramをウェブサイトやWordPressに表示させたり、WordPressの記事を自動的にInstagramにも投稿させる方法など、Instagramの連携方法をご紹介します。 「ホームページにインスタグラムの写真を表示したい」 「ブログを投稿すると、インスタグラムにも自動で投稿したい」 と言ったケースは多いと思います。 ホームページとインスタグラムの連動についてベストな方法をご紹介いたします。 ホームページとインスタグラムの連動させる事前確認 SEOの影響 表示する枚数やキャッシュ機能、LazyLoadなどを利用することで、素早く表示させることができます。 instagramの写真を表示させることで、ホームページの表示速度が遅くなり、SEOへの影響を気にされる方もいますが、当社の事例や、海外の事例をみても影響はありません。 ただし、サイトスピードテストには影響するため、点数が

    ウェブサイトにInstagramを表示させたり、投稿を連動させるベストな方法
  • 超軽量で使いやすいビューポート アニメーションのVanilla JavaScript

    リモートで新宿のオフィスが恋しい新人ウェブデザイナーのNNです。 Scroll Animationは超軽量のビューポートアニメーションJavaScriptです。独自のCSSアニメーションをビューポートで発火させたいだけの方にはお薦めです。 ビューポートでアニメーションするだけのVanilla JavaScriptです。 ミニマムな仕様でわずか800KBの超軽量。 gsap3を使用するまでもない、ビューポートで独自のアニメーションをさせたい人にはお薦めです。 Scroll Animation

    超軽量で使いやすいビューポート アニメーションのVanilla JavaScript
  • サクッとグリッドCSSを理解して、クライアントワークに使う

    こんにちは。イッティのデザイナーのHです。IEを非対応の場合はCSSグリッドを積極的に使うことができます。 CSSグリッドは難しくはありません。グリッドの基と、3つほどのプロパティを覚えれば使いこなすことができます。このページを読み終える頃にはCSSグリッドを使いこなす事ができているでしょう。 グリッドCSSは、グリッドの分割方法と新しい単位frを覚えることで、グリッドCSSを使いこなすことができます。 グリッドの指定方法がいくつかありますが、まずは基的な指定方法を習得しましょう。 複雑なレイアウトも可能ですが、運用の効率化も考慮してシンプルなグリッドレイアウトにすることも重要になります。 まずはグリッド線の理解 まずはグリッド線の理解から。 Y軸は「row」 X軸は「column」 です。 グリッドを指定するプロパティ グリッドを指定するプロパティや、値の記述方法はいくつか用意されて

    サクッとグリッドCSSを理解して、クライアントワークに使う
  • 1