タグ

サムネイルに関するunieye51のブックマーク (4)

  • WordPressでサイズの違うアイキャッチ画像をPC用とスマホ用で出し分ける - 魔ッドアングラー

    WordPressでサイズの違うアイキャッチ画像をPC用とスマホ用で出し分ける スマホ用にメディアクエリを設定してひと息ついた頃、PageSpeed Insightsを確認してみたら「モバイル」の速度がガタ落ちしていました。記憶では80点くらいあったのに、50点になっていました。 原因は画像。特にアイキャッチに使用している「722 × 234」ピクセルの元画像が大きすぎるようです。 メディアクエリで「max-width: 100%;」にしているだけなので毎回読み込みに時間が掛かっているようです。 PageSpeed Insightsはこれを『横幅 320px にリサイズしろよ』と迫ってきます。 ご丁寧にもリサイズされた画像のダウンロードすらできます。非常に親切です。 しかしそう簡単に置き換えるわけにもいかない、PC用の画面で見ると今度は小さくなってしまうからです。 さらに考えてみれば、この

    WordPressでサイズの違うアイキャッチ画像をPC用とスマホ用で出し分ける - 魔ッドアングラー
  • hublog.biz

    This domain name registration has expired and renewal or deletion are pending. If you are the registrant and want to renew the domain name, please contact your registration service provider. 2023 著作権. 不許複製 プライバシーポリシー

    hublog.biz
  • 画像サイズを「サムネイル」「中」「大」「フルサイズ」から選択または任意のサイズを指定する

    ブロックエディタでは記事に「画像」ブロックを追加し画像ファイルをアップロードすることで記事に画像を表示することができますが、追加された画像をどのサイズで表示するのかを選択することができます。ここではブロックエディタを使っている場合に記事に追加した画像のサイズを選択する方法および任意のサイズを指定する方法について解説します。 画像のサイズを「サムネイル」「中」「大」「フルサイズ」から選択する 画像サイズの選択方法を確認するため、新しい記事を作成し「画像」ブロックを追加しました。 「アップロード」をクリックして、表示する画像ファイルを選択します。今回は画像サイズが 4800 x 3200 の画像をアップロードしました。 画像を記事のなかでどれくらいの大きさで表示するのかの設定は、サイドバーオプションの中の「画像設定」で行います。 「画像サイズ」の下にあるドロップダウンメニューをクリックすると、

    画像サイズを「サムネイル」「中」「大」「フルサイズ」から選択または任意のサイズを指定する
  • 20行で作るPHPサムネイル生成スクリプト / ウェブデザインライブラリー

    投稿日:2007年11月16日   レベル:初心者    ソフトウェア:- このチュートリアルでは私がAccidental Presidentのサイトで書いたサムネイル生成スクリプトに焦点を当てます。小さい画像を生成するのではなく、写真のセクションを切り取ってぼんやりしたスナップショットを作成します。また、サムネイルのサイズは変更が可能なので、それぞれのサイトの間でスクリプトを使用して異なるサイズのサムネイルを作成します。 Step1 : 変数を取得 Step2 : 変数を保存 Step3 : 画像をトリミング Step4 : サムネイルの調整 Step5 : 空白の画像を作成 Step6 : 微調整 Step6 : 完成

  • 1