Webクリエイター能力認定試験:合格までの体験談(その7)

Webクリエイター能力認定試験 Webクリエイター能力認定試験

この記事では、私がWebクリエイター能力認定試験(エキスパート)に合格するまでの勉強過程を残します。

私が現在受講しているのは、職業訓練センターでの合計10回(30h)の講座です。

最終的にWebクリエイター能力認定試験を取得するための勉強です。

  • なぜWebクリエイター能力認定試験を勉強することにしたのか?
  • 私の経歴・資格
  • なぜ、Webクリエイター能力認定試験を独学でやらないのか?

こちらついては下記の記事をご覧ください。

Webクリエイター能力認定試験:合格までの体験談(その1)
私がWebクリエイター能力認定試験(エキスパート)に合格するまでの勉強過程を残します。 私が現在受講しているのは、職業訓練センターでの合計10回(30h)の講座です。 最終的にWebクリエイター能力認定試験を取得するための勉強です。

【7日目】Webクリエイター能力認定試験講座

よくわかるHTML5&CSS3 ウェブサイト構築の基本と実践 (FOM出版のみどりの本) [ 富士通エフ・オー・エム ]
を194ページ(第9章STEP3)〜234ページ(第11章STEP3の6)までやりました。

今回の講義内容は、サイドメニューの配置設定・動画の埋め込み・マップの埋め込み(Googleマップ)・問い合わせフォームの作成でした。

かなり実践的な内容でWebサイト作成には欠かせない内容でした。

特にGoogleマップの埋め込みがこんなに簡単にできるとは思ってもいませんでしたので勉強になりました。

逆に動画の埋め込みについては、今時みんなYouTubeのリンクを貼るのが主流なので、サイト内でmp4形式のファイルを再生することは少ないのかなと思いながら講座を聞いていました。

問い合わせフォームが作られるようになったのは、SPAMメールを回避するためだと教わりました。(メールアドレスがベタ貼りだと送り放題だから)

ただ、問い合わせフォームを作ってもSPAMメールが大量に来るパターンもあるんですよね・・・(前職の経験上)

大体その場合は、同一IPアドレスからCGIファイルにアクセスが大量にきてログがとんでもないことになっています。

IPアドレスをブロックするのも手ですが、結局キリがないので、根本解決としてreCAPTCHAの設定などをおすすめしていました。

こういうのは実務経験がないとなかなか気づけないことです。

【7日目】学び

  • サイドメニューをボックス表示して、ボックス内のどこをクリックしてもジャンプするようにする設定は【display:block;】をCSSで記載する。
  • サイドメニューの配置変更(メイン記事の横に回り込ませる方法)
  • ウィンドウ幅が小さい場合、サイドメニューが横に配置されずメイン記事の下に落ちてしまうことを「カラム落ち」と呼ぶ
  • 「カラム落ち」はレスポンシブWebデザインの設定で回避させる。【float:none】で回り込みを解除。

【7日目】難しいと感じた箇所

よくわかるHTML5&CSS3 ウェブサイト構築の基本と実践 (FOM出版のみどりの本) [ 富士通エフ・オー・エム ]
の204〜211ページです。

サイドメニューの配置設定がなかなか難しいです。

メイン記事を左に固定。サイドメニューを右に固定。

という概念は理解できましたが、メイン記事を左に固定する場合、どのタグに【float:left】を適用させるかとっさに判断できません。
ここは先生も慣れが必要とおっしゃっていました。

トライアンドエラーの繰り返しかなだと感じましt。

Webクリエイター能力認定試験講座はこんな人におすすめ

店舗経営者の方も知っていて損はないと思います。

この講座を受験しにきてる周りの方は、40〜50代の方が多い印象です。

もしかすると自分で事業をされている方が多いのかなと思ったりして見てます。

Webクリエイター能力認定試験講座の感想

今回はいつもよりも実践的な内容でした。

サイドメニューをボックス表示して、ボックス内のどこをクリックしてもジャンプするようにする設定は、サイト閲覧者からして親切ですし凄く使えるテクニックだと感じました。

また、「カラム落ち」は恥ずかしいと言うことが分かりました。

実際にカラム落ちしたサイトのページを見てみて身をもって気づくことができました。

自分で作っているHTMLのマニュアルがあるのですが、今回学んだことを活かしてサイドバーを左に配置して作ってみようと思います。