ウェブデザイン技能士の試験基準(2025.1.1~2025.12.31)に正確に合わせたウェブデザイン技能士の実技試験内容に最適化された実技試験専門講義で、HTML+CSS+JQUERYパブリッシング、コーディングワークスウェブデザイン技能士実技試験講義は他とは違います。 2023年に追加されたDタイプ、Eタイプの完全制作授業動画と2024年に追加されたFタイプの完全制作授業動画がすべて反映されています。
HTML+CSS+JQUERY コア理論
ウェブ パブリッシングの就職のために個人ポートフォリオのウェブサイトを作成
ウェブサイト制作のスキルとノウハウの向上
ウェブデザイン機能士実技試験に高得点合格
2025年度ウェブデザイン機能士資格試験情報： http://www.q-net.or.kr/crf005.do?id=crf00503&jmCd=7798
▲2023年基準で3,991人が受験して2,298人合格、 1,693人不合格
（2023年度に1,693人がそれなりに懸命に試験準備し、受付し、受験しに試験場まで行ったが不合格でした。
実技試験の受付は4日間行われます。 Q-Netで午前10時から受け付けてください。受付期間は4日ですが、受付開始日の10:00～10:30内にすべて締め切ります。だから10時前にQ-Netログインしてスタンバイしてこそ実機試験受付可能です。実技試験は、筆記試験とは異なる特定の試験場でなければならないため、実技試験人員が毎回定められています。実技試験の受付ができなかったので試験できない学生たちはとてもたくさん見ました。だから必ず受付初日午前10時前にログイン後スタンバイしてください。
日程よく見て、今年はぜひ！合格していただきたいと思います〜！
ウェブデザイン機能会社公式ウェブサイトで新しく上げた2025年基準の公開問題をダウンロードし、2024年の公開問題と比較してみました。試験内容で変わった点は一つもなく、変わった点は2つです。
まず、実機試験時間を既存の4時間から3時間に調整して試験難易度を高めました。
第二に、資格種目名が既存の「ウェブデザイン機能士」から「ウェブデザイン開発機能士」に変わりました。
2025年試験に追加された事項はありません。もし2025年の変更があったり、追加があれば、できるだけ早く更新され、追加費用はまったくありません。 （2024年12月6日基準）
2024年から追加されたFタイプ4種類（F1、2、3、4）制作映像が更新されました。 Fタイプと呼ばれる新しい制作モジュールがあるか、そうではありません。ただし、レイアウトだけ1つ追加されたと考えればいいです。追加されたFタイプ4つのため実技試験の準備に大きく負担されないと思います。
2023年度までAタイプ、 Bタイプ、 Cタイプ、 Dタイプ、Eタイプそれぞれ4種類ずつ合計20個でしたが、2024年の1回目の試験からFタイプ4種類が追加されました。それで、合計24種類を勉強する必要があります。
主催側で2023年度に試験年齢を大幅に上げたが、2024年度から試験難易度をもう少し上げました。
✅ 2024年に追加されたFタイプ授業映像は現在準備中です。
2024年1回実技試験が2024.03.16～2024.03.29なので、Fタイプを除いて現在ある内容を勉強してください。 A、B、C、D、Eタイプを十分に上手にしている状態であれば、 Fタイプも全体のレイアウトだけがちょっと違うので、大きく違う部分はありません。ただし、全体のレイアウト設計で1340ピクセルで中央揃えですが、スライドセクションのみブラウザ100％にする必要があるのが難しいようです。
※Fタイプもスライド方式、タップメニュー、ナビゲーション、モーダルともA、B、C、D、Eタイプと同じです。
Fタイプ授業映像と資料は遅くとも1月末までに準備される予定です。少し早いかもしれません。予想では1月20日程度になると予想します。
※公開問題PDFファイルは下記セクションで2023年度と2024年度ダウンロードしてご確認ください。
2024年度ウェブデザイン機能士資格試験情報： http://www.q-net.or.kr/crf005.do?id=crf00503&jmCd=7798
▼ F1 レイアウトとモジュール製作内容
▼ F2 レイアウトとモジュール製作内容
▼ F3 レイアウトとモジュール製作内容
▼ F4 レイアウトとモジュール製作内容
学習の質問ではありませんが、先生が周りにFタイプ試験を見たことがないので
情報が正確ではないというのが覚えてくると思いますが、他の受験生の方々と
先生に役立つようにテストを終えて走って来て、投稿を作成します！
今週ずっと不思議にFタイプが気になっていましたが、今日ちょうど試してみるのが直感していたようです😭😭
1.講義通り
.slideの中でslide-imageとslide-bannerで結んで勉強しましたが、
試験紙では私達がslide-bannerと呼んだ部分を指示事項では<ショートカット>とし、content-innerの中にあるshortcut部分を試験紙ではバナーと指示していました。ただコードを結ぶ名前だけ違ったけどFタイプ用意してる方はあまり混乱してほしい気持ちでコード名を変えて勉強するのかどうかという気がしました！しばらくして、ちょうど指示事項要求した名前でコード名も統一をさせました！
2. ピンク色のボックス部分を色塗りした部分について申し上げるものがありますよ～
覚えているかもしれませんが、..😭😭
私が24.03.27にFタイプslide-banner link部分に文字を入力する指示があるかと思う
質問を投稿したことがあります..！
残念ながら、私の予想通り、テストの指示にアンカーごとにテキストを入れるという部分がありました。
提供されるテキストメモ帳に挿入するようにテキストがありました😭😭
そして、総入る画像はレイアウトと同様に5つでした。
ただし、テキストを画像のどこに置くように特定の指示はなく、
だから私は
spanでテキストを入力してギャラリー画像にspanを入れたのと同じように
display:block 処理をして上下に入れて配列する方法にしました。
イラストやフォトショップでイメージを作るのではなく、提供されたイメージを挿入しなければなりませんでした。
配置をしてからスライド画像の上に浮かんでいない写真を貼っておいたようで、
私はバックグラウンドカラーを与えて透明度を調節してスライドイメージとは別の部分であるアイコンのように見える
作成しました。
3. そしてお知らせ部分です！右側に先生が???😭😭 と水色で書いた部分は本当に空白でした！ただし、お知らせ部分にエン？と驚いた部分は、tab-inner幅が広くないことがあるから
お知らせ部分にem/bタグを使ってバッチや馬の縮小を勉強していきましたが、
日付入力がありませんでした！
だからゆっくりアンカーだけ入れてブロック処理して中央配置して飾りました。
私が間違えたのは、フッターメニューにボーダーボトムを与えたことです。
メニューサブバックwidthサイズをハザーサイズに与えたということの2つのことですが、(Aタイプsub-backのように作ってしまいました😭)
他のものはすべてうまくいき、自分でもああ、これくらいすればいいという気持ちでよく解いてきました！ 😭😭
こういうあの二つの問題に落ちるとあまりにも恥ずかしくて恥ずかしいようですが..😭😭😭😭
それでも、自分で多くの構造を把握して作ることができるというのがあまりにもそうです。
そしてFタイプがどうしても見たことのないタイプだから。
今日私が行った試験場に12人が試験を見ましたが、6人が途中であきらめていきました。
私はすべての確認を終えて提出するのに2時間20分かかりましたが、
その時まで私を含めて提出した人は3人であり、私が教室出てくるまで3人が残っていました。
4月9日に合格発表日ですが、どうぞよろしくお願いします😭😭
先生対面の授業ではなくオンラインの授業でしたが、本当にたくさんのことを学びました😭😭
ありがとうございます😭😭！
ジェイコーリー方式スライド制作映像が更新されました。 2023年からDタイプ、Eタイプ追加され、実機試験の難易度が上がり、スライドの制作方法をより簡単で楽に制作が必要です。そこで既存のジェイクエリー方式映像を新しい映像で制作しました。
従来のCSSスライダーで作成すると、多少減点要素がある可能性があります。 CSSスライダー講義がありますが、ジェイクエリを使ってスライダー製作することをお勧めします。 （事実2つの方法の中で楽なもので学習して試験をしても合格には全く支障がありません。）
CSSスライドの場合、スライド1、2、3の後に再びスライド1に戻り、1、2、3に行く部分が少しぎこちないが、ジェイコーリースライドはスライド1、2、3の後、再び自然にスライド1、2、3に見えます。まもなく、CSSスライドよりも完璧なスライド作成が可能です。
ジェイクエリコードを見れば短くてとても簡単で理解しやすいと思います。
※JQueryコードは6行ですが、実際に動作するコードは3行です。
▼ジェイコーリー方式スライド制作映像とダウンロードファイルは下記からご覧頂けます
2023年からウェブデザインの機能士実技試験に新たに追加されたD,Eタイプ製作講義のアップデートが完了しました。追加された映像は7時間近い分量です。 D、Eタイプの製作難易度も上がり、学習量が多くなったので、あらかじめ用意しておいてください。
2023年に新たに追加されたDタイプとEタイプ制作講義のアップデートが完了しました。 DタイプとEタイプ制作講義はセクション09にあります。制作映像にもありますが、必ずA、B、Cタイプをすべて完了した後、DタイプとEタイプ制作講義を学習してください。
▼ D1 レイアウトとモジュール製作内容
▼ 2023年に新たに追加されたDタイプ（D1）最終版のプレビュー
▼ D2 レイアウトとモジュール製作内容
▼2023年に新たに追加されたDタイプ（D2）最終版のプレビュー
▼ D3 レイアウトとモジュール製作内容
▼2023年に新たに追加されたDタイプ（D3）最終版のプレビュー
▼ D4 レイアウトとモジュール製作内容
▼2023年に新たに追加されたDタイプ（D4）最終版のプレビュー
▼ E1 レイアウトとモジュール製作内容
▼ 2023年に新たに追加されたEタイプ（E1）最終版のプレビュー
▼ E2 レイアウトとモジュール製作内容
▼ 2023年に新たに追加されたEタイプ（E2）最終版のプレビュー
▼E3レイアウトとモジュール製作内容
▼ 2023年に新たに追加されたEタイプ（E3）最終版のプレビュー
▼E4レイアウトとモジュール製作内容
▼ 2023年に新たに追加されたEタイプ（E4）最終版のプレビュー
2024年、ウェブデザイン機能士実技試験試験情報が発表されました。筆記実技ともにWebデザイン機能史出題基準は2022年出題基準と同じです。また、ウェブデザインの機能士実技試験の公開問題も2022年とまったく同じですが、2023年からDタイプとEタイプが追加されました。 Webデザイン機能士実技試験の公開問題は以下のセクションに更新されました。
[追加事項] 2024年度1回目からFタイプ4つがさらに追加されました。 （合計24種類）
2022 年から変わった部分は、公開問題 5 ページの技術的遵守事項 10 番で Internet Explorer でうまく動作しなければならないという部分が MS Edge でよく見られていると変わった部分が唯一です。 Internet Explorerで結果をチェックせずにMS Edgeをチェックするというのは、FLEXなど、ほぼすべてのCSSプロパティを使用できるということです。すぐに受験生が成果物を製作する際に、クロスブラウジングに対する負担がほとんどなくなったと考えても良いです。 （試験ですから安全な合格のために講義の授業内容で使用した方法で学習し、試してみることをお勧めします。）
- Webデザイン機能士実技試験、決して簡単な試験ではありません！
- ウェブデザイン機能士資格高得点合格！簡単で簡単なコードが保証されます。
- Webデザイン機能士の資格を取得し、Webデザイナー就職後年俸も上げてください〜！
現行ウェブデザイン機能社出題基準適用期間は2025.1.1～2027.12.31まで有効です。
本講義は現行出題基準に完全に合わせた実技試験講義で製作されました。
2025年度ウェブデザイン機能士資格試験情報： http://www.q-net.or.kr/crf005.do ?id=crf00503&jmCd=7798
2021年の3回目の実技試験からビジュアルスタジオコード（Visual Studio Code）テキストエディタのみが利用可能になりました。既存のテキストエディタでインストールされていたBracketsとDreamweaverは、Q-Net公式サイトの案内によると、2022年からは使用できません。したがって、結論はNotepad ++またはVisual Studio Codeのいずれかを使用してテスト準備することができます。もちろんEditPlusとBracketsを書くことはありませんので、Visual Studio Codeを使って実技試験を勉強してください。
https://www.q-net.or.kr/cst006.do?id=cst00602&gSite=Q&brdId=Q006&code=1204&artlSeq=5199079
上記のガイドに示すように、「プラグイン（別途アプリケーション、アドイン）はインストールできません。」となっています。意味は、ビジュアルスタジオコードエクステンションがインストールされていないため、ビジュアルスタジオコードプログラムの基本機能として実技試験を見なければならないということです。だからビジュアルスタジオコードをインストールし、別のエクステンションをインストールしないで勉強してください。実技試験場と同じ環境で試験準備をしなければなりません。下図のビジュアルスタジオコード講義の4つのうち、赤いボックスの2つだけを学習してください。もちろん、実務のためのビジュアルスタジオコード学習なら、4つすべて学習してください。
該当講座にあるVisual Studio Codeの使い方の中で、Webデザインの機能士実技試験のために赤いボックスの2つの映像のみを学習してください。 （実技試験場にはエクステンション設置がされていません。 ）
自動保存はエクステンション機能ではなくビジュアルスタジオコード自体機能なので自動保存する詳細な方法はコーディングワークス Inflearnブログでご確認ください。 https://www.inflearn.com/blogs/728
1) 2022年よりウェブデザイン機能士実技試験技術的コンプライアンスでEdgeとChromeでクロスブラウジングチェックします。以前のIE（Internet Explorer）は正式に除外されました。 👍
2) floatで横配置する既存方式を十分に学習後、Flex配置を学習（ Flex配置は必須ではない）
Float と Position の配置を知らずに Flex 配置学習を控える必要があります。
3) 使用する場合 Flex 配置は全体レイアウトのみに使用することをお勧めします（詳細な配置に Flex 使用を控える）
選択 1) Flex 配置(全体レイアウト) + Float, Position(レイヤーポップアップ、ナビゲーション、お知らせ)
選択 2) Float, Position (全体レイアウト、レイヤーポップアップ、ナビゲーション、お知らせ)
※フレックス（Flex）での全体レイアウト制作は、Floatで配置する既存方式を十分に学習した後、最終本製作で活用されることをお勧めします。
コーディングワークスパブリッシングYouTubeチャンネルで理論映像講義と並行してください。もちろん、すべての理論映像がYouTubeチャンネルにあるわけではありませんが、重要な理論映像はほとんどありません。映像が多いので、映像を探す方法は以下の例のように検索することをお勧めします。
コーディングワークスパブリッシングYouTubeチャンネル： https: //www.youtube.com/codingworks
▲InflearnコーディングワークスWebデザイン機能士実技講座受講生合格後期です。やりがいがあります〜^^
こんにちは！久しぶりに質問文を書くようになりました！結論から申し上げれば89点で合格したと今日連絡を受けて手帳型資格証明申請を終えた状態です:)
実は他のことと並行して勉強をしっかりできず、急いで一ヶ月の落ち打ちをしましたが。
一ヶ月ぶら下げという言葉に疑わしいと思うので、先に申し上げれば、私は映像、広告、デザイン系列専攻をして昨年夏ウェブデザインをするために勉強して手書きを取って実技準備より（デザイン系列で）就職を先にやってしまって遅くなったケースです^-^;;
以前勉強したことがあったので一ヶ月の落雷が可能でした😢😢
私が勉強した方法についてお話ししたら、私は講義を見て従う方法ではなく、
私が持っている情報で自分で作って講義を見て、先生がどうするか見て学ぶ方法で勉強しました。
具体的な例を挙げると、
A型レイアウトを学んだらB型は自分で作ってみて、ワイヤフレーム理論を学んだら、その理論だけを持って私が直接先に作りました。すぐに勉強するには時間がかかりますが、覚えられる程度も早く、こうして一度でも自分で作ることになれば、2-3回目には一人で作れるようになりました。
また映像中途中の先生がおっしゃったように先生には以前に作ったものをコピーして入れても、私は毎回一つ一つ直接打って枠を作ったのも大きかったようです。
たぶん当然の勉強方法かもしれないが、時間をたくさんつかみ、私が先に作ってみるので、最初はダメなことができるのにその時なぜか？考えるようになって先生の講義を聞き、なぜできなかったのかが分かる部分が勉強になるのに大きいと思います。
少しでも役に立たればと思う心に長く作成するようになりました。ありがとう:)
おかげで試してみました！
投稿者: f1rstf1y9/2021.12.05 10:28 PM
受講後期は合格後に書こうとまずコミュニティに感謝の挨拶を上げます！
私は実はこちら関連専攻大学生なのでhtml、css関連講義を専攻授業でしか二度は聞きました。専攻授業では耳にも入らない講義の内容にひたすら試験のために月々覚えて試験が終われば忘れてしまってウェブデザイン機能士実技を準備する時も何をどのように準備すべきか分からないほど基礎知識が多く不足した状態でしたが、コーディングワークス様講義を聞くと、今こそちゃんとした授業を受けたという気がします。今日の試験は終わったが、この講義を通じて学んだ内容は私の記憶の中に長く行くと思います。
試験受付後、YouTubeの講義で独学をしてから専攻講義を聞いた時のように、とても頭に入らず迷い、この講義を発見したが、無料講義を聞いてみたので、試して一ヶ月ほどしか残っていない時点で、この講義にお金を投資するのに合う。かなと悩みもしたんですよ。悩む必要もなかったと思います😊😊
個人的な試験の後期ももしかしたら他の方が見たいかと思って残しておけば、私は講義を聞く前からビジュアルスタジオを上手に書いてきてずっとビジュアルスタジオコードで勉強し、ブラケット関連講義はパスしました。試験場もわざわざvscodeのあるところに受付しました。ところで、今日試験場に行ってみるとブラケットしかありませんでした。.最初は慌てましたがショートカットも講義で学んだままで、何より講義内容がブラケットなのでむしろおなじみのインターフェースなので難しくないように適応して無事に試験を打つことができました！試験はJUSTショッピングモールに出てきて、最終本製作講義にもあったタイプなので、ほとんど目詰まりなくコードを書いて何度も点検後に最初の順番で提出しました！この講義でなかったら私も何人かのように真ん中に出て行かなければならなかったかも…。
良い講義ありがとうございました。
-------------------------------------------------- ----------------------------------
合格しました！
合計30時間、合計112の講義と18のコア資料で実技試験合格を誇るカスタム講義
合計27のHTML+CSS+JQUERYコア理論講義
実技試験製作モジュール完璧分析講義（レイアウト、スライド、ナビゲーション、タブメニュー、レイヤーポップアップ）
Webデザイン機能士実技試験通過の最大の難関！スライド製作
コーディングワークス講義は、ジェイコーリー製作だけでなく、純粋なCSSでスライド完全に実装
学生の好みに応じて、ジェイコーリースライドまたはCSSスライドの制作方法を選択可能
CSSスライドアニメーション（横スライド、縦スライド、クロスフェードスライド）
ジェイコーリースライドアニメーション（横スライド、縦スライド、クロスフェードスライド）
すべての製作モジュールを含む実技試験最終版の3つの制作映像
Webデザイン機能士実技試験に不可欠なPhotoshop CS6の使い方と画像制作映像
HTML + CSS理論教材だけでなく、すべての制作モジュールと最終版の3つの制作ファイルをダウンロード
コーディングワークス講義は合格かどうかではなく、どれほど高得点で合格するかについての本当の講義
実技試験当日に試験場の雰囲気、手続き、コツ、提出方法、資格証明申請方法など詳細な映像まで
- Webデザイン機能士資格証明実技試験に合格したい方
- ウェブサイトのメンテナンス修正補完を独自にしたい方
- WebデザインからWebパブリッシャーに職業を切り替えたり、HTML+CSS+JQUERYパブリッシングを強化したい方
- Webパブリッシングの理解度を高めたいWeb企画者
- フロントエンドパブリッシングに対する理解度を高めたい開発者
- Webデザイン機能士実技試験に高得点で合格できます。
- HTML+CSS+JQUERY パブリッシングのスキルを体系的に向上させることができます。
- ウェブサイト制作ノウハウを向上させることができます。
- Webパブリッシング就業のための個人ポートフォリオウェブサイトを作成することができます。
- 基本的なコンピュータ活用能力とインターネットブラウザ使用能力
- コーディングのための基本的な英語タイプの能力
- 2024年出題基準に最適化された講義内容（12種類の完璧分析及び適用）
- 簡単で簡単なコードが高得点合格と安全錠合格を保証
- 実務にすぐに使える実力を育てる体系的な講座
- 合計30時間を超える充実した講義内容
- 現場で学生を直接教えている実力ある講師が進行する特別な講義
- HTML+CSS+JQUERY理論学習書PDF教材ファイル提供
- 実務ウェブパブリッシャー兼有名学院でオフライン講義を進行する講師
- 良い講義のために直接教えた経験とノウハウが十分な講師
- 長年ウェブデザイン機能士資格証明実技試験に備えて授業進行した講師で特別な合格ノウハウ専修
- ウェブ機能士資格証明実技試験に備えている学生のレベルと何が必要かをよく知っている講師
- 入門者と初級者が理解しやすいコードで現実的かつ効率的な学習方法を提示する講師
▲受講生に無料で提供されるコーディングワークスパブリッシングPDF教材詳細を見る
▼横スライド
▼縦スライド
▼クロスフェードスライド
▼ナビゲーション左個別に下に下がるサブメニュー
▼ナビゲーション左個別に右に落ちるサブメニュー
▼ナビゲーション上部個別に下に落ちるサブメニュー
▼ ナビゲーション上部 すべてのサブメニューが下がるメガメニュー
▼ ナビゲーション上部 すべてのサブメニューが背景とともに下に下がるメガメニュー
▼横固定型最終本
▼横100％最終本
▼縦2カラム最終版
試験場ではインターネットは利用できません。
そのため、ライブサーバーエクステンションはインストールできません。
ビジュアルスタジオコードでコーディングしたら、保存してブラウザで更新として確認する必要があります。
試験場に行ったら、以下にあるものを簡単に設定して試してみてください。
以下のコーディングワークスのブログをご覧ください。
[必読] Webデザイン機能士実技試験をご覧になるときのビジュアルスタジオコード設定必読事項https://www.inflearn.com/blogs/1221
Q. PDF教材でジェイクエリーパートが内容が多くありませんでしたか？
A）ジェイクエリは特性上、内容があまりにも膨大なので、PDF教材にすべての内容を入れるには無理があり、基本的な使い方と必須関数、イベント、メソッドの使い方についての内容があります。また、パブリッシング入門者初心者には何よりCSSとFLEXが重要であるため、PDF教材の90％に該当する170ページが割り当てられています。
Q. コーディングワークスパブリッシングコア理論 PDF教材は市中教材と違う点は何ですか？
A. すぐに知らなくてもよい内容、重要度が落ちる内容は除いてぜひ！必要な核心だけを収めました。コーディングワークス教材は、長年にわたりオフライン学園で使用されている教材をさらに強化して作ったPDF教材です。特に市販教材にないコーディングワークス講義のヒント（Tip）が多く含まれています。
Q.ダウンロードコンテンツ容量はいくらですか？
A）ダウンロードされるコンテンツの総容量は42メガです。 PDF理論教材は見やすく5つに分けてアップロードされました。個別に受け取ります。そして、実習例ファイルは圧縮プッシュすればフォルダに整理されています。
Q. 出力してみることもできますがPDF教材は高画質ですか？
A）PDFファイルは300dpi高画質で製作されているため、出力してもきれいなプリントができます。
Q. ダウンロードしたコンテンツの使用用途はどうなりますか？
A）ダウンロードしたすべてのコンテンツは、コーディングワークスの独自のファイルです。コーディングワークスPDF教材は、受講申請された本人の個人学習用途以外に、他のいかなる目的にも使用または他人に配布してはなりません。また、PDFファイルにコーディングワークを表示する部分を編集して講義用資料として使用することもできません。
学習しながら質問がある場合は質問してください。ご質問の際にはいけない内容とコード、ブラウザ結果画面のキャプチャを投稿してください。コードの場合、HTML、CSS、JSコードをコピーしてすべてアップロードしてください。正確な回答を提供できます。
ブラウザの結果画面はキャプチャで、コードはコピーしてアップロードしてくれば正確な回答ができます。
インタビューと就職を呼ぶパブリッシャー 個人ポートフォリオ ホームページ制作スクリプト、レイアウト、インタラクティブウェブ、インタラクティブウェブ、ウェブデザイン、ウェブデザイン、ポートフォリオ、パブリッシング、レスポンシブウェブ、ウェブデザイン機能士実技試験、ブートストラップ、ブートストラップ、css frameworks、フレームワーク
学習対象は
誰でしょう？
初めてウェブコーディングを始める方
ウェブデザイン機能士資格試験の実技試験に合格したい方
ウェブサイトのメンテナンス修正補完を独自にしたい方
ウェブデザイナーからウェブパブリッシャーに職業を変更したい方、または HTML+CSS+JQUERY パブリッシングを強化したい方
Web 出版に関する理解を深めたいWeb プランナー
フロントエンド パブリッシングの理解を深めたい開発者
前提知識、
必要でしょうか？
基本的なコンピュータ利用能力とインターネットブラウザの使用能力
コーディングのための基本的な英語タイピング能力
12,620
受講生
743
受講レビュー
2,113
回答
4.9
講座評価
23
講座
■ [현재] 국비 퍼블리싱 & 프론트엔드 강사
■ [현재] 프리랜서 프론트엔드 퍼블리셔
■ [현재] HTML+CSS+JQUERY 퍼블리싱 유튜브 채널 '코딩웍스' 운영
■ 그린 컴퓨터 아카데미 웹 퍼블리싱 강사
■ 더조은 컴퓨터 아카데미 웹 퍼블리싱 강사
■ 이젠 컴퓨터 아카데미 웹 퍼블리싱 강사
■ 프론트엔드 퍼블리셔, 프론트엔드 퍼블리싱 전문강사
■ UI/UX 웹 디자인 포트폴리오 강의
■ 웹디자인 기능사 실기 자격증반 강의
■ 이지앤에듀프론트엔드 UI/UX 디자인 및 퍼블리싱
🌏코딩웍스 인프런 강의목록 - https://www.inflearn.com/users/@codingworks
🌏인프런 코딩웍스 강의 학습 순서(학습 로드맵) - https://www.inflearn.com/blogs/2351
🌏코딩웍스 인프런 퍼블리싱 블로그 - https://www.inflearn.com/users/@codingworks/blogs
🌏코딩웍스 퍼블리싱 유튜브 채널 - https://www.youtube.com/codingworks
🟣인프런 인포커스 코딩웍스 인터뷰 보기 : https://www.inflearn.com/pages/infocus-8-20230704
全体
149件 ∙ (37時間 46分)
講座資料（こうぎしりょう）:
全体
97件
4.9
97件の受講レビュー
受講レビュー 1
∙
平均評価 5.0
5
꼼꼼하게 알려주시고 도움 많이 되었습니다! 다만 html을 아예 모르는 생초보가 들으면 따라가기 어려운 부분들도 있을 것 같아요 한번은 개념 익히고 보시는 것을 추천
코딩웍스입니다. 먼저 수강평 감사합니다~ HTML 이론 영상이 많으면 학습 초반 부분이 너무 길어질 것 같아서 HTML 이론 부분을 간소화 했는데 이 점이 아위우셨군요. 부족하다고 생각되시는 HTML 이론 부분은 저의 유튜브 채널에 길게 자세히 되어 있는 영상들이 많이 있으니까 그 영상들을 참고해주세요. 코딩웍스 온라인 강의가 도움이 되고 있다니 기쁘니다~^^ 웹디자인 기능사 실기시험에 고득점으로 합격하시길을 기원합니다.
受講レビュー 1
∙
平均評価 5.0
5
정말 잘 배우고갑니다! 우선, 처음으로 말씀드릴 부분은 "독학하기 어렵다" 라는 주제입니다! 어떤 공부를 하더라도 물론 시도는 해볼 수 있지만 아시다시피 난이도가 있다면 금방 포기하게 됩니다(혹은 미루게 되거나) 저는 이X적 책을 구매하여 시험을 준비하였으나... 필기까지만 책 보고 실기는 그쪽 영상도 어디서 복사해온 텍스트를 붙여넣기 하면서 설명할 뿐이더군요... 참 답답했습니다. 하지만 카카오톡 요새 잘되어있으니까 오픈톡방 이곳저곳 다녀보다가 솔직히 잘 알려주는곳도 없었고... 저같아도 합격한지 오래되었으면 현직자 질문에 더 대답을 많이 해줄꺼라고 생각은 합니다! 그래서 그분들중에 한분이 이쪽 "코딩웍스 선생님" 을 추천하시더군요! 저는 덕분에 소개글 이런거 안보고 기초부터 다져준다고 하니 바로 칼결제 했습니다. (실화입니다) 그리고나서 1강부터 천천히 보기 시작하는데 팩트는 이해가 쉽게 될 수 없겠죠... 하지만, 저는 꼭 따야겠다라는 생각 하나만 가지고 이론부터 쭉 [순서대로] 강의를 보다보니 어느새 직접 영상을 따라하지 않고 혼자서 미리 만들어 두더군요. 딱 이때 느꼈습니다. 아 이건 지금부터가 시작이구나... A유형이 제일 쉬운편에 속하며 제일 여러가지 관점에서 이해할 수 있는 포인트가 많습니다! 즉, 다른걸 만들 때 마저도 응용해야하는 프로세서를 도중에 파악을 빨리 하는사람이 쉽게 배우는데 제가 모르는게 많았어도 그냥 머리박으면서 기출문제 따라하면서 왜 그럴수밖에 없었는지 대체 왜 이렇게해야 결과값이 나오는지 꾸준히 고민하고 공부했습니다. 3일차가 되니 A, B, C의 레이아웃을 만드는데 성공하였고 7일차가 되니 A, B, C의 완성본을 스스로 혼자서 아무 길라잡이도 안보고 오직 강의 하나 들었던 그 경험으로만 끝내버렸습니다. 이후 D, E 유형은 C 유형만 안보고 만들 수 있는 사람이면 무조건 할 수 밖에 없는 단계로 이루어져있어서 아마 지금 조급해 하시는분들은 C가 제대로 안되어있어서 D, E를 못넘어가시는거다 이렇게 생각할수도 있을거라고 봅니다! 결국 합격하였으며 고득점은 아니지만 (디테일 다버림) 코딩웍스 선생님의 강의 하나만으로 1시간 20분만에 시험장 끊고 바로 나올 수 있었습니다. (질문도 정말 자기가 이도저도 안될때 그런것만 물어봤음) 여기까지가 제 경험담입니다! 정리하겠습니다 1. 당신이 코딩웍스 강의를 결제해야하는 이유 : 주변에 눈씻고 찾아봐도 1:1로 알려줄 사람이 없다. 2. 독학은 아무리 네임드 책 사서봐도 이해가 안되고 어려워서 중간에 무조건 포기하게 될 것이다. 3. 이곳저곳 좋은 강의를 찾아보다가 이 댓글을 보게되었을때 1초의 망설임없이 그냥 결제버튼부터 눌러라 4. 다양한 변수에 대처 가능한 방법들도 많고 당신이 간절하다면 최소 7일 최대 14일 안쪽으로는 빡세게 공부하여 합격할 확률이 80%정도는 된다고 생각한다.. 아니? 90%로 생각한다 5. 이해가 안되고 그냥 뭔가 잘 안된다 싶으면 기출문제 그 부분만 자동으로 타이핑 될 때까지 연습해보자. 6. 신규문제는 시험장에 자주 안나올뿐더러 강의에서 알려주는 D, E 유형 또한 고퀄리티의 프로세서이다. 7. 컴퓨터는 당신보다 똑똑하다. 안될때는 자신을 탓하며 꾸준히 연습하자. 8. 합격을 의심하지 말 것이다. 구매 누른 순간부터 모든 선택에서의 최대를 맛볼 수 있을 것이다.
길고 구체적인 수강평 정말 감사드립니다~!!
受講レビュー 1
∙
平均評価 5.0
5
디자이너라 코딩은 완전 노베이스였고, 유튜브 강의들 다 찾아봤는데 하나도 이해가 안가서 포기하고 있었던 자격증이었습니다. 필기 면제 기한이 이번 23년도 1분기까지라 미루고 미루다가 그냥 도전이라도 해보자는 심정으로 실기공부를 시작했는데, 본격적으로 각잡고 한건 원서접수 후 1~2달인 것 같아요. 진짜 왜 선생님 강의가 후기가 많은지 공부하면서 느꼈습니다. 개념을 정말정말 쉽게 설명해주셔서 똥멍청이인 저도 개념을 이해하면서 문제를 풀 수 있었습니다. 레이아웃 + 1번 문제 수업 듣고 풀어보면 어? 2번 ~ 4번은 이렇게 변형하면 되겠구나 감이 생기고, 그러다 보니 어려운 구문들을 크게 외울 필요가 없었던 것 같아요. 공부 도중에 취업이 되어 후반에는 빡세게 못해서 선택과 집중으로 신유형만 연습했습니다. D,E에서 반드시 나올 거라는 믿음 하나로... 다행히도 D유형이 나왔고, 2시간 정도? 만에 시험장을 나올 수 있었습니다. 결과는 91점으로 합격했습니다! 생각보다 엄청 높게 받아서 기분이 좋았습니다 ㅎㅎ 여담으로, 저는 선생님께서 가르쳐주시는 코딩이 정답이라고 생각하며 공부했는데, 다른 강의를 보니 같은 결과를 정말정말 다양한 방법으로 만들 수 있더라구요. 그걸 알고나서야 이 강의가 초보자의 시선으로 바라본, 아주 잘 만들어진 강의임을 깨달았습니다. 이 계기를 시작으로 코딩 놓지 않고 계속 공부해보려고 합니다 :-) 좋은 결과를 얻게 해주셔서 감사합니다~
수강평 감사합니다. 짧은 기간이었는데 고득점으로 합격하셨네요. 축드립니다~!!
受講レビュー 2
∙
平均評価 5.0
5
1. 강의 내용이 쉽다. 2. 마크업이 깔끔하다. 매번 의미없는 width,height의 반복이 없다. 묻지마 그냥 이렇게 써 라는 식이 아니라 자세한 설 명을 들을 수 있어서 좋았다. 3.예제로 사용하는 와이어프레임 자체가 세련됐다. 4.이미지 슬라이드를 CSS만으로 작성하는 등의 새로운 방법을 배울 수 있어서 좋았다. 5. 질문을 할 수 있어서 좋았다.
수강평이 길진 않지만 이렇게 구체적이고 이해하기 쉽게 적어주신 분은 처음인 듯 합니다. 고득점으로 합격하실거에요. 화이팅입니다~!!
受講レビュー 1
∙
平均評価 5.0
5
안녕하세요! 오늘 3회차 실기 시험 결과 나왔는데 92점으로 합격해서 후다닥 수강평적으러 왔습니다! 일단 강사님, 좋은 강의 너무 감사드립니다. 질문도 정말 빨리 답변해주시고 강의내용도 비전공자가 공부하기에 기초부터 차근차근 설명해주셔서 좋았습니다. (특히 저는 강사님이 올려놓으신 유튜브 강의와 병행하며 들었는데 이해가 더 빨랐습니다.) 빠른 시간안에 이해할 수 있는데 특화된 수업이라고 생각합니다. 수강료가 전혀 아깝지 않은 수업이었어요! 감사합니다. 시험볼때도 1시간 40분만에 클리어하고 1등으로 위풍당당하게 나왔답니다. 감사합니다 쌤 :) 강의 다른거 또 들으러 올게요!
seohyeon님 수강평 감사드립니다. 그리고 진심으로 고득점 합격 축하드립니다. 저도 시험볼 때 2시간에 클리어 했는데 1시간 40분만에 클리어 하셨다니 대단하시네요. 강의의 도움도 있었겠지만 본인이 열심히 하신 결과라고 생각합니다~!!
期間限定セール、あと4日日で終了
￥124,570
25%
￥20,247
知識共有者の他の講座を見てみましょう！
同じ分野の他の講座を見てみましょう！
![[CSS&JS Master] - 트렌디한 감정기록 일기장 만들기강의 썸네일](https://cdn.inflearn.com/public/courses/335863/cover/836195ea-22e0-4a97-84a9-5c520b028729/335863.png?f=avif&w=420)
![웹디자인개발기능사 [2025년] 실기전체 (카톡질문가능)강의 썸네일](https://cdn.inflearn.com/public/courses/332868/cover/3a2245ca-bb9f-414a-ba67-403cfcb2b7c9/332868.jpg?f=avif&w=420)
![[웹 퍼블리싱 실습] 웹 표준 사이트 만들기강의 썸네일](https://cdn.inflearn.com/public/courses/328172/cover/2c352d60-87dd-4e15-9880-9dccde4539ee/328172-eng.png?f=avif&w=420)
![[자바스크립트부터 리액트까지] 포기없는 React로 가는 길 [Full vers.]강의 썸네일](https://cdn.inflearn.com/public/courses/334889/cover/00422504-ab9c-46e3-9abd-8bcf0bb9ec7a/334889.jpg?f=avif&w=420)
![[환상의족발] 디자인부터 코딩까지강의 썸네일](https://cdn.inflearn.com/public/courses/332845/cover/5d0ef569-50e5-4300-96ed-3205d526795b/332845.png?f=avif&w=420)
![스프링 프레임워크는 내 손에 [스프2탄]강의 썸네일](https://cdn.inflearn.com/public/courses/329630/cover/e05f1532-5d1d-440e-be03-c21c42cd5566/329630-eng.png?f=avif&w=420)