オンライン講座・第2弾は「作業の効率化をして欲しい」講座!

blog_main_emmet

  • staff_icon CCFスタッフ
  • kuriya_icon 栗谷講師

オンライン講座・第2弾は「Emmet基礎講座」!

「Brackets基礎講座」に続く CCFアカデミーのオンライン講座である「Emmet基礎講座」が開講となりましたね!

立て続けに!という感じでしょうか(笑)。今回の講座については、第1弾の「Brackets基礎講座」と2つで1つというようなところもありますからね。

そうなんですか?!

Web制作を行なう上でのツールの選択肢の1つに Brackets を加えてもらいたい、との気持ちから開講をした「Brackets基礎講座」を受けて、Brackets も含めたさまざまなテキストエディタやオーサリングツールをさらに効率よく使ってもらいたい!との想いで開講をしたのが「Emmet基礎講座」ですからね!

少ない記述量でHTMLやCSSをコーディングできる Emmet!

「Brackets基礎講座」開講の際にも Brackets についてお聞きしたのですが、「Emmet基礎講座」の Emmet とは何なのでしょう?

Emmet はさまざまなテキストエディタにインストールをすることができる無料のプラグイン(機能拡張)です。古くは Zen Coding と呼ばれていたものなのですが、2013年にリネームされました。

先ほど「テキストエディタなどをさらに効率よく使ってもらいたい」とおっしゃっていたんですが、Emmet をインストールすることで なぜ作業効率が良くなるんでしょうか?

本来 HTML や CSS をコーディングして行く際には、コードの1つ1つをイチから書いて行く必要があります。ところがテキストエディタに Emmet をインストールすることによって、Emmet 独自の省略記法を用い それを展開することで、通常よりも大幅に少ない記述量で HTML や CSS をコーディングすることができます。「コードを書くこと」自体は単純作業ですから、その作業が早く行なえるのであれば それに越したことがない訳です。クリエイティブは 本来 「考える部分」に時間をかけたい。コーディングで言えば「この情報はどんなコードで記述をしようか?」「この見栄えにするためには どんなCSSを書こう?」というようなところに時間をかけたい。決まってしまえば、あとは ガーッ と手早く記述をして行く! そんな時に Emmet を使って欲しいと思います。

最近のテキストエディタやオーサリングツールは、それぞれに入力支援機能などを持っているような気もするのですが?

おっしゃる通りです。テキストエディタそれぞれに便利な機能が備わっていますので、それらは有効に活用をしたいところです。ただ その「それぞれに」というのがポイントでもあって、裏を返せば テキストエディタそれぞれに使い勝手が違うということになります。Emmet の良いところは さまざまなテキストエディタやオーサリングツールにインストールをすることができるところ(2016年10月現在 15種類ほどのテキストエディタに対応)。つまり、Emmet でのコーディング作法を覚えれば 幅広い制作環境において 同じ要領で 手早いコーディングを行なえることになります。

サイトを作成する流れの中で Emmet の省略記法が学べる!

今回 開講になった「Emmet基礎講座」には 何か特徴がありますか?

Emmetの基本的な記述方法をチュートリアル的に伝えるのであれば、トータルで1時間強の動画レクチャーとして構成することができたかと思います。ただ、今回の講座は3時間40分を超える講座となっています。これは、架空のカフェサイトのコーディングを行ないながら Emmet の省略記法を学んでいただける構成としたからです。サイトを作成する工程を疑似体験しながらコーディングを行なっていく方が「書いている実感」を味わってもらえると思いますし、何よりも楽しいと思うんですね。Emmet ならではの「サクサク」書いていく感じを味わってもらえるといいなと思います。また「Brackets基礎講座」と同様に、「Emmet基礎講座」も 日本語で行なわれる Emmet の講座としては 本講座が Udemyで唯一のもの(2016年10月現在)なので、とても嬉しく思っています。

最後に、講座を受講される皆さんに一言お願いします!

オンライン講座の良いところは、いつでも どこでも 自分のペースで学べるところだと思います。そのような意味では、ベースとなるスキルや知識を「モレなく」身につけることができるのがメリットとも言えます。今回の「Emmet基礎講座」は、まさにHTMLやCSSを効率よくコーディングするための「作業のベース」となるスキルですが、それを身につけることで たくさんの制作経験を積んで行ってもらいたいと思います!

コメントを残す

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