実技 スマートフォンサイト作成実習②(実機検証について)

前回の復習

本日の訓練内容

実機検証について

Webページを作成したら各種ブラウザ・スマートフォン実機で検証する必要がある。

特定の機種のみで発生する不具合などがあるので確認が必要。

メモ

リンク

見出しから自動で目次を作成する(プラグイン不要)
...
https://code-kitchen.dev/html/picture/
Can I use... Support tables for HTML5, CSS3, etc
...
remを使ってCSSの文字サイズ指定 | パソコン工房 NEXMAG
...

-本日のアジェンダ-

実技 スマートフォンサイト作成実習② | DEAUアカデミー WEBデザイナー養成科(短時間)A教室

1限目
実技 スマートフォンサイト作成実習②
実機検証ついて

2限目
実技 スマートフォンサイト作成実習②
Webサイトの納品について

3限目
実技 スマートフォンサイト作成実習②
課題制作

4限目
実技 スマートフォンサイト作成実習②
課題制作

5限目
実技 スマートフォンサイト作成実習②
課題制作

本日のテーマ

実機検証は最後にしっかりと

レスポンシブWEBデザイン(RWD)とは?

「レスポンシブWEBデザイン(Responsive WEB Design)」は、PC、タブレット、スマートフォンなど、デバイスの画面サイズよってResponsive=反応するWEBデザインという意味で、WEBサイトを単一のHTML(ワンソース)で実現する制作手法です。ブラウザのスクリーンサイズを基準にCSSでレイアウトすることで、デバイスごとに専用サイトを用意することなく、マルチスクリーンに対応したWEBサイトを制作できます。

サンプルページ(レスポンシブWebデザイン基礎)

ワンポイントアドバイス

昨今のWebサイトでレスポンシブWebデザインは必須とも言える技術になります。使い方が様々ですが、特にメディアクエリはCSSの基礎理解がとても重要になります。シンプルに整理して覚えていきましょう。

実機検証 について

スマホによる実機検証は、新しく開発したアプリやWebサイトを利用者が実際に使う端末機を使ってテストを行うことで、問題や不具合を発見し、品質を向上させるもの。 世にWebサイトやアプリをリリースするための重要な作業の一つです。

ワンポイントアドバイス

サイトが出来たら、出来る限りの実機検証を行ってみましょう。
実機でしかないバグや見た目の違いが多くありますので、サイトが一通り形になったら実機検証を出来る範囲で行ってみましょう。

参考サイト

Webサイトの納品 について

サイトが完成したら後は納品です。納品方法は色々なパターンがありますので、ご依頼を頂いたお客様としっかりと確認をして納品を行いましょう。

ワンポイントアドバイス

FTPでサーバにUPして納品となるのが一般的ですが、データ納品となる場合もよくあります。ファイル名や無駄なファイルが残っていないように気を付けて納品を行いましょう。

参考サイト

第5回成績考査について

9月30日(金)の5限目までに、Webページを提出してください。
※WEBページはFFFTPでHTMLサーバーにアップしてください。
※サイト内容は自由です。是非、就職活動に活かせる作品を作成してみてください。

予告

9/16はポートフォリオサイトの発表会です