Web ページの作成

 

このセクションの内容:

新規ページを作成する

適切な編集モードを選択する

作成した新規ページを保存してブラウズする

 

新規ページを作成する

Netscape Composer は、Web ページの作成と編集ができる HTML(HyperText マークアップ言語)エディタです。 Composer は、WYS/WIG(What You See Is What You Get)エディタであるため、ページがどのように読者の目に映るかを確認しながら作成を進めることができます。基本的な HTML 機能はほとんどツールバーやメニューからコマンドとして使用できるため、HTML についての知識は必ずしも必要ありません。

Web ページを作成するには、下記の方法のうちの 1 つを使用します。ページを開始した後、ワード プロセッサと同じようにテキストを追加したり編集したりすることができます。

新規ページを作成するには:

Navigator で現在表示しているページを編集するには:

ローカル ドライブに保存された HTMLファイルから開始するには:

  1. [タスク]メニューから[Composer]を選択します。
  2. [ファイル]メニューから[ファイルを開く]を選択します。
  3. ハード ドライブから使用するファイルを選択します。
  4. [開く]をクリックします。そのファイルが Composer ウィンドウ上で開きます。

Web ページを編集するには:

  1. [ファイル]メニューから[Web の場所を開く]を選択します。
  2. [Web の場所を開く]ダイアログ ボックスにページの URL(例:www.netscape.com)を入力し、ドロップダウン リストから[新しい Composer]を選択します。
  3. [開く]をクリックします。指定したページが Composer ウィンドウ上で開きます。 注記:このページはハード ドライブにしか保存できません。

ヒント:Composer ウィンドウで最近使用したファイルをすばやく開くには、[ファイル]メニューから[最近のページ]を選択し、リストから使用したいファイルを選択します。

このセクションの最初に戻る

 

適切な編集モードを選択する

Composer には 4 つの編集モードがあり、ビュー間ですばやく切り替えることができます。各編集モードでページ中の作業は継続できますが、HTML タグ(および タグ アイコン)の表示レベルは異なります。

編集モードを選択する前に:

編集モード ツールバーには以下の 4 つのタブがあります。

注記:JavaScript 関数、フレーム、および GIF アニメーション ファイルは、どの編集モードでも有効にはなりません。

このセクションの最初に戻る

 

作成した新規ページを保存してブラウズする

新規ページを HTML ファイルとしてローカル ドライブに保存するには:

ヒント:作業中のドキュメントを最後に保存した状態に戻すには、[ファイル]メニューから[最後に保存したバージョンに戻る]を選択します。この際、ドキュメントを最後に保存した後に加えた変更は失われるので注意してください。

リンクのテストのためにページを Navigator(ブラウザ)ウィンドウで表示するには:

このセクションの最初に戻る

 


Web ページの書式設定

 

このセクションの内容:

段落、見出し、箇条書きの書式を設定する

文字列の色、スタイル、フォントを変更する

ページ中のテキストを検索する

横罫線を挿入する

特殊な文字や記号を挿入する

HTML エレメントと属性を挿入する

スペルをチェックする

 

段落、見出し、箇条書きの書式を設定する

段落に書式を設定するには:

  1. 書式設定を開始する場所にポインタを置いてクリックするか、書式設定する段落を選択してハイライト表示します。
  2. [書式]メニューから[段落]を選択します。
  3. 以下の書式のうちの 1 つを選択します。

見出し書式を設定するには:

  1. 書式設定を開始する場所にポインタを置いてクリックするか、または書式設定するテキストを選択してハイライトします。
  2. [書式]メニューから[段落]を選択します。
  3. 使用する見出しレベル(大きい方から 1〜6)を選択します。たとえば、大見出しには「見出し 1」、次のレベルには「見出し 2」のように選択します。

箇条書き書式を設定するには:

  1. 書式設定するテキストを選択してハイライトします。
  2. [書式]メニューから[箇条書き]を選択します。
  3. 以下の箇条書きスタイルから選択します。

ヒント:箇条書きスタイルをテキストにすばやく適用するには、ツールバーの[番号付き箇条書き]ボタンまたは[行頭文字付き箇条書き]ボタンを使用します。

行頭文字または番号のスタイルを変更するには:

  1. 変更したい箇条書き項目のテキスト中にポインタを置いてクリックします。 箇条書き全体を変更したい場合には、箇条書き全体を選択します。
  2. [書式]メニューから[リストのプロパティ]を選択します。
  3. ポップアップ メニューから行頭文字付きスタイルまたは番号付きスタイルを選択します。番号付き箇条書きの場合には、開始番号を指定します。 行頭文字付き箇条書きの場合には、行頭文字のスタイルを指定します。

ページ中の段落またはテキストを揃える(例:中央揃え、左寄せ、右寄せなど)には:

  1. 揃える段落またはテキストの行中にポインタを置きます。
  2. [書式]メニューから[配置]を選択し、配置オプションを選択します。 または、書式ツールバーから配置オプションを選択します。

このセクションの最初に戻る

 

文字列の色、スタイル、フォントを変更する

選択したテキストのスタイル、色、フォントを変更するには:

  1. 書式設定するテキストを選択してハイライトします。
  2. [書式]メニューを開き、以下のうちの 1 つを選択します。

また、ページの背景色を変更することも、背景として画像を使用することもできます。ページの配色と背景を設定するを参照してください。

ヒント:選択したテキストからすべての書式を素早く削除するには、[書式]メニューから[テキスト スタイルの使用中止]を選択します。

このセクションの最初に戻る

 

ページ中のテキストを検索する

現在作業しているページ中のテキストを検索するには:

  1. [編集]メニューから[検索]を選択します。
  2. [このページを検索]ダイアログ ボックスに検索したい文字列を入力します。検索範囲を狭めるには、以下のオプションのうちの 1 つまたは複数を選択します。
  3. 検索を開始するには[検索]をクリックします。最初の一致が発見された後で次の一致を検索するには、[編集]メニューから[次を検索]を選択します。

このセクションの最初に戻る

 

横罫線を挿入する

ページに横罫線(水平線)を挿入するには:

  1. 線を表示したい場所にポインタを置きます。
  2. ツールバーの[横罫線]ボタンをクリックするか、または[挿入]メニューから[横罫線]を選択します。

横罫線のプロパティを設定する

横罫線の高さ、長さ、幅、配置、影をカスタマイズできます。

  1. 横罫線をダブルクリックして選択します。
  2. [書式]メニューから[罫線のプロパティ]を選択します。
  3. 以下のプロパティを編集します。
  4. これらの設定を横罫線に対する標準の設定として使用するには、[標準設定として使用]をクリックします。

このセクションの最初に戻る

 

特殊な文字や記号を挿入する

記号やアクセント記号付きの文字を挿入するには:

  1. 特殊な文字または記号を表示する場所にポインタを置きます。
  2. [挿入]メニューから[文字と記号]を選択します。
  3. 文字のカテゴリを選択します。
  4. [大文字アクセント]または[小文字アクセント]を選択し、[英文字]ポップアップ メニューからアクセント記号を適用する文字を選択します(注記:すべての文字にアクセント付きの形式があるわけではありません)。
  5. [文字]プルダウン メニューから挿入する文字を選択します。
  6. [挿入]をクリックして閉じます。

このセクションの最初に戻る

 

HTML エレメントと属性を挿入する

HTML ソース コードに精通している場合には、ページに追加のタグ、スタイル属性、JavaScript を挿入できます。HTML コードを使用する場合には、以下の方法のうちの 1 つを使用します。

このセクションの最初に戻る

詳細プロパティ エディタを使用する

属性や JavaScript を表、画像、横罫線などのオブジェクトに加えるには、[詳細プロパティ エディタ]ダイアログ ボックスを使用します。

詳細プロパティ エディタを使用するには:

  1. 修正するオブジェクトを選択し、その[プロパティ]ダイアログ ボックスを開きます。たとえば、横罫線を修正する場合には、横罫線をダブルクリックして選択するか、横罫線を選択してから[書式]メニューから[罫線のプロパティ]を選択します。
  2. [プロパティ]ダイアログ ボックスで[詳細編集]をクリックします。 [詳細プロパティ エディタ]ダイアログ ボックスには、以下の 3 つのタブがあり、各タブには選択したオブジェクトの現在のプロパティが表示されます。
  3. 現在一覧表示されているプロパティまたは属性を変更するには、その名前をクリックし、フィールドに新しい値を入力します。
  4. プロパティを追加するには、[名前]を入力し、新しい値を入力して[追加]をクリックします。
  5. [OK]をクリックして変更を適用し、再度[OK]をクリックして[プロパティ]ダイアログ ボックスを閉じます。

HTML を囲む左かっこ < と右かっこ >、および属性テキストを囲む引用符は自動的に挿入されます。

注意: Composer は入力した属性の妥当性はチェックしません。値を追加、削除、変更する前に、必ずその規則にを完全に理解しておくようにしてください。

このセクションの最初に戻る

 

スペルをチェックする

ページ内のスペルをチェックするには:

  1. ページ中にポインタを置きます。
  2. ツールバーの[スペル]ボタンをクリックするか、または[編集]メニューから[スペル チェック]を選択します。
  3. [スペルチェック]ダイアログ ボックスを使用して、スペルの誤りを訂正したり、現在の辞書の単語を編集したり、単語を追加することができます。作業終了後[閉じる]をクリックします。

このセクションの最初に戻る

 


Web ページへの表の追加

 

このセクションの内容:

表を挿入する

表のプロパティを変更する

行、列、セルを追加/削除する

表内を移動する

表を移動、コピー、削除する

 

表を挿入する

表はテキスト、画像、データを行と列の形式にまとめる際に便利です。表を挿入するには:

  1. 表を挿入したい場所にポインタを置きます。
  2. ツールバーの[表]ボタンをクリックするか、または[挿入]メニューから[表]を選択します。 [表を挿入]ダイアログ ボックスが表示され、ここで表のプロパティ(たとえば、高さ、幅、背景色)を指定できます。
  3. 行数と列数を入力します。
  4. 高さと幅の値(ピクセル単位)を入力します。
  5. 枠線の太さを入力します。枠線を使用しない場合には、0 を入力します。注記:枠線のない表は赤い点線で枠の位置が示されます。点線はページのプレビューまたはブラウズ時には表示されません。
  6. 追加の表の属性や JavaScript を適用するには、[詳細編集]をクリックして詳細プロパティ エディタを表示します。
  7. [OK]をクリックして設定を適用し、作成された表を確認します。

表のプロパティを編集または追加するには、表内をクリックし、[書式]メニューから[表のプロパティ]を選択します(または、ツールバーの[表]ボタンをクリックします)。

このセクションの最初に戻る

 

表のプロパティを変更する

表全体に適用されるプロパティだけでなく、行、列、セルごとのプロパティを個別に修正できます。

表のプロパティ(例:表題、背景色、余白など)を表示、変更、追加するには:

  1. 表内の任意の場所をクリックして、表を選択します。
  2. ツールバーの[表]ボタンをクリックするか、または[表]メニューから[表のプロパティ]を選択します。次のような 2 つのタブを備えた[表のプロパティ]ダイアログ ボックスが表示されます。2 つのタブは[表]と[セル]です。
  3. 以下のプロパティを編集するには、[表]タブをクリックします。
  4. 注記:追加の属性や JavaScript のイベントを適用するには、[詳細編集]をクリックして詳細プロパティ エディタを表示します。
  5. このダイアログ ボックスを閉じずに変更をプレビューするには[適用]をクリックします。変更を加えるには[OK]をクリックします。

1 つまたは複数のセルのプロパティを表示、変更、追加するには:

  1. 行、列、またはセルを選択し、[表]メニューから[表のプロパティ]を選択します。
  2. 以下のプロパティを編集するには、[セル]タブをクリックします。 注記:追加の属性や JavaScript のイベントを適用するには、[詳細編集]をクリックして詳細プロパティ エディタを表示します。
  3. ダイアログ ボックスを閉じずに変更をプレビューするには[適用]をクリックします。変更を加えるには[OK]をクリックします。

このセクションの最初に戻る

 

行、列、セルを追加/削除する

Composer では、1 つまたは複数のセルをすばやく表に追加、または削除できます。 さらに、編集タスクの実行中に表のレイアウト(元の四角形の構造)を維持するようにオプションを設定できます。

セルまたはセルのグループ(行または列)を表に追加するには:

  1. セルを追加する表の内部をクリックします。
  2. [表]メニューから[挿入]を選択します。
  3. セルのグループ分けの 1 つを選択します。表のセル中に新しい表を挿入することもできます。

セルまたはセルのグループを削除するには:

  1. 行、列、またはセルをクリックします。
  2. [表]メニューから[削除]を選択します。
  3. 削除する項目を選択します。

セルをその右側のセルと結合するには:

結合したセルを元の 2 つのセルに分割するには:

表のレイアウトを修正する

通常、1 つまたは複数のセルを削除するとそのセルの枠線も削除されるため、表に空白ができたり、セル数の不揃いにより表の外形が不規則になります。

Composer では、行の最後にセルを追加することによって表の元の四角形の構造(レイアウト)を維持するように設定できます。

このセクションの最初に戻る

 

表内を移動する

以下の 2 つの方法のいずれかを使用して表、セル、またはセルのグループをすばやく選択できます。

このセクションの最初に戻る

 

表を移動、コピー、削除する

このセクションの最初に戻る

 


Web ページへの画像の追加

 

このセクションの内容:

作成したページに画像を挿入する

画像のプロパティを編集する

画像マップ(ホットスポット)を作成する

 

作成したページに画像を挿入する

作成した Web ページに GIF および JPEG 画像を挿入できます。それらを使用してリンクを作成することもできます。

  1. 画像を挿入する場所にポインタを置きます。
  2. ツールバーの[画像]ボタンをクリックするか、または[挿入]メニューから[画像]を選択します。
  3. 画像のプロパティ]ダイアログ ボックスで画像のファイル名と場所を指定し、必要な場合は設定を変更します。

ヒント:画像をすばやく挿入するには、画像をページ上にドラッグ アンド ドロップします。

このセクションの最初に戻る

 

画像のプロパティを編集する

ページに画像を挿入した後、そのプロパティ(高さ、幅、余白、文字列の配置など)を編集してページ内でのレイアウトをカスタマイズできます。

選択した画像のプロパティを編集するには:

  1. 画像をダブルクリックするか、画像を選択してツールバーの[画像]ボタンをクリックします。 [画像のプロパティ]ダイアログ ボックスが表示されます。プロパティのリストを展開するには[詳細設定]をクリックします。プロパティのリストを縮小するには、[簡略設定]をクリックします。
  2. ハイパーリンクを含む画像にホットスポットを作成するには、[画像マップ]フィールドの[編集]をクリックして[画像マップ エディタ]を使用します。
  3. 注記:追加の属性や JavaScript のイベントを適用するには、[詳細編集]をクリックして[詳細プロパティ エディタ]を表示します。
  4. [OK]をクリックして変更を確定します。

このセクションの最初に戻る

 

画像マップ(ホットスポット)を作成する

Composer の画像マップ エディタを使用して、画像のマップ領域にホットスポットを作成できます。 マップ ファイルに画像のホットスポット、つまり URL を割り当てることができる画像の領域の座標が保存されます。

画像マップ エディタの動作は描画ツールに似ています。選択した画像がウィンドウ領域に表示され、ウィンドウの左端のツールバーに各種の形状ツール ボタンが表示されます。

画像マップ エディタを使用するには:

  1. ページ中の画像を選択します。
  2. ツールバーの[画像]ボタンをクリックして[画像のプロパティ]ダイアログ ボックスを表示し、[画像マップ]セクションの[編集]ボタンをクリックします。(必要な場合は、まず[詳細設定]をクリックしてダイアログ ボックスを展開します。)
  3. 形状ツールを使用して画像の一部を選択し、URL または名前付きアンカーを含むホットスポットを指定できるようにします。まずツール ボタンをクリックし、次に画像内をクリックしてドラッグし、選択範囲を定義します。

画像から画像マップを削除するには:

  1. 画像を選択します。
  2. [画像のプロパティ]ダイアログ ボックスを開き、[画像マップの削除]をクリックします(必要な場合は、まず[詳細設定]をクリックしてダイアログ ボックスを展開します)。
  3. [OK]をクリックして変更を適用します。

このセクションの最初に戻る

 


ページ プロパティの設定

 

このセクションの内容:

ページのプロパティと Meta タグを設定する

ページの配色と背景を設定する

 

ページのプロパティと Meta タグを設定する

[ページのプロパティ]ダイアログ ボックスを使用して、現在作業中のドキュメントのタイトル、作成者、説明などのプロパティを入力できます。サーチエンジンはこの種の情報を使用してページの索引を作成するので、この情報はページを Web サイト上で使用する計画の場合に有用です。

以下のプロパティがあります。

このセクションの最初に戻る

 

ページの配色と背景を設定する

現在作業中のページの背景色を変更したり、背景に使う画像を指定することができます。この選択は、ページ中のテキストやリンク エレメントがブラウザを通してユーザの目にどのように映るかに影響を与えます。

現在のページの配色や背景を設定するには:

以下のプロパティを編集できます。

  • 注記:追加の属性や JavaScript のイベントを適用するには、[詳細編集]をクリックして詳細プロパティ エディタを表示します。

    Composer で作成する新規ページごとに、標準のページ背景と配色を設定することもできます。

    このセクションの最初に戻る

     


    リンクの作成

     

    このセクションの内容:

    同じページ内にリンクを作成する

    他のページへのリンクを作成する

    画像をリンクとして使用する

    リンクを削除する

     

    同じページ内にリンクを作成する

    同じページ内にリンク(たとえば 1 つのセクションから別のセクションへのジャンプ)を作成するには、アンカーを作成してそのアンカーへのリンクを作成する必要があります。アンカーは、名前付きアンカーまたはターゲットとも呼ばれます。

    1. アンカーを作成する行の先頭にポインタを置くか、テキストの一部を選択します。
    2. ツールバーの[アンカー]ボタンをクリックするか、または[挿入]メニューから[名前付きアンカー]を選択します。
    3. [アンカー名]フィールドにアンカーの名前(30 文字以内)を入力します。スペースは入れないでください。スペースが必要な場合には、アンダースコア「_」を使用して単語を分離してください。
      手順 1 でテキストを選択した場合には、このボックスにはすでに名前が入力されています。
    4. [OK]をクリックします。
      ドキュメント中にアンカー アイコン が表示され、アンカー位置を示します。

    アンカーへジャンプするリンクを作成するには:

    1. アンカーにリンクするテキストまたは画像を選択します。
    2. [リンク]ボタンをクリックするか、または[挿入]メニューから[リンク]を選択します。
    3. ページ中のすべての名前付きアンカーおよび見出しのリストを表示するには、[詳細設定]をクリックします。
    4. [リンクのプロパティ]ダイアログ ボックスを使用して、適切なアンカー名を選択します。
      • 名前付きアンカーを選択する:名前付きアンカー(ターゲット)へのリンクを作成する場合には、ページ中の現在有効なアンカーのリストから選択します。
      • 見出しを選択する:アンカーのない見出し(たとえば、見出し 1〜見出し 6)へのリンクを作成するには、ページ中の現在有効な見出しのリストから選択します。
    5. [OK]をクリックします。
    6. 作成したリンクをテストするには、[ファイル]メニューから[ページをブラウズ]を選択し、リンクをクリックします。

    このセクションの最初に戻る

     

    他のページへのリンクを作成する

    作成したページから、ご使用のコンピュータ上または LAN 上のローカル ページ、あるいはインターネット上のリモート ページへのリンクを作成できます。

    リンクを他のウィンドウからドラッグ アンド ドロップしてすばやく作成できます。たとえば、Web ページ、ブックマーク、またはメールとニュースのウィンドウからリンクを選択してハイライトし、それを作業中のページ上にドラッグ アンド ドロップすることができます。

    [リンクのプロパティ]ダイアログ ボックスを使用して、以下の手順で別のページへのリンクを作成することもできます。

    1. アンカーにリンクするテキストまたは画像を選択します。
    2. [リンク]ボタンをクリックします。
    3. ページ中のすべての名前付きアンカーおよび見出しのリストを表示するには、[詳細設定]をクリックします。
    4. [リンクのプロパティ]ダイアログ ボックスを使用して、リンクを定義します。
      • リンクの文字:別のページまたはアンカーへのリンクとして使用するテキストを入力します。すでに画像ファイルまたはテキストを選択している場合には、ここに表示されます。
      • リンクの場所:リンク先ページのローカル パスおよびファイル名、またはリモート URL を入力します。 ローカル ファイルのパスやファイル名がわからない場合には、[ファイルを選択]を使用してハード ディスクまたはネットワーク上でファイルを検索します。 リモート URL の場合には、ブラウザの[場所]フィールドから URL をコピーできます。
    5. 注記:追加の属性や JavaScript のイベントを適用するには、[詳細編集]をクリックして詳細プロパティ エディタを表示します。
    6. [OK]をクリックします。
    7. 作成したリンクをテストするには、[ファイル]メニューから[ページをブラウズ]を選択し、リンクをクリックします。

    このセクションの最初に戻る

     

    画像をリンクとして使用する

    画像、絵、JPEG や GIF ファイルのようなグラフィック ファイルをリンクとして機能させることができます。リンクされた画像をクリックすると、ブラウザ ウィンドウにはその画像のリンク先のページが表示されます。

    1. ページ中の画像を選択します。
    2. ツールバーの[リンク]ボタンをクリックするか、または[挿入]メニューから[リンク]を選択します。
    3. [リンクのプロパティ]ダイアログ ボックスを使用して、画像をページ内の名前付きアンカーや見出し、または別のローカル ページやリモート ページにリンクします。

    ヒント:画像とリンクの両方をコピーするには、Navigator ウィンドウから Composer ウィンドウへリンク付きの画像をドラッグ アンド ドロップします。

    このセクションの最初に戻る

     

    リンクを削除する

    リンクを削除するには:

    1. リンク付きのテキスト(通常、青色で下線付き)または画像を選択します。
    2. [書式]メニューから[リンクを削除]を選択します。

    このセクションの最初に戻る

     


    Composer 設定のセットアップ

     

    このセクションの内容:

    Composer を設定する

    配色と背景画像を設定する

     

    Composer を設定する

    作成するすべてのドキュメントに適用される標準設定(例:表の編集)を設定するには:

    1. [編集]メニューから[設定]を選択し、[Composer]をクリックします。

    以下の標準設定を設定できます。

    このセクションの最初に戻る

     

    配色と背景画像を設定する

    作成するすべてのドキュメントに適用する標準設定を設定できます。

    1. [編集]メニューから[設定]を選択します。
    2. [Composer]カテゴリ[新しいページの設定]をクリックします。

    以下の標準設定を設定できます。

    ページごとに作成者名を変更するには:[書式]メニューから[ページの表題とプロパティ]を選択します。

    ページごとにページ配色と背景画像を変更するには:[書式]メニューから[ページの配色と背景]を選択します。

    このセクションの最初に戻る

     


    2000 年 10 月 12 日


    Copyright 1994-2000 Netscape Communications Corporation.