はてブ 
pocket 
twitter
#ブロネク の9回目がブログデザインの話しなので、僕も何か書こうと思ったのだけれども
に選定していただきました。✌('ω')✌
- 2013-4-7
- ブロネク
- 0
もう既にまとめられてた。
かなり包括的かつ的確に。
第9回ブロネクオンエアー視聴！非デザイナーだけどテーマ自作中なので思うところを語ってみる #ブロネク | こけらブログ_
ノンデザイナーとか嘘だろ！という感じで、かなり的確ですね。新しいテーマもとても楽しみです！
と、激しくハードルを上げた後で、少し個人的な雑感を。
の前に。
まだブロネクをご覧になってない方はコチラでございます。
しかし2013めちゃかっこいいなぁ。レスポンシブかつフラットで、さらにボーダーデザインですか、お見事。これデフォにしてちょいと弄ればいい感じになりそうですね。
では、私の考えを。
モバイルファーストとレスポンシブ
まず、第一前提として、モバイルでの流入が大事！だと思っているのなら、レスポンシブをオススメします。
理由はいくつかあるのですが、大きく誤解してそうなポイントをかいつまみますと。
レスポンシブの基準となるデザインは、PCビューではない。
これにつきます。
Responsive Grid Systemの仕様が変更となり、僕のレスポンシブデザインの作り方もちょっと変わりそうなので共有 | バンクーバーのうぇぶ屋
コチラを読むと、大体の流れが理解できると思います。
WordPressのデフォルトテーマ2012も、モバイルファーストなレスポンシブで組まれています。
新テーマ: Twenty Twelve — ブログ — WordPress.com
モバイルファーストって、モバイル優先みたいなとらえ方ね。
モバイルの見え方を優先して組もうね！＞そしてそれ以外をうまいことしよう！という発想。
PCビューのままモバイルもいけるぜ！という発想自体がレスポンシブを誤解しています。
誤解その2。
レスポンシブっていろいろ大変なんでしょ？？？
デフォルトだとほとんどなんの問題も起きません。
そうなんです。すべてのプラグインを取っ払って、2012をあててみてください。もちろん、ソーシャルボタンとかもすべて外して。
新テーマ: Twenty Twelve — ブログ — WordPress.com
自分で書いたCSSやPHPも全部キャンセルして。
どうでしょうか？
レイアウト崩れてますか？？
崩れてないでしょう。
そもそもレスポンシブが大変なんじゃなくて、自分で追加した、デフォルトではない要素を制御するのが大変なんです。
もしも、デフォルトではない、自分で付け加えた要素を制御するのが大変な人は、レスポンシブであろうがなかろうが、大変なんです。
レスポンシブという考え方を理解せずに、制御しようとすると、より大変というだけで、レスポンシブ云々はさほど関係ないんです。
必読！5分でわかる流行のレスポンシブWebデザインまとめ | 株式会社LIG
レスポンシブを語るなら、最低でも、リキッドデザインや、フレキシブルデザイン、絶対と相対の違い程度は理解しないと、完全にアウトです。
とはいえ、やっぱり制御したいでしょうね。
モバイルビューにはサイドバーは不要だとか、サイドバーがあると重くなる！とか考えちゃいますよね。
個人的にはサイドバーがあろうがなかろうか、重さにはさほど影響しない（なぜならサイドバー要素なんかほとんどテキストとか、重くない要素だから）と思っているのですが、それはまあ、人それぞれですね。見栄えの問題とかもありますよね。
WordPressをカスタマイズするなら絶対覚えておきたい条件分岐やカスタム投稿タイプなどいろいろ
wp_is_mobile関数 – WordPress3.4から実装されたパソコン用サイトとスマートフォン用サイトを分ける条件分岐タグ | 株式会社コミュニティコム
display:noneはグーグル先生に怒られるよね！ごもっともなんですが、WordPressを使う以上避けては通れないPHPという謎の言語について、ちょろっと理解すれば、思ってる以上に制御も楽です。
WPtouchは万能ではない
やや釣りっぽいですが、まあ、そうです。
WPtouch と WP Super Cache を併用するための設定 | さあ WordPress をはじめよう
Head CleanerとW3 Total CacheのプラグインとWPtouchとKtai Styleの問題を解決する方法 | WordPress トラブル | Lovelog+*
スマートフォン対応をテーマの振り分けで簡単に実現。~wptouchからの卒業~ テーマファイルも置いてあるよ。 | 所感 ~android~
モバイルからの流入が大事！だから、モバイルで表示が軽いテーマを使おう！という考え方には大いに賛成なのですが、なにも、モバイルテーマはWPtouchだけじゃないんやで。
そもそもWPtouchに対して、モバイル用のテーマであるという認識すら欠けている方もいるかも知れませんね。
要は、アクセスされされるデバイス（パソコンかスマホかタブレットか）を認識してPC用テーマかWPtouchテーマに振り分けているわけです。
Wptouchをカスタマイズしてスマートフォン用のモバイルテーマを作成しました | OZPAの表4
やろうと思えば、WPtouchをカスタマイズして、オリジナルのテーマを作ることももちろん可能です。
でもですねぇ、ここまで読んで、アレ？ってなりませんでしたか？？
既に上に書いてますが、デフォルトに自分のオリジナルを足して、制御することが大変な訳で、レスポンシブかWPtouchかという問題ではないわけです。
どちらも、デフォルトだと問題は起きない（WPtouchだと、最新androidに対応してなかったり、キャッシュ系のプラグインとバッティングするけど）わけです。
WPtouchならWPtouchなりにちゃんと走らせる数行から数十行のおまじない（手を加える作業）は存在するんです。
iPhoneなどのスマートフォンに最適化されたWordpressテーマを、WPtouch無しで適用できるプラグイン「WPtap Mobile Detector」
もちろん、モバイル用のテーマを導入しても、同じ事が言えます。
モバイル大事！表示を軽く！でもオリジナルで！問題を回避したい！となってきたとき、選べる選択肢は多くないですが、どのみち自分でデザインや機能を制御しないといけないようになってきますよね。
ど れ を 選 び ま す か ？ ？ ？ ？
このくらい書くと、そろそろ僕がレスポンシブ屋さんの回し者に見えてくると思うので、
閑話休題。
レスポンシブWebデザインはブームではない*ホームページを作る人のネタ帳
まあね、デメリットのないデザインなんか、ないわなぁ。デメリットさえも遊べるかどうかだわなぁ。
こうなってきたら、モバイルテーマを用意して、軽くすることが正義！という考え方すら怪しくなってくるわけです。
趣旨とは外れるかもだけど、みんな大好きアップルさんにはモバイル用のテーマすら存在しないわけですから。もちろんiPhoneやiPadに最適化されてはいるんだけどね。
おっと、モバイル表示を語るとき、意外と無視されがちな要素の
これがスマートフォン向けサイトを作るときの viewport 設定３パターンだ – てっく煮ブログ
viewport
これも、ちゃんと押さえておかないと、話しがややこしくなるね。
いろいろと書いてきました。まあ、思っていることや書きたいことはまだまだあるのだけれども、それは次回以降のデザインブロネクにとっておくとして。
僕自身は、モバイル用の表示は軽くて読みやすいに超したことはないと思っていて、さらに言えばユーザーインターフェイスもPC・モバイルどちらも共通であった方が分かりやすいと思ってるし。見た目レベルでPCモバイルそろってる方がいろいろ印象面でも得するだろうし、さらにはsingle.phpやstyle.cssは1ファイルの方が管理が楽だし、「いやー、モバイル大事ってわかってるんだけど、モバイル用テーマに手が回らなくてね」とか「テーマカスタマイズしたいけど、PC用とモバイル用、二つもさわるの面倒」とかそういう発想から解放されるし、何回も書いてるけど、どのみち何かしら手を入れないとちゃんと使えないなら、この先も使える技術の方が得だと思ってるんですわ。
ぶっちゃけレスポンシブであるデメリットってないとすら思っているわけです。
IEに対応してないのはレスポンシブだからじゃなくて、CSS3だったり他のゴニョゴニョだし。
フレッシュはこう思うの。
とりま優先順位を大事にしましょうよ。
ブログを運営する上で、僕の中の優先順位ではブログデザインって結構上位に食い込んできます。
なぜなら、ブログに書くことの半分以上がデザインについてだからです。
デザインを扱う以上、デザインに気を遣うってのは、説得力の問題からも大事だと僕は思っているからです。
もちろん、frasmを糞ダサいと思っている方も、frasmを糞読みにくいと思っている方もいるでしょう、はい、いるでしょう。
でも僕は鬼かっこいいと思ってます。
鬼かっこいいことで付加される説得力があると、本気で信じています。そりゃプライオリティーもあがるはずです。
凄いと思わせればブログって人気が出るんじゃないですか？ / Maka-Veli .com
趣旨が違うかもですけど、こういう効果、確実に狙いにいってます。やらしい話し。
しかしまあ、デザインなんて、自分が気に入っていることがかなり重要。むしろ気に入ってないことにこそ問題があると思ってます。
迷いや気に入ってないことって、思っている以上に漏れ出ているからです。
何かしらの迷いがあれば、読んでくれる人に何かしらの迷いが漏れ伝わってしまうんだろうなぁと、そういう風に考えます。
ざっくりと決定した事項に対しては、ああ、ざっくりと決定したんだなぁという印象を与えてしまうモノです。デザインにうるさい人にはダイレクトに、そして、デザインに明るくない人にでも無意識にアプローチします。
素人をなめてはいけません。なぜなら、ブログのほとんどの読者は素人なのですから。
なので、僕は自分のブログデザインに関しては、いっぺんの迷いもありません。
レスポンシブを採用していることにも、なんの迷いもありません。多少崩れていても仕様です！と言ってのける覚悟を持っています！この最後の部分に関してはオススメしません。バグはつぶしましょう。
だからまあ、あなたの優先順位の中で、ブログの見た目が下の方なら、別にそれはそれでいいんじゃないですかね。
かっこいいとか、シュッとしてるとか、格好良くないとデザインにこだわってないとか、シュッとしてないとデザインではないとか、勘違いなんじゃないですかね。
徹底的に表示が速いとか、徹底的に読みやすいとか、もはやそれがデザインなんじゃないですかね。
面白い、役に立つ、共感を生む、そんな記事を書くこと、それがデザインでもあるんじゃないですかね。
いつだって、コンテンツイズキングな訳で、中身が重要ってところになんらの異論はありません。
でもさあ、
デザインって、中身じゃね？
と、話しは尽きないわけです。はい。
文：シンタロヲフレッシュ
一緒に読んで欲しい記事
