学科 レイアウトデザイン基礎③

-本日のアジェンダ-

1限目
学科 レイアウトデザイン基礎③
マークアップについて

2限目
学科 レイアウトデザイン基礎③
マークアップについて

3限目
学科 レイアウトデザイン基礎③
マークアップについて

4限目
学科 レイアウトデザイン基礎③
課題制作

5限目
学科 レイアウトデザイン基礎③
課題制作

本日のテーマ

マークアップです。

マークアップとは?

マークアップとは、webサイトを作成する時に使用するhtmlという言語でサイト内の文書に意味づけをしていく作業のことを指します。 … そこでロボットに適切にwebページの内容を伝えるためにhtmlというマークアップ言語を使用しタグをつけます。

ワンポイントアドバイス

正しくマークアップ出来ているかの判定は、人の目では解り難いです。そんな時は、機械に頼りましょう。
検証サイトなどを使って正しくマークアップされているかを確認してみましょう。

参考サイト

第4回成績考査

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

学科 レイアウトデザイン基礎①

-本日のアジェンダ-

1限目
学科 レイアウトデザイン基礎①
Webサイトについて

2限目
学科 レイアウトデザイン基礎①
ワイヤーフレームについて

3限目
学科 レイアウトデザイン基礎①
課題制作

4限目
学科 レイアウトデザイン基礎①
課題制作

5限目
学科 レイアウトデザイン基礎①
課題制作

本日のテーマ

Webサイトを作ってみましょう。

Webサイトとは?

ウェブサイトは、World Wide Web 上にあり、一般に特定のドメイン名の下にある複数のウェブページの集まりのこと。サイトと呼ばれることもある。企業などの団体が自身を紹介するため自ら構築したサイトを、その団体の公式サイトなどと呼ぶ。 ホームページと呼ばれることもあるが、この用法は誤用とされる場合もある。 ウィキペディア

参考サイト

LP(ランディングページ)とは?

ランディングページ最適化はコンバージョン最適化、もしくはコンバージョン率最適化と呼ばれるより広範なインターネットマーケティング手法の一つであり、セールスリードや顧客となりうるウェブサイト訪問者の比率を向上させることを目的としている。 ウィキペディア

ワンポイントアドバイス

未経験でいきなりWebサイトを作るよう業務を指示する制作会社はありません。もし言って来たら疑ってください。個人レベルや担当者がWebサイト制作の知識理解が足りない等で、依頼されるなどの事は逆によくあるかもしれませんのでお気を付けください。
そこで、まずは最初の一歩としてチャレンジするのであればLP(ランディングページ)のような、1ページのページ制作をしっかりと行ってみると良いでしょう。

参考サイト

ワイヤーフレームとは?

ワイヤーフレームとは、webページのレイアウトを定める設計図のことです。
webサイトの制作現場で聞かないことがない、といえる単語であり、サイト制作において決して欠かせない要素です。
単に「ワイヤー」と呼ぶことも多いです。

制作のポイント

チラシを作る時と同じで掲載が必要な内容を先に、しっかりまとめてからレイアウトを考えると良いでしょう。そのレイアウトが、HTMLとCSSというルールに変わっただけです。
まずは、PCサイズとして上記の例のような、コンテンツ部分が960pxでその外側部分を入れて、1280pxでワイヤーフレームを作成してみましょう。

ワンポイントアドバイス

ワイヤーフレームの段階では、お仕事の契約成立に至っていない場合が多いです。逆を言えば、しっかりとしたワイヤーフレームを作成できるという事は、「仕事を獲得できる力がある」という証明にもなります。お客様のご要望(相手の気持ち)をしっかり理解する事を心掛けて制作をしてみましょう。

参考サイト

第4回成績考査

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