実技 ポートフォリオ作成実習②

-本日のアジェンダ-

1限目
実技 ポートフォリオ作成実習②
WordPressサイトの掲載内容について

2限目
実技 ポートフォリオ作成実習②
WordPressサイト中間チェック

3限目
実技 ポートフォリオ作成実習②
WordPressサイト中間チェック

4限目
実技 ポートフォリオ作成実習②
WordPressサイトを拡充しましょう

5限目
実技 ポートフォリオ作成実習②
WordPressサイトを拡充しましょう

本日のテーマ

WordPressサイトの中間チェックです

WordPressサイトの掲載内容について

WordPressサイトには、以下の内容を掲載しましょう。

ポートフォリオサイト

ポートフォリオサイトとして活用できるように以下の項目を掲載してください。

  • ご挨拶
  • プロフィール(自己紹介)
    • 名前
    • 顔写真
    • 生年月日
    • 略歴
    • 仕事への姿勢や意気込み
    • 自己PR
  • 保有スキル
    • スキル項目
    • スキルレベル
  • ポートフォリオ
    • 作品
    • 作成の説明
    • 作品ツール
    • 作成時間
    • その他(苦労したこと、考慮したこと、学んだこと など)
  • 後書き

訓練ブログ

学んだことの復習や忘れてしまったことを思い出す資料として訓練ブログを作成してください。

  • 訓練の1日単位で投稿ページを作成してください。
  • ページのタイトルは、訓練内容がわかるようにしてください。

参考サイト

注意事項

  • テーマやプラグインを入れすぎるとサーバーのディスク容量が大きくなってしまうと同時にWordPressの動きが重たくなってしまうので不要になったテーマは削除するようにしましょう。

WordPressサイト作成時の注意事項

WordPressサイトの作成に当たっては、ポートフォリオとしての活用を中心に考えてサイト構成を考えてください。また、ポートフォリオの作成に当たっては、ポートフォリオを見る人の立場に立って考えてみましょう。

  • 採用担当者の立場になって作りましょう(採用担当者が何をみたいか考えてみましょう)
  • トップページは作品主体にしましょう(ポートフォリオとしてのトップページを意識してみましょう)
  • 操作性や導線を考慮しましょう(クリックの多すぎは見る気がしなくなります)
  • 未経験者の場合は「学校でこんな事を勉強してきました」、「私はこんなことができます」をわかるようにしましょう

本日の課題

ポートフォリオサイト、訓練ブログの完成度を上げてください。
修了式前の9月15日(金)に発表会を行います。

学科 CSS基礎⑥

-本日のアジェンダ-

1限目
学科 CSS基礎⑥
ボックスモデルについて

2限目
学科 CSS基礎⑥
ボックスモデルについて

3限目
学科 CSS基礎⑥
レスポンシブWEBデザインについて

4限目
学科 CSS基礎⑥
レスポンシブWEBデザインについて

5限目
学科 CSS基礎⑥
本日の講義のまとめ

本日のテーマ

Box modelについて(レスポンシブWEBデザイン)

Box modelについて(RWD)

【資料】

ドロップボックスの資料をダウンロードしましょう。
資料 > 【STEP3】Webページの理解 > マルチデバイス対応の教科書①.pdf
Box model(レスポンシブWEBデザイン)の手順をまとめた資料です。

【動画】

RWD 対応のサイトについて

  • 幅広デザインでの Web ページ作成
  • viewport 定義の指定
  • 横幅変動時のコンテンツ幅を設定
  • Media Querie でデザインを整える
  • 画面サイズに合わせた表示部品の導入

本日の課題

WordPressサイトに、本日学んだ内容を「投稿ページ」にまとめてください。
投稿日は、本日の日時で設定してください。
※ページタイトルは、投稿内容がわかるような記述にしましょう。