6/3に神戸まちづくりセンターで行われたWordBench神戸のふりかえりです。
第12回 WordBench神戸 : ATND
今回はお題がとても魅力的だったためか、定員20名が一日のうちに埋まり、参加者枠を増やす事態となりました。
「レスポンシブルなテーマの作り方」@HissyNC
プレゼン資料:レスポンシブルなテーマの作り方
正確には「レスポンシブル」ではなく「レスポンシブ」でしょうか。
PCディスプレイの画面サイズは、横1024pxを超えるサイズが一般的です。PC用のWebサイトはこの横幅を考慮して作られています。
レスポンシブなテーマでは、これに加えてスマートフォンなどで利用されている横320pxなどの小さいサイズに対しても、レイアウトをうまく組み替えたり、表示する画像のサイズを変えたりすることができます。表示が整うように1つのcss中に、PCやスマホなどデバイス毎(正確には解像度毎)のcss設定を記述してマルチデバイス対応する技術です。
今まではWPTouchなどのスマートフォン用プラグインを入れて、デバイスごとに全く違うレイアウトや表示技術を使っていたところを、レスポンシブなWebデザインにすることで比較的簡単にモバイルデバイスに最適化されたレイアウトの表示をさせることができます。
印象に残った話。
・IE6～IE8はレスポンシブ技術に対応していない。
・PC用、スマホ用と別々に作っていたテーマを、レスポンシブWebデザインで柔軟に対応することができるため、制作コストの削減になる。
・MediaQueryの使い方などの知識がいるため、マークアップエンジニアのスキルが必要となる。
・PCで見る場合でも、レスポンシブデザインのテーマではモバイルデバイス用のcss記述も合わせてダウンロードしていることになる。逆にモバイルデバイスの場合でも、画像はディスプレイに合わせて小さく表示されるかも知れないが、画像はPCで使っている画像と同じものでありサイズは変わらないので、データ転送量としてはレスポンシブを使わない従来のWebサイトよりも不利になる。
・レスポンシブデザインのシミュレーションは responsive.is で出来る。
「WordPress事例の徹底解説」@tkc49
NPO法人としてよくWordPressサイトを作っている細谷さんのWordPress構築事例です。
「西宮 イイトコ情報 ウブスナ」という観光情報サイトの例を説明していただきました。
ユーザーが簡単に記事を投稿できるように、カスタム投稿タイプとカスタムフィールドを駆使して、定形記事を書くための仕組みを実装しています。
デフォルトの状態では、記事投稿時はタイトルと記事内容くらいしか入力するところがありませんが、カスタムフィールドを使うことで、チェックボックスとか、専用のテキストボックスフィールドを設けることができます。
またカスタムメニューを使うことで、例えば「このサイトについて」などの固定ページの記事編集のためのページを、管理画面の左メニューに目立つように配置することが出来ます。
「WordPress3.4特集」@bren_boss
次期リリース版のWordPress Version3.4で実装される機能についてのお話。
目玉機能はテーマカスタマイザーだそうです。
これがあれば、オンライン上でテーマの内容をリアルタイムに編集することが出来ます。
今までは管理画面の中で、タイトルの色を変えたりトップ画像を指定したりする機能はありましたが、テーマカスタマイザーがあればそれ以上のことができるし、実際に表示されるテーマを見ながらカスタマイズできるので、ユーザーがテーマをカスタマイズしやすくなります。
ただし、そのぶんテーマファイル側で対応しなければならない仕組みが増えるので、テーマカスタマイザー対応のテーマを作れるのはよりシステムを理解した人に限られてくるでしょう。そういう、ユーザーと開発者の役割の二極化が進む機能と言えます。
勉強会を終えての感想
とても内容の濃い勉強会でした。スピーカーの方の話がどれも面白くためになりました。
内容が高度だったので、ちょっとついていくのが大変でしたし、全部自分のものにはできていませんが、技術を知るきっかけにはなったので、これから学習するときに役に立つと思います。ありがとうございました。
一方、今回の勉強会は高度で内容の濃い話だったため、初心者には難しかったようです。「カスタム投稿タイプ」とか「タクソノミー」等のWordPress専門用語が分かっている前提での話が多かったので、敷居が高く感じた方も多かったみたいです。
