4月の授業日記

4/13　web

ファイルをサーバーにコピーすることで他者から閲覧できる

www=ワールド・ワイド・ウェブ

• インターネット上のサービスのひとつ。htmlという言語でページを記述することで、高い互換性で画像やリンクを使って情報の共有ができる。
• 閲覧にはHTML言語を翻訳して表示するソフト＝ブラウザを使用する

URL

• 開くが使えないのでサーバー名/フォルダ名/ファイル名を直接アドレス欄に入力する
• 閲覧者が入力に使うのできまりに従ったフォルダ・ファイル名にする必要がある

Dreamweaver

• HTMLをワープロのように編集できるソフト
• バージョンが古くコマンドメニュー等クラッシュするので何かしたら必ず保存しておく

きょうのひとこと

はじめてホームページをつくりました

4/20　文章の構造定義

HTMLでは文章にその部分がどういう役割（意味）を持つのかを印（タグ）をつけている

改段落=enter

• 前後の意味合いの違う段落を区切る
• 前後に1行空行が入る

改行=shift+enter

段落内で改行を行いたいときもタグを使って改行する

見出し

見出しの強さに応じて1〜6

水平揃え

• 段落単位（行はできない）で揃えを指定できる
• プロパティインスペクタの中央揃え・右揃えなどのアイコンをクリック

リスト

• リスト
  • 同じ扱いのものを箇条書きリストに
• 番号リスト
  • 順位のあるものに自動で番号が振られる

   

インデント

項目の解説など補完する項目をインデントさせる

ページプロパティ

• ページ全体にわたる設定（背景・文字色等）を行う
• 印刷が主目的ではないので背景色が使われるケースが多い
• 選択できないので修正＞ページプロパティより

webページの記述（html）

• 文章を役割（構造）に分けて目印（タグ）をつけて定義（html）し記述
• ブラウザはそれを理解して見合った表示を行う
• DWでは意味づけはプロパティインスペクタから役割に合った定義方法を指定する

きょうのひとこと

文章の構成を覚えた

4/27　画像の挿入

画像の挿入＝挿入＞イメージ

ｈｔｍｌ書類ではページに画像は埋め込めない

1. ｈｔｍｌ書類とは別に画像ファイルを必要点数用意
2. 表示する位置に画像の保存場所・ファイル名を記述
3. ｈｔｍｌ書類とともにサーバーへ転送

画像の保存場所

転送しない画像＞web/DW

• 使うかどうかわからないものはとりあえずここへDL

転送する画像＞web/site/img

• 画像はファイルサイズが大きいので使用するものだけ
• DWが転送できるフォルダはweb/siteのみ

webで使用できる画像の種類

画像ファイルはサイズが大きいので以下の方法で圧縮（最適化）し、軽くしたものを使用する

1. gif（ジフ）
• 画像の色数を減らして軽量化する
• 色数の少ないイラスト・ボタン等
• 背景を透過させて四角以外にすることもできる
• 動かすことのできるアニメgifもある
2. jpeg（ジェイペグ）
   • 画像を劣化させて軽量化する
   • 写真など色数の多いもの
   • 背景は透過できないので四角い

背景画像

ページの背景には画像を敷き詰めることもできる＞ページプロパティ

• ページのサイズは可変できるので完全に合わせることはできない
• 小さい画像（軽い）をタイル状に繰り返してページ全体に表示させる

この画像を背景として設置する

今日の一言

画像の挿入をしてホームページらしくなった