WordBench京都でテーマについて考えてきました

嵐山の紅葉2015年11月7日に、「WordBanch京都」に参加してきました。
昨年の10月から約1年ぶりの参加です。

まだ紅葉には早いようでしたが、行きがけの電車の車窓から見える保津川下りや嵐山のトロッコ列車は、たくさんの観光客で賑わっていました。
そんな楽しそうな人々が大勢行きかうJR京都駅で、私はコンセント付きのファストフード店でサンドイッチをパクつきながら、直前まで仕事をしておりました・・・

近況がそんな感じなので、今回は詳しい内容ではなく、参加した感想などをざっくり書かせていただきたいと思います。

今回のテーマは「テーマにまつわるエトセトラ」

WordPressの魅力の一つとして、数えきれないほどのテーマがあります。
インターネットから簡単に入手できるこれらのテーマを使う事で、Web制作の知識が少なくても、とても美しく、構造的にも優れたWebサイトを作ることができます。

テーマは、いわば服のようなものです。
安いもの、高いもの、シンプルなもの、装飾がいっぱいついたもの、フォーマルなもの、カジュアルなもの、暖かい・涼しいなど機能的なもの、下着、水着、作業着、ウェットスーツ、宇宙服・・・というように、目的によって多種多様なものがあります。
それらを単に選んで使うだけでなく、自分でカスタマイズしたり、一から作ったりできるのが、WordPressです。

私たちWeb制作者は、その「テーマを作る」ことが主な仕事になることが多いですから、いわば洋服の仕立て屋さんのようなものですね。

洋服を作るなら、やはり流行は知っておく必要があります。
というわけで、今日の最初のセッションは、コンチさんの「聞いて覚えるマテリアルデザイン入門」です。

「聞いて覚えるマテリアルデザイン入門」

ここ数年は「フラットデザイン」と言われる、シンプルで多種多様なデバイス(PC、タブレット、スマートフォン)に対応できるデザインが主流になっていますが、最近になってGoogleが「マテリアルデザイン」というものを発表し、話題になっています。
マテリアルデザインは、Webページの構成要素を「紙とインク」に例えて、構造から形、色、動きまでを定義しています。
詳しくはスライドを見ていただきたいのですが、一言でいえば「マテリアルデザイン」は、「フラットデザイン」を用いた「デザインガイド」ということなのだそうです。
つまり、そのまま使うと、Googleのデザインのパクリになるわけです・・・

じゃあ、マテリアルデザインを知っても使えないから意味ないのかと言うと、そういうものでもありません。
「デザインガイド」は設計図の前にある基本的な考え方ですので、これをきちんと決めておくと統一された品質を保つことができます。
特にチームで制作をする場合には、非常に重要なものになります。
これを作るうえで、Googleが作ったデザインガイドを参考にするというのは、その考え方が役に立つだけでなく、現在のWebのトレンドや将来の方向性も取り入れることができるようになるわけです。

私の場合は個人での制作が多いので、デザインガイドは頭の中にあるだけなのですが、コンチさんはちゃんと書き出したものを作っておられるそうです。
また、デザインガイドを公開されているような制作者は信頼できますよね。

つまり、デザインガイドは、Web制作者の「ブランディング」なのですね。
(「ブランディングとは、モノを売り続ける仕組みである」のだそうで、ロゴとかカラーとかという表面的なことを指すのではないんだそうです)
頭の中のデザインガイド、私も明文化して、公開しようと思います。

テーマ開発座談会

続いては、JUSO Coworkingの深沢さんを司会に、コンチさん、井坂久子さん、岡本秀高さんを中心に、事前に寄せられた質問に答える形でのテーマ開発についての座談会が行われました。

メモを取っていなかったのですべての内容は覚えていないのですが、私が気になった話題としてはこんなものがありました。

自作テーマは、WordPress本体がバージョンアップしたら更新していかないといけないのか?

最近の話題だと、次のバージョンから、これまで当たり前のように使われていた「wp_title」が非推奨になるというのがあります。
JavaScriptやcssの読み込みも、テンプレートで読み込まず「wp_encueue_script」、「wp_encueue_style」を使うようになっていますし、そういった仕組みに対応していないテーマはどうすればいいのかってことですね。
WordPressはわりと後方互換性が高いので、テーマの場合は推奨されていないだけで動かないわけではないようです。
もし必要なら、受託案件の場合はちゃんと費用をいただいて修正することになります。
サポート契約大事ですね。

公式テーマって使い勝手がいいの?

これは皆さん揃って「特に良いわけではない」というご意見でした。
その中で比較的良いということで話題に出てきたのが「Habakiri」、「Lightning」です。
両方とも、元のテーマ自体の完成度が高いうえに、あらゆるところで制作者が手を入れやすい(専門的に言うとフックが多い)構造になっており、よほど特殊な機能や独自のデザインを要求されない案件の場合は、ベースとして使用すると工数の削減も可能です。
bootstrapを使用していますので、普段から使っている人には導入が容易です。

実はこのサイト、以前は「Habakiri」を使っていて、今は「Lightning」をベースに子テーマでカスタマイズをしています。

コンチさんは「Habakiri」を薦めておられましたが、私はカスタマイズ手法が技術的にちょっと高度だなという印象を持っています。
当日参加されている方々は、私も含め「Lightning」がいいという方が多いようでした。

また、一からテーマを作成する場合に、ひな形として使用する「スターターテーマ」というものも存在します。
こちらは、WordPress.comを運営しているAutomatic社が提供している「_s」というテーマを使用されている方が多いようでした。
最新のWordPressの機能を取り入れたテンプレートが揃っていながら、デザイン自体は何もされていないので、自分でcssを書いていくことでテーマを作っていきます。
私も、いくつかの案件で「_s」をひな形にして制作をしていますが、割と作りやすいです。
(ちなみに「アンダースコア―ズ」と読むそうです)

スターターテーマとしては、参加者のkiteさんが作られている「bathe」も紹介されました。
(kiteさんは、WordPressのコアコントリビューターで、WordCamp Kansai 2015 実行委員長だった方です。wockerの開発者としても有名ですよね)
私がいいなと思ったのは、bootstrapではなく、Bourbon、neat、Bitters等を使用されているので、セマンティックなコードが書けるというところです。
今後、要注目のテーマだと思います。

ビアバッシュという名のLT大会に突入

勉強会の後は懇親会です。
勉強会を行った会場でピザやビールなどをメインに行う懇親会を「ビアバッシュ」というらしいのですが、まぁ、WordBench京都ではいつもの展開です。

ところが、今回は(今回も?)懇親会の間も登壇者以外の参加者の方による発表が続き、お酒を飲みながらワイワイと突っ込みながらの楽しいLT大会になりました。
食事をしながらだったので、あんまり細かく覚えていません。発表者の方すみません。

公式テーマディレクトリに登録待ちの方が、世界最速(になるかもしれない)Twenty Sixteen の子テーマの紹介をしてくださいました。
Twenty Sixteen は、次期WordPressに同梱される、現在は正式には未発表の公式テーマです。凄いですね。

GOUTENさんの「WordCamp Tokyo 2015 のレポート」では、あっちでLTやったらダダスベリしたというお話で(笑)、たくさんお土産を持ってきてくださってじゃんけん大会になりました。

最後は座談会でも話題になった「Bathe」について、作成者のkiteさんから簡単に紹介していただきました。
本当は、量子論について語りたいそうで(笑)、もしかしたら12月のWordBench京都で聴けるかもしれません。

テーマに関しては、もっともっといろんな切り口があって、全然話が尽きないですね。
とかいいつつ、そろそろ、このサイトのテーマをちゃんと作らないと・・・と思いながら帰路につきました。

今回は、新婚さんや婚約された方もいらっしゃって、いつもよりなお一層、ほのぼのしてたような気がします。
参加者のみなさん、会場のコワーキングkotoさん、ありがとうございました。

この記事を書いた人

川井 昌彦
川井 昌彦
FAシステムメーカー、国内最大手印刷会社製版部、印刷・ウェブ制作会社を経て、家庭の事情で実家に帰省して独立
現在はフリーランスと制作会社シニアディレクターのマルチワーク
ウェブ制作のほぼ全般を見渡せるディレクター業務が主だが、デザイン・コーディングも好き

1997年ブログ開設
WordPressコミュニティには2011年から参加
WordCamp Kansai 2016 セッションスピーカー
WordCamp Tokyo 2023 パネルディスカッションパネラー
WordBench京都、WordBench神戸、WordPress Meetup八王子など登壇多数

ご質問・ご相談などありましたら
お気軽にお問い合わせください


コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

Vektor Passport(ライセンス期間1年)
VK Filter Search Pro
Vektor WordPress Solutions
PAGE TOP