サポートページ作り

PC講座

もう講座は始まってますが、サポートページの存在は受講生に伝えていないので1回目の講座が始まる4月11日までに完全リニューアルする予定。今日はトップページとそれ以外のページのレイアウトを決めるのに1日中かかりっきりでした。


去年はレイアウト一新のときに冒険しようとして失敗したので、今回は初心に帰って普通のレイアウトで構成してみました。*1でも、Webレイアウト本とか読んでもそう簡単にはレイアウトって決められないんですよね。


サンプル例はどれを見てもすごいきれいでよさそうなんですが、HTMLソースが全部載ってるわけじゃないので形を見た上で自分で一から構成しなおすことになります。そのまままったく同じ見た目を目指せして作ればいいのかもしれませんが、きれいなものは要所要所に画像を使っていたりするのでそれを用意するのが面倒なのもあります。


Webサイト作りで既存のものをぱくるのは常套手段ですが、そのままぱくるのは自分のプライドが許さないってのもあります。全部ぱくるのは許さないけど、一から自分で作ろうとしてもろくなものにならないということで、今年は本を見つつ良さそうなものを部分的に集めつつ、CSSテクニックを勉強しつつで作ってみました。


CSSをいじってて面倒なのがIEエンジンとGeckoエンジンの違い。
僕の知っているブラウザでは

とりあえずIEとFirefoxでチェックしておいたので大丈夫でしょう。


でもって、サンプル画像を用意するのにPictBear SEの使い方もちょっと勉強。その存在はかなり前から知ってたし、いつもインストールするアプリケーションのリストに入っているけどその使い方はほとんど知りませんでした。イメージの縮小がペイントよりもきれいにできるくらいの使い方しかしてなかったかも。

  • マスク編集で選択範囲を指定する方法
  • まわりをぼかして切り抜く方法
  • フィルタプラグインを使って水面を作る方法

画像編集って面白いなぁ。


PictBear‚Å•`‚­I
いろいろなフィルタプラグインを使って、水面とか作っているんですけど、この手順をどうやって思いつくんでしょうね。このフィルタを使ったらこうなるだろうっていうイメージが頭の中に完全に作れるのかな？


さて、んじゃ中身を作っていきますか。あ、そういや日程その他を管理するシステムも4月11日までに再構築しないと？明日はこっちの設計をしますか。PHP5で作る予定でしたが、ここでPythonを使うってのもありですね。


あぁ、ヒトカラ行きたくなってきた。

*1:もちろんいつものキャラクター付きで