ウェブで公開する時に使用する画像の種類は png jpg gif のどれかです。Gimp の形式であるxcfはそのままでは使えません。png jpg gif のどれかに変換して使います。Gimpで保存し直すだけで簡単にできます。
Gimpで書いた自作の絵(yama, hana, takusan など)を開けて、jpg(jpeg)画像への変換にしたがって、jpgのファイルにします。
写真や山の絵など色がだんだん変化する部分の多い画像はjpgが適しています。文字のレイアウトやアイコンなどはpngが適しています。
画像がない場合はざっとなにか書いてください。
大きな画像は、p タグの中に画像だけをいれることにして、次のようにすればいいでしょう。
<p><img src="yama.jpg" alt="青空に遠い山と近くの並木"></p>
yama.jpg というファイル名の画像を public_html というフォルダに入れた場合です。もっと正確に言えば、編集中のhtmlファイルのある場所に yama.jpg があると指定していることになります。次のように見えるはずです。
pタグに入れていますから他のpタグの内容と左の余白が同じになります。これを変えたい場合は、class分けをして、スタイルシートで、マージンやパディング、センタリングなどを指定します。
センタリングしてみます。
body の中に、
<p class="gazou"><img src="yama.jpg" alt="青空に遠い山と近くの並木"></p>
スタイルシートには、
p.gazou { text-align: center; }
で、このようになるでしょう。
以前描いたyama.xcfなどをjpg,pngなどに変換して表示されるページを作りなさい。
必ず自分で描いた絵にすること。以前描いたyama.xcfなどがないときは、とりあえず新しく絵を書くこと。青く塗ったところに、緑の三角や丸がいくつかあるという程度でよい。
見出しや、説明など適当に加えて、仕上げてください。
「もどる」リンクも入れて、index.html にいけるようにし、index.html にも sakuhin.html にいけるリンクを加えて完成です。
余裕があれば２つ３つ自分の作品を紹介するページにしてください。
スタイルシートでセンタリングするかどうかは好きにしてかまいません。
例によって「読み取り許可の設定」が必要です。sakuhin.htmlに加えてyama.jpgにも必要ですが、両方一度にできます。
z2c2s@star00:~$ chmod go+r public_html/*z2c2s@star00:~$
<!DOCTYPE html> Doctype宣言 <html> ここからhtml <head> ここからhead部 <meta charset="utf-8"> 文字コード指定 <title>GIMP作品.. ここにtitle <style type="t... ここからstyle ここにstyleいろいろ </style> ここまでstyle </head> ここまでhead部 <body> ここからbody部 <p><a href="in... index,htmlへのリンク <h1>GIMP作品集... ここにh1要素(大見出し) ここにh2とかpとかいろいろ <p class="gazou"><img src="yama.jpg" ... ここが画像。２つ以上あってもよい ここにh2とかpとかいろいろ </body> ここまでbody部 </html> ここまでhtml