初心者でもAdobe Dreamweaver CCで楽にウェブサイトができる！
BPDスタッフのたけしたてつおです。
ここだけの話ですが、
実は私、BPDのデザイン担当なのですが、
ホームページ（HTML）が、あまり得意ではありません。
「ソースコードやタグコードなど…」すべて英字で記述していくので、
普段日本語しか目にしない私としては、見た目が…
パッと見ただけで、頭が痛くなります。w(￣Д￣;)wﾜｵｯ!!
しかし、やらないといけない…
でも、楽にWebサイトを構築したい！！
ということで、
今回、楽にHTML/CSS等のコーディングができるという噂の
「Adobe Dreamweaver CC」でWebサイトを構築してみようとおもいます。
※Adobe Dreamweaver CCは、アドビ社が提供しているWebサイト構築のソフトウェアで、
楽にHTML/CSS等のコーディングができるそうです。
そして今回から構築していくウェブサイトは私の個人的さいと「てつお使えるイラストぷらす」が昔に作成したままのダサイデザインなのでこちらをイケテルデザインのウェブサイトへと修正していきたいと思います。
第一回目 新規ドキュメントを制作
では早速、「Adobe Dreamweaver CC」を起動して新規ドキュメントを制作してみます。
※私はMacで作業をしていますので、説明画像はMacの画像です。
Windowsの方は見た目が少し違うと思いますが、大体一緒だと思います。
１．新規ドキュメントを制作
左の項目から「新規ドキュメント」を選択します。
ドキュメントタイプから「HTML」を選択します。
フレームワークは「なし」のタブを選択し、ドキュメントタイプから「HTML5」を選択します。
フレームワークのタイトルを入力して制作をクリックします。
２．編集画面を変更
ツールバーを「ライブ」から「分割」に変更して、ライブビューとコードビューを表示させます。
３．ドキュメントを保存
メニューの「ファイル」→「保存」→ドキュメントに名前を付けて保存で、「新規サイト」をクリックします。
サイト設定画面が開きますので、各項目を記入して保存します。
サイト名：「サイトの名前」
ローカルサイトフォルダー：「保存するフォルダを選択」
ファイル名：「index.html」
今回制作したウェブページの基本的なコードについて
※新規ドキュメントを制作するとウェブページの基本のコードが自動的に制作されます。
<!doctype html>：
HTML5のDOCTYPE宣言です。（使用するHTMLのバージョンを指定します。）
<html>〜</html>：
「これはHTML文章です」と宣言するタグです。
<head>～</head>：
このタグ内にウェブページに関する情報や設定などを記述します。
<meta charset=”UTF-8″>：
エンコードの種類です。
<title>〜</title>：
このタグ内にページのタイトルを記述します。
<body>〜</body>：
このタグ内にウェブサイトで表示するコンテンツなどを記述します。
おまけ
今回、今回制作したウェブページの基本的なコードについてでタグを書いていますが、
「<」と「>」はタグの記号ということなので、
文字として表示する場合はそのまま使用することはできません。
「<」は「<」、「>」は「>」と入力すれば表示されます。
以上
「初心者でもAdobe Dreamweaver CCで楽にウェブサイトができる！」第１回目でした。
更新は遅いですが地道に更新していく予定です。
