Webデザイナー 初級

この授業では0から自分でコーディングを行い、一つのスマホサイトを完成させます。

google推奨のモバイルフレンドリーな開発環境を整え、Web制作に欠かせないHTML/CSSのコーディングを学びましょう。

はじめてコーディングを学ぶ方から、HTML入門（全3回）を見て少しコーディングに触れた方など、コーディング初心者を対象としています。
シリーズ7回通してできるようになる事はgoogle推奨のモバイルフレンドリーな開発環境を整え、スマホサイトを完成させる事です。
なお、このシリースで制作したスマホサイトは次のシリーズでtabletやPCなどデバイズごとにデザインが切りかわるレスポンシブサイト制作実践へと続きます。
『Webデザイン入門 0から自分でコーディング！ ~スマホサイト編~』第1回目は、Webフロントエンドの開発環境を自分のPCに作ってしまうという授業です。

授業に臨むPCに以下のご準備をお願いします。

【拡張子の表示】
拡張子とは、ファイルの種類（画像ファイル、テキストファイル、htmlファイルなどを拡張して識別します）を識別するための符号です。これが表示されていなければWebページを構成している各種ファイルの識別ができません。以下リンクを参照されて拡張子を表示しておいてください。

• Windows 7の場合
• Windows 8の場合
• Mac の場合

【使用エディターのインストール】
この授業ではSublimeTextというエディターを使用します。最新版はSublimeText3ですがOSのバーションによってはSublimeText2しかインストールできません。どちらでも構いませんので授業に使用するPCにインストールをしておいてください。

• http://www.sublimetext.com/

このエディタはパッケージコントロールをインストールする事により、数々の便利な拡張機能やプラグインを導入する事ができますが、このシリーズでは使用しません。パッケージコントロールやプラグインのインストールしたい場合は以下の授業を見ながら慎重に行ってください。（高度な授業になりますのでこのシリースでは不要です）

• https://schoo.jp/class/1665

「自作サイトのFTPサーバーアップロード編 全3回」

ここまでのカリキュラムでは、ビジュアルデザインのためのPhotoshop、WEBサイトに表示するためのHTML、デザインを反映するためのCSS、そして、WEBサイトサイト制作の設計・開発を学んできました。

ここまでで制作したWebサイトは、まだみなさんのパソコンのブラウザでしか見ることが出来ません。ここからは、いよいよ完成したサイトを実際にネットに上げてテスト運用していくための手順をひとつずつ進めていきます。

この授業では、どうやって世界中の人たちがWebサイトを見ることが出来るのか？サーバーって何？というような、インターネットについての基礎知識についてお話します。
また、授業の後半では「レンタルサーバーの借り方」も一緒にやっていきます。

★授業中に使用するレンタルサーバー：http://lolipop.jp/ 【ロリポップ】

※ レンタルするプランによってはサーバー会社にお金を払う必要があります

サイト制作の大まかな流れは、下記の手順です

１）クライアント（お客様）へのヒヤリング
２）ターゲット設定
３）サイト設計（ワイヤーフレーム）
４）制作仕様書策定（デザインルール、コーディングルール策定）
５）開発（デザイン＆コーディング）
６）ローカルテスト
７）テストサーバーレビュー（クライアントチェック）
８）リリース（本サーバーアップ）
９）ランニング（SEO解析）

このシリーズは7番のテストサーバーレビューの為、にレンタルサーバーを借りてサイトをアップロードする演習です。
テストサーバーレビューとは、ローカル（自分のPCの中）で完成したサイトがネット上でどのような動きをするのか検証する事です。自分でデバッグをして問題なければ、クライアント（サイトの発注者）さんにURLをお伝えしてチェックしてもらいます。

授業では、10日間の無料期間のあるレンタルサーバーを使用します。無料期間終了後は月払いだと300円、年払いだと月額250円が必要になってきます。また、すでにレンタルサーバーを借りている人は、次回の授業から参加されても大丈夫です。

今回は、レンタルサーバーに挫折した人でも何なく借りれる様に始終ハンズオンでゆっくり授業を進めていきます。