知らないことがあってもへっちゃらさ

METAタグでブラウザのキャッシュ制御と文字コードの指定をしよう

HTMLのMETAタグって、Webページの様々な情報（設定？）を指定できるんですけど、よく忘れてるんでメモメモなわけです。ちなみにHTMLファイルのHEADタグ内に記述します（念のため）。

まずは文字コードの指定。

<meta http-equiv="content-type" content="text/html; charset=UTF-8">
 

よく使う指定は「Shift_JIS」だったり「EUC-JP」だったり「UTF-8」だったり「ISO-2022-JP」(JIS)だったり・・・。なお、HTTPレスポンスヘッダを以下のように出力しての指定もできます。

Content-type: text/html;charset=Shift_JIS
 

お次はWebブラウザにキャッシュされないようにする（キャッシュを無効）にする指定。

<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Expires" content="Thu, 01 Dec 1994 16:00:00 GMT">
 

こちらは３行使って指定します。文字コードと同じく、こちらもHTTPレスポンスヘッダでの指定も可能で、以下のようなヘッダを追加して指定できます。

Pragma: no-cache
Cache-Control: no-cache
Expires: Thu, 01 Dec 1994 16:00:00 GMT
 

どちらにしてもMETAタグよりもHTTPレスポンスヘッダでの指定が優先されるので、HTTPレスポンスヘッダで指定できるなら、そちらでした方が吉かも・・・。

参照リンク
　・<META>－HTMLタグリファレンス

はじめてのコア凸 「ボーダーブレイク」

(C)SEGA

　今週のマップは「スカービ渓谷 ～戦線突破～」。人呼んで「コア凸練習マップ」であります。そんなわけで、はじめてのコア凸に挑戦してきました（実はコアアタッカーの勲章が欲しくって）。

　今回用意したコア凸用の機体は、頭がツェーブラ38、胴体がクーガーⅡ型、腕がシュライクⅠ型、脚がシュライクⅠ型というもの。で、肝心の強襲兵装の武器なんですが・・・。実は初期のままだったりします。

　ちなみに、この状態で機動力は6%の低下となっており、歩行・ダッシュともにB程度の速度が期待できます。なお頭をシュライクⅠ型にすると、重量オーバーのペナルティは2%まで減らせるんですが、装甲とか射撃補正とか自分の技量を考えた結果、今回は採用を見送っております。

　ところで私、実は強襲兵装って１時間も乗ってなかったんですよ（もちろん強襲章も無し）。いや～、自分でもビックリ（笑）。

　そんなわけで、一度「個人演習」で操作を練習してから、いざ！全国対戦へ。とはいえ、そんな強襲兵装初心者がいきなりあれこれ出来るわけがないので、戦略はいたってシンプルに行くことにします。

　とりあえず剣と手榴弾のことは考えない（オィ！）。プラント周辺でドンパチしようと思わない（オ～ィ！）。ひたすらコアに銃弾をブチ込む事に専念する。であります。

　パターン的にはベースからスタートして、哨戒しながらBプラントの脇のカタパルトを使って、敵コアを目指します。もし、Bプラントと自軍ベースの間で敵機を発見した場合は、そちらの撃破を優先します。

　で、結果はと言うと・・・。ちゃんとコア凸できました。勲章もコアアタッカーだけじゃなく、コアストライカーまでもらえました。これはラッキー。

　しかし、Bランク下位とはいえ、コアの割れるのが早いこと早いこと（笑）。ホントに300秒かからずに割れたりするんだもんなぁ。す、すげぇ！。

黄砂が舞った朝

　朝起きたら、窓から差し込む光がえらく黄色くてビックリしました。前日の天気予報では「晴れ」となっていたので、明るいのは分かるんですが・・・。

　あれ～？と思ってウェザーニュースを見てみたら、黄砂が飛んできているとのこと。なるほど。そりゃ黄色いわけだ。

　こんな日は家から出たくないんですが、諸般の都合により出かけることに・・・。とはいえ、せっかくなので写真なんか撮ってきてみました。

　時間は午前10:00くらい。大津通を桜通大津の交差点付近から南（栄方向）に向かっての１枚です。なんか朝霧か朝靄がかかってるみたいに見えますねぇ。

　11:00頃にはすっかり収まってたんですが、外を歩くにはマスクが無いと(ちょっと)辛かったっす。

JavaScriptからradioボタンの情報を取得しよう

javascriptからHTMLのradioボタンのどれが選択されているかを取得するための覚書です。

サンプルソースは以下のとおりです。

<INPUT TYPE="radio" NAME="r1" id="r1_1" VALUE="ATM-09-ST" onChange="radioSelect()">   <label for="r1_1" id="lr1_1" style="cursor: pointer;">スコープドッグ</label><br> <INPUT TYPE="radio" NAME="r1" id="r1_2" VALUE="ATM-09-WR" onChange="radioSelect()">   <label for="r1_2" id="lr1_2" style="cursor: pointer;">マーシードッグ</label><br> <INPUT TYPE="radio" NAME="r1" id="r1_3" VALUE="ATM-09-SA" onChange="radioSelect()">   <label for="r1_3" id="lr1_3" style="cursor: pointer;">スコープドッグII</label><br> <script type="text/javascript"> function radioSelect() {   var element = document.getElementsByName("r1");      for(var i=0; i<element.length; i++) {     if (element[i].checked) {       var labeltxt = document.getElementById("l"+element[i].id).innerHTML;       alert("選択されたのは "+i+" 番目の「"+element[i].value+"」（"+labeltxt+"）です。");     }   } } </script>

実際には「どの項目も選択されていない」という状態がありえるので、場合によっては「何も選択されていない状態」を判定することが必要かも。

もしくはchecked属性（XHTMLでは checked="checked"、HTMLでは checked）を付けて、予めどこかが選択されているようにするとか・・・。

余談ですが、radioボタンに対応する文言をlabelタグで囲んでradioボタンに関連付けしておくと、文言をクリックしてもradioボタンにチェックが入るようにできます。

この場合、該当のlabelタグにCSS（cursor: pointer;）を使って、マウスが乗ったらマウスカーソルが指マークになるように指定しておくのが良いみたい。

ところで、今回久しぶりにradioボタンのHTMLを書いて思ったんですが、radioボタンのグループを括る条件（？）ってタグのname属性だったんですねぇ（完全に忘れてました）。

なんつうか、グループ化するためのコンテナに当たるタグが無いってのは、なんとも不思議というか何というか。きっと歴史的（もしくは政治的）に仕方なかったんですよね。きっと。

参照リンク
　・JavaScriptで radio ボタンのvalue値取得 - JavaScript入門
　・radioボタンの選択をJavaScriptで調べる - パソコンＱ＆Ａ

JavaScriptからselectタグの情報を取得しよう

javascriprからHTMLのselectタグの選択されている要素の値を取得しようとすると、該当のselectタグをオブジェクトとして引っ張ってきて、どのoption要素が選択されているか判定して、値を取り出さなくてはいけません。

でも、あんまりselectタグを使う機会がないので、いつも忘れちゃっうんですよねぇ。で、その都度検索するのもバカらしいので、自分用にメモメモです。

サンプルソースは以下の通りです。

<select id="s1" onChange="selectedValueSample()">
  <option value="MS-06F">ザク</option>
  <option value="MS-07B">グフ</option>
  <option value="MS-09">ドム</option>
</select>

<script type="text/javascript">
function selectedValueSample() {
  var element = document.getElementById("s1");
  for(var i=0; i<element.options.length; i++) {
    var option = element.options[i];
    if(option.selected) {
      alert("選択されたのは '"+i+"' 番目の「"+option.value+"」( "+option.innerHTML+" )です。");
    }
  }
}
</script>

ビクターのカナル型ヘッドホン「HA-FX700」を試聴してきました

　前から気になっていた、ビクターのカナル型ヘッドホン「HA-FX700」を試聴してきました。

　この製品の最大の特徴は、振動板とハウジング部に木を使用していることなんですが、木の部品が採用されたのはこれが初ではなくて、前に「HP-FX500」って製品が出てたりします。

　当然「HP-FX500」も試聴したことがありますが、「まぁ、こんなもんかな」といった感じで、特に欲しいとは思わなかったんですが・・・。

　「HA-FX700」は別物でしたね。試聴して「欲しい！」と思ったヘッドホンは久しぶりです。つか、カナル型は初めてです。

　まず音が柔らかいんです。でもメリハリが無いわけじゃなくて、音の表情は非常に豊かです。サンプルとしてジャズが流れてたんですが、ウッドベースの弦の振動が見えるような音がするんですよ。いや～ビックリ。

　ちょうど隣に「HP-FX500」があったんで聴き比べてみたんですが、音の作り方（て言うか、方向性？）にはそう違いがないんですが、表現力が明らかに違うんですよ。当社比1.5倍みたいな感じです。

　しか～し、いい音ってのはそれなりのお値段がするもので、「HA-FX700」の場合、実売価格で２万円台前半ですからねぇ。「衝動買い」はちょっと無理でした・・・orz

参照リンク
　・インナーイヤー・ヘッドホン　HA-FX700　｜ビクター
　・ビクター、木製素材のユニット＆ハウジングを搭載したカナル型イヤホン「HA-FX700」を発売 - Phile-web

備考：過去に試聴して「欲しい！」と思ったヘッドホン
　・Bose on-ear headphones
　・audio-technica ATH-CM7TI (生産終了)

　

「Victor ステレオミニヘッドホン HA-FX700」の詳細をAmazonで見る。

オーディオ用のマイクをPCに繋ぐにはアンプが必要とな

　オーディオ用のマイク（いわゆる「ボーカルマイク」ってやつ）をPCに繋げなきゃいけなくなったんですが、そのままPCのマイク端子に挿すのマズイみたいなんですよね。

　PCのマイク端子ってば「プラグインパワー」という仕様らしく、端子に電源が来てるみたいなんです。対してオーディオ用のマイクは電源不要ですから、仕様が違うというわけです。

　試しにWebでちょっと調べてみたんですが、「そのまま挿してＯＫ」ってのから「挿したけど音が拾えない」とか「そんなコトしちゃダメ」ってのまで人によって意見は様々でした。

　どうやらサウンドボード（というか端子？）がオーディオ用のマイクに対応してれば、そのまま挿してもＯＫということのようなんですが、うちのＰＣは非対応っぽいんだなぁ。

　じゃぁ、全く方法が無いのか？というとそうでもなくて、マイク用のアンプ（マイクロホンアンプ）を通して、ラインインから入力すればＯＫと言うことなんですね。

　つうわけで、大須のアメ横で「audio-technica マイクロホンアンプ AT-MA2」を買ってきました。

　このAT-MA2ってのはなかなか面白いというか優れものでして、入力はφ3.5mmとφ6.3mm両方の端子が用意してあるし（同時使用はできません）、アナログマイクでもステレオマイクでも使えます。さらにプラグインパワーにも対応（スイッチでON/OFFします）してますし、ボリュームまで付いてたりします（いや、アンプですから）。

　出力はステレオのピンプラグになっているので、ピンプラグをステレオミニプラグに変換（？）するケーブル（例えばSONYのRK-G129とか）でアンプの出力とPCのラインインを繋いでやればＯＫってわけです。

　かくして、無事にマイクの音がPCで拾えるようになりました。

　それにしても、PCのマイク端子って「マイク端子」って言うくらいだから、ジャックの合うマイクなら何を挿してもＯＫだと思ってたんですけどねぇ・・・。いい勉強になりました。

　

「audio-technica マイクロホンアンプ AT-MA2」の詳細をＡｍａｚｏｎで見る。

table の枠線を１本の細い線にする方法

tableの枠線を細くするための覚え書きです。

何も指定しないとこうなりますよね。

<table border="1"> <tr><td>セル１</td><td>セル２</td></tr> <tr><td>セル３</td><td>セル４</td></tr> </table>

セル１	セル２
セル３	セル４

この二重になってる枠線を１本の線にしたいわけですよ。

まず最初はHTMLだけで指定する方法。

<table border="1" cellspacing="0" cellpadding="0"> <tr><td>セル１</td><td>セル２</td></tr> <tr><td>セル３</td><td>セル４</td></tr> </table>

セル１	セル２
セル３	セル４

次はCSSを併用する方法。

<table border="1" style="border: 1px solid black; border-collapse: collapse;"> <tr><td>セル１</td><td>セル２</td></tr> <tr><td>セル３</td><td>セル４</td></tr> </table>

セル１	セル２
セル３	セル４

ちなみに border="1" を指定しないとこうなります。

セル１	セル２
セル３	セル４

最後はCSSのみで指定する方法。

<style type="text/css"> #table { border-collapse: collapse; border: 1px solid black; } #table TD { border: 1px solid black; } </style> <table id="table"> <tr><td>セル１</td><td>セル２</td></tr> <tr><td>セル３</td><td>セル４</td></tr> </table>

セル１	セル２
セル３	セル４

とまぁ、こんな感じかなぁ。

なお、１つめと２つめの方法はブラウザによって見え方(？)が微妙に異なってくるようです。

父ちゃん！これじゃない！！

　仕事の帰り際に、娘からメールがありました。

　「父ちゃん、帰りに『マリア様がみてる』のDVDの１巻、借りてきて」

　というわけで、帰りにレンタル屋によって、探して探して借りてきました。

　家に帰った僕からDVDを受け取った娘は「わ～い！ありがとう！」と言ったきり、しばしの沈黙・・・。

　あれ？やっちまいましたか？私。

「父ちゃん！これじゃない！！」

　あぁぁぁぁぁぁぁぁぁぁぁぁ、ごめんなさいぃぃぃぃぃぃぃぃぃぃぃ。

　娘によると、僕が借りてきたのは4thシーズンの１巻で、娘が観たかったのは1stシーズンの１巻だったんだそうです。「マリア様がみてる」までは合ってたんだけどなぁ。残念。

　しかし娘よ、父も一言いいたい。

「複数のシーズン（シリーズ）があるんなら、最初に教えといてよ」

娘がパソコン検定を受検するというので

　娘がパソコン検定の４級を受験するってんで、受験勉強に付き合ってみました。

　大まかな内容としては、「パソコンの基礎知識」「ワープロソフトの活用」「プレゼンテーションソフトの活用」「インターネットの活用」「情報モラルと情報セキュリティ」「表計算ソフトの活用」となっております。

　「娘よりは詳しいだろう」と軽く考えてたんですが、そもそも対象の OS が Windows Vista ってあたりで、早くも挫折気味。だって、家も会社も XP なんだもん。

　もちろん対象の Office は 2007 であります。でも、会社の Office は 2003 だし、家のは OpenOffice.org なんですよね。しかもパワポなんか触ったこともないし。

　というわけで、「インターネットの活用」と「情報モラルと情報セキュリティ」くらいでしか役に立てませんでしたとさ。

　せっかく「父ちゃん、スゲェ！」ってところを見せてやろうと思ったのにな。がっかりです。

　ついでにWebブラウザはIEだし、メーラーはOEなんだもんなぁ。まぁ、仕方ないんだけどね。でも、ウチは基本が Firefox と Thunderbird なもんで、娘的にはかな～り戸惑ったみたいです（苦笑）。

　まぁ、そういったアプリの使い方はともかくとして、個人的にはインターネットにかかわるところのセキュリティであるとかモラル（って言うか、ルール？）やエチケット（ネチケット？）。著作権や個人情報に関する考え方や知識を、ある程度まとめて学ぶ機会（きっかけ）として、なかなか良かったのではないかと思います。

とはいえ、試験は明日なんですよね（笑）。こんな一夜漬けで大丈夫かなぁ？

参照リンク
　・Ｐ検-パソコン検定試験　ICT利活用能力を証明するCBT方式の資格試験