おすすめのWebデザイン＆プログラミングスクールを一部紹介！主要なスクール23校は『Webデザインスクールの一覧』でチェックしましょう。
【コーディング模写用】XDのデザインデータを無料配布中！
コーディング /
2021.01.19
模写コーディング用に、XDのデザインデータを作りました。無料配布しています。コーディング練習中の方はぜひトライしてやってください。↓の記事からダウンロードできます。
【無料配布】コーディング練習用デザインと完成版コーディングデータ
合計８ページあります。デモとコーディングファイル一式もあります。作るの疲れた〜
コラム①：Webデザイナーを強くオススメする理由
エンジニアになるのは本当に難しいです。
だからこそ、このサイトでは、Webデザイナーになることを強くオススメしています。
でも、もし、エンジニアになれれば、月収100万円以上も可能です。実際に僕の友人も軽く年収1000万円は超えています。
ほとんどの人がエンジニアにはなれないので、30〜40万円以上はする高額なプログラミングの学校に行くのはお金をドブに捨てる可能性があります。
どうしてもエンジニアになりたい方は、無料でプログラミングを学べるProEnginner開講の学校『プログラマカレッジ』に行きましょう。プログラマカレッジは、学校＆就職支援の一体型サービスです。ここは本当にありがたい存在です。ソーシャルゲーム大手企業で有給インターンまで可能です。
無料のプログラミング学校はもう一つ、『GEEK
JOB』があります。就職率97.8%と驚異的な数字を出しています！よりエンジニア色の強いカリキュラムを受けたい場合はこちらを受講します。
２校ともオススメです。無料見学をしてみて自分に合いそうな雰囲気の学校を選びましょう。
この２つの学校のどちらかに通って、自分にエンジニアとしての素質があるのかチェックしてください。もし、あなたに才能があったら、最高にラッキーな人生です。20代のみ対象です。もし20代ならこのチャンスをぜひつかんでください。
参考記事 : なぜ「エンジニア」ではなく「Webデザイナー」をすすめるのか
コラム②：正社員のWebデザイナーを強くオススメする理由
このサイトでは、
本当にWebデザインのスキルを磨きたいなら、未経験の方はまずはWeb制作会社に正社員で入社すること
を強くオススメしています。
Webの最先端に触れられるWeb制作会社に入社し、スキルをガッツリ高めてほしいです。そして、社内では、やはり派遣でもなく、アルバイトでもなく、長く在籍する可能性のある正社員にこそ成長できるお仕事を振ってくれるのです。派遣やアルバイトは、リンク張り替えやテキスト修正など成長しづらい作業をやらされがちです……。
未経験OKで正社員のWebデザイナー・フロントエンドエンジニア案件を多く保有しているのが、IT系に強いWebistです。
※現在はコロナの影響でWebistですら未経験OKの求人が少ない状況です。ただ、少しでも選択肢を増やすために、また今後状況が改善されてきた時のために登録しておきましょう。
コラム③：WordPressでポートフォリオサイトを作ろう！
“【コーディング模写用】XDのデザインデータを無料配布中！” への7件のフィードバック
ご質問や感想など、お気軽にどうぞ！
管理人（ねこポン）について
週３日だけ会社で働く30代前半ウェブデザイナーです！
インテリ風＆仕事できる風を醸し出す腕前では右に出る者はいませんが、電話すら怖くて取れないし、無断欠勤してしまい自宅に警察が来たほどのコミュ症ポンコツ人間です。
現在Web業界5年目。事業会社とWeb制作会社のウェブデザイナーを経て、フリーランスになりました。
最近ちょこっと『月曜から夜ふかし』に出演しました↓
なんでもWebの質問受け付け中 (^o^) /♪
on ポートフォリオ用WordPressテーマ『PORTFOLIOベーシック』マニュアル: “フランクさま、お世話になっております。 サイトを拝見して調べてみましたが、少し…” 6月 29, 15:29
on ポートフォリオ用WordPressテーマ『PORTFOLIOベーシック』マニュアル: “お世話になっております。 wordpressテーマを購入させてもらったものなの…” 6月 27, 19:58
on 大学4年生で今はまったくWebデザインの知識が無いのですが、Webデザイナーとして就職は可能ですか？: “ねこポンさん、返信ありがとうございます！ 本当に丁寧なコメントで感激しておりま…” 6月 20, 21:29
おすすめのWebデザインスクール一覧
| スクール名 | 料金 | 授業形式 | ジャンル | 就職支援 |
|---|---|---|---|---|
 求職者支援訓練 ハロートレーニング |
無料 （教材費のみ） |
通学 （約６ヶ月/週４〜５日） |
Webデザイン | ハローワークによるサポート |
 プロによる総評 |
||||
|
一番おすすめのスクールは国の運営する求職者支援訓練（ハロートレーニング）です。授業料が無料！しかも約６ヶ月という期間がWebデザインの基礎スキルを習得するのに十分な長さです。僕自身も求職者支援訓練を経てWebデザイナーになりました。 失業保険が受給できる方は職業訓練がおすすめです。期間が約３ヶ月と短くやや理解が浅くなる点は不安ですが、復習や独学で補えれば問題ありません。最近は数は２校ほどで少ないですが６ヶ月コースも登場しました！ 参考記事：【無料】職業訓練でWebデザインを学ぶ |
||||
| スクール名 | 料金 | 授業形式 | ジャンル | 就職支援 |
|---|---|---|---|---|
 LIG |
有料 （¥450,000 〜） |
通学 （６ヶ月） |
Webデザイン | 転職セミナーあり/LIGへの採用実績もあり |
| プロによる総評 |
||||
|
金銭的に余裕があればLIGを検討しましょう。超有名Web制作会社LIGによるWebデザインスクールです。現役のプロデザイナーが講師で、Mac＆デュアルディスプレイという最新設備で学べます！LIG運営のコワーキングスペースも無料で使い放題。生徒のレベルによってはLIGへの就職も可能です。 |
||||
| スクール名 | 料金 | 授業形式 | ジャンル | 就職支援 |
|---|---|---|---|---|
 デイトラ |
有料 （¥89,800〜） |
オンライン （90日間/質問期間は1年） |
Webデザイン | なし |
| プロによる総評 |
||||
|
『デイトラ』はかなりコスパの高いオンライン完結型のWeb制作スクールです。格安ながらもデザインとコーディングのレビュー（添削）が受けられます。人気急上昇中でTwitterで受講生のツイートを見ない日はありません。「課題 ＋ 課題のレビューあり ＋ 質問し放題」というサービスを提供しています。 |
||||
| スクール名 | 料金 | 授業形式 | ジャンル | 就職支援 |
|---|---|---|---|---|
 Famm |
有料 （¥162,800） |
オンライン （１ヶ月） |
Webデザイン | なし（案件獲得サポートあり） |
| プロによる総評 |
||||
|
ママさん専用Webデザインスクールです。現在はコロナでライブ配信授業が中心です。なんと授業中は自宅にシッターを手配してくれるのでしっかり集中できます。受講期間は１ヶ月で５日間という超短期間なので、忙しいママさんでも時間を確保しやすいです。生徒はママさんだけなので、ママさん同士の交流も楽しめます。 |
||||
| スクール名 | 料金 | 授業形式 | ジャンル | 就職支援 |
|---|---|---|---|---|
 CodeCamp デザインマスターコース |
有料 （¥148,000 〜） |
オンライン （２ヶ月〜） |
Webデザイン | キャリア支援あり （就職エージェントの紹介） |
| プロによる総評 |
||||
|
CodeCampはオンラインのWebデザインスクールです。低価格ながら講師から直接指導とフィードバックを受けられるのが最大の特長です！おすすめのコースは「デザインマスターコース」。コスパ重視で講師と対話しながら学びたい人に最適なスクールです。 |
||||
| スクール名 | 料金 | 授業形式 | ジャンル | 就職支援 |
|---|---|---|---|---|
 プログラマカレッジ |
無料 | 通学 | プログラミング | あり |
| プロによる総評 |
||||
|
『プログラマカレッジ』は20代限定の通学式で完全無料のプログラミングスクールです。無料なのでエンジニアになりたい方はぜひ挑戦してみてください。スクール側は就業先の企業からお金をもらうことで無料で運営をしています。とはいえ授業の質は高いと評判です。『プログラマカレッジ』の卒業生による体験談記事はこちらです。 |
||||
| スクール名 | 料金 | 授業形式 | ジャンル | 就職支援 |
|---|---|---|---|---|
 GEEK JOB |
無料 | 通学 | プログラミング | あり |
| プロによる総評 |
||||
|
上で紹介した『プログラマカレッジ』と同様の20代限定の通学式で完全無料のプログラミングスクールです。プログラマカレッジは決まった時間に通学しますが、GEEK JOBは個別指導なので自分のペースで通学できます。エンジニアになりたい方は、自分の生活スタイルに合わせてどちらのスクールに行くか検討してみましょう。就職率97.8%は驚異的です！ |
||||
Web制作会社を歩き回れるゲームを作ってみました！ぜひ探検してみてください。(注意：音が出ます！)
【コーディング模写用】XDのデザインデータを無料配布中！
上記サイトを閲覧しました。当サイトで配布されているデザインデータは、ポートフォリオとして使用してもいいのでしょうか？ ご返答のほど、よろしくお願いいたします。
↓こちらに記載があります。
https://webdesigner-go.com/template/coding-tutorial/
「こちらのデザインをコーディングしたものはポートフォリオへ掲載していただいてOKです。XDのデザインもご自身で改変していただき、オリジナルのデザインを作ってポートフォリオに掲載していただいてかまいません。デザインを変えず再配布や販売する行為は禁止です。」
ねこポンさん、私は36歳で接客業から未経験でwebデザイナーの転職をしようとしています！！
全く今までの経験が生きないので採用されるのかどうか不安ですが、頑張ります！！
ねこポンさんのポートフォリオのテンプレートを使用させて頂きました！！
コードも見やすく、そして勉強になりました！
ありがとうございます♪
hiromiさん、はじめまして！
接客業をされていたんですね。他業種からでもしっかりWebデザインの基礎スキルを身に着けたら就職できるはずです！
テンプレートを参考にしていただいてありがとうございます。少しでもお力になれたら嬉しいです＾＾
わからないことやお悩みなどあれば、お気軽にコメントをください。楽しみながらがんばっていきましょう！
ねこぽんさん、はじめまして。
2020年12月よりWEB制作の学習をしており、現在カンプコーディングの修行中です。
スキルアップに良さそうなので本デザインデータ、ありがたく使用させていただきます。
答えもあるようなので恐らく大丈夫ですが、どうしても分からない時は質問させて下さい。
よろしくお願いします。
みそしるさん、はじめまして！
デザインデータをぜひ学習に活用してやってください。わからない箇所がありましたら、どんどんこちらで聞いてください。具体的に教えてもらえると返信しやすいです。
Web制作の勉強、楽しみながらがんばってください＾＾
poffyです。
丁寧な返信をいただき、本当にありがとうございました。
sassをもっと勉強すると、このテンプレートが理解できるようになるのですね。
（Sassはパーツごとにかき分けるのですね）
不勉強な状態で抽象的な質問をしてしまい、本当に申し訳ありませんでした。
今後私が「チームで制作する」などということはないだろうと思っています。
ですので、どこまでSassで書かなければいけないのか疑問に思っていました。
制作会社で働くのでない限り、cssをきちんと理解し
命名規則を決め、デザインをきっちり再現できるようになることの方が大事
そうですね。それがわかってスッキリしました。（Sassはその上で取り組みます）
＞@useを使ったDart Sass
こうしている間にも、どんどん進化していってますね！
Sassは必要になった時に勉強するのが、今の私には良さそうです。
Sassが出てきて、自分はどこまでやろうかとても悩んでいたのですが、
ねこぽんさんのおかげで、区切りがつきました。
こんな拙い質問に丁寧にお答えして頂き、本当にありがとうございました。
仕事をしながら勉強しております。
何か進展がありましたら報告させていただきます。
それまではこちらのサイトを隅々まで読んで参考にさせていただきます。
本当にありがとうございました。