«« PSP goのコンパクトっぽい外見にちょっとキュンときたかも | 引越しで揃えたい持っていきたいものリスト »»

WCAN「CSS3+jQueryを実際に使ってみよう!」で少しだけ発表してきました

2009年6月 5日

このエントリーをはてなブックマークに追加
CSS3やjQueryを皆さん使ってますか?今回名古屋のWeb開発者・デザイナ向け勉強会WCANが行われ、私も昨日「たてよみ」実装したCSS3のポイントを中心に少しだけ発表させてもらいました。


名古屋のWeb開発者・デザイナ向け勉強会WCANにて「CSS3+jQueryを実際に使ってみよう!」という勉強会が行われました。  

0900605wcan.jpg

で、実際に使っている方で発表者募集!とのことでしたので、私も少しだけながらと発表してきました。 

題材は、先日公開したiPhone/Android※向けテキストファイル縦書き変換ジェネレータ「たてよみ」

内容は『縦書きとCSS3におけるrotate指定』

ということで、iPhone/Android(※)で縦書きのWebアプリを作る際、どういった点について気をつけるべきか、またCSS3の適応例を簡単ながら説明させていただきました。
※EclipseからAndroidエミュレータを起動したところ、iPhone向けのものからコードを1行も変えていないにも関わらず対応している事が分かりました。
さすがどちらも描画エンジンがWebkitなだけはある?!

実は「たてよみ」は先日の公開後も地味に修正しています。
で、前々から気になっていた以下の点を昨日修正しました。

 「普通の文章はすべて1文字ずつに分解して縦に並べるだけで良いが、その方法では括弧の向きが全ておかしくなって大変読みづらい。」

 090605tateyomi01.gif

↑括弧がおかしい例

しかし、CSS3では『(iPhone/Androidの場合)-transform:rotate(角度);』指定を利用する事で文字を回転する事ができるので、記号っぽい文字が来た場合には右に90度回転させる事にしました。 

090605tateyomi02.gif

↑括弧を修正した最近の「たてよみ」例

その辺のあれこれを中心に、スマートフォン向けWebアプリのCSS3実装例を説明させていただきました。

その際に、最初のどこかのサーバにアップしたテキストファイルを指定する「URLの指定」を中心に操作方法がよくわからないという「やっぱりな」なご指摘を頂きました。
今後その辺りを中心に、もう少しぼちぼち修正していきますので、ご興味のある方はこれに懲りず「たてよみ」是非今後もご利用ください。

なお私を含めて8人の方が発表されていたのですが、jQueryのプラグインを自作した方がいらっしゃったり、CSS3だけを使ったアニメーションデモを披露されたり、HTML5についてまとめを発表していただいたり参考になりました。

ただ、CSS3はユーザーの殆どが利用するであろうInternetExplorerにおいて、未実装だったり癖のある挙動があったりして、凄く便利なのに使えないのが勿体な過ぎる。

Microsoftがその辺をモダンブラウザレベルに追いついて・・・くれたとしても一般に普及するにはまだまだ随分な時間がかかるでしょう(なにせ未だにWindows ME使っている人とか、Windows Updateの存在を知らない人の数が馬鹿にできん)

いかにこの問題を回避するか、制作者側でCSSハックとかjQueryに代表されるいいJavaScriptフレームワークとかの情報を駆使して、対応していく事が大事だなとかも感じました。

PHP×WebサービスAPIコネクションズ
秋元 裕樹
ソフトバンククリエイティブ
売り上げランキング: 140326
おすすめ度の平均: 3.0
2 概要を知るには良いものの、基本部分がちょっと分かりづらい
4 マッシュアップ本では一番好き
4 マッシュアップサイトを作る参考に!!
3 最新Webサービスのとっかかりに。

■□■□ おまけ ■□■□

WCAN「CSS3+jQueryを実際に使ってみよう!」にて、私が使ったプレゼン資料です。
ご興味のある方は、ご参考ください。

 


投稿者 kuze : 2009年6月 5日 21:45


■このエントリーに関連した記事

■「実用ソフト&サイト」カテゴリの最新記事

«« PSP goのコンパクトっぽい外見にちょっとキュンときたかも | 引越しで揃えたい持っていきたいものリスト »»


自己紹介
PHPやVBによるコーディングやシステムエンジニアを仕事にしています。
主にiPhoneアプリの紹介やWeb開発などのPC系の話題と、アニメやゲームなどのサブカルな話題を取り扱っています。

[PR]

instagram

カテゴリ

最近のエントリー

最近掲載した画像
  • GitHubへ『Manually image classification for AI』を公開しました
  • うどんを見ながら時刻がわかる『うどん時計』を公開しました
  • うどんを見ながら時刻がわかる『うどん時計』を公開しました
  • Flickrから指定したキーワードに関する画像とかをダウンロードするimage-loader-from-flickrを公開しました
  • 「四月一日さん家の」は緩い3姉妹ものだけど、両親について謎が隠されていて油断できない
  • サーモス ステンレスランチジャー(保温効果付き弁当箱)であったか昼ご飯を食べている今日このごろ
  • 大人の麻しん対策としてMMRワクチンを予防接種してきた
  • 親知らずのむし歯を治療して合わせて神経も抜いてもらいました

RSS
更新情報はRSSをご利用下さい