chevron_left

PCサイトコーディング
PREMIUM
第6回

PCサイトコーディング -お問い合わせフォームの作成-

2016年8月3日 60min
PCサイトコーディング -お問い合わせフォームの作成- play_arrow おためし受講

スライド資料

会員登録して、全てのスライドを見よう

1 / 66

授業の概要

このコースでは、HTMLとCSSの基本的なスキルを持った方を対象に、企業のコーポレートサイトのような簡単なPCサイトのコーディングについて全6限で学びます。

「様々なテクニックを使いこなして、かっこいいWebサイトを作れるようになりたい」という気持ちは、Web制作を行う誰もが思うことです。しかしながら、基礎があやふやだと応用がききません。まずは基本的なレイアウトをきちっと実装できるように、基礎力をしっかり身につけることが大切です。

第6回はお問い合わせフォームを作成します。入力しやすいお問い合わせフォームのためのHTMLとCSSの書き方を覚えましょう。

授業を通して、簡単なレイアウトのサンプルデザインを使って、実際にWebページとして完成させましょう。

こんな人にオススメ

HTML、CSSの基本を学んだので実際にWebサイトを制作したいと考えているWebデザイナー

担当の先生／パーソナリティ

授業で使用する教材

※授業以外での使用は禁止します

チャプター

play_arrow
自己紹介
00:56
play_arrow
授業のアジェンダ
01:06
play_arrow
サンプルデータの説明
01:06
play_arrow
フォームのHTMLの書き方
00:13
play_arrow
入力欄の種類
03:22
play_arrow
dlでマークアップする
00:53
play_arrow
問題#01　なぜ、tableタグではなく、dlタグを使うと良いのでしょうか？
04:47
play_arrow
答え#01
03:36
play_arrow
input要素の書き方
08:52
play_arrow
使いやすいお問い合わせフォームにするためのCSS
00:14
play_arrow
focus, error
00:53
play_arrow
selectのカスタマイズ
01:45
play_arrow
必須項目
01:22
play_arrow
ボタン
00:15
play_arrow
問題#02　最近では、リセットボタンを配置しないお問い合わせページが主流です。それはなぜでしょうか？
02:50
play_arrow
答え#02
01:18
play_arrow
お問い合わせページにはおもてなし心をドボドボ注ぎ込もう！
00:30
play_arrow
広告とか入れない
00:43
play_arrow
不必要な項目を作らない
01:19
play_arrow
「フリガナ」でなく「ふりがな」にしよう
01:37
play_arrow
住所欄は半角/全角OKに
02:14
play_arrow
問題#03　クレジットカードや生命保険の加入申し込みページは信じられないほど項目がたくさんあります。この授業で学んだこととは真逆のことをやっているのに、なぜ利用が伸びているのでしょうか。
03:08
play_arrow
答え#03
03:52
play_arrow
状況に応じた使い方をしよう
00:49
play_arrow
まとめ
01:26
play_arrow
全6回で学んだことまとめ
02:55
play_arrow
Q：フォームのメソッドですが、昔はCGI で作成されるのが、主流だったと思いますが、今はphpで作成するのが主流でしょうか?Webデザイナーでもデータベースを自作出来た方がよいでしょうか?
02:00
play_arrow
Q：セキュリティは何処まで対応するのでしょうか？ 安心して、商用や個人サイトでも使えるレベルでしょうか。 組み込むセキュリティの種類を教えてください。
02:04
play_arrow
Q：モバイルフレンドリーを考えた時に、フォームでの電話番号や郵便番号の入力欄は、どのようにするのが一般的ですか？また、Googleフォームなどをカスタマイズして利用してる方は多いですか？
01:56
play_arrow
先生からのメッセージ
01:34
play_arrow
お知らせ