2012
01/25

Webデザイン勉強会Vol.6まとめ第6回目は、WEBサイト制作をデザインからコーディングまで進めた場合のソフトについてと、プログラムが絡む場合のツールを紹介しました。記事内容は、当時紹介した内容を再構成してまとめています。

WEBサイトを制作する種類とソフト

WEBサイトを制作する上で必要なソフトは、ほぼAdobe系のソフトとなります。

サイトデザインを制作するソフトはPhotoshop、Illustrator、Fireworksがあります。Photoshopは直感的でアーティスト寄りなデザインを作るのに向いています。Illustratorはベジェや文字のレイアウト秀でています。使用ソフトは制作会社によって違いますが、最近はデザインからスライスまで一括で制作可能なFireworksを使うところが増えてきています。

コーディングやWEBプログラムはDreamweaverかテキストエディタが使われます。テキストエディタはフリーからシェアウェアまで様々で、サクラエディタ秀丸エディタTeraPadmi(Mac)などがあります。入力支援ツールとしてzen-codingが人気です。

WEB用のプログラム言語は、CGI、Perl、Rubyなどがありますが、現在多く使われているのはPHPです。また、CMSなどでよく使うデータベースは、PostgreSQL、MySQL、SQLiteなどがあります。またアニメーションに関する部分はFlashのActionScriptが主流でしたが、JavaScriptに変わってきています。

プログラムを組み込む時の進め方

WEBサイトでアニメーションなどを制作するプログラムがFlashからJavaScriptに代わり、Wordpressの様なプログラムが絡むCMSが開発の中心になることが多くなりました。よりコーダーがプログラム開発をすることが増えています。HTMLにプログラムを組み込む時、開発効率が上がる便利ツールなどを紹介します。

テンプレートエンジン

テンプレートエンジンとは、HTMLとPHPを分離して開発することができるようになるプログラムです。今まではプログラムのソースコード内にHTMLも記述していたため、ソースの見た目が複雑になりがちでしたが、両方が分離されることで内容が把握しやすく、コーダーとプログラマーを専任するグループワークも可能となります。

テンプレートエンジンで有名なのはSmartyです。

ウェブアプリケーション開発環境

制作用のローカルPCでサーバー環境を構築する各種フリーソフトをまとめたものです。Windowsでは「XAMPP」、Macでは「MAMP」が有名です。導入することでプログラムの動作確認やCMSのインストールなど、WEBアプリケーション開発が可能になります。