ウェブサイトを作るのに必要な言語

web

Webサイト製作に使う言語

Webサイト製作に興味を持って本屋に向かうと、サイト製作に関する色々な本を見つける事ができます。でも沢山ありすぎて何を使えばいいか分からないし、内容も最初はちんぷんかんぷんですね。

Webサイト製作に使う言語やツールは、どんなサイトをどう実現するかで変わります。 でも最低限必要なものはたったの2つです。

Webサイトは文書構造を「HTML」、装飾を「CSS」で記述します。

サイトの文書構造を記述するHTML

文書構造とレイアウトについて、履歴書を例に詳しく見てみましょう。

一口に履歴書といっても、様式や記述内容は様々です。名前と写真ぐらいは当然として、住所、電話番号、性別、年齢、経歴、趣味、特技、性格、自己PRなど、色々書く事があります。それらを思いついた順に片っ端から書くよりも、整理して書いた方が良い文書になります。

個人情報欄

名前・写真・年齢・性別・住所・電話番号

経歴欄

学歴・職歴

趣味・特技欄

得意なスポーツやゲーム・趣味

PR欄

長所・短所・性格・やりたいこと

自己紹介で書く内容(要素)を決め、似た要素を4つの大枠に分けました。他にも「履歴書」と銘打っておいたり、作成日時を書いたりするのもいいでしょう。これがHTMLで記述する文書構造です。

サイトのレイアウトを装飾するCSS

次にこれをどのようなレイアウトで表現するか考えましょう。色をどうするか、文字の大きさはどれぐらいか、各欄をどのように配置するかなど色々あります。文書構造は同じでも、レイアウト次第でまったく表現は変わります。これがCSSで記述する装飾です。

HTMLとCSS以外にもウェブサイトを作るツールや言語は沢山あります。しかしHTMLとCSSはWebサイトの根幹を司る部分を記述する言語で、どんなサイトもこれ抜きには作れません。まずはこの2つをしっかり学びましょう。

eyecatch

ウェブとウェブサイト

eyecatch

長さ単位の基本

ウェブサイトの記事

eyecatch

ConohaのVPSにWordPressをインストールするまでの備忘録

eyecatch

ウェブサイトの長さの単位一覧

eyecatch

ウェブサイトの需要と供給から考えるアクセスアップ

eyecatch

「JPG」「PNG」「GIF」の画像形式による違い

eyecatch

レスポンシブウェブデザインの設定方法

eyecatch

サイトのPV数を増やす3つの基本

ウェブサイトの記事一覧HOME