今週した事まとめ

なんかてんやわんやとしていたのでまとめますね。

今週の火･水･木は、大阪の祭始めとされる「愛染祭」に参加しました。
といっても遊びに行ったわけではなく、ボランティア活動として参加しました。
ゴミ拾いや掃除、自転車整理、宝恵駕籠(ほえかご)と言われる愛染娘の担ぎ駕籠の解体や音響まで幅広くサポートし、充実の3日間を体験しました。
特に1日目2日目は雨で、びしょ濡れになりながらゴミ拾いを行いかなりへとへとになりましたが、祭自体テンションが上がる行事ですので、比較的楽しいままに終了する事が出来ました。

愛染娘さんからおみくじを買ったのですが、見事に中途半端な小吉でした。
4月に住吉大社で買った恋愛おみくじは大吉だったのですが、その他の運に関してはそれほど無いようです。

あとは、「はてなブックマーク」のアカウントを作りました。
はてなブックマーク - ほるめす のブックマーク
きっかけは、Sleipnirを制作・配布している「フェンリル」の「あの話題のデバイス」プレゼントキャンペーンです。
応募するだけならタダですし、もらえるモノはもらっておいて損はしないですから。
はてなブックマーク自体は初めて使ってみますが、ブックマークをネット上に置く理由はあまりないかなぁと思います。
こういうように、ブログに貼り付けて便利なサイトを共有したり、自分の家にあるPCのお気に入りと同期して外部から見られるようにする以外は使い道を見出せないですね。
しばらくは様子見です。

こんな感じです。
今週は忙しかったので、この土日はゆったりと過ごす予定です。

とりあえずテンプレ変更

ずっとほったらかしだった、IE6による描画問題を解決しようと思ったのですが、
結果的には、元からのテンプレートが問題のようだったので変更しました。

Bloggerはテンプレートの種類が少なくて味気ないですね。
結果的にはHTMLとCSSなので、中身までざっと変えればいいのですが。
少しSeesaaとかのほかのブログがうらやましいです。

グミ人（グミんちゅ）ブログ

どうやら友達がブログを始めるそうで。

グミ人（グミんちゅ）ブログ

コンビニなどで売っているグミのレビューをするそうです。
最近、コラーゲンが手軽に取れるなどの理由でグミブームがきてるとかきてないとか。
長く続いてもらえたらうれしいです。
まだまともな記事が無いのが気がかりですが・・・。

HTML+CSS エラーメモ

※追記：書いてから見てみると出来てますね。
　　　　え、なんで？
※さらに追記：原因(？)がわかりました。
　　　　　　　別のCSSファイルに書いたCSSをclass名で当てていたものが、
　　　　　　　うまく反映されていないようです。
　　　　　　　理由が分からないから余計に混乱します・・・。
作ってるうちにムカついてきたので、頭を冷やすついでにメモ。

HTMLとCSSを組み合わせてとあるページサンプルを作っている途中なのですが、テーブルのセル内でのレイアウトについて困っています。
それは、1行内に左右両端にそれぞれオブジェクトを配置して表示するということ。
物体1
物体2
とすると、ご覧の通り物体2が1行下に表示されます。
<div>
 <div style="float:left;">物体1</div>
 <div style="text-align:right;">物体2</div>
</div>
原因は、＜div＞を使用しているせいです。
＜DIV＞－HTMLタグリファレンス
＜div＞は、自動的にその前後で改行を行う「ブロック要素」なのです。

それでは困ってしまうので、改行されない＜span＞を使います。
物体1物体2
すると今度は、物体2が左に並べられてしまいます。
<div>
 <span style="float:left;">物体1</span>
 <span style="text-align:right;">物体2</span>
</div>
これも原因は＜span＞を使用しているせいで、「text-align」が適用されないのです。
text-align - CSS Dencitie
こちらにある通り、「text-align」は「ブロック要素」に適用されるものであり、＜span＞のような「インライン要素」には適用されないのです。

んー、これはどうしたものか・・・。
1行に左右両端とも表示出来るような違うやり方があるのか、はたまたこれに似た方法があるのかわからないです。
もう少し考えてみることにします。

PC修理講義メモ

PCの修理に関しての講義があったのでメモ。

先に書いた記事で、マシンやネットワークの管理をしている組織があるという話をしました。
マシンの管理といえど、マザーボード上の異変までは流石に検知できない状態ではあります。
そんな「マザーボードのエラー専門」の先生なんて居ない事も含め、「修理するためのマシンがないと講義もできない」事も、知識不足となる原因ではあります。
今回は良い機会に恵まれたので、特別詳しい先生をお呼びして講義をしていただきました。
上の画像は、その時の説明に使われた図です。

赤線に囲まれている領域が、最低限の状態で起動する場合。
その時に起動出来なかったら、マザーボードの何らかのエラーである可能性が高いと言えます。

今回講義に使用したマシンは、LANケーブルを接続するとフリーズしてしまうという問題がありました。
ですので、起動したマシンにLANケーブルを挿してみます。
すると、BIOS画面でもフリーズするマシンがちらほら。
マザーボードを覗くと、コンデンサが少し膨らんでいるのが目視できました。
この事より「コンデンサの不良・破損による暴走」が、LANケーブル接続時フリーズの原因であることがわかりました。

こういった現象は、実際に知っている人に聞かないと分からないですし、調べようの無い事じゃないかと思います。
ネットワークがより活発化してるこの時代なのにと思うかも知れませんが、マザーボードが原因だと予想は付いても検証できないのが現実でした。
このような講義はこれからも多数していきたいなと思います。

「根拠」と「ぐらい」

別にグチを書くつもりはないですが、僕にしては重要な事なのでメモ。
誰かが見て「へぇー」程度に思える内容で。


学校の授業とは別に、校内のマシンやネットワークを管理している組織があり、放課後に業務を行っています。
僕はその組織のリーダーで、業務を振り分ける際に重要にしている事があります。
それは「根拠」。
「この作業は、こういうために必要だから行う」といった事です。

例えば、部屋に並べてあるマシンを全て部屋の後ろに片付ける、という作業。
それだけの情報では、ただ単に片付ければ済む話で、作業する人にとっては「片付ければいい」だけです。
そこに「根拠」を付ければ、この作業に対する意識も大幅に変わります。
今回の「根拠」は、「その部屋を保護者会時に使用するため」なので、作業する人は「その為にはどういう事をすべきか」を考えて行動する必要があります。
保護者会で部屋を使用するということは、その学校に通っている生徒の保護者がその部屋を見るということ。
後ろに並べられたマシンを見て、「印象の良い学校」と思うか「印象の悪い学校」と思うかは、マシンを片付ける人に委ねられます。

そこまで大げさな事を言うのかと思うかも知れませんが、このぐらいの考え方を組織のメンバーにも持っていてもらいたいです。
今回の例はマシンを片付けるという事でしたが、他の作業でも重要になることですし、就職活動での「志望動機」などにも応用できる考え方です。
そういったモノの考え方をして、もしそれが見当違いのミスであるとしても僕は咎めないですし、むしろ学生でそういう事を勉強しておく良い機会ですから。


それに加えてして欲しいこと。
組織の業務を行う上で、必要になる備品を置いてある棚には当然鍵を掛けていて、組織の人しか触れられないようになっています。
部屋の鍵をかける時には、棚の鍵をかけ窓の鍵を確認し、さらにマシンとモニタの電源が付いていないかを確認する必要があります。
困ったことに、それが出来ないメンバーが少なくないのが現状です。
こういった事は、現場を押さえて注意することが重要になりますが、何せ帰った後には注意できないので悩んでしまいます。
そもそも、組織で「しなければならない事」として話してあるので、「それぐらい」はして欲しいのです。
普通に始業時間に学校にいるように、「当たり前の事を当たり前」にして欲しいのです。

学生であるからまだしも、社会に出れば「常識」が「当たり前」なので、上の「根拠」と同様に学生の間に知っておいてもらえたらなぁと。
そういう組織に入っているのだから、技術だけでなくこういう事も勉強してもらっていても良いと思うのです。

んー、結局グチみたいになってしまいました・・・。

珍しい画像

珍しい画像が取得出来たのでメモ。

どうも、モニタの情報が取得出来ない場合に発生するようです。
実際には、解像度が800*600で4ビット表示だったと思います。
表示された時にはド肝を抜かれ「うおあぁー！」と叫んでしまいましたが、モニタケーブルを挿し直すと元の設定に戻せました。

細かい話ですが、最近のモニタは「プラグアンドプレイ」形式なので、USBメモリなどのようにドライバが不要・自動でドライバを割り当てる事により、複雑な割り当て設定は不要です。
なので、何も知らない人からしてみたら、僕以上に困惑して「パソコンに詳しい人」に泣きつくんだろうなぁと思います。
再起動して急にこんな画面になっても、ケーブルのせいだとは思わないでしょうし。

Amazonプライム やめました

一ヶ月前ほどにAmazonプライムでの迅速な宅配ライフをエンジョイしていましたが、年会費を払う時期に差し掛かったので停止しました。
実はもうすでに請求が着ていて、キャンセルすることによる返金が発生しています。
気付くのに3日遅かったのです。

やめた理由としては、2つあります。
1つは「宅配が届く時間に家にいない」こと。
いくら早く届こうとも、いくら時間を正確に持ってこようとも家にいなければ受け取れませんし、宅配便のお兄さんに迷惑ですから。
もう1つは、「そもそもAmazonを多用しない」こと。
この1ヶ月間で、Amazon店内で商品を買ったのが2つ、マーケットプレイスで1つです。
そのうちAmazon店内での商品しかプライム対象にならないので、あまりにも利用回数が少ないのが明白です。

大きなものを買ったりなど、別途送料がかかるものであれば、やはりお得なのかなぁと思いました。

表示エラーについて

追記：右メニューを見てみると「読者」がうまく表示されていなかったので、
　　　ひとまず削除しました。
　　　これで落ち着けばいいのですが・・・。

今日友達から聞いた症状なのですが、このブログを表示しようとすると「ブラクラ的」な事が起こってしまうようです。
ここで言う「ブラクラ的」とは、同じページを複数自動で生成しようとする動作のことです。
僕の方では全く感じていなかったことですが、「Sleipnirで表示してもIEで開こうとする」など、不思議な動作も起こるようです。

当方ではそういった症状は起こっていないものの、時折「開けません」のエラーは表示されます。
閲覧環境が「IE8」で、上に挙げた動作は「IE6,7」で起こっているとの情報をもらったので、その間に何か動作の差が起こっているような気がしないでもないです。

画面の表示を見ている限り、どこかでJavaScriptのエラーが起こっている気がします。
こちらとしては、ブラクラ的なスクリプトを仕組むことはありませんし、意図的にエラーを発生させようとはしませんので、もしそのようなエラーが発生した場合には出来ればキャプチャを添えて連絡してもらえたらと思います。

Sleipnirプラグイン Hawkeye

常日頃使っているWebタブブラウザ「Sleipnir」での、便利な機能を紹介します。
Sleipnirでは、Firefoxなどに比べてまだプラグインやスキンは少ないです。
ただし、少ないゆえ(?)のシンプルさもあり、個人的にはSleipnir使いならば使うべきだと思います。

で。
今回紹介するのは、プラグイン「Hawkeye」。以下からダウンロードできます。
Sleipnir｜プラグイン｜レイアウトの調整、CSS・HTML のエラー修正などの Web 開発補助ツール Hawkeye
Hawkeyeは開いているページ内のHTMLを解析し、情報を抽出することが出来るプラグインです。


インストールすると、通常左にあるエクスプローラバーに緑色のタカのアイコンが表示され、そのアイコンを選択することでメニューを表示出来ます。
上のキャプチャは「デザイン」メニューで、他には「校正」「アクセシビリティ」「SEO」「デバッグ」「解析」があります。
何が便利か、と言うのが今回書きたい内容ですが、量が多すぎる事とまだ全部使えていない事を踏まえて、今回は「デザイン」のみの解説を。


「解析：クリックした要素の詳細を表示」
その名の通り、クリックした部分のオブジェクトの情報を表示します。
上のキャプチャはBlogger投稿画面の、タイトル横のINPUTを選択した時の情報です。
HTML内の階層のどこにいるか、そのオブジェクトが持つスタイルの情報などの表示がされます。
わざわざINPUTを立体的に見せるために、枠線も1本ずつ違う色に選択してるのが分かりますね。


「枠線」
この中で選択したものに対応して、HTML内の要素に枠線を付加して分かりやすくします。
上のキャプチャでは、「要素名も表示」して「H要素」に枠線を付加した状態です。
どの部分に＜H1＞～＜H6＞要素が使われているかが一目でわかります。


「CSS」
HTML内にあるCSSに関する情報を操ることが出来ます。
上は、このブログの「すべてのCSSを無効」にした状態です。
外部から呼んでいるCSSだけでなく、要素にStyleとして付加したCSSも無効化され、ページを作成する際などの解析に応用できます。
ブログではいかにCSSを多用しているかが分かりますね。


「HTML」
ここでは、表示されているHTMLを編集することや構造をGUI的に表示することが出来ます。
上のように、階層を色分けして表示出来ますが、階層が深すぎると訳が分からなくなります。
「HTMLを編集」することで、リアルタイムにページに書き換えが反映され、「ここにこれを入れるとこうなる」といったデモンストレーションとして利用できます。



「表示」
今回一番推したい機能です。
HTML内の要素のidや色の情報を取得出来ます。
キャプチャ1枚目が「id,class属性値」、2枚目が「色情報」をそれぞれ表示した状態です。
idが分かれば便利な時と言えば、JavaScriptで要素を操作する時ですね。
idさえ分かれば、あとはその大きさもスタイルも中の値も変え放題ですから。
「色情報」が1発で表示出来るのも嬉しいです。
サイトを見ていて「この色が欲しい」と思った時にさっと使えます。
欲しい情報を局部的に即座に出せる機能は本当に便利だと思います。


「画面」
ウィンドウのサイズの表示と変更が出来ます。
あまりブラウザを細かく表示したりはしないので、使い道が分からないです。
キャプチャする時に「どうしてもこのサイズじゃないとダメ！」というぐらいじゃないかと。


以上で、「Hawkeye」メニュー「デザイン」の解説は終わりです。
適当にサイトで有効/無効に機能を切り替えるだけでも、思わぬ発見があったりします。
特に最近のウェブサイトは入り組みすぎて「どうやってこの構造を生み出してるの？」というのが多々ありますから。
そういう意味では、テクニックを奪う為の1つの案としてもいかがでしょう。