2014年01月31日
■ホームページ作成はできる-3■
前回はホームページの第一歩でしたが、
今回は画像の読み込みです。
動作環境
・作業フォルダ設定
今回の最終的なフォルダ構成を下記の通りとします。
デスクトップ-----「hp」フォルダ
|
-------index.htmlファイル
|
-------「img」フォルダ
｜
-------0.png画像ファイル
前回作成した「hp」フォルダ内に「img」フォルダを作成し、
その中に画像ファイルを入れ、0.pngと名前を付けます。
画像がない場合には下記の画像を右クリックして「名前を付けて画像を保存」を
選択し、上記名前を付けてください。
・htmlファイル編集
次に前回作成したhtmlファイルを下記の通り編集します。
下記の赤文字箇所を追加しています。
<!doctype html>
<html lang="ja"> <!-- HTML開始 かつ 言語を「日本語」 -->
<head>
<meta charset="utf-8"> <!-- 文字タイプ設定 UTF-8 -->
<title>ホームページ作成</title> <!-- ブラウザ上部表示タイトル -->
</head>
<body >
ホームページを始めます。
<img src="./img/0.png" alt="画像サンプル">
</body>
</html>
・htmlファイル内容説明
画像を読み込む際には<img>タグを使用します。
そしてその中の「src」には画像ファイルのある場所を指定します。
「./」と先頭についているのは、現在のフォルダという意味です。
ここではindex.htmlが入っている「hp」フォルダを指します。
そしてフォルダごとに「/」で区切ります。
次に「alt」については、画像が正しく表示されなかった場合に、
文字として替わりに表示されるものとなります。
・htmlファイル表示
実際にブラウザで表示すると下記のようになると思います。
ホームページを始めます。
これで画像の読み込み成功です。
次回は「リンク」について書こうと思います。 続きを読む
今回は画像の読み込みです。
動作環境
・作業フォルダ設定
今回の最終的なフォルダ構成を下記の通りとします。
デスクトップ-----「hp」フォルダ
|
-------index.htmlファイル
|
-------「img」フォルダ
｜
-------0.png画像ファイル
前回作成した「hp」フォルダ内に「img」フォルダを作成し、
その中に画像ファイルを入れ、0.pngと名前を付けます。
画像がない場合には下記の画像を右クリックして「名前を付けて画像を保存」を
選択し、上記名前を付けてください。
・htmlファイル編集
次に前回作成したhtmlファイルを下記の通り編集します。
下記の赤文字箇所を追加しています。
<!doctype html>
<html lang="ja"> <!-- HTML開始 かつ 言語を「日本語」 -->
<head>
<meta charset="utf-8"> <!-- 文字タイプ設定 UTF-8 -->
<title>ホームページ作成</title> <!-- ブラウザ上部表示タイトル -->
</head>
<body >
ホームページを始めます。
<img src="./img/0.png" alt="画像サンプル">
</body>
</html>
・htmlファイル内容説明
画像を読み込む際には<img>タグを使用します。
そしてその中の「src」には画像ファイルのある場所を指定します。
「./」と先頭についているのは、現在のフォルダという意味です。
ここではindex.htmlが入っている「hp」フォルダを指します。
そしてフォルダごとに「/」で区切ります。
次に「alt」については、画像が正しく表示されなかった場合に、
文字として替わりに表示されるものとなります。
・htmlファイル表示
実際にブラウザで表示すると下記のようになると思います。
ホームページを始めます。
これで画像の読み込み成功です。
次回は「リンク」について書こうと思います。 続きを読む
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)
ホームページを始めます。
シンプル過ぎますが、ホームページ作成の第一歩でした。
今後も少しずつ作成を進めていきたいと思います。
続きを読む
2014年01月29日
■ホームページ作成はできる-1■
天草でできること。
■ホームページ作成
天草でできることの一つにインターネット環境が整っていれば、
ホームページを作成して公開することができますね。（ここのブログもできます。）
ホームページの方がこだわってしまうとブログより難しいですが、
より工夫が入れられて面白く感じるかもしれません。
あと、厳密に言えばホームページはインターネット環境が無くても作成できます。
ホームページビルダーなどのホームページ作成ソフトがなくてもです。
少なくとも「HTML」というものを覚えればできます。
→HTML手打ち→HTML基本
上記リンク先の基本では説明が少し足りないような気もしますが、ほかにも色々調べてみてください。
基本的には「ファイル名.html」というテキストファイルに上記リンクの「HTML基本」の中身を記述すればできます。
・.htmlファイルを「見る」ときにはInternet Exploler等のブラウザで開きます。
・「編集」するときにはテキストエディタ(windowsに最初からあるのでは「メモ帳」)を使用します。
ホームページに興味を持っている人がいたら、公開まで行ったほうが良いと思いますが、
とりあえず、HTMLで書いてみてはどうでしょうか。
パソコン・インターネットを利用する目的が増えるかと思います。
今後も何か少しだけでもためになる情報を発信していきたいと思います。
■ホームページ作成
天草でできることの一つにインターネット環境が整っていれば、
ホームページを作成して公開することができますね。（ここのブログもできます。）
ホームページの方がこだわってしまうとブログより難しいですが、
より工夫が入れられて面白く感じるかもしれません。
あと、厳密に言えばホームページはインターネット環境が無くても作成できます。
ホームページビルダーなどのホームページ作成ソフトがなくてもです。
少なくとも「HTML」というものを覚えればできます。
→HTML手打ち→HTML基本
上記リンク先の基本では説明が少し足りないような気もしますが、ほかにも色々調べてみてください。
基本的には「ファイル名.html」というテキストファイルに上記リンクの「HTML基本」の中身を記述すればできます。
・.htmlファイルを「見る」ときにはInternet Exploler等のブラウザで開きます。
・「編集」するときにはテキストエディタ(windowsに最初からあるのでは「メモ帳」)を使用します。
ホームページに興味を持っている人がいたら、公開まで行ったほうが良いと思いますが、
とりあえず、HTMLで書いてみてはどうでしょうか。
パソコン・インターネットを利用する目的が増えるかと思います。
今後も何か少しだけでもためになる情報を発信していきたいと思います。
2014年01月28日
■天草の最新つぶやき発信
天草に住んでいる人、天草に旅行に来る人、
天草にお店を持っている人、天草でイベントをする人、
天草で釣りをする人、天草でつぶやきたい人
にとって最新の情報を集めて届けたいと考え、以下のサイトを作成しました。
「ココオル-天草-」http://amakusa.holy.jp/index.php
基本的にはスマホのGPS機能を利用して現在いる場所の情報を発信するものです。
現在位置の情報もとに発信する理由としては、現在いるところの情報であれば、正確で最新の情報に
違いないと思われるからです。
ただ、試験的に以下の「つぶやき」については手動で情報を発信する位置を指定できるようになっています。
「ココオル-天草-つぶやき」http://amakusa.holy.jp/02_tsubu/tsubu_manual/tsubu_manual.php
目標としては
・天草で「今」行われているイベントが見つけられる
・天草で「今」ここの観光地・レジャーができるというのが見つけられる
・天草で「今」ここの居酒屋が空いてる
・天草で「今」ここでこんな魚が釣れる
などの情報が集まり、みんなで共有できることです。
今のところ情報を集約することがなかなか難しい状態です。
天草の人はあまりインターネットを使わないのかな？？？
投稿した情報は削除も可能ですので是非なにか試しに投稿してみてください。
なにか利用できないなどあれば、お手数ですが連絡をお願い致します。
天草をよりよくしていきましょう(/・ω・)/
天草にお店を持っている人、天草でイベントをする人、
天草で釣りをする人、天草でつぶやきたい人
にとって最新の情報を集めて届けたいと考え、以下のサイトを作成しました。
「ココオル-天草-」http://amakusa.holy.jp/index.php
基本的にはスマホのGPS機能を利用して現在いる場所の情報を発信するものです。
現在位置の情報もとに発信する理由としては、現在いるところの情報であれば、正確で最新の情報に
違いないと思われるからです。
ただ、試験的に以下の「つぶやき」については手動で情報を発信する位置を指定できるようになっています。
「ココオル-天草-つぶやき」http://amakusa.holy.jp/02_tsubu/tsubu_manual/tsubu_manual.php
目標としては
・天草で「今」行われているイベントが見つけられる
・天草で「今」ここの観光地・レジャーができるというのが見つけられる
・天草で「今」ここの居酒屋が空いてる
・天草で「今」ここでこんな魚が釣れる
などの情報が集まり、みんなで共有できることです。
今のところ情報を集約することがなかなか難しい状態です。
天草の人はあまりインターネットを使わないのかな？？？
投稿した情報は削除も可能ですので是非なにか試しに投稿してみてください。
なにか利用できないなどあれば、お手数ですが連絡をお願い致します。
天草をよりよくしていきましょう(/・ω・)/
