マークアップの初学者が挫折するパターン

マークアップの初学者が挫折するパターン
2020年6月17日

webデザイナーの平尾誠です。
クライアントワークの合間に、初学者のメンターになっています。

初学者の方を平均的に3ヶ月以上サポートしており、180人の方のメンターになりました。
最近、独学が楽しいと思ってもらえることにやりがいを感じでいます。

MENTAというサービスとこのブログからお申し込みいただけます。

ところで、初学者の独学で上手くいかない方のパターンがわかりました。
大きく理由は分けて、”技術的理由”と“メンタル的理由”のいずれかです。

よくあるパターンを知ることで、挫折を回避できます。

この記事のターゲット
マークアップがうまく捗らない
Progateやったけど手応えがない
CSSがわからない

このあたりの方が対象です。
自分が今どれに当たるのかを理解して対策を練りましょう。

それではマークアップで挫折しないために細かく説明していきますね。

技術的理由

自分で作業して、作れるという実感を得ないとみんな諦めてしまいますね。

まずはpositionとflexを最初に身につけろ

この二つだけをまずは優先的に覚えましょう。
これだけで挫折する確率がめちゃくちゃ下がります。

  • flex => 子要素を横並びにできる。そして子要素を自由自在に操れる。
  • position =>自由自在に配置ができる。

何はともあれ、レイアウトができないと何も進みません。
挫折する方の一つ目の壁はここですね。

逆にこれさえクリアすれば、自分の思うようにレイアウトが進み、楽しくなる方がほとんどです。

marginとpaddingを理解していない

marginは要素間の余白のことをいい、paddingとは要素の内側の着膨れのことを意味します。
ここは背景色を指定して見るとわかりやすいのですが、初めは混同している方が多いですね。

displayタグを理解していない

displayは色々使い方があって、HTMLタグの振る舞いを自由に変えていくことができる便利なプロパティです。
まずはブロックレベル要素とインラインレベル要素を理解すると一気にdisplayプロパティに対する理解が進みます。

画像の書き出しができない

実務未経験のマークアップエンジニアで一番クリティカルなのがこれ。

素材になる画像の書き出しはデザイナーがするものではなく、マークアップエンジニアするものです。
なので、デザインアプリケーションの基礎的な使い方を理解していないとだめ。

メンタル的理由

目標が高すぎる

最初から何でもかんでもできると思わない方がいいです。
じゃないと検索しながら『なんて検索していいかわからない。。』って思いながらフェードアウトしてしまう人が多いです。

こういった人はweb制作を決してナメている訳ではなく、逆に凄いものだと思いすぎてしんどくなっている印象です。

まずは一つづつできるようになることが増えるたびに、自分のことを褒めてあげて欲しいです。

先に考えすぎる

作る前からずっと考えている人は、学習が捗らないです。

どんどん間違えながら、軌道修正していくのがマークアップや、プログラミング学習に対しては一番の近道です。

メンターとしてはミスが多い人の方が、教えてて楽しいなって思いますね。w

楽しいと思ってない

二ヶ月くらいして、何かしらの楽しいって思う『アハ体験』をしなければ、きっとそれは向いていないです。

誰でもできなかったことができるとうれしくて楽しいですよね。
でも楽しくないのであれば、成長率は人よりも遅いので、きっとそれは適性がないです。

逆に全然できなくてもめっちゃ楽しいって人は絶対に報われます。

これはたくさんの人を見てきて一番感じるところです。

まとめ

だいたい独学を初めてみて、デザインデータからコーディングをしてみて楽しいと感じる方はそれだけで将来が有望かなと思います。
なので、どうしても挫折しそうな時は上記のようにflexとpositonをまずは理解するようにしてください。

実践的でアウトプット中心の学習をされたい方はぜひお問い合わせくださいませ。

ほなね