基礎篇★発行先の確保から作成、アップロードまで

VOL3.基本のページ作り・その3 ★テキスト入力と画像、ハイパーリンクの挿入

�T.テキストを入力する。...ワープロソフトで打ち込むのと同じ要領で、画面にテキストを打ち込みます。

�U.画像を挿入する位置が決まったらその部分をクリックしてカーソルを表示し、メニューの「挿入→画像→ファイルから」の順に選択するか、ショートカットをクリックすればファイル一覧が現われます。

「検索先」に挿入したい画像があるフォルダを表示します。現在表示されているフォルダを含む親フォルダに移りたい場合は、横の、上向き矢印がついたフォルダのアイコンをクリックします。この親フォルダに画像が保存されている場合は、一覧から選択すると横に挿入する画像が表示されますので、確認してOKボタン。

親フォルダ内の一覧に含まれる子フォルダに画像が保存されている場合は、目的のフォルダをダブルクリックします。その一覧から画像を選択してOKボタン。

この時「URL」という項目には、現在作っているページと同じフォルダに画像がある時は画像ファイル名のみが表示されますが、上の例のように他のフォルダにある場合は、挿入する画像が保存されいてるフォルダ名が並べて表示されています。これは「相対パス」と呼ばれ、画像を挿入しようとするページを規準として、サイト内のどこに目的の画像があるかを順を追って記述する方法です。「パス」の書き方についての詳しい決まりは、Column1. 「相対パス」と「絶対パス」をご参照下さい。

これで作成画面に画像が挿入されました。テキストを画像に回り込ませたい場合などについては、初級篇VOL2.「知っておきたい画像の基礎知識」を参照して下さい。

�V.ページ全体のレイアウトが出来上がって何ページか作ったら、今度はリンク設定をしなくてはなりません。ヴィジターがアドレスを直接入力しなくても目的のページにジャンプ出来るようにするためです。

テキストにも画像にもリンクが設定出来ますが、手順は以下の通りです。

�V-1. 画像にリンクを設定する場合...リンクを設定したい画像をクリックすると、画像を囲んで６箇所に小さい黒点が表示されます。これで画像が選択されました。この状態でメニューから「挿入→ハイパーリンク」の順にクリックするか、ショートカットの青い地球をクリックすると、「ハイパーリンクの作成」という詳細設定画面が出ます。

画像を挿入した時と同様に、「検索先」にリンク先のページや画像が保存されているフォルダを表示させ、一覧の中からジャンプ先のファイル名をクリックします。下の「URL」という項目にそのファイル名が入力されますので、確認して「OK」を押して下さい。この場合も画像の時と同じに、作成中のページとは違うフォルダにリンク先がある場合は、下の例のように「相対パス」で記述されています。「パス」の書き方についての詳しい決まりは、Column1. 「相対パス」と「絶対パス」をご参照下さい。

�V-2.テキストにリンクを設定する場合...リンクを設定したい文字の始めから終わりまでをマウスで選択してハイライト表示にします。あとは画像にリンクを付けた時と同じように「ハイパーリンクの作成」から設定して下さい。テキストにリンクを付けた場合、その文字の下にアンダーラインが引かれ、あらかじめ設定されている色に変化します。

�V-3.リンク先は通常、現在開かれているブラウザ上で次のページにジャンプしますが、新しいウィンドウを開いて表示させるようにすることもできます。「ハイパーリンクの作成」画面の下の方にある「ターゲットフレーム」というボタンを押してみましょう。この「共通のターゲット」一覧の中から「新しいウィンドウ」を選択して、「ターゲットの設定」に「_blank」と表示されたのを確認してOKボタンを押します。これでこのリンクがクリックされた時、自動的に別ウィンドウが開かれ、新しいページはそちらに表示されることになります。

とりあえずこれで基本的なページ作成が出来ることと思います。３ページに渡って解説してきましたが、何をするにしても以上の設定が基本になりますので、まず覚えてしまって下さいね。

また、ページがある程度出来て来たら、随時ブラウザで表示してみて内容を確認する習慣をつけましょう。複雑な画面になってくると、作成ソフト上では思った通りに表示されても、ブラウザで表示した時に問題が出る場合があります。可能なら最も代表的なブラウザであるIEとNetscape両方で確認できればベストです。片方で正しく表示されても、片方でとんでもない状態になっていることが少なくありません。ローカルで確認した上で発行が終わってからも、表示の確認とダウンロードに時間がかかり過ぎないかをチェックするために、オンラインで見てみることをお奨めします。この時、案外にリンクが抜けていたり、リンク先が誤まっていたり、未発行になっているページにリンクしていたりするのを発見出来ることがよくあります。

基礎篇VOL3. 基本のページ作り★その2 <<

>> 基礎篇VOL4. FTPでページを発行する