¥138000
30日間返金保証
このコースの特徴
短期でLPコーディング案件受注可能なコーディングスキル習得を目指す
～ランディングページ(LP)制作を通して、複雑なレイアウトのコーディング方法を学ぶ～
フリーランスとしてWebデザインのお仕事を探したとき、多く見かけるのがランディングページの制作案件。商品やサービスを販売する商業的なWebサイトにとって、ランディングページは必要不可欠なページの一つとも言えます。
コーディング学習やフリーランスデビュー
ハードルが高いと感じていませんか？
HTMLとCSS基礎学習から
レベルアップするには…？
習ったページは作れるけど
自分で考えるのは難しい
コーディング案件受注は
難易度が高そうで不安
情報量の多いLPをコーディングすることで、幅広い表現方法の習得・応用が可能になります
ランディングページは情報量が多く、縦長。ユーザーを飽きさせずに様々な情報を見せるために、デザイン的な表現も多く使われています。そのため極力画像化せずCSS等でデザインを再現しようと思うと、ランディングページのコーディングは難易度が高くなります。
つまり、ランディングページのコーディングができれば、多くのWEBページのコーディングが可能になります。
本講座ではランディングページを作成しながら、よく使われるレイアウトや、複雑な表現を可能にするCSSについてミニマムに学習して頂きます。題材デザインのコーディングができれば、もはや初心者ではありません。
お仕事案件チャレンジへの自信もつき、様々な応用もできるようになりますよ。
本格的なデザインのLPをコーディングしてただきます
Skillhub LPコーディング講座の特徴
多くの未経験者をフリーランスWeb制作者としてデビューさせてきた、Skillhubの講座は無駄なくミニマムな内容。実際に手を動かしてコーディングを行いながら、考え方や仕組みを学ぶことで、短期間でもコーディングスキルの向上を可能にしています。
分かりやすい図解やアニメーションでしっかり理解できる
コーディングの学習はレベルが高くなるほど「正解のコードを見たら分かるよね？」という形式が増える傾向にあります。そのため、なんとなくで作ったり、コピペしたものをアレンジしようとしたらレイアウトが崩れたり、なんて事も……。
本講座では、どういった仕組みでデザインの再現を行っているのかを図解やアニメーションを使ってしっかり解説。検証ツールと組み合わせた解説もあるので、上手く行かない時はどこを見るのか、どのように直すのかのコツも掴むことができます。
引き出しを増やし、様々なデザインに応用できるようになる
渡されたデザインからどのように考えて、HTMLとCSSで形作るのか。コンテンツ量や画面幅に左右されない背景画像の設定、疑似要素やlinear-gradient()を使った表現方法なども解説しています。
考え方や活用法を知ることで、レッスン題材だけではなく、様々なデザインをコーディングで再現することが出来るようになります。もう、コピペ可能なコードを探し回る必要はありません。
案件数の多いLPコーディングのお仕事に挑戦できる
商的Webサイトでは、ランディングページが多くあります。クラウドソーシングサイトでコーディングでお仕事を探しても、LPコーディング案件の割合はかなりのもの。
ランディングページのコーディングが出来るようになると、エントリーできるお仕事の数が増えます。比例して獲得できるお仕事数や収入も高まっていくでしょう。仕事をこなすほど、Webデザイナー・Webコーダーとしてのあなたの実績も上がっていきます。
本講座の受講に必要なスキル
ランディングページ(LP)コーディング講座では複雑なレイアウトや、デザイン性の高いコーディングを行います。レッスンをスムーズに進めるため、HTMLとCSSの基礎知識が必要となります。
- HTML,CSSの基本書式を理解している
- Flexboxでのレイアウトができる
- positionプロパティを使った絶対位置指定ができる
- ブラウザ付属の検証ツールが使える
本講座受講でできるようになること
- レスポンシブなランディングページを作れる
- 渡されたデザインをWebページで表現できる
- 表示が崩れてしまっても自己解決できる
- コーディングのスピートが向上する
- LPコーディングのお仕事を受注できるスキルが身につく
学習内容
こんな方におすすめ
受講に必要なもの
コースコンテンツ
セクション: 4本講座の進め方と注意点
初期設定：Webフォント、サニタイズCSSを導入する
実習範囲01：ヘッダー部分
解説01：自作グリッドシステムとヘッダー作成
実習範囲02：ファーストビュー
解説02：ファーストビュー部分の作成
実習範囲03：問題提起部分まで
解説03：Web起業で～問題提起部分
実習範囲04：結果セクションとCTA
解説04：結果セクション～CTAの作成
実習範囲05：Skillhubメソッド部分
解説05：Skillhubメソッド部分の作成
実習範囲06：学習フロー部分
解説06：学習フロー部分の作成
実習範囲07：卒業生の声とCTA
解説07：卒業生の声～2つめのCTA作成
実習範囲08：特徴セクション・よくある質問
解説08：特徴セクション・よくある質問の作成
実習範囲09：料金プラン
解説09-1：テーブル(表)の基礎知識
解説09-2：料金プランの作成
実習範囲10：お問い合わせ
解説10：お問い合わせ部分の作成
実習範囲11：フッター作成
解説11：フッター作成と全体の見直し
実習範囲12～15：スマホ幅表示の調整
解説12-1：①大きなはみ出しを無くす
解説12-2：②ヘッダーナビゲーション
解説13：③fv ~ 1つ目のCTAまで
解説14：④Skillhubメソッド～特徴まで
解説15：⑤フッターまで
講座終了課題について
