俳句野郎

俳句、俳句、プログラミング、俳句。

インターン二日目、三日目(HTMLの基本との格闘編)。

アムウェイやら起業のためになにかやろうみたいな、夢を実現させるためにキラキラしている人にやたらウケのいい上田です。

どっからどう考えても遠回りの提案をされても困るんです。

僕は南の外れの週に一度しか連絡船が来ないような無人島を退職金で買って、妻と柴犬と馬と羊とやぎと鶏と野菜に囲まれた生活がしたいだけなのです。

 

続きを書きます。

HTMLを昨日と今日と、そして明日もやります。

・head内の<meta>要素

これまでよくわかってなかったのですが、

<meta name="author" content="上田拓史">

<meta name="keywords" content="上田, 拓史, うえだ, たくし">

他にも、"keywords"のところに、"description"(このHTMLの説明)もいれられるそう。

こんな風に書くことで、サーチエンジンに情報提供をすることができる、という説明に納得しました。SEOなんかにも関係してくるのでしょうか?

もともと論文を読みやすく、探しやすくするために作られた、という歴史背景も後押しでした。歴史も大事なんですね。目的を知る上で。

 

スタイルシートの読み込み順

明確に

1.局所的なスタイルが大局的なスタイルに優先する。

2.同じ優先順位のスタイルが競合したら後から読み込んだものを採用する。

 というルールがあるとは知りませんでした。

 

・form

 formのtypeやメソッドに関して、概要をつかむことが出来ました。

特に忘れたくないのは、

formとは「何を」(コントロール(データを入力する手段)で範囲を明示)「どこに」(データを受け取るプログラムを指定するaction属性)「どうやって」(postとgetのmethod属性)送信するのかを提供するものだということ。

 

メソッドの使い分け

post・・・新規データのデータを送信、登録するためなどに使う。

get・・・検索キーワードを入力して、データベースから情報を取得するためなどに使うなど、常に一定の結果を伴う時に使う。文字にリンクを貼って、同じページのその章に飛ぶとかにも使える。

 

formの<input type>の種類

text,radio,textarea,checkbox,select。用途に応じて使う。

 

 

<form method="post" action="mail to": メールアドレス?= "page-enquete">

これを使うことで、postの内容を指定したメールアドレスに送ることができる。

メールアドレスの後ろの"page-enquete"は、件名になる。

 

☆a要素タイプのname属性は、idと同様に同じ名前を使うことは出来ないけれど、input要素などのformのコントロールのname属性は、そのコントロールが指定する範囲内だけで、名前を指定するため、同じ名前を使うことが出来る。☆

 

わからなかったところ

・input type ="hidden"の使い方。用途の方法がわからず、イメージ出来なかった。

・input type = "file"による、ファイルの送信方法。MIMEのマルチパートデータとしてのプログラムに届く、とあるが、よく分からなかった。

 

・labelによる関連付け

label要素とそのidを示すfor属性。<label>要素の<for>属性と、<input>要素の<id>属性関連している。同じ属性を指定することで、関連付けられる。

 

<label>要素の内容には、一つのコントロール(textだけ、とかradioだけ、とか。)しか含めることが出来ない。

一つのコントロールに、複数の<label>は付けられる。(selectメニューのgroup化をするときとか)

例)一つのコントロール<select>に対して、二つの<label>が付いている↓

<select name="area">

 <optgroup label ="首都圏">

 <option>東京</option>

<option>千葉</option>

<option>神奈川</option>

</optgroup>

<optgroup label = "四国">

<option>香川</option>

<option>愛媛</option>

<option>徳島</option><option>高知</option>

</optgroup>

</select>

 

 ・<tab index>

キーボードのTABキーで移動できるようになる。

<tab index = "数字">

小さい数から順に移動していく。

 

<accesskey = "キー名"/>

ショートカットキー。

 

<img>属性を使うとき、表示できない時のためにaltでテキストデータを使う。

こういうユーザーに配慮するタグは知らなかったので、勉強になりました。

 

「詳しいHTML」の説明を三日目の後半に入ったのですが、全く頭に入ってこなかったので、また今日読み返したいと思います。