WordBench 東京7月モバイル勉強会

WordBench 東京7月モバイル勉強会


7月9日(水)にGMOのシナジーカフェにてWordBench東京が開催されました。
今回のテーマは「モバイル」です。
当日は、スタッフを含めて116名の参加者が来場し、「WordPressでモバイル」の関心の高さが伺えました。初めてWordBenchに来た、という方も多かったようです。

wptokyo0709

今回私は、たまたまモデレーターをすることになりまして、つたないながらも司会をさせていただきました。
登壇者がPCをつなぐ合間の時間に、自分なりの感想とかをはさみながらやろうと思っていたのに、いざ前にでると全然言葉が出てこないもんですね〜・・・

「レスポンシブWebデザインの基礎とWordPressを使った最適化の手法」

ogawa-san
登壇者は小川裕之さんです。

まずは、小川さんのレスポンシブWebデザインの話です。
私は以前、横浜のコワーキングスペース「タネマキ」に小川さんの講演を聞きにいったことがありました。
今回の内容の前半は、そのとき聞いた話と同じ部分もありましたが、当時はまだ自分でも実践で使っていなかった頃でしたので、大枠を流して聞いていた感じでした。

その後、実際に案件でレスポンシブWebデザインを使った制作を行なった後で、もう一度今回、整理されたスライドを見直しながら、お話を聞く事できたため、自分の中でも論理的に整理ができてきた気がします。

レスポンシブWebデザインの実装方法について

– Fluid Grid => グリッドの幅を早退値で指定
– Fluid Image => 画像を可変にする
– Media Queries = メディアタイプと特性に関する条件を調べ、その結果に応じて処理を行なう
– viewport => content=“width=device-width,initial-scale=1”

グリッドシステムとCSSフレームワークの紹介

– グリッドシステム
960grid systemは私も使っています。これを最初に作った人、ホント偉い。

– CSSフレームワークの話
BootstrapとFoundationは使ったことがありますが、他にもいろいろあるんですよねー・・・
特性をよく理解しておかないと、どれを使うのがいいのかを判断することが難しいですね。

– Bootstrapをショートコードで使えるようにするプWordPressラグイン「Easy Bootstrap Shortcode」の話。

これは、今度使ってみようーと前から思っていたプラグインでした。
少し手が空きそうなので、試してみます!

後半のWordPressとからめた部分では、関数を使ってUser Agentを振り分ける、というお話でした。
レスポンシブを採用するか、スマホ専用デザインにするかは、案件によってどちらが最適か、をしっかり考える必要がありますね。

既にあるモノを活用して制作作業を軽減しよう

Webの世界では、どんどん新しい技術が出てきます。
つい先日まで手作業で時間をかけてやっていたものを、あっという間に自動化してくれるツールがいろいろ登場してきて、正直「名前は聞いた事あるけど、まだ試していない」というものが増えて行ってしまうのです・・・
毎日、目の前の案件をこなすことにばかりに集中していると、結果的に時間のかかる作業をやり続けることになりかねません。
すでにあるフレームワークなどを最大限に活用して、作業の効率化ができるようにしていきたいと思います。

WordPressサイトをiPhoneアプリにしてみた〜構築事例の紹介〜

sasaki-san

次の登壇者は、佐々木きはるさん

WordPressで構築したクイズのサイトをiphoneアプリにしたそうです。
アプリといっても、ネイティブで実装したのは外側のみで、クイズに答える画面はWebビューで表示するという仕様だそうな。

スクリーンショット 2014-07-10 22.03.51

「WordPressをアプリ化」ってきいて、「何それ!そんなことできるのー?」ってびっくりしましたが、そういうことだったんですね。
まあ、Objective-cがわからないんで、私は作れないんですけども。そういうやり方もあるんだなーってことで興味深かったです。

Multi Device Switcher

スクリーンショット 2014-07-10 21.42.37

デバイスを判断して表示するテーマを切り替えることができるプラグイン。
モバイル用に別テーマを作成してあり、アプリからのアクセスを判別するために独自のUserAgentを追加して、アプリの場合のみ該当テーマを表示するように設定したそうです。

Appleの承認が降りるまでの道のり

facebookの投稿で、佐々木さんがAppleの審査でリジェクトされたという投稿を見ていたのですが、やっぱりAppleの審査って厳しいんだな、と思いました。というか、Apple側にチェックしてもらうだけで1週間以上待ってるなんて、リリース日が遅れるのも無理ないですよね。

リジェクトされた原因は、アプリそのもののエラーではなく、さくらインターネットのサーバ設定で国外IPのアクセス制限がデフォルトでonになっていたため、チェック側から見られなかったということらしいです。不正アクセスを禁止するための措置なんでしょうけど、そういうこともあるんですね。

ライトニングトーク

– 宮崎優太朗さん「WordPressとモバイルとbrowser-syncと部屋とYシャツと私」
– 土田成宏さん「私とWordPressとモバイルとのお付き合い」
– 戸田江里子さん「WordBench東京・青山勉強会のご案内」
– 山本龍二郎さん「WordPressとお仕事をつなぐマッチングサイト WP-WORK」
– 岡本直美さん「WordBench千葉」
– 清野まいこさん「仮想マシンが制作現場にくれる幸せ」
– 小林よしのりさん「IEのテストツールのまとめ」


shoko administrator

フリーランスのWeb制作者。WordPressのサイト構築、およびWebデザインとディレクション。専門学校HAL東京にてWEB学科の講師をしています。WordPressコミュニティに出没。趣味は合気道。