サイト構築・運営

031記事に掲載する画像の管理

2024.01.07

この記事で解決出来る課題は、

  • 表示される画像の表示速度が遅い
  • サイト全体が重い
  • 画像の管理が出来ない

企業の公式サイトやウェブページを制作している時に画像を使用することは少なくないと思います。

ウェブページ内に画像を入れる時、最近はWordPress(ワードプレス)などで作られているウェブサイトが増えてきたので、WordPress(ワードプレス)内にそのまま画像をアップロードすることも少なくないと思います。

ただ、この方法だと掲載する画像の枚数が増えてきた時に、画像の表示速度が遅くなったり、サイト全体が重くなったりします。

この記事では、それらの課題を解決する方法をお伝えします。

ページに掲載する画像だけ別の場所に格納して表示させる

下記のようにページに掲載する画像をどこかのウェブアルバムなどにまとめておき、そこから画像を一枚ずつウェブページ内にリンクを貼って表示させるという方法です。

ここでのウェブページで表示されている画像は、WordPress(ワードプレス)などのサイト管理システム内に保存されているものではなく、どこかのウェブアルバムなどに保存されている画像のリンクを持ってきて表示させているというわけです。

1Googleにログイン

ここでは、Googleフォトというウェブアルバムを使って、ウェブページに画像をリンクで表示させる方法を解説します。まず、Googleにログインします。

ログインするGoogleアカウントは普段使っているGoogleアカウントで良いのですが、画像を置いていくことで容量を消費するため、新たにGoogleアカウントを作成されるのがお勧めです。

普段、インターネットを見る時やウェブページを更新する時にGoogleChromeを使っている人は、Firefoxなど別のブラウザを使ってGoogleアカウントにログインして、作業を進めることをお勧めします。ちなみにここでは、Firefoxを使って進めています。

2Googleフォトを開く

Googleアカウントにログイン出来たら、次はGoogleフォトを開きます。

3アルバムを作成

Googleフォトを開いたら最初に新規の〝アルバムを作成〟します。

4アルバム名を付ける

ご自身が分かって、後々アルバムが増えていった時に識別しやすく、分かりやすい〝アルバム名〟を付けます。アルバム名には作成した日付を入れるのがお勧めです。

5〝写真を追加〟からフォルダを選択

続いて、作成したウェブアルバムの中に、ウェブページで掲載する画像を入れていきます。アルバムは空ですという記載の下にある〝写真を追加〟をクリックして、掲載する画像が入っている(パソコンの)フォルダを選択します。

なお、ここではウェブページに掲載する画像はパソコンの中にあるという前提でお話を進めていきます。

6画像を選択

ウェブページで掲載する画像を全て選択して、〝開く〟をクリックします。

7ウェブアルバムに画像がアップロードされる

作成したウェブアルバムに画像がアップロードされていくのをしばらく待ちます。

8アルバムをシェア

作成したウェブアルバムに掲載する全ての画像がアップロードされたら、〝アルバムをシェア〟するために共有アイコンをクリックします。

ここでは、作成したアルバムの共有設定を行っています。

9リンクを作成を選択

アルバムの共有設定画面が開いたら、〝リンクを作成〟をクリックします。

10共有リンクを作成

共有リンクの作成が開くので、〝リンクを作成〟をクリックします。

11作成された共有リンクをコピー

作成された共有リンクをコピーします。

12新規プライベートウインドウを開く

〝プライベートウインドウ〟というのは、ウィンドウを閉じるとインターネットの閲覧履歴、フォームデータ、Cookie、サイトデータが保存されないようになっている仕組みです。

Firefoxの場合は、画面向かって右上のハンバーガーアイコンをクリックして表示されたメニューの中にあります。

13共有リンクのURLを貼り付ける

プライベートウインドウが開いたら、先程コピーしておいたウェブアルバムの共有リンクをアドレスバーに貼り付けます。

14ウェブアルバムが開く

アドレスバーにウェブアルバムの共有リンクを貼り付けたら、エンターキーを押してウェブアルバムを開きます。

これで、ウェブページに掲載する画像の準備が出来ました。

このまま、ウェブページの編集に入る場合はプライベートウインドウでウェブアルバムを開いた状態にしておきます。

この工程で気をつけることは、共有アルバムのリンクを取得した後にプライベートウインドウではなく、通常のウインドウ、例えばご自身のGoogleアカウントでログインしているウィンドウで共有アルバムを開いても、共有アルバムは開きますがそれだと、後に画像リンクを取得してウェブページに貼り付けた時にしばらくは画像が表示されますが、時間が経つと画像が表示されなくなるのでご注意ください。

-サイト構築・運営