2014年01月30日
■ホームページ作成はできる-2■
前回のホームページの作成の提案から
今回からはホームページを実際に作成していきます。
知っている人は読み飛ばし下さい
動作環境:
OS:windowsXP以上を想定
ブラウザ:Firefoxで確認しています。
→Internet explorerでもきっと大丈夫
テキストエディタ:サクラエディタ
→windows標準の「メモ帳」、またはTeraPad等でも良い。
*OS・・・オペレーティングシステム(パソコン動作を決める基本ソフト)
→windows,MacOS、UNIX系など
*ブラウザ・・・ホームページを見るためのもの
*テキストエディタ・・・HTMLファイル等を手打ちで編集するためのもの
・作業フォルダ設定
今回の最終的なフォルダ構成を下記の通りとします。
デスクトップ-----「hp」フォルダ
|
-------index.htmlファイル
デスクトップに「hp」フォルダを作成して、
「hp」フォルダ内で右クリックメニューから「新規作成」→「テキストドキュメント」として
ファイル名をindex.htmlとします。
・htmlファイル編集
次にindex.htmlファイルを右クリック→「プログラムから開く」→使用するテキストエディタを選択(私の場合はサクラエディタ)
によりindex.htmlファイルの中身が見れます。最初は空のはずです。
その空のファイルに下記をコピーして保存してみてください。
(保存する際には名前を付けて保存の際に文字コードを選択する場所があると思いますので、
「UTF-8」を選択してから保存をしてください。そうしないと文字化けしてしまいます)
<!doctype html>
<html lang="ja"> <!-- HTML開始 かつ 言語を「日本語」 -->
<head>
<meta charset="utf-8"> <!-- 文字タイプ設定 UTF-8 -->
<title>ホームページ作成</title> <!-- ブラウザ上部表示タイトル -->
</head>
<body >
ホームページを始めます。
</body>
</html>
・htmlファイル内容説明
htmlというものは基本的に
<タグ名>何かしら記述</タグ名>
として記述されます。
→詳細
丸投げすみません<m(__)m>
<meta charset="utf-8">
の箇所では文字タイプを設定しています。一般的に「UTF-8」が良いようなのでUTF-8にしています。
・htmlファイル表示
次にhtmlファイルを表示してみます。
「hpフォルダ」内のindex.htmlファイルをダブルクリックで開いて見てください。
ブラウザで下記の通りシンプルに表示されるのではないでしょうか。
(ブラウザで開かれない場合は、右クリック→「プログラムから開く」→使用するブラウザを選択(私の場合はFirefox)
ホームページを始めます。
シンプル過ぎますが、ホームページ作成の第一歩でした。
今後も少しずつ作成を進めていきたいと思います。
今回からはホームページを実際に作成していきます。
知っている人は読み飛ばし下さい
動作環境:
OS:windowsXP以上を想定
ブラウザ:Firefoxで確認しています。
→Internet explorerでもきっと大丈夫
テキストエディタ:サクラエディタ
→windows標準の「メモ帳」、またはTeraPad等でも良い。
*OS・・・オペレーティングシステム(パソコン動作を決める基本ソフト)
→windows,MacOS、UNIX系など
*ブラウザ・・・ホームページを見るためのもの
*テキストエディタ・・・HTMLファイル等を手打ちで編集するためのもの
・作業フォルダ設定
今回の最終的なフォルダ構成を下記の通りとします。
デスクトップ-----「hp」フォルダ
|
-------index.htmlファイル
デスクトップに「hp」フォルダを作成して、
「hp」フォルダ内で右クリックメニューから「新規作成」→「テキストドキュメント」として
ファイル名をindex.htmlとします。
・htmlファイル編集
次にindex.htmlファイルを右クリック→「プログラムから開く」→使用するテキストエディタを選択(私の場合はサクラエディタ)
によりindex.htmlファイルの中身が見れます。最初は空のはずです。
その空のファイルに下記をコピーして保存してみてください。
(保存する際には名前を付けて保存の際に文字コードを選択する場所があると思いますので、
「UTF-8」を選択してから保存をしてください。そうしないと文字化けしてしまいます)
<!doctype html>
<html lang="ja"> <!-- HTML開始 かつ 言語を「日本語」 -->
<head>
<meta charset="utf-8"> <!-- 文字タイプ設定 UTF-8 -->
<title>ホームページ作成</title> <!-- ブラウザ上部表示タイトル -->
</head>
<body >
ホームページを始めます。
</body>
</html>
・htmlファイル内容説明
htmlというものは基本的に
<タグ名>何かしら記述</タグ名>
として記述されます。
→詳細
丸投げすみません<m(__)m>
の箇所では文字タイプを設定しています。一般的に「UTF-8」が良いようなのでUTF-8にしています。
・htmlファイル表示
次にhtmlファイルを表示してみます。
「hpフォルダ」内のindex.htmlファイルをダブルクリックで開いて見てください。
ブラウザで下記の通りシンプルに表示されるのではないでしょうか。
(ブラウザで開かれない場合は、右クリック→「プログラムから開く」→使用するブラウザを選択(私の場合はFirefox)
ホームページを始めます。
シンプル過ぎますが、ホームページ作成の第一歩でした。
今後も少しずつ作成を進めていきたいと思います。
ここも宜しくお願いします。
「ココオル-天草-」http://amakusa.holy.jp/index.php
・デザインの基本も勉強中
黒背景に黄色で金色に見えるし、映える。
黄色と白のグラデーションにすればより一層。
「ココオル-天草-」http://amakusa.holy.jp/index.php
・デザインの基本も勉強中
黒背景に黄色で金色に見えるし、映える。
黄色と白のグラデーションにすればより一層。
Posted by せしる at 14:00│Comments(2)
│パソコン関係
この記事へのコメント
テキストホルダでホームページも簡単にできるようですね。
ホームベージ作成アプリはないんでしょうか。
ウインドウズパソコンもあるのですが、タブレットを使うことが多いです。
ホームベージ作成アプリはないんでしょうか。
ウインドウズパソコンもあるのですが、タブレットを使うことが多いです。
Posted by 日常の日常 at 2014年01月30日 18:15
>> 日常の日常さん
タブレットの場合はインターネットを使って
いろいろと検索したり、メールしたりはできると思っていますが、
「テキスト編集」というものに向いていないため、
ホームページ作成アプリは無いのではないでしょうかねー。
あったら手軽にできそうでよいのですが。。。
タブレットの場合はインターネットを使って
いろいろと検索したり、メールしたりはできると思っていますが、
「テキスト編集」というものに向いていないため、
ホームページ作成アプリは無いのではないでしょうかねー。
あったら手軽にできそうでよいのですが。。。
Posted by せしる at 2014年01月30日 20:40