ホームページを作るやつ

HTMLの知識不要。簡単にホームページを制作できるソフトウェア(フリーソフト)です。

チュートリアル >> ページのエレメント
画面左下のタブで 『 エレメント 』 を選択してください。
『 エレメント 』 とはページ内の構成要素(テキストや画像など)のことです。
現在ページ内には3つの 『 エレメント 』 が存在しています。
エレメントタイプが 『 ページ 』 『 フローコンテナ 』 『 テキスト 』 のものです。
ページ
エレメントタイプ 『 ページ 』 はページ全体のことです。
すべてのページには必ず1つの 『 ページ 』 が存在します。
ページ全体に関する設定を行うのが、エレメントタイプ 『 ページ 』 です。
例えばページの横幅・ページの背景色などを設定します。
テキスト
エレメントタイプ 『 テキスト 』 はテキスト(文章)です。
『 テキスト 』 ごとにテキストの色・フォントのサイズなどを設定します。
つまりホームページ内で複数の色のテキストを使用したい場合は複数の 『 テキスト 』 に分割する必要があります。
フローコンテナ
エレメントタイプが 『 フローコンテナ 』 はテキストを格納する為の 『 エレメント 』 です。
エレメントは大きく分けて 『 ブロック 』 『 インライン 』 の2種類が存在します。
ブロック
ブロックは四角形の形をしていて別のエレメントを中に入れることもできます。
位置や大きさを自由に設定できます。
インライン
インラインはブロックの内側に配置されるテキストや画像です。
インラインは末端のエレメントで別のエレメントを中に入れることはできません。
位置を自由に設定することはできません。
ブロックの中に複数のインラインが配置されている場合、ブロックの左上から右方向に並び右端で自動改行されます。
ホームページ制作のコツは、複数のインライン(またはブロック)のまとまりをブロックに格納し、そのブロックを上位のブロック内の好きな位置に配置していくことです。
【 ページの構成例 】
テキスト (インライン)
フローコンテナ (ブロック)
テキスト (インライン)
画像

(インライン)
テキスト (インライン)
フローコンテナ (ブロック)
テキスト (インライン)
フローコンテナ (ブロック)
ページ (ブロック)
各エレメントが 『 ブロック 』 『 インライン 』 のどちらに属するかの一覧表です。
ブロック
【 別のエレメントを内部に配置できる 】
ページ
フローコンテナ
フリーコンテナ
分割コンテナ
デザインコンテナ
共有コンテナ
プレースホルダー
【 別のエレメントを内部に配置できない 】
テキスト(改行)
リンクテキスト(改行)
点滅テキスト(改行)
点滅リンクテキスト(改行)
画像(改行)
リンク画像(改行)
ポップアップ画像(改行)
見出し
見出しリンク
ツリーメニュー
パンくずリスト
パンくずツリー
画像ツリーメニュー
スライドショー
インライン
テキスト
リンクテキスト
点滅テキスト
点滅リンクテキスト
画像
リンク画像
ポップアップ画像
埋め込みHTML
ブロックは上位のブロックの内部で縦方向に並びます。
横方向に並べるためには上位のブロックに特殊なブロックを使用します。
分割コンテナ
『 分割コンテナ 』 はブロックを横方向に並べる為のブロックです。
『 分割コンテナ 』 の内部を 『 分割コンテナ(セル) 』 で横方向に分割し、 『 分割コンテナ(セル) 』 の内部に別のエレメントを追加していきます。
フリーコンテナ
『 フリーコンテナ 』 は内部のエレメントを自由に配置可能なブロックです。
並べるという概念は無く好きな位置に好きな大きさで配置できます。
『 フリーコンテナ 』 の内部では 『 インライン 』 のエレメントも 『 ブロック 』 として扱われます。

『 フリーコンテナ 』 の欠点は高さが固定されることです。
高さが固定されるとテキストの表示で問題が発生する可能性があります。
ホームページのテキストは閲覧者の環境によって表示に必要な幅と高さが変化します。
環境とはOSの違い(パソコン、スマートフォンなど)や、ブラウザのフォントの設定などです。
ホームページを制作した環境と閲覧者の環境では表示が異なる場合があります。
『 フリーコンテナ 』 の領域から、はみ出した部分は表示されないので注意してください。