Web Survive

Webで生きる道を模索するブログ

Webサイト制作

Webの仕組みやサイト(ホームページ)制作するにあたっての基本的な流れ、
最低限用意するもの、そして必要となる知識を紹介します。

Webサイトの仕組み

Webサイトは一般的にHTMLとCSSという言語で作られおり、
サーバーと呼ばれる場所にWebサイトを構成しているファイルを置くことで
インターネットに繋がっている環境からならどこからでも
制作したサイトをブラウザを通して閲覧する事ができるようになります。

Web制作に必要なツール

PC

サイトを作ろうと考えている人ならすでに持っているとは思いますが
Webサイトを作るにあたって
後ほど紹介するPhotoshopやIllustratorなどの
グラフィックソフトを併用することを考えると
最低でもメモリは4GほどあるPCが望ましいです。
(最近のPCは4Gを越えたスペックが多いので気にする必要は無いかもしれません)

インターネットのできる環境

ISP(インターネットサービスプロバイダ:インターネット接続業者)と契約して
インターネットができる環境を整えましょう。

テキストエディタ

Webサイトの元となる、HTMLやCSSなどの言語を書く為の
テキストエディタをPCにインストールしましょう。
元から入っているメモ帳やテキストエディットなどでも大丈夫ですが
高機能で無料でダウンロードできるテキストエディタがネットにはあるので
そちらをDLして使用することをオススメします。

Sublime Text

僕はSublime Textを愛用しています。

HTMLとCSS

Webサイトは基本的にHTMLとCSSという言語でできています。

HTML(HyperText Markup Language:ハイパーテキスト・マークアップランゲージ)
サイト制作のメインとなる言語です。
プログラミング言語と勘違いされる方も多いですが
HTMLはマークアップ言語になります。
サイトに載せたい文章や画像はHTMLで表示させることができるので
HTMLだけでもサーバーにファイルを置けばサイトを公開することはできますが
コンテンツがただそのまま表示されるだけで
デザインされてなく、とても観にくい状態になります。
そこでCSSの登場です。

CSSは(Cascading Style Sheet:カスケーディング・スタイルシート)
CSSを使うとサイトの見栄え(デザイン)を細かく指定することができます。

HTMLは人間でいうところの「体」にあたり
CSSは「服」のようなものです。

HTMLの中にCSSを記述することも可能ですが
コードが複雑になり、見辛くなってしまうので
HTMLとCSSは別々のファイルに分けて記述する方法が推奨されています。

↓現在HTMLの簡単な解説ページを製作中です
HTML入門

初心者にオススメのサイト(ブログ)や本の紹介

ドメインを決めよう

レンタルサーバーを選ぼう!

Webサイトをネットに公開するには
サーバーにサイトのファイルを置かなければなりません。
まずはレンタルサーバーを借りましょう。
オススメのレンタルサーバーをご紹介します

ロリポップ

ミニバード

エックスサーバー

僕は現在ミニバードを使っていますが
サイトのアクセスが増えたらロリポップに移動しようと考えています。

07:FTPソフトを使ってサイトをサーバーにアップしよう

レンタルサーバーのFTPクライアントを利用しても大丈夫ですが
無料のFTPソフトがネットにはあるのでご紹介します。