HTML5テンプレ、Sketch、変態的CSS…2016年アクセス数1位はあの開発者ツールでした

2016/12/30

小橋川誠己[WPJ編集部]

FREE
142

デザイナー、エンジニア、マーケターの「掛け算」のスキルアップを応援するパスファインディング・メディア「WPJ」がオープンしたのは2016年7月20日のこと。この半年間で公開した記事は400本あまり。HTML、JavaScript、UXデザイン、SEOなどのテクニカルな記事から、クリエイターへのインタビューまで、さまざまな記事を公開してきました。

オープン初年度によく読まれたのはどんな記事だったのか? トップ20を紹介します。

1位■まだChrome使ってるの? Web開発者専用ブラウザー「Blisk」に惚れた!

160705blisk

1位は、Web開発者向けの専用ブラウザー「Blisk」。レンダリングエンジンにBlinkを採用し、エンドユーザー向けの機能は最低限に、開発者向けの便利な機能を搭載したブラウザーです。国内ではほぼ無名のブラウザーでしたが、この記事がソーシャルで話題になり、その後、他のメディアでも紹介されるようになりました。2017年も新しいツールをどんどん紹介していきたいですね。

2位■「うわっ、そのコード変態的すぎ…」と叫びたくなるCSSトリック10選

160831css

「変態的 CSS トリック」(by Kite)というスライドをきっかけにこの夏、話題になったのが「変態的CSS」。海外では強者たちがCodePenにたくさんの「変態的CSS」を投稿して腕を競っています。その中から「これは」と思うものを編集部がピックアップして紹介しました。実用度はともかく、柔軟な発想と根気強さ、あとは気合があればここまでできるのかと驚くものばかりでした。

3位■エンジニアのデザインが10倍よくなる!「余白恐怖症」を克服する方法とは?

160801whitespace

「デザインには余白が重要」とはよく言われることですが、具体的にどう余白を使うと効果的か、なぜ余白が大切なのかを実例を挙げながら解説した記事。この記事はSitePointのライセンス記事ですが、普遍的なデザイン原則に関する記事はソーシャルでも人気が高いので、2017年はオリジナル記事も企画したいと思っています。

4位■もう迷わない!HTML5のもっとも基本的なテンプレートはこれだ!(2016年版)

160530html5

HTML5を書くにあたって最低限必要になるタグをまとめた、もっともシンプルなテンプレートを紹介する記事。実はオリジナルは2013年にSitePointで公開されたもので、今春、内容をアップデートしたのがこの記事。そのため、最近はあまり使わなくなってきたHTML shivの組み込みなども含まれていて、「2016年っぽくない」との声もいただきました。記事では1つ1つのコードの意味を解説していますので(前に挙げたHTML shivについても前提条件などの説明があります)、なぜそのコードが必要なのか、ぜひ確認しながら読んでもらえればと思います。

5位■ノンデザイナーがもっと知りたい!センスより大切なデザイン心理学のルール+3つ

170928psycology
こちらもノンデザイナー向けのデザイン原則に関する記事。何年か前に「CTAボタンは緑色がいい」といの話が流行っていましたが、色に限らず、ある特定の条件下で成功した結果をそのまま真似しても、うまくいかないことがほとんど。検証、改善していくための仮説として、この記事の「原則」を持ち込んでみてはどうでしょうか。

6位■「安倍マリオ」で話題に!世界中でマリオがいかに愛されているかがわかるCSSまとめ

160822mario-2

リオ五輪の閉会式に突然現れた、安倍マリオ。マリオってどれぐらい世界中に人気なんだろう? ということをCodePenで探して紹介した記事です。そういえばずいぶんと話題になったのに、流行語大賞はノミネートすらされませんでしたね…。

7位■WordPressコアコントリビューターに聞く「ぼくのかんがえた最強の開発環境」

160526dev
50本近く公開した WordPress関連記事の中で、ぶっちぎりの1位だったのがこちらの記事。内容は、仮想環境を使う、コマンドラインを使う、IDEを使う、コーディング規則をツールでチェックする、といったもの。Twitterではいろいろなコメント(もっといいツールがある、など)が寄せられ、議論を呼んだ記事でもありました。

8位■jQueryの次に学びたい!D3.jsはWebデザイナーの最高の武器になる

160804visualize

海外ではとても人気の高いJavaScriptライブラリー「D3.js」。今年は米大統領選の報道でデータビジュアライズが流行りましたが、2017年は日本でも利用は増えるのでしょうか。

9位■Slackだけじゃなかった!働き方を劇的に変える海外製7つのツール

160709teamwork

コラボレーションツールの話題も多かった2016年。Slackは人気を通り越してすでに定番化していますが、それ以外にも便利なツールがいろいろまとまっています。

10位■UIデザイナーがSketchを使う理由と導入方法

sketch-start
人気デザインツール「Sketch」の入門記事の第1回。Standardの吉竹遼さんに現場の勘所を交えて解説してもらいました。本来はプレミアムメンバー限定コンテンツですが、 第2回までは無料開放しています。ぜひこの冬休みにどうぞ。

11位以下はタイトルだけ、ざっと紹介します。

11位■JavaScriptエンジニアなら知ってるよね? エラー処理のいい書き方、悪い書き方

12位■カッコいいグラフがむちゃくちゃ簡単に描ける!Chart.js 2.0がスゴい

13位■知ってる?Web開発者がJavaScriptでゲームを作るときのはじめの一歩

14位■えふしん「現場に必要なのは『フルスタック』より『デュアルスタック』エンジニア」

15位■UIデザイナーの私が4年間で学んだ、ダッシュボードのデザインで大切な26のこと

16位■セミコロンは省略?人気スタイルガイドに学ぶJavaScriptのコーディング規則

17位■便利すぎてしびれた!あなたが知らないCSS関数トリック8選

18位■「いらすとや」だけじゃない! Webデザインで使える無料イラスト素材サイト11選

19位■Webディレクターが知らないとマズい!Googleの注目プロジェクトPWAって何?

20位■ノンデザイナーこそ知っておきたい!デザインでセンスより大切な心理学のルール

こうして振り返ってみると、1位になったBliskの記事を除くと、JavaScriptの書き方や、デザイン原則など、定番ネタが多かった2016年。個人的にはもっと新しいツールの話題が上位に来るのかなと思っていたので、ちょっと意外でした。

2016年はWPJをご愛読いただき、ありがとうございました。2017年の更新は1月6日からの予定です。来年も定番ネタから最新技術・ツールの情報まで、デザイナー、エンジニア、マーケターのみなさんのお仕事に役立つ記事をお届けしたいと思います。どうぞよろしくお願いします。

小橋川誠己[WPJ編集部]

小橋川誠己[WPJ編集部]

株式会社KADOKAWA WPJ編集部 副編集長。2009年よりASCII.jpでWebプロフェッショナル向けの記事を執筆するほか、クリエイター向けの書籍『Web制作の現場で使う jQueryデザイン入門』『神速デザインシリーズ』などの企画・編集も担当。
過去の執筆記事:『明朝体は絶滅するのか? AXIS Font生みの親の挑戦』『巨人AT&Tをも動かしたAPI「Twilio」の衝撃

Loading...