2008年04月20日
program.jpg

久々にPHPを使ってプログラムを組んだ。

今週、仕事中に先輩と話している際に思いついた、面白いと思ったアイデアを週末2日つかって実装してみた。

前職でプログラムの才能がないと引導を渡された時はずいぶんと落ち込んだけど、やっぱり作業効率化のために思考を巡らすのは楽しい。

共通部分を探してモジュール化したり、繰り返し処理ができる部分を探してループさせたり、変数が引き渡しが可能かを試してみたり・・・。

XHTML + CSS + Photoshop + Adobe Premiereで見た目を表現する能力だけじゃなく、アイデアをテンプレート化する最低限の力はやっぱり欲しいなあ。


【お祝い】先輩夫婦に娘が産まれた。ご出産おめでとうございます。
人として、日本人として、人生における必須事項(イベント)を順調に進めてる二人を尊敬してます。

秒速5センチメートル 通常版
コミックス・ウェーブ・フィルム (2007-07-19)
売り上げランキング: 712
おすすめ度の平均: 4.0
4 最後を除き最高の作品
2 心は動かされましたが…
5 ありふれた出来事、だから心が締め付けられる
5 せつない 恋。そして、大人になってしまうのだ...
4 唐突に・・分かってしまった・・・・

ピクチャ 1.jpg

春、皆新しいスタートを始める季節。
3月末で仕事の山場を乗り越え、4月中旬となった今では緩やかな日々を過ごせるようになった。

気持ちに余裕ができはじめたところで、タイミング良く懐かしい面々から連絡が入る。
なんてタイミングが良い奴らなんだ。

はじめは、高校の友人。
東京に来る用事があるから帰りに泊まらせてくれってことで、我が家に来た。
高校の友人は、当時と容姿・性格とも、まるで変化がなく・・・
というよりも、成長というものがまるでなく、
そんな友人を見て危なっかしい高校時代を懐かしく思った。


次は、中学の友人。
この友人は僕の住んでいる街で接客業をしている。
最近僕の帰社時間が早くなったこともあって、駅前でばったり再会した。

去年も一度、同じような形で再会していたのでびっくりした。
この友人とは1年に1度の確率で繋がっているみたいだ。

週末に飲むことを約束し、自宅へ招かれ、お互い自然と眠りに落ちるまで、思いで話に没頭した。

友人の部屋は中学時代会話した印象とは似ても似つかなく、
どんな10年間を過ごせば、僕が当時描いていたイメージとこれほどすれ違ってしまえるのだろうかと思った。

中学の時の友達って、相手のことを何でもわかった気になっているだけで、
相手がどんな将来を考えどんな大人になり、自分とどういう距離感を持つかなんて、
想像することもない軽い関係だったんだなと、今は思う。
というより、その日、その時、その場所が楽しければ良かっただけなのかもしれないけど・・・。


最後に、大学の友人から飲みの誘いがあった。
彼らに会うには少し勇気が必要な状況だったが、この機会に会う事を決めた。

中学・高校・大学、どの時代に戻りたい?
と聞かれれば僕は大学と即答するだろう。

それだけ、あの場所には僕の大切なものがある。

大切なものに後ろめたさを感じたくないから、
だから彼らに話した。仕事を辞めた事、転職した事。

少しびっくりしていたようだけど、あいかわらずの軽いノリで僕の今後を応援してくれた。



これで、少しづつまた前に進み始めることができそうだ。
今年はどんな一年になるのか今から楽しみだ。


小説・秒速5センチメートル (ダ・ヴィンチブックス)
新海誠
メディアファクトリー
売り上げランキング: 207
おすすめ度の平均: 4.5
4 読んでる途中に例の曲が頭の中で流れます
5 読んでもらいたい、そして映像をもう一度みてもらいたい
5 心に不思議な感覚を抱きます
5 小説も書ける新海誠
5 “奇跡”を踏み台にして
webrenu.jpg

4ヶ月かけたWebサイトリニューアルの案件がようやく一段落した。
自分の新しい可能性と未熟さを感じたこの4ヶ月間の反省をまとめてみようと思う。

外部CSSからの背景指定はCSSファイルを基準として指定でOK


今回の案件ではサイトを全ページXHTML+CSSで作成した。
CSSをモジュール化し外部ファイルで管理、htmlから必要なものだけimportする構成にしたのだが、
外部CSSでbackgroundに指定した背景が表示されない事態に遭遇した。

これまでも、外部CSSで指定した背景が表示されないことがあったけど
原因を調べないまま、絶対パスで背景指定して対応してきた。
基本を理解してないことが今回の案件ではっきり浮かび上がった。

原因は画像へのパスを外部CSSを読み込む先のhtmlを基準に記述をしていたため。
外部CSSから背景画像を指定する際は、外部CSSを読み込んだhtmlを基準に指定するのではなく、外部CSSを基準にパスを指定すること。


記述ミスはバリデータでチェック


今回コーディング作業中に混入した1文字のタイプミスのせいで全ページが表示崩れする事態になった。
作業中ならば、それまでの作業過程を思い出しなんとなく問題箇所に心当たりがつくものだけど、
休憩後や日をまたいでしまうと、すっかり忘却の彼方。

今回の表示崩れの原因は、ファイルを保存する際にしたタイプミスだった。
昨日は何ともなかったに!と原因究明にあたったのだが、中々問題箇所を見つけられず時間だけが過ぎて行った。

バリデータを使うことを思いついて、チェックをかけたら
表示崩れを起こした原因であるたった1文字の混入を一瞬で見つけてくれた。

XHTMLコーディングの過程で何か壊れた際には、速攻バリデータでチェック


案件で使う文字コードで強制的にファイルが開くようエディタを設定しとく



head内で指定した文字コードと、実際の文字コードが違う場合
Firefoxでは表示されてもIEでは文字化けしたり、表示がごっそり消えたりする事態があった。
開発中はテキストエディタに案件で使う文字コードだけで強制的に開かられるよう
事前に設定しておくのが良いかも。

js外部ファイル化した共通メニュー部分がごっそり消えたときはあせった。
jsファイルだけ文字コードが違ってったのが原因。


Google AJAX Feed APIはdivをネストするとIEでエラーになる



今回の案件でGoogle AJAX Feed API を利用したRSSティッカーを制作した。
Google AJAX Feed API は、利用したページでdivをネストするとIEでエラーを吐く。
XHTMLで構成されたページでの利用推奨しているのに、これは酷い。

Firefoxではエラーにならないところがやっかいで、
納期ぎりぎりのタイミングで実施したIEでのチェックで初めてエラーが発覚し、かなり青ざめた。

以前Google Mapsを利用したページを作成した際に経験していた現象だったので、原因がわかれば、どうにもならないことがすぐに納得でき、iframe化する事で乗り切ったが、気がつくのが遅れてしまった。

今後、他社が提供しているAPIを用いる際には、何かしらの制約がないか、よく調査して導入を検討する必要があることを再認識。

Google AJAX Feed APIはdivをネストするとIEでエラーになる。XHTMLコーディングでティッカー部分にデザインをかぶせる場合、divで括らずAPI呼び出し部分を記述する事は難しいので、
Iframeで対応するか、導入事態を再検討する。



IEでの動作確認は早めにしとく


web制作をする際はFirefoxを基準に動作確認をしている。
今回のリニューアルの案件ではIEでの確認作業を後回しにしたことで痛い目にあった。

Google Ajax Feed APIの件もそうだが、firefoxでは何事もなくとも、
IEでは閲覧すらできない状態なんていくらでもあるのがブラウザ界の現状。

時間の節約を考えて、後でまとめてIEでチェックすればいいやなんて考えで、
作業を進めて行くと致命的なミスの発覚が遅れ、原因究明に時間がかかる。

IEチェックは後でまとめてと言わず、まめにチェック。



サイト設計図は素晴らしい


リニューアルにあたり、サイト構成図、ディレクトリ構成、サイト設計図の三つを作成。
サイト構成図、ディレクトリ構成はともかく、サイト設計図はデザイナー、クライアントとの交渉で絶大な効果を発揮した。

当初、制作チームの皆はサイト設計図でがちがちに指定するやり方を疑問視していたが、
納期が迫ってきた時期ではなんだかんだで食い入るように設計図を確認していたので、
サイト設計図をはじめに作成することの重要さを実感して貰えたと思う。

問題は一度決めた設計図を、案件の途中でひっくり返すことは時間的にも精神的にも不可能て事。
一度作業ベースに移ると、設計図の見直しと修正をして関係者に共有するのが非常に面倒い。

また制作途中でクライアントが方向転換を希望してきた時には、納期的にもどうにもならなかったので
土下座もいとわない気持ちでごめんなさいした。いやもうこれは本当ごめんなさい。

サイト設計図の作り込みは大事だと思った。
なるべく案件が走り出した後、早めに作成して、ミーティングでブラッシュアップを重ねるのがクオリティアップに繋がると思う。
HTMLコーダー的にはディレクトリ構成と命名規則とかも、適当でいいので早めにクライアントに相談しておくと後の作業が楽になる。

サイト設計図の作り込みがそのままサイトのクオリティに繋がる



クライアントと真っ直ぐ向き合う事。


正直今回の案件、クライアントの希望を30%も満たしていないと思う。
サイトのアクセス数を増やすため提案したサイト構成がクライアントの希望と180°方向性が違っていた。
その状態から始まったこの案件を上手くコントロールできたかと問われれば非常に自己評価は低い。
クライアントも制作チームも時間をかけたわりには妥協点が多い部分があった。
場数を踏んでコミュニケーションスキルを高めない事には、この点は改善できないと思った。

特に今回ディレクションする時に、HTMLコーダー脳が働き、
コーディングする際に非効率な構成にならないよう無意識にコントロールしてた気がする。

クライアントから逃げない。コミュニケーションは大事。



z-indexの指定はpositionと一緒にする


z-indexを指定する時に一緒にpositionを指定しないとFirefoxで意図した重ね順で表示されない。
IEだと上手く行って、Firefoxだと上手く行かないケース。

z-indexあれこれ
●position プロパティで [fixed] [absolute] [relative] のいずれかの値を持つ要素(つまり [static] 以外の値)にのみ適用される
●z-index プロパティの [auto] はボックスの重なり順が親要素と同じになる
●[整数] は値が大きいほど値が小さいボックスよりも前面になり、小さいほど大きい値よりも背面に配置される
●[整数] はマイナスの値も指定できる



他にも色々反省点があるので、追記予定。
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。