（タップで電話をかける）
column
コラム
画像からホームページ表示データへの変換作業（コーディングとは）
ホームページのデザイン案が完成した段階では、それはまだ一枚の画像データにすぎません。
たとえば、デザイン上に「詳しくはこちら」と書かれたボタンがあっても、画像の状態ではそれをクリックして別のページに移動することはできません。なぜなら、その段階では見た目だけの「絵」であり、ホームページとしての機能を持っていないからです。
たとえば、デザイン上に「詳しくはこちら」と書かれたボタンがあっても、画像の状態ではそれをクリックして別のページに移動することはできません。なぜなら、その段階では見た目だけの「絵」であり、ホームページとしての機能を持っていないからです。
画像データ
あくまで画像データのため、クリックしても反応や動作は一切ありません。
ここで登場するのが「コーディング（Coding）」です。
コーディングとは、このデザイン案をもとに、Webブラウザ（Chrome、Safari、Edgeなど）が理解できる「言語（コード）」を使って、実際に動作するホームページへと作り上げていく作業のことです。
先程の例で言えば、デザイン上の「詳しくはこちら」というボタンも、コーディングを施すことで、初めて「クリックできるリンクボタン」として機能するようになります。
コーディングとは、このデザイン案をもとに、Webブラウザ（Chrome、Safari、Edgeなど）が理解できる「言語（コード）」を使って、実際に動作するホームページへと作り上げていく作業のことです。
先程の例で言えば、デザイン上の「詳しくはこちら」というボタンも、コーディングを施すことで、初めて「クリックできるリンクボタン」として機能するようになります。
コーディングを施したデータ
コーディングによって、リンクの設定はもちろん、ボタンにマウスカーソルを重ねた際のアニメーションなどが可能になります。
もちろん、ボタンだけでなく、ホームページのすべての要素にこのコーディングの作業が必要です。
文字や画像の表示はもちろん、動画の再生、さらにパソコンやスマートフォンなど閲覧する端末に応じたレイアウトの最適化もコーディングによって実現されます。
文字や画像の表示はもちろん、動画の再生、さらにパソコンやスマートフォンなど閲覧する端末に応じたレイアウトの最適化もコーディングによって実現されます。
Possted by
野澤 亮介
浜松職業能力開発短期大学校／産業デザイン科卒業後、印刷物制作を中心としたデザイン事務所に勤務。デザイン未経験の私にデザインの基礎を教えていただき、その経験は今でも活かされています。その後、WEBシステム会社にてWEBデザイナーとして従事後に2010年八十八デザイン事務所設立
