ウェブ業界の当たり前だと思っていることでも、同業他社の人には違う常識があるかもしれません。自分が業界多数の傾向と違うところはどこなのか・・・ この連載ではアンケートデータから国内のウェブ業界の傾向を分析します。
連載第2回目となる本記事ではウェブ業界に関する「学習方法」「HTMLのコーディングスタイル」「JavaScriptのコーディングスタイル」「労働時間」「フォント」の5分野のアンケート結果を紹介します。アンケートは筆者のTwitterから実施していたものです。
HTMLやCSSを学ぶとき、何で勉強をはじめましたか
ウェブ制作の初学者はどのような手段で勉強しているのでしょうか。従来は解説書や会社/学校で学ぶことが多かったと思いますが、最近は動画学習サイトが充実しています。2013年以降に学び始めた方へ質問しました。
208件の回答があり「本」が34%、「学校/会社/スクール」が31%、「ウェブサイト」が29%、「動画学習」が6%でした。
動画学習は操作方法を確認できるためツールやコーディングの勉強に適しており、国内でもドットインストールやスクー、lynda、Udemyなど動画学習サービスが盛り上がっています。ただ、現状では書籍や会社/学校に比べると動画学習を利用している人は少数のようです。
HTMLのコーディングスタイル
同一HTMLファイル内でh1要素はいくつ使っていますか
W3CのHTML5の仕様ではsection
タグによって複数のh1
要素を記述できるようになりましたが、HTML 5.1の仕様ではその記載が削除されました。そのため、現場ではh1
要素を複数使っていいのか意見が分かれています。そこで、h1
要素を同一HTMLファイル内でいくつ使っているかアンケートを実施しました。
「h1
要素は一個だけにしてる」が68%、「h1
要素は複数使うようにしてる」が26%、「その他」が6%。
寄せられた意見として次のようなものがありました。
- SEO観点では
h1
要素を複数個使おうが影響はない - 「
h1
要素は1ページに1つだけであるべき」という従来の理解をしている人が多い。h1
を複数使った場合に納品先に正当性を説明するのが不毛だ
この意見はTogetter「h1要素は複数回使って良いのか!? HTML5.1に関するW3CとWHATWGの主張の違い」にまとめているので、あわせて参照ください。標準化団体のW3CとWHATWGの主張の違いが根底の問題にあります。
JavaScriptのコーディングスタイル
jQueryをCDNのリンクで納品しますか?
jQueryをはじめ多くのJavaScriptライブラリにはURLを指定するだけで利用可能になるCDNのURLが提供されています。CDNを利用すると、ブラウザキャッシュに保存されるので読み込み時間を短縮できるメリットがあると言われていました。
とはいえ、自社サーバー以外のURLが納品ファイルに含まれることに抵抗を感じるウェブマスターがいるとも聞きます。そこで、ウェブ制作者のCDN利用状況をアンケートで質問しました。
443件の回答があり、結果は「CDNを使わないで納品」が49%、「ほとんどCDNを指定して納品」が32%、「たまにCDNを指定して納品」が19%でした。
アンケートに寄せられた肯定的な意見として「手軽に利用できる」「ブラウザキャッシュに残るので読み込みが早い」と回答がありました。
対して否定的な意見として「CDNのトラブルに巻き込まれるリスクを回避したい」「webpack等でJSライブラリをバンドルするのでCDNは必要ない」「オフラインでも開発に使いたい」「計測したところ、CDNからの読み込みは早くなかった」といった回答が寄せられています。詳しくはTogetter「CDNのjQueryって使ってる? イマドキのウェブ制作事情」にまとめたので、あわせて参照ください。
変数宣言にvarを使いますか、letを使いますか
JavaScriptでは従来(ECMAScript 5まで)は変数宣言にvar
が使われていましたが、ECMAScript 2015からlet
が導入されました。let
ではスコープの巻き上げが起こらないといった言語仕様上の利点があります。
// ECMAScript 5
var apple = "リンゴ";
// ECMAScript 6
let orange = "オレンジ";
ECMAScript 2015の動作環境が2017年現在、次のように整ってきています。
- モダンブラウザ(EdgeやSafari 10、Chrome、Firefox)では
let
を解釈できる - 古いブラウザ(IE 11やSafari 9)を対象にした場合でも、BabelやTypeScriptでECMAScript 5にトランスパイル/コンパイルすることで
let
を利用できる - Node.js 4以降では
let
を解釈できる
そこで、var
とlet
のどちらを使っている人が多いのかアンケートを実施しました。
結果はvar
が61%、let
が39%でした。従来使えるvar
を利用する人が多いようです。
プログラマの技術情報共有サービス「Qiita」ではlet
やconst
でJavaScriptを説明している記事が増えています。最近のブラウザはデフォルトでlet
は使えるので、JavaScriptを学ぶ人はvar
ではなくlet
が当たり前になっているかもしれません。数年後にどうなっていくのか興味深いです。
一日平均何時間、働いていますか?
ウェブ業界では終電まで仕事をしていたり、持ち帰って仕事をしている方が多いと聞きます。そこで、ウェブ業界の人に一日の労働時間をアンケートしました。
719件の回答があり結果は、「〜8時間」が28%、「8〜11時間」が50%、「11〜14時間」が15%、「14時間〜」が7%でした。
アンケート回答数が719件もあったとはいえ、ブラック企業に勤めている方は忙しくTwitterのアンケートに気づいていなかったという可能性も大きいでしょう。労働時間の資料としては、厚生労働省の「労働統計要覧」(※1)や、「コーダー白書 2016」(※2)も参考になるでしょう。
※1「労働統計要覧」によると「情報通信業」の月間実労働時間(30人以上の事業所規模)で、160.7時間(月間出勤日数は19.0日)です。
※2「コーダー白書 2016」の集計「Q:一日の仕事終了時間はだいたい何時頃ですか」では74%が21時台までに仕事が終わることをレポートしています。
フォント
Noto Sans Japaneseをパソコンにインストールしていますか?
Noto Sans JapaneseはGoogleブランドとしてリリースされた無償で利用できる高品質な日本語フォントです。Googleウェブフォント日本語早期アクセスで無料で提供されていることもあり、日本語ウェブフォントの中でももっとも多く利用されています。
注目度が高まっているNoto Sans Japanese。このフォントをウェブ制作者の作業マシンに導入しているか質問しました。
81件の回答があり、54%の人がNoto Sans Japaneseをインストールしている結果となりました。
Noto Sans JapaneseはAndroid 6の標準フォントとしても導入されており、存在感を増しています。Adobe PhotoshopやSketchでデザインするときの共通フォントとしてNoto Sans Japaneseを選択肢の1つとして考えてもいいでしょう。
Windowsのメイリオフォントってどう?
Windowsに標準搭載されている日本語フォントの「メイリオ」。よく目にしますが、どんな印象をもってますか?
140件の回答があり、「好意的」が51%、「気にしない」が25%、「否定的」が24%という結果になりました。
メイリオは字形がモダンなため、ウェブサイトに利用するフォントとしては癖が強いと筆者は考えています。Windows 8から游ゴシック体が搭載されましたが、ウェブサイトで使うとかすれる課題があるため、使いづらいのが現状です(参照「游ゴシックは何故Windowsでかすれて見えるのか - Ryusei’s Notes)」)。Windowsのフォント事情が改善するといいですね。
まとめ
ウェブは時代の流れが早い業界です。「今まではこれが当たり前だった」という常識もすぐに変わっていくでしょう。さまざまな調査報告に目を通し、多角的に業界を俯瞰していくことは大切な活動だと思います。
半年前の記事「Web業界は何時まで働くのか? HTMLコーダーへのアンケート結果(業務時間やコードの書き方、Web技術について)」では、アンケート対象の母集団を掲載しています。あわせて参照ください。
このようなアンケートは今後も実施していく予定です。興味があれば私のTwitterアカウントをフォローいただければ幸いです。今回のアンケート実施にあたり、回答やシェアを多数いただきました。ご協力いただいたことに感謝を申し上げます。