Webページへの画像の追加

画像を適切に表示する

ウェブサイトのHTMLにリンクしたい画像は、 FTPでアクセスするウェブサーバー上でホストされているか、ウェブホスティングサービスを使用しているかに関わらず、WebページのHTMLを送信するのと同じ場所にアップロードする必要があります。 ウェブホスティングサービスを使用している場合は、おそらくサービスによって提供されるアップロードフォームを使用します。 これらのフォームは通常、ホスティングアカウントの管理セクションにあります。

あなたのイメージをホスティングサービスにアップロードすることは、最初のステップにすぎません。 次に、タグを識別するためにHTMLにタグを追加する必要があります。

HTMLと同じディレクトリに画像をアップロードする

あなたの写真はHTMLと同じディレクトリに置かれるかもしれません。 その場合は:

  1. あなたのウェブサイトのルートに画像をアップロードします。
  2. イメージタグをHTMLに追加して、イメージをポイントします。
  3. HTMLファイルをウェブサイトのルートにアップロードします。
  4. Webブラウザでページを開いてファイルをテストします。

imageタグの形式は次のとおりです。

「lunar.jpg」という名前の月の写真をアップロードしていると仮定すると、画像タグの形式は次のようになります。

高さと幅はオプションですが推奨されます。 イメージタグは終了タグを必要としないことに注意してください。

別のドキュメントのイメージにリンクする場合は、アンカータグを使用してイメージタグを内部に入れます。

サブディレクトリへの画像のアップロード

画像を通常サブディレクトリに保存する方が一般的です。通常は画像と呼ばれます。 そのディレクトリ内の画像をポイントするには、ウェブサイトのルートとの関係を知る必要があります。

Webサイトのルートは、最後にディレクトリがないURLが表示される場所です。 たとえば、「MyWebpage.com」という名前のWebサイトの場合、ルートは次の形式になります。http://MyWebpage.com/ 最後にスラッシュがあることに注目してください。 これは、通常、ディレクトリのルートがどのように表示されるかです。 サブディレクトリには、スラッシュが含まれており、ディレクトリ構造内のどこに座っているかを示します。 MyWebpageサンプルサイトの構造は次のとおりです。

http://MyWebpage.com/ - ルートディレクトリ http://MyWebpage.com/products/ - 製品ディレクトリ http://MyWebpage.com/products/documentation/ - 製品ディレクトリ http://の下にあるドキュメントディレクトリ MyWebpage.com/images/ - imagesディレクトリ

この場合、画像ディレクトリの画像をポイントすると、次のようになります。

これはイメージへの絶対パスと呼ばれます。

表示しない画像によくある問題

あなたのウェブページに表示される画像を取得することは、最初は難しいことがあります。 最も一般的な理由の2つは、HTMLが指し示している場所に画像がアップロードされていないか、HTMLが正しく書かれていないことです。

最初に行うことは、自分のイメージをオンラインで見つけることができるかどうかを確認することです。 ほとんどのホスティングプロバイダには、画像をアップロードした場所を確認するための管理ツールがあります。 イメージのURLが正しいと思ったら、ブラウザにそのURLを入力します。 画像が表示された場合は、正しい位置にあります。

次に、HTMLがその画像を指していることを確認します。 これを行う最も簡単な方法は、テストした画像のURLをSRC属性に貼り付けることです。 ページを再アップロードしてテストします。

イメージタグのSRC属性は、 C:\またはfile:で始まるべきではありませんこれらは、あなた自身のコンピュータでWebページをテストしても動作するように見えますが、サイトにアクセスした人は誰もが壊れたイメージを見ます。 これは、C:\がハードドライブ上の場所を指しているためです。 イメージはハードドライブ上にあるため、表示すると表示されます。