CHROMA

世の中の "当たり前" を確認する

フロントエンドデベロッパー面接時の一般的な質問事項への回答

一昨日、「フロントエンドデベロッパー面接時の質問事項」というのがあるのを知りました。

この中の「一般的な質問事項」に少し答えてみました。

プログレッシブ・エンハンスメントとかの用語の意味を普段あまり考えていないので、質問に答えにくいところが結構ありました。なかなか恥ずかしい回答をしてしまっているところが多いですが、せっかく書いたものをゴミ箱に捨ててしまうのも勿体無いと思ったのでブログに残しておきます。(「わかりません・知りません」と、答えを投げているところもいくつかあります)

今回は答えていませんが、HTML / JavaScript / CSS の質問に答えることは「何故自分がその技術を使っているのか」を考えるのに良い機会になりそうですね。

一般的な質問事項

昨日・今週に何を学びましたか?

HTTP の用語と基礎的な仕組み、現状の HTTP の問題を解決するために仕様が考えられている SPDY や WebSocket といった新しい通信の仕組みについて学びました。
また、スマートフォンタブレットが出てきたことで、変化し続けるユーザーの Web との付き合い方はこれからどのような方向に進んでいくのか、ということを Automagic.fm という PodCast をきっかけに考え始めました。

何があなたをコーディングに惹きつけていますか?

まだベストな作り方が確立されていないところです。 難しい実装ができることよりも、コーディングの知識が浅い人でも理解できるコードを書けるようになりたいです。

好きな開発環境について教えてください。(OS、エディタ、ブラウザ、ツール等)

OS は Mac を使っています。これは、好きとかいうよりも Web 製作を始めだした頃から使っていて、単に慣れているからです。
エディタは Vim が好きです。パッケージなどを含めて、常に開発が行われているのが好きなのと、エディタを作る開発者がときどき飛ばすジョークがおもしろいと思うからです。
ブラウザは Chrome が好きです。開発時に使う DevTool の使い心地が良いからです。OS と同じで既に慣れてしまっているというのもあるかもしれませんが、「どこに何のメニューがあるか」というのが把握しやすいのも好きで使っている理由です。

あとは Web サイトのデザインを作る上で Fireworks が手軽なので使っているのと、シンプルな Markdown のプレビューツールとして Mou を好んで使っています。

webページを作るときのあなたのワークフローを教えてください。

仕事では、デザインを Fireworks で作ってチームに共有し、貰ったフィードバックを元に修正した後、これを HTML と CSS を使って Web 上に表示するという工程を踏んでいます。個人で作るものでは、簡単なドキュメントと大枠のレイアウトを作った後、すぐにコーディングに移ることが多いです。

CSS は、Sass などのプリプロセッサを使って書くこともありますが、大体は素の CSS で書いています。また、矢印を作るときなど、書くのが面倒くさそうなものを作る場合はジェネレーターサービスを使っています。

プログレッシブエンハンスメントとグレースフルデグラデーションの違いを説明してください。

プログレッシブエンハンスメントは、すべての環境下で同じサイトの見た目を表示するのではなく、自分たちが目的とする環境以外ではコンテンツを読む上で最低限の見た目だけを確保する考え方のことです。グレースフルデグラデーションは、すべての環境で同じサイトの見た目を実現しようとする考え方のことです。

フィーチャーディテクションの説明もできるとボーナスポイント。

知りません。

「セマンティックHTML」の意味を説明してください。

適切な要素の決定や命名を行なうことで、正しいサイトの構造を HTML で表現することです。セマンティックな HTML を組むことは、Google のような機械に Web ページの情報を理解してもらうことにも繋がると思っています。

ウェブサイトのアセット・リソースを最適化をどのように行いますか?

Gulp や Grunt を使うことで、ファイルの結合・圧縮でリソースの容量を縮めたり、冗長な記述や不要なコードを洗い出して削除することでリソースを最適化させます。

複数ドメインからアセットを提供したほうがよい理由は何ですか?

知りません。

一度にブラウザが与えられたドメインからダウンロードできるリソースの数はいくつですか?

わかりません。

ページロードを減らす3つの方法の名称を挙げてください。

全然わかりません。

プロジェクトに加入したときに、もし彼らがタブを使い、あなたがスペースを使っていたとしたらどうしますか?

おそらく慣習に従ってタブを使うと思いますが、スペースを使わない理由は始めに聞くと思います。

シンプルなスライドショーのページを書いてください。

またね。(多分何もリソースを見てはいけないなら、僕は CSS だけでスライドを作れないと思う )

コードのパフォーマンスをテストするのにどんなツールを使いますか?

Chrome の DevTools のネットワークタブを見たり、拡張機能の「PageSpeed」を使います。

もし今年1つの技術をマスターできるとしたら、何をマスターしますか?

JavaScript

標準化と標準化団体の重要性を説明してください。

標準を作ることで、ベンダー間で異なる仕様が無くなり(少なくなり)、開発者はサイトを組み上げるときに迷うポイントが減ると思います。
また、標準化が進むことで、どのプラットフォームでも使えるサービスを提供しやすくなると思うので、ユーザーにとってもそれぞれの環境の違いで困ることが無くなると思います。

FOUCとは何ですか? どのようにFOUCを防ぐことができますか?

知りません。