最近読んだ本についてメモ(2019年1月)

だいたい月イチくらいのペースで書店に足を運んで気になった書籍をチェックしているのですが、読んだ本についてかんたんに紹介しておきたいと思います。

JavaScript コードレシピ集

あいかわらずJavaScriptを勉強しようと思いつつもダラダラと怠けてしまっている私。

逆引き辞典というふうに書いてありましたが、実践的なサンプルも載っているため、初心者向けの学習用教本としても活用できそうです。
書店で即購入しようか迷いましたが、立ち読みしてみて本のサイズの割りにページ数が分厚くて読みづらそうだったので、いずれ電子書籍版を購入して勉強しようと思っています。

今すぐ使えるCSSレシピブック

中級者向けの内容ということでしたが、確かに最初の章であるセレクタから異様さというか、他の本とはちょっと違う異質さを感じさせる内容になっています。
ジャンル的にいうと「CSSシークレット」に近いかもしれません。

すでに私も知っている内容もあれば、不得意であまり触れてこなかった分野や、あぁコレ知りたかったんだよねというテクニックもあったりと、読めばこれまで知らなかったCSSの使い方を発見できるかと思います。

いろんなテクニックが詰め込まれているCSSテクニック集のような本になっていますが、どれも使う頻度がそれほど少ないようなモノが多いのと、ひとつひとつの内容はネットなどで調べれば情報が得られそうなところなのが、購入をためらうポイントになりそうです。
あとはフルカラーでないのと、価格が高いのが最大のネックかもしれません。

WordPress はじめてのデザイン&カスタマイズ入門

WordPress関連書ではたぶん初となる、Gutenbergも解説している入門本。

デザイン&カスタマイズ本としては物足りなさもありますが、Gutenbergの入門書としては大いに役立ちそうです。
かくいう私もGutenbergのエディタは全然触っていないので、これから使っていかなきゃなぁと思っています。

これからWordPressでブログやサイトをつくろうという人にはオススメできるかもしれませんが、すでにWordPressを使っている人やパソコン操作に長けている人などは、Gutenbergの使い方も感覚的にわかりそうですし、この書籍も必要ないかもしれません。

ブログ・サイトの改善方法がわかるデザイン&カスタマイズ入門というよりも、Gutenbergの使い方入門として活用できるオススメの本だと思います。

あと個人的に表紙のデザインが好きです。

WordPressテーマ「Dan」をバージョン 1.1.1 にアップデート

先日、WordPress公式ディレクトリ掲載テーマ「Dan」のバージョンを1.1.1にアップデートしました。

ほんとうはこういうアップデート情報などは、別にテーマ用のサイドなどをつくってそちらでお知らせしようなどと考えていたのですが、どうにも面倒でしばらくはこちらのほうでたまに書いていこうかなと思っております。

主なアップデート内容は、カラースキーマの追加とフッターにソーシャルリンクナビゲーションを追加できるようになったことです。

カラースキーマの追加

これまでは黒、グレーを主体としたカラー一色のみでしたが、これだけだと暗いし何か別の色も使えるようにしたいなと思い、新たにカラースキーマ機能を追加しました。

追加したのはブルーグレーと、カスタムカラー。色を追加するといっても元の雰囲気は崩したくなかったので、多少落ち着いた配色となっています。カスタムカラーについては、もう少し色のバランスを変えたりする必要もあるかもしれませんが……

ヘッダーや背景など各パーツごとに色を設定するやり方もあるかと思いますが、そうすると設定範囲が膨大になりますし、逆にカスタマイズが面倒になるおそれもあるので、簡易的に変更ができるような仕組みにしてあります。

フッターソーシャルリンクメニューを追加

カスタムメニューで各SNSなどのリンクを追加して設定すると、フッターにソーシャルアイコンのリンクメニューが追加されるようになりました。

この機能に需要があるかは分かりませんが、自分で追加してみたい、つくってみたい機能だったので追加してみました。

テーマについて

このテーマはなるべくシンプルにしようとしているのですが、他にもいろいろと機能を追加してみようと思うと、ごちゃごちゃになってしまいそうなのでバランスが難しいところですね。ほんとうは巷で流行っている有料テーマのように、もうちょっとデザインもこだわりたいところなのですが、そこは新たに別のテーマをつくっちゃおうかなぁとも考えたりしています。

有料テーマにも取り組んでみたいのですが、更新作業やサポートの環境を用意しないといけないのが面倒ですし……
もし、使ってくれている人で投げ銭とかでもしてくれる方がいたりするのであれば、よろこんでもっと公式のテーマづくりもがんばれるんですが(笑)

AMPプラグイン 0.7でCanonical AMPができるようになったので試してみた

WordPressのAMPプラグインのバージョン0.7から、AMPページのみでサイトを構築する「Canonical AMP(Native AMP)」が使えるようになったというので、早速試してみました。

やり方もかんたんでテーマに

add_theme_support( 'amp', array(
        'comments_live_list' => true // example value
) );

を登録してあげるだけ。

あとは登録するテーマをAMP用にちょこっと変更することで設定できました。
ベースとなっているのは私が作成した「Saka」というテーマ。
こういうときにベースとなるものがあると、つくるのも楽になっていいですね。

でも、最初うまくCSSをちゃんと読み込んでくれなかったので、ちょっと焦りましたが……

AMPにはCSSで使用を制限されているものや、サイズが50KBまでとかいろいろと制約があるので多少気をつけないといけません。

また、普通のJavaScriptが利用できないため、問い合わせフォームのプラグインが動作しなくなっていたので停止し、代わりにGoogleフォームを設置してみました。

まだまだページによってはエラーがあったり、デザインも修正しなきゃいけないかもしれませんが、体感的には一気に速度アップした感じがあって今のところ良好です。

WordPress公式ディレクトリ掲載テーマ「Dan」を作成しました

書くのが遅くなってしまいましたが、WordPressの公式ディレクトリ掲載テーマ「Dan」をこのたび作成しました。
公式ディレクトリに公開されたのが2017年12月28日、テーマを申請したのが2017年9月ごろだったので、約3ヶ月ちょっとくらいで登録されたかたちとなります。

私は以前にも「Saka」というテーマを作成しており、おかげさまで「有効なインストール: 500+」(2018年1月現在)と多くの方に使っていただいております。
その以前つくった「Saka」は、CSSでカスタマイズしやすいよう(WordPressのスターターテーマとして使えるような)装飾を何も施していないため、少々物寂しいデザインとなっており、もうちょっとデザインしたテーマをつくりたいなと思い、2つめのテーマを作成することにしました。

以前つくった「Saka」との3つの違い

かといって、せっかくWordPressの公式ディレクトリに掲載するテーマをつくるのだから、以前の「Saka」と同じようなモノだと面白くないと思ったので、新たにやってみようと思ったのが以下の3つ。

2カラムのレイアウトデザイン

「Saka」は1カラムがベースのテーマであったため、「Dan」は2カラムのレイアウトにしてみました。
テーマのスクリーンショットやプレビューを見ていただければ分かると思うのですが、デザインについてはごく普通の地味でありきたりな2カラムレイアウトになっています。
一応、弁解をさせてもらうとするば、これはあえてこのようなデザインにしているのです。

Danのスクリーンショット画像

つくるときにもうちょっとトレンドを意識したデザインにしようかとも思ったのですが、WordPressのテーマはつくったら終わりではなく、更新作業であるとかバージョンアップも必要となってきます。
そうすると、トレンドを意識したテーマだと数年経ったら(自分が)飽きてしまいそうな気もしますし、つくり変えたくもなっちゃいそうです。それなら普遍的なベーシックなモノものだったら多少の飽きが来ても耐えられるのではないかなぁと考え、このようなかたちにしてみました。

アクセシビリティ対応

これが今回のテーマレビューにて、いちばん挑戦してみたかった大きなコトです!
はじめてテーマをつくったときにもやってみようかなぁと思ったのですが、アクセシビリティレビューは大変で時間も掛かるとされていたため、怖気づいてしまい諦めたのですが、今回は意を決してチャレンジしてみました。

アクセシビリティレビューを通過するためには、まずテーマレビューのチェックをクリアし、タブキーでナビゲーションを操作できるかや、テキストなどの色のコントラストなどの必須項目のテストをクリアしないといけません。(テーマアクセシビリティガイドライン
私の場合は、テキストのコントラストで引っかかってしまいました。この部分だけ何も考えずに組んでおり、抜け落ちていたのです。
ですが、レビュアーの方に教えていただいたガイドラインに載っていたコントラストのツールを用いることで、何とか対処することができました。

思ったより意外にあっさりとアクセシビリティレビューを通過することができたのですが、通過できたおかげはWordPressのデフォルトテーマを参考にしていたからだと思います。
WordPressのデフォルトテーマである「Twenty Seventeen」や「Twenty Sixteen」は、タグを見てみるとアクセシビリティに対応しています。
そのため「Twenty Seventeen」などのコードをじっくりと読んで参考にしながら、私のテーマもつくっていきました。
「Twenty Seventeen」はシンプルな構成ながら非常によく考えて作られてあるので、デザインさえ気に入れば非常におすすめのテーマだと思います。それに定期的にバージョンアップもされるでしょうから、安心感もあります。

ホームページに固定ページセクション配置

これまた「Twenty Seventeen」に搭載されているカスタマイザーの機能なのですが、ホームページ(フロントページ)に固定ページを配置することができるセクション機能を設けました。
つくろうと思った経緯は「世界一わかりやすいWordPress 導入とサイト制作の教科書 」に、このホームページに固定ページを配置するテーマカスタマイザー機能の実装のやり方が載っていたためです。
もちろん「Twenty Seventeen」の中身も確認していましたが、この本に載っている内容を読んで、つくり方に対する理解も深まりました。(慣れていないのですぐに忘れてしまいますが……)

テーマ紹介ページもつくりたい

今回はブログでの報告となりましたが、テーマを紹介する専用のランディングページのようなものもいずれつくりたいと思っています。
やはり紹介しないと多くの人には伝わらないでしょうし、いろんな人につかってもらいたいですから。

それに今までは自分のため(自分用)のサイトしかつくったことがありませんでしたが、これからは誰かのサイト(≒仕事として、報酬をもらう)もつくっていきたいと考えています。
正直、これまでほぼ独学でやってきたため自分のスキルに自信もありませんし、やれるのかも未知数ではありますが、一歩前進するためにもやってみたいと思います。
まずは、それ用のホームページ(ポートフォリオ)みたいなのもつくらないといけないですかね。

最後になりますが、このWordPressテーマ「Dan」をぜひ使ってみてください。使ってもらえると嬉しいです。

WordPress公式テーマ「Saka」を作成しました

公式ディレクトリに公開されてから少し時間が経ってしまっているのですが、WordPressテーマ「Saka」を作成しました。

テーマ「Saka」について

シンプルなデザインで、日記やブログ用途に適したレイアウトのテーマになっています。

グローバルナビゲーションは、ハンバーガーボタンをクリックすると、スッと横からスライドして表示されるドロワー型のメニューになっているのが特徴です。

装飾をほぼ施していないので、CSSカスタマイズでアレンジして利用するのもおすすめです。

公式テーマを作成した訳

これまでも個人でオリジナルの自作テーマを作成して、このブログで運用していたのですが、何か目に見える形で残したい、ちょっとだけアピールしたい、公式テーマづくりにチャレンジしてみたいという気持ちから、今回作成することにしました。

また、私はコロコロとブログのデザインを変えたがる、飽き性な部分があるので、CSSで気軽にイジりやすいように何の装飾もないような、ベースとなれるテーマを作ろうと思い、このような形のテーマとなりました。

どちらかというと、誰かに使ってもらいたいというよりは、自分のための自己満テーマになっているかもしれません(笑)

WordPressテーマをつくってみて

公式ディレクトリに申請してから、レビュー・登録までに掛かった時間は約6,7週間ほどでした。

レビュアーの方とのやり取りは全て英語だったため、正直不安でドキドキだったのですが、Google翻訳パイセンのおかげで何とかなりました(多分、何とかなっているはずw)
私は英語が大の苦手なので、ここがいちばんの高いハードルでしたかね、やっぱり。

「よし、完成した!」と思っても、後で確認してみると何かココがおかしくなっているとかあったりしたので、こぼしのない完璧なモノを仕上げるというのは大変だなあというのも、やってみて感じましたね。
私はこれまで、自分のつくったものを誰かに見てもらうという機会がなかったので、良い勉強にもなったかもしれません。

テーマ一覧に自分のテーマが載ったときは嬉しくて、思わずスクショにおさめてしまいました。
登録されてから1ヶ月くらい経過していますが、こんなテーマでも毎日少なからずはダウンロードされているのを見ると、やっぱり世界中で利用されているWordPressってすごいなぁと感じています。

WordPress公式テーマはつくれる

英語が苦手なアマチュアの私でもつくれたくらいですから、_s(underscores)のスターターテーマをベースにすれば、HTMLやCSSが分かる方であれば、デザインをイジるだけでもテーマをつくることができるのではないでしょうか。

そう考えると、意外とハードルはそんなに高くないともいえるかもしれないので、もっといろんな人に公式テーマをつくって欲しいなぁとも思います。

私も、実はもうひとつテーマをつくろうと考えています。
自分でつくったテーマだったとしても、1ヶ月くらい中身を見ていないと「どんな内容だったっけな?」ってなってしまいますし、正直まだ身についているともいえません。
それに、今回つくったテーマはある意味手抜き(笑)ともいえるモノなので、今度はちゃんとデザインもしっかり行ったモノを作ってみたいですね。

最後になりますが、もしよろしければ「Saka」を使ってみてください。