Web広報PR広告業界 Webの壁[担当者に必要な基礎知識/その②]基本構造 15.11.18 HTMLで構成しCSSで見映えを指定。テキストとプログラム言語で画面を制御。まず、Webの基本技術についておさらいしておきたい。近年ではWebと呼ばれることの多い「www(World Wide Web)」は、世界中のサーバで公開されている情報をインターネット上で閲覧することができる仕組みのこと。クモの巣状に張り巡らされた地球規模のネットワークだ。それぞれのWebサーバには住所があり、例えば当社であれば「http://adband.jp/」となる。インターネット利用者はそれぞれのブラウザにこのアドレス(住所)を入力し、Webサーバにアクセス。するとHTTPという共通の環境を通じて、サーバから送信されるテキストや画像、動画などのデータがウインドウに表示される仕組みとなっている。Webサイトのページを記述するための言語をHTMLといい、これはテキストとタグで構成される。開始タグと終了タグは目印となり、囲まれた要素に意味や役割が与えられる。このHTMLだけでもWebサイトを作ることは可能だが、ここ数年はHTMLに加えCSSという手法を活用するのが一般的だ。HTMLでWebサイトの基本構造を構築し、CSSで見た目や装飾などを指定するという流れで制作する。例えば文字の大きさや行間の設定、色の指定、背景画像や囲み罫などデザイン装飾をルール化。同一のCSSを複数のWebページに読み込ませることで、統一感のあるデザインを効率的に制作できる。また、HTML文書の各要素を、どんな幅・高さでどこに配置するかを指定することで、レイアウトを整えることも可能だ。つまり、HTMLだけなら複雑な文書となり制作工程が非効率となってしまうが、CSSを併用すれば文書の構造を簡素化でき、しかも整ったデザインのWebサイトを容易に制作できる。もちろん修正にも楽に対応することが可能だ。Webサイトで使われる画像の形式についても、簡単に述べておきたい。画像には3つの形式がある。ベタ面が多く色数の少ないロゴなどは「gif」形式、写真など色数の多いものは「jpg」形式。背景画像の上に、画像の一部を半透明にして配置する場合には「png」形式が使われる。また、印刷物とは異なりWebサイトでは低解像度の画像(72dpi)で十分だ。画像を軽くすることで、Webサーバへのアクセス時間を短縮できるからだ。 Point ●記述言語はHTML、CSSで見た目や装飾を指定●画像の形式はgif(ジフ)、jpg(ジェイペグ)、png(ピング)●画像データを軽くすればWebサーバの負担が軽減 関連記事 広報誌のトレンド最前線を開拓! BtoBの救世主!“映像”を使いこなすべし! 主役はコンテンツ! 売り込まなくても売れる最新Webマーケティング②... インナーブランディングのための秘密兵器「理念ブック」とは!?【後編】...
HTMLで構成しCSSで見映えを指定。テキストとプログラム言語で画面を制御。
まず、Webの基本技術についておさらいしておきたい。
近年ではWebと呼ばれることの多い「www(World Wide Web)」は、世界中のサーバで公開されている情報をインターネット上で閲覧することができる仕組みのこと。クモの巣状に張り巡らされた地球規模のネットワークだ。
それぞれのWebサーバには住所があり、例えば当社であれば「http://adband.jp/」となる。インターネット利用者はそれぞれのブラウザにこのアドレス(住所)を入力し、Webサーバにアクセス。するとHTTPという共通の環境を通じて、サーバから送信されるテキストや画像、動画などのデータがウインドウに表示される仕組みとなっている。
Webサイトのページを記述するための言語をHTMLといい、これはテキストとタグで構成される。
開始タグと終了タグは目印となり、囲まれた要素に意味や役割が与えられる。
このHTMLだけでもWebサイトを作ることは可能だが、ここ数年はHTMLに加えCSSという手法を活用するのが一般的だ。
HTMLでWebサイトの基本構造を構築し、CSSで見た目や装飾などを指定するという流れで制作する。
例えば文字の大きさや行間の設定、色の指定、背景画像や囲み罫などデザイン装飾をルール化。同一のCSSを複数のWebページに読み込ませることで、統一感のあるデザインを効率的に制作できる。
また、HTML文書の各要素を、どんな幅・高さでどこに配置するかを指定することで、レイアウトを整えることも可能だ。
つまり、HTMLだけなら複雑な文書となり制作工程が非効率となってしまうが、CSSを併用すれば文書の構造を簡素化でき、しかも整ったデザインのWebサイトを容易に制作できる。もちろん修正にも楽に対応することが可能だ。
Webサイトで使われる画像の形式についても、簡単に述べておきたい。
画像には3つの形式がある。
ベタ面が多く色数の少ないロゴなどは「gif」形式、写真など色数の多いものは「jpg」形式。
背景画像の上に、画像の一部を半透明にして配置する場合には「png」形式が使われる。
また、印刷物とは異なりWebサイトでは低解像度の画像(72dpi)で十分だ。
画像を軽くすることで、Webサーバへのアクセス時間を短縮できるからだ。