期間限定で、Webデザイナーホームページ制作コースの無料体験ができるというメールが来たので、申し込みしてみました
ウェブサイト制作基礎講座の無料体験e-Learningです。
ヒューマンアカデミーの無料体験イーラーニングを申し込みしたのは初めてでした。流れはこんな感じ。
無料体験イーラーニングやってるよ〜というメールが届く→申し込み
↓
翌日メールが到着。受講開始。
どの無料コースを申し込みしてもお金かかりません。無料なので、５分くらいの動画一本かな？？？と思いましたがとんでもない・・・・私はガッツリ体験講座を利用しました。2時間強くらいやりました♩しかもその2時間に得られた知識は結構濃かったです。
ヒューマンアカデミーの無料体験イーラーニングWebデザイナーホームページ制作コースはどんな内容だったか
ウェブ業界に２０年席を置いてフリーランスで活躍する女性講師でした。デザイン会社でコーダー（フロントエンジニア）を経験した後フリーランスで活躍されている方で、大きいサイトから小さいサイトまで多数作成経験のある、しかも講師講演などもやっていてコードに関する書籍なども執筆されている有名な方です。
無料体験講座ということで、
ウェブサイト制作にあたって最低限押さえておきたい考え方を知る
制作技術前提となる知識を習得するのに必要なことを学ばせていただきました。
サイト制作にまつわる基礎知識について
サイト制作の流れ
制作に必要なソフト
インターネットとは
Webブラウザとウェブサーバーの働きや仕組み
ウェブサイトをデザインするのに必要なことは？
誰のためのウェブサイトかを考えて作る。
最終的にはクライアントが満足するサイトになればゴール
常にクライアントの向こう側にいる人
実際にウェブサイトを見てくれている人を意識
プロのクリエイターに求められているものははにか？
ただ綺麗なサイトを作る
のでなく
・クライアントのために作る
・サイトを使う人にとってメリットの大きなサイトを作る
綺麗汚いという以上に、機能的、ユーザーに情報提供につながっていることが大前提
作品というより、クライアントのビジネスを支えるとうツール
という考えで作る
サイトの設計、段取りデザイナー、プログラマー
公開
クライアントへの取材、写真 打ち合わせ段取り大切
デザインファイルを作成するのにおすすめのやり方とか
ビジュアルデザイン
ページになった暁にどう見えるか絵で作ってしまう。最初に。
これを作ることによって文字の大きさだったり、
段とか最初にパーツから作ると、あとでバランスが・・・
になるので、最初ざっと作ってしまう。
一枚の絵としてつtくったものを
パーツに分ける。
バナーとか商品の写真だったり
デザインファイルからパーツを書き出す
スライスする
パーツにばらけて保存する
これらのパーツの画像、テキストなどを組みわせる
コーディング。
HTMLで文字とパーツを合わせる味気ない
CSS使ってデザインを入れた状態でコーディング
見やすい。綺麗。あとはJavaScript使うと動きあるウェブページを構成するファイル
サイト制作のためのソフトウェア
イラレ、フォトショ、スケッチ
Webデザインで使われてるのはフォトショが多い。
レイアウトしやすさはイラレの方が向いてる。
イラレは、もともと印刷物を作るようと。
解像度とか色の表現方法はもともとウェブ向きじゃないという初期設定
ウェブデザインでイラレは初期設定を書き換える知識が必要。
マックの人は、スケッチというソフトが増えている。
イラレとフォトショのいいとこ取り。慣れると使いやすい。
ねだんは１００００くらい。
コーディングのためのソフト
アドビドリームウぃーバー
非常に有名。非常に小さいサイトからでっかいサイトまでカバー軽いのがいいなって人はブラケッっつとかアトム
というエディター使う人多い
ブラケッつの画面を見てみましょう。
実際にHTMLを入れ込んでみる。タグを直打ちするとき、タグ候補が出てくるので超わかりやすい
カーソル合わせると、どのがぞうが読み込まれているかとかわかりやすい。
この辺りから何言ってんだかわからんっっw様々な閲覧環境。
同じアドレスでスマホとパソコン版違う画面
振り分け。同じアドレスなのに。
ブラウザオーエス、ハードウェア（ディスプレイ）
切り分けが必要。物理的な違いも考えていかなきゃいけない。
これまでパソコンだと横長だったんだけど、スマホは縦長。
で、
こちらの思惑通りにこう見せたい！！というのが通らなくなってきた
ウェブメディアの特徴。
ハンバーガーアイコン
これは実はユーザーエージェントは見てない。
画面はばが変わることで見た目が変わる
オーエスとかも種類じゃなく、ディスプレイの大きさだけで帰る
重要なのは確実に伝えること。
プログレッシブエンハンスメント
どんなブラウザでもそれなりに見える。
全く見られないという状況を避けるAWS アマゾン エーダブリューエす
オンラインストレージ
ドロップボックス
ファイルを誰かと共有するときはこれが便利
ネットワークでやってしまおうという目的。
じぶんの手元のパソコンじゃなくって、ネットワーク上のサーバーで管理。
出先でシームレスに作業をできちゃう
誰かとファイル共有も簡単
ロールバッグも昨日の段階に戻すとかも簡単
ドロップボックスはある程度の容量無料でおけ
アドビが提供しているオンラインストレージもある。
ビジュアルデザインの前にやること
デザイン、コーディングの前に考えておくといいこと
ゴールを達成するために発信すべき情報やその見せ方を検討する過程
最初にやっておくべきこと
ゴールを決める。
サイトへの訪問者を増やしたい。
美しいデザイン
パソコンだけでんなくスマホ用のサイトを作りたいウェブサイトを作ることによって何がしたいのか
ゴールは何かを決めないと
見てる人からいうと散らかったサイトになっちゃう。
最初にウェブサイトはどうなったら成功したと言えるのか、何をしたいのかというのを明らかにしておく。サイトを運営したい→集客を増やしたい
本当にクライアントにとって特になるデザインを親身になって考える
信頼感アップ
ゴールを決めるという重要性
デザインの良し悪し判断材料→主観入る。
ゴール決まってればこのデザインでいいゴールが切れるかを達成の指標にできるわかりやすい指標を設ける
一ヶ月あたりの問い合わせを最低５件以上に、
Pvを二割アップ
サイト経由で来店する客を獲得するなど
サイトでクーポン配るとか
やっておくべきこと
継続的な情報提供が可能な体制づくり
問い合わせ対応はどうする？
よさんは？サイトを掲載した後のことを考える
サイトを公開してからの後のことを考える
永遠とチューニングを重ねていく必要あるウェブサイトに公開する
→ウェブに窓口を設ける感覚。
問い合わせ返信をビジネスでやっていく体制
運営には予算が必要。企画情報整理
アイデアを練るカテゴライズするゴールを達成するためのあいであ
情報のパーツをページ単位にまとめる
ページに名前つけるこの三段階を石すると
思いつくままにアイデアにまとめる
アウトライナー
ワークフローリーワイヤフレーム
プレゼンテーションソフトが向いてるパワポとか
付箋と画用紙で情報整理しても。
カットソーティング法
文章になっていませんが、私はこの2時間でこれだけのメモを書くくらい、色々学ばせていただきました。
特になるほどーー！！と思ったのが、
まず一枚の絵からこういうサイトみたいな設計図？みたいなのを作って、パーツは後で作るというところ、
あとは、アドビドリームウィーバーの存在について
コーディングについて
そもそもコーディング作業よくわかってなかったので、どういう仕事なのかもすごくためになりました。これも私には必要な作業と感じたので、すごくためになりました。
あと、アドビ三ヶ月受け放題で、、、アドビドリームウィーバーを学ぶ章があったのを思い出しました。私には関係なさそうだから多分受けないかな〜〜？？とか思っていたので、
三ヶ月受講期間終わる前に、アドビドリームウィーバーの重要性をここで教えてもらったことに全力で感謝します。ありがとう。本当にありがとう。
とりあえず、三ヶ月はみっちりアドビ講座うけ放題の方に集中する予定です。
近い将来、Webデザイナーホームページ制作コースも受講してみようかなと思える授業でした。
ヒューマンアカデミー「Webデザイナーホームページ制作コース」の女性講師さんが
ホームページ制作するときに
・クライアントのために作る
・サイトを使う人にとってメリットの大きなサイトを作る
綺麗汚いという以上に、機能的、ユーザーに情報提供につながっていることが大前提
ということを大前提にあげていました。この部分を最初に聞いて、この先生は信頼できるし、もっと学びたいなあと感じました。
趣味で綺麗なサイトを作りたいという講座じゃなく、ビジネスで役に立つサイト制作を聞くことができました。サイト制作の本何個か持っているけど、趣味関係のことばかり書いてある本だったので、この先生の通信講座は貴重だと感じました♩
ヒューマンアカデミーの無料体験コース
今回無料体験できるコースがこちらでした。
・ネイリスト・ジェルネイル検定コース
・日本人のための「やさしい日本語」
・オリエンタルリンパドレナージュ
・保育士【完全合格】講座
・ほめ育子どもｺｰﾁﾝｸﾞ講座（Basic)
・ベビーシッター講座
・登録販売者合格講座
・医療事務講座
・動画クリエイター Premiere Proコース
・FP＋ゼロから始めるマネープラン講座
・NLPファンダメンタル通信コース
・Webデザイナー ホームページ制作コース
・動物看護士・介護士講座
・クリスタルデコレーション
視聴期間は登録完了〜４月２４日まで
コメント