XHTML+CSSの最近のブログ記事

AUの実機でとあるフォームのサブミットボタンを押したら、「クリア」ボタンとか十字キーの左を押したときのように、前画面に戻ってしまう、という現象が発生した。

会員登録とかに代表される入力項目がたくさんある入力フォームを見ると、パソコンの、ワードの、キーボードのプロであるところの僕ですらうんざりする。一言でいうと苦行。
たくさん入力したすえに登録ボタンを押したら「〇〇が間違ってます」とか言われると悲しくなる。もっと早く言えよ、と思う。
ということで、できるだけ入力フォームの苦行を和らげる工夫を調べたり、考えたりしたのでメモ。


たぶん間違いないと思うんだけど、jCarouselってスクロールのためのボタンは自動生成のみで、任意のところには置けない仕様になってる。

CSSである程度はカスタマイズできるものの、タグ構成としては位置が決まってしまっているのでどうにもならないケースもでてくると思われる。というか、でてきた。

こうなったら、jCarousel自体をいじるしかない。
jCarouselLiteがverticalだとIE7で表示崩れがおきてしまい、追っかける気力が
なかったのでjCarouselを使うことにした。

やっぱLiteに比べて手順が多いのでメモ。


こんな状態のときに"編集"ボタンを押すとフォームが送信されちゃう。

<form>
~略~
<button id="inputSwitch" >編集</button>&nbsp;<input type="submit" value="仮登録" />
</form>
EC2でCentOSにLAPP(Linux+Apache+PostgreSQL+PHP)環境を構築の続き。
EC2はインスタンスを止めると、それまでの変更はすべてパーになる。だから重要なデータはS3とかにバックアップをとらなくちゃならない。とはいってもDBのデータとかいちいちS3にバックアップとってるわけにもいかない。


登録フォームあるじゃないですか。名前入れーの、住所入れーの、生年月日入れーの。の生年月日が悩ましい。

もっと言うとタイトルにあるとおり生年月日をプルダウン式にするか記入式にするのかが悩ましいんですよ。ああ、困った。さらに言うと、年と月と日それぞれ、どっちにするか悩ましい。


こんな記事を読んだ。

プログラマが生産性を上げるためにoperaを使うべき11の理由

そうですか。Operaですか。よさそうですなー、と思い早速Operaをインストールし、その便利さに感動。開発のメインブラウザとなりました。
そしたら、今日、入力フォームからの値がうまくサーバ側にPOSTできない、というよくわからんところでハマってしまい、1日を費やしてしまった。表示崩れとかJavaScriptがらみとかじゃないから、ブラウザが原因とは思っていなかったが、1日の終わりにIEとFFでやったら再現せず、どうやらOperaのみの問題のようだ、ということが判明。もともとOperaは保障ブラウザじゃないから対応はしないことにした。1日丸損。。

と、いうのは夢だったのでよかったんですが、こんなケースの発生を想像しちゃうと、やっぱIEかFF使うわ、と思ってしまう。つまり、筆者としては、多数ユーザーと同じ環境で開発したほうが後々不意打ち的な障害報告を聞く確率が減る、という考え方だったりするんですが、これって損してますかね?

ブラウザなんて1個だけになればいいのに!

先日紹介した究極のマルチカラムリキッドレイアウトを使ってページを作ってたときのこと。

FireFoxで確認しながら「だいたいできたかなー」と思ってIE6での確認をしたらレイアウトがガン崩れしてた。col1~col3のボックスがガッっと右に寄ってた。

数時間かけてわかった原因はXML宣言をコピペし忘れていたことだった。
#本家のソースをマルコピしたものからXML宣言を削除したら同じ現象が起こった。

つまりどうやらIE6の「後方互換モード問題」によるものっぽかった。
#後方互換モードの話は、「後方互換モード」でググれば死ぬほどでてくる

究極のやつは標準とか後方とかに影響される要素は使ってないんじゃなかったっけ、と思ったが、たぶん筆者の知識不足か英語力不足なんだと思い直し、更なる学習への意欲を燃やしたのであります。

ここのところ、XHTML+CSSを勉強しながらサイト作成に四苦八苦しているわけですが、またもお手本を探そうとインターネットしてたらすごいのが見つかりました。

Ultimate multi-column liquid layouts

訳して「究極のマルチカラムのリキッドレイアウト」。

詳しくはリンク先を見てもらうとして(英語できない人はがんばって読むと将来の幸せ度が上がると思います。筆者もがんばって読みました。)、筆者が印象に残ったポイントだけ挙げると、
・フルクロスブラウザ対応だよ
・XHTML 1.0 strictに準拠してるよ
・JavaScriptなんて必要ないさ
・画像は使ってないよ。デザインには必要ないさ
・お金?そんなものいるわけないじゃないか。勝手に使ってくれよ!

という感じで、とにかくすごいようです。

で、自力でシコシコやろうとしてたけど、どうせまったくそのまま使えるわけはないし、HTMLだけに時間を使ってられないし、いいお手本ベースでサイト構築するのはいいものに囲まれて育つのと同じで、きっとハイソなウェバーになれると思うんです。

と、いろいろ言い訳をしながら、これをベースに使わせてもらうことにしようと思っております。

あと、提供もとのマシューさんは、サイトのURLを書いてメールしてくれたらサンプルサイト一覧に載せるよ。そしたらタダでアクセス稼げるぜ?というオマケ提案も提供してくれているようです。

このアーカイブについて

このページには、過去に書かれたブログ記事のうちXHTML+CSSカテゴリに属しているものが含まれています。

前のカテゴリはUNIX/LINUXです。

次のカテゴリはrubyです。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。