アイクラウド研修サービス
研修概要
本ページに掲載するコーディング研修の概要をベースに、貴社のご要望にあわせて内容をカスタマイズし、研修をご提供します。ご検討にあたっては、研修実施までの流れや研修の受講形式もあわせてご確認ください。助成金を活用した研修や新入社員研修をご検討の場合は、各ページをご覧ください。
対象者
HTML・CSS・JavaScriptの基礎を理解し、Web制作やWebアプリ開発へ活かしたい方。
学べること
HTML・CSS、レスポンシブ対応、JavaScript・PHPの基礎、WordPressによるサイト制作。
到達目標
Webページの構造を理解し、PC・スマートフォンに対応したサイトを制作できる状態。
研修形式
18時間・3日。標準実施時間は10:00～17:00で、テキストエディタを使用します。
| 研修名 |
コーディング研修 |
||
|---|---|---|---|
| 研修概要 | 本研修では、HTML/CSSを中心に、Webサイト・アプリ制作に必要な技術を体系的に学びます。マークアップやレイアウト設計、レスポンシブ対応、SEO・アクセシビリティ対策に加え、JavaScriptやPHPによる動的機能の実装、WordPressによるCMS構築も習得します。 | ||
| 到達目標 |
|
||
| 対象者 | HTML / CSS / JavaScript の基礎を理解している方、Web制作、Webアプリ開発技術に活かされたい方 | レベル | 基礎、応用 |
| 学習時間/期間 | 18時間／3日 | 実施時間 | 10:00～17:00（休憩含） |
| 受講形式 |
|
||
| 使用ソフトウェア | テキストエディタ | ||
| その他、備考 | 貴社独自のカリキュラムを構築できます。ご要望やご相談はお問い合わせください。 | ||
研修カリキュラム例
アイクラウドが提供するコーディング研修のカリキュラム例です。ご要望を反映したオーダーメイドのカリキュラムで実施することもできます。
この研修で扱う5つの学習領域
- Webの仕組みとHTMLブラウザ・サーバ・制作フローを理解し、文書構造、基本タグ、フォーム、ファイルパス、メディア埋め込みを学びます。
- CSSとレスポンシブ設計基本的な装飾、Flexbox、アニメーション、レスポンシブ対応、スタイルガイドなどのCSS設計を扱います。
- JavaScriptの基礎JavaScriptの概要と基本文法を確認し、Webページでよく使われる処理やライブラリの役割を整理します。
- PHPフォームとセキュリティPHPとJavaScriptの違い、フォームの処理手順、Webアプリで注意すべき脆弱性や対策を学びます。
- WordPressとサイト制作WordPressの環境・管理画面・投稿方法を理解し、サイトの企画、制作、発表までを実践します。
| HTML | webページの構造理解 | HTML、CSS、ブラウザ、サーバの基礎知識／ウェブ制作フロー |
| HTMLの編集方法 | VS Codeの使い方／確認方法（ソース、開発ツール） | |
| 基本的なHTMLファイルの作成 | ファイル命名規則、ファイル構造／doctype、 html、 head、body／h1～h2 | |
| HTMLの基本文法 | タグの書き方、入れ子、属性 | |
| ウェブページのHTMLの構成 | 一般的なメディアサイトがどのようなタグで構成されているか | |
| ページを構成するタグ | hタグ、p、li、ol、br、a href、strong、span、table、img等 | |
| ファイルパス | 画像やリンク時に設定するパスの概念 | |
| ここまでの復習 | ||
| フォームタグ | form、input、submit | |
| ブロック、レイアウト要素 | div、main、article、header、footer、nav、aside、section | |
| metaタグ（SEO関連） | title、description、keywords、ogp、favicon、確認方法（拡張機能） | |
| メディア埋め込み | YoutubeやGoogleマップ、各種SNS埋め込み | |
| ユーザビリティ、アクセシビリティ | ユーザビリティ／アクセシビリティの概要、JIS規格 | |
| HTML記述時の注意点 | 正しい文法、著作権 | |
| CSS | CSSとは | CSSの概要／CSSの適用方法 |
| CSSファイルの作成 | 命名規則、基本文法 | |
| よく使うCSS | font-size,color,font-family,text-align,background,width,height,margin,padding,border等 | |
| 1日目の復習 | ||
| CSS | 1日目の振り返り | |
| webフォント | 参考：webフォントとは、使い方 | |
| 16進数カラーコード | 参考：カラーコードとは、色指定方法 | |
| レイアウト関連CSS | flexbox | |
| CSSのアニメーション | transition、transform／マイクロインタラクションについて | |
| レスポンシブデザイン | PCとの違い、確認方法や注意点 | |
| CSSの設計 | スタイルガイド、コーディングガイドライン、Sass（参考）リセットCSS（参考）、フレームワーク（参考） | |
| JavaScript | JavaScriptとは | 概要、文法 |
| JavaScriptでできること | よくあるJavaScriptの利用方法紹介、ライブラリ（参考） | |
| PHP | PHPとは | 概要、PHPでできること、JavaScriptとの違い（参考） |
| PHPフォーム | アルゴリズム、作り方 | |
| セキュリティ | 参考）脆弱性や攻撃の種類、対処法 | |
| ここまでの復習 | ||
| WordPress | WordPressとは | 概要、他CMSの紹介 |
| 必要なもの | PHP対応サーバ、ドメイン、データベース、SSL | |
| 注意点 | 参考：注意点（セキュリティ、プラグインのバージョンアップ等） | |
| ログイン、管理画面 | ログイン、管理画面の操作方法、初期設定 | |
| 投稿方法 | 投稿と固定ページ、ブロックエディタの使い方 | |
| ウェブページの自主制作 （WordPress） |
進め方説明 | 1つのサイトを作成 |
| テーマ決め | サイトのテーマ、作成ページ、担当者を決定 | |
| 2日目の復習 | ||
| ウェブページの自主制作 （WordPress） |
2日目の振り返り | |
| 作成、発表 | ||
研修実施にともなう確認事項
助成金を活用してコスト削減
厚生労働省で取扱っている支援金は、条件さえ満たせばどんな会社でも貰うことができ、返済する必要はありません。助成金の種類は50種類以上（雇用や教育訓練など）あり、社員教育に関連した助成金は、「人材開発支援助成金」が多く利用されています。アイクラウド研修サービスは、研修のご提供だけでなく、助成金サポートも行っております。 助成金の詳しいご説明はこちら
コーディング研修のFAQ
どのような人を対象とした研修ですか？
HTML・CSS・JavaScriptの基礎を理解し、Web制作やWebアプリ開発の技術を業務へ活かしたい方を対象としています。
HTMLとCSSでは何を学べますか？
HTMLの文書構造、基本タグ、フォーム、SEO・アクセシビリティに加え、CSSの装飾、Flexbox、アニメーション、レスポンシブ対応を扱います。
JavaScriptやPHP、WordPressも扱いますか？
はい。JavaScriptの基本文法、PHPフォームとセキュリティ、WordPressの管理画面・投稿操作・サイト制作を扱います。
研修時間と使用ソフトウェアを教えてください。
学習時間は18時間・3日、標準実施時間は10:00～17:00（休憩含）で、テキストエディタを使用します。
自社の制作環境に合わせて内容を変更できますか？
はい。掲載しているカリキュラム例をベースに、習得したい技術や制作環境に応じた独自カリキュラムを構築できます。