六月の授業日記
＞home
6/6 テキストの修飾
改行と改段行を区別
改段落＝Enter（P056）
前後と文脈の意味が違う区切りを明示する
前後に一行空行が入る
改行＝Shift＋Enter（P057）
同じ段落内で改行だけしたい場合
見出し
文章上での役割・機能
- WPでは技術者が役割に見合った表示効果を設定する
- webでは役割（見出し１等）をタグで記す
- ブラウザが役割を判断し見合った表示にする
- 検索ロボット等読めなくても意味（機能）が伝わる
DWではプロパティインスペクタ＞フォーマットから見出しの強さ（１から６まで）選ぶ
水平揃え
行単位では行えず、段落単位
プロパティイインスペクタから中央揃え・右揃え等のアイコンをクリック
リスト（059）
同じ扱いを箇条書きにする場合など
- 頭にドットが付きインデントされ行間が狭くなりまとまる
プロパティインスペクタ＞リスト
解除するには＞もう一度リストボタン（Enterキーを二回打つ）
番号付きリスト(P061)
箇条書きに順位がある場合番号を自動で振ってくれる
- 頭に数字が付く
プロパティインスペクタ＞番号リスト
テキストインデント（P063）
箇条書きの中に階層がある場合右にインデントさせるとわかりやすい
プロパティインスペクタ＞テキストインデント
解除するには＞テキストインデント解除
きょうのひとこと
いっぱい打ち込んだ＾＾インデントややこしいです
6/13 画像の挿入
ページプロパティ（P044）
ページ全体に関する設定＞選択できないので修正メニュー
webページでの画像
特徴＝ページに画像は埋め込めない
- 必要点数HTMLとは別にファイルとして用意
- その画像がどこにあるのかを記述する
DWでの画像貼り付けの流れ
- 画像の準備
- 必要なファイルをダウンロードフォルダ（Web/DLに保存）
- （DLでの）画像の挿入
- 挿入バー＞画像の挿入
- （コピーするようダイアログが出るのでOK）コピーの保存先（web/site/img）を指定
- アップロード
- 貼り付けたページをアップロード＞依存ファイル（貼り付けられている画像）を含有にOK
- 必要な画像も正しい位置に一緒にアップロードされる
きょうのひとこと
サイトがにぎやかになってきたー
焼肉おいしそうだった
6/20 リンク
使用できる画像の種類(P019)
- 画像ファイルはサイズが大きく、ダウンロードに時間がかかるので圧縮（最適化）しサイズを軽量化したものを使用する
- jpeg（ジェイペグ）
・写真など色数の多いもの
- gif（ジフ）
- イラストなど色数の少ないもの
- 背景を透過でき四角以外の形もできる
背景画像(P080)
ページの背景には画像を敷き詰めることもできる＞ページプロパティ
- ページのサイズはブラウザの状態により可変するので完全に合わせることができない
- 小さい画像（軽い）をタイル状に繰り返してページいっぱいに表示させる
サーバーでの特殊なファイル名（index.html）
- サーバーでファイルを開くためには正しいフォルダ名＋ファイル名を記述する必要がある
- ファイル名を省略してフォルダ名だけにすると（サーバーの設定による）
- エラーメッセージ
- フォルダの中のファイルすべてにリンクの張られたリストが見える（便利だがセキュリティに不安）
- index.html（html）というファイル名のファイルが自動的に開かれる
- トップページはindexという名前にしておけばフォルダ名まででアクセスできる
リンク
- クリックするだけで指定したページが開ける
- リンクがある部分のテキストはリンクカラー（プロパティインスペクタで設定）リンクがある部分はアンダーラインが引かれる
DWでのリンクの指定方法
- リンクさせたい部分をドラッグして選択しプロパティインスペクタ：リンク右の
- フォルダアイコン
をクリックしファイルの参照ダイアログからリンクしたいファイルを指定（P075）
- ターゲットアイコン
からドラッグしファイルパネルのリンクしたいファイルのアイコンを指定（P084）
きょうのひとこと
今日は内容が濃かったです〜
6/27 リンク２
画像によるリンク(P085)
- 画像にリンクを貼りたい場合（リンクボタンなど）画像を選択し同様にプロパティインスペクタより設定
- リンクとソースが並んでいるので間違えないようにリンクから設定
インターネット上のファイルへのリンク（P087)
ファイルパネルやファイルの参照は使えない
- URLを直接入力＞アドレスバーからコピー
- プロパティインスペクタ：リンクテキストボックスにペースト
メールリンク（P090)
お問い合わせは
- クリックすると送信先に記入したメールアドレスが入力された状態でメーラーが立ち上がる
- リンクテキストボックスにmailto:と入力しその後にメールアドレスを記入
イメージマップ（P098）
一枚の画像の中にエリアを描きそれぞれに異なるリンク先を設定できる
- 画像選択しプロパティインスペクタ左下マップ部分から画像に短形・楕円・多角形でエリアを描く
- 選択ツールで選択すると各エリアごとに独立したリンクが貼れる（＃を消する）
- エリアを区別する色はDW以外では見えない
きょうのひとこと
たくさんリンクはった〜