WEB基礎技術講習
(HTML&CSS&サイト管理・構築)

カリキュラム/参加者2名

<第1回>2021年5月24日(月)15:00~18:00
講習アウトライン説明
環境構築(エディタ(Notepad++)のインストール作業など)
HTML概要、CSS概要、コーディングの流れ、HTML基礎(~a要素)
<第2回>2021年6月1日(火)15:00~18:00
HTML基礎(~select要素)
<第3回>2021年6月7日(月)15:00~18:00
HTML基礎
環境構築(Firefoxのインストール作業など)
HTMLコーディング演習
<第4回>2021年6月22日(火)15:00~18:00
CSS基礎(~@ルール(@で始まる書式))
<第5回>2021年7月9日(金)15:00~18:00
Webオーサリングアプリについて
CSS基礎(~list-style-typeプロパティ)
<第6回>2021年7月16日(金)15:00~18:00
HTML・CSSコーディング演習
<第7回>2021年8月6日(金)15:00~18:00
環境構築(FileZillaのインストール作業など)
ネットワーク&サーバ概要
FTP転送演習
HTML・CSSコーディング演習
<第8回>2021年8月26日(木)15:00~18:00
目視とAnother HTML lintによるチェック作成課題のチェック
CSS応用(モバイルデバイス対応)
開発者ツール
<第9回>2021年9月3日(金)15:00~18:00
自社ネットワークからFTPが使えない(Webは使える)問題→ルータの再起動で解決(ルータが半端な状態で動いていた?カミナリの影響?)
HTML5概要
御社公式サイトのWordPress固定ページ編集方法、画像の差し替え、バックアップ、復旧方法
HTML・CSSコーディング演習(RWD)
<第10回>2021年9月29日(水)15:00~18:00
本番環境の諸情報確認と動作チェック
Html Lint
HTML5で軽量化
ブラウザチェックについて(**IE11**, Chrome, Firefox, Edge, Safari, Mobile Safari, Mobile Chrome, Mobile Android 標準ブラウザ, Webview(アプリ内ブラウザ))
抗菌に関するランディングページの最終チェック+公開予定
画像ファイルの軽量化(減色、適切なサイズ)キャッシュの影響
日英翻訳について
新しい技術、プロパティの使用について(Transforms、justify-content)
PC向けサイトの横幅について
効率的な制作方法(Dreamweaver)について
section要素
CSSファイルの分割方法
SSL化について
ランディングページの拡散―『URLを貼りつける』がメイン

講習用サーバ(dev01.dejitan.com)

使用アプリ・サイト

  1. Notepad++
  2. FileZilla
  3. Chrome
  4. Firefox
  5. HTML文字セット
  6. HTMLタグ辞典|コーディングのプロが作るHTMLタグ解説
  7. CSS辞典|コーディングのプロが作るCSS解説
  8. スタイルシートリファレンス(目的別)
  9. とほほのWWW入門
  10. HTML Living Standard
  11. HTMLのコード整形ツール
  12. Another HTML Lint - Gateway
  13. Twitter埋め込みタイムラインウィジェット
  14. CMANインターネットサービス
  15. viewportChecker
  16. CanIuse
  17. 英語の記号・マークの読み方 英語@めもらんだむ
  18. marksign.net
  19. HTML standard
  20. CSS - YUI Library
  21. SVGOMG - SVGO's Missing GUI
  22. モバイル フレンドリー テスト - Google Search Console
  23. Web便利ツール/デバイス情報の確認 - TAG index|デバイスのビューポートサイズやデバイスピクセル比などの確認
  24. WEBデザイナーのためのランディングページのリンク集。サイトからの離脱率を抑え、コンバージョン率を高めろ!
  25. Twitter Card validator
  26. OGP画像シミュレータ
  27. LPサンプル:Nordace - ノルデースシエナスマートリュックを発見-旅行者、通勤、サラリーマンのための完璧な!
  28. HTML UTF-8リファレンスマニュアル
  29. Convert Word documents to Clean HTML
  30. WEB色見本 原色大辞典 - HTMLカラーコード
  31. Poedit Translation Editor — Poedit
  32. 顔文字コピペ
  33. ドメインパワーを計測・チェックできる無料SEOツール

素材、課題、テキスト