2013-01-15

無料でサイトを作る時に恐るべきほど役立つツール23選

当サイト・ブログでも実際に利用しているツールを紹介する。

リファレンス

サイトを制作するためには、htmlやcssに関する知識は欠かせない。それらを勉強したり、分からない時に役立つリファレンスを紹介する。

1. ちょっと詳しいHTMLとCSS

まずは、htmlとcssの基本をここで学ぼう。やや古い内容だが、初心者でも分かり易く丁寧に解説してくれている。実際にhtmlとcssを使いながら体験的に学べるのが特徴だ。htmlとcssを同時に学べるのが嬉しい。目次に沿って学習を進めれば、全てが終わる頃には簡単なサイト制作ができるようなる。

2. HTMLクイックリファレンス

htmlとcssで分からない事があった時のリファレンスとして活用できる。また、実際にサイト作りに入った段階で、自分のhtmlの使い方が正しいのかを検証する時にも活用しよう。htmlとcssに関する事が網羅されている。ただ、タグの使用例がやや分かり難いかもしれない。そんな時は、下の「TAG index」が分かり易い。

3. TAG index

こちらも、htmlとcssでのリファレンスだ。上の「HTMLクイックリファレンス」と比べると、目次が分かりにくく、調べたい情報が見つかり難い。他方、タグの使用例は「HTMLクイックリファレンス」よりも分かり易く記載されている。その時々に合わせて、上の「HTMLクイックリファレンス」と使い分けると良い。

テキストエディタ

htmlファイルやcssファイルの作成は、windowsに標準搭載されているメモ帳でも可能だ。しかし、テキストエディタを使った方が、作業をより効率化できる。テキストエディタは1つあれば十分なので、初心者でも使い易いものを1つ紹介する。

4. TeraPad

軽快に動作する無料のテキストエディタだ。行番号やルーラーの表示など、Windowsに標準搭載されているメモ帳にはない多くの機能を備えている。直ぐに取り入れよう。

画像編集ソフト・ジェネレーター

サイトロゴやヘッダ画像など、サイト作りには画像が必要になる。無料の画像編集ソフトとジェネレーターを紹介する。使いこなせるようになれば、プロ並みの画像が作れる。

5. Inkscape

Inkscapeと下の「Gimp」の組合せは、illustrator＋photoshopを無料で代替してくれるものとして有名だ。プロの中でも使っている人は多い。感覚的に操作できるので、画像を作りながら使い方を習得していこう。

6. Gimp

上の「Inkscape」と組合せて使えば、多彩な画像を作成できる。ただ、Inkscapeに比べると若干使い方が難しい。難しさを感じる場合には、上の「Inkscape」だけで十分だ。画像編集ソフトは最低でも1つは使いこなせるようになろう。

7. As Button Generator

ウェブ上でボタンアイコンを確認しながら作れるジェネレーター。ストライプやグラデーションの設定が簡単に出来る。上の「Inkscape」でボタンを自作するのも良いが、このジェネレーターを使えば、格好良いボタンを短時間で作成可能だ。

画像・写真素材

画像は一から全部自作する必要はない。既にある素材を上手く加工すれば、効率的に画像を作成できる。そんな時に役立つ無料の素材集を紹介する。

8. Design Warehouse

無料の画像素材集。ホームページ制作会社が運営しているだけあって、デザイン性が高い画像が用意されている。特に、矢印やワンポイント素材など、小物の素材が秀逸だ。

9. materialand

こちらも、無料の画像素材集だ。デザイン性が高い画像が膨大に用意されている。上の「Design Warehouse」と組み合わせて使えば、気に入った素材が見つかるはずだ。

10. 写真素材足成

無料の写真素材集。全国のアマチュアカメラマンが撮影した写真素材だが、品質は十分。ジャンルもビジネスシーン、人物、風景など幅広くあるので、目的の写真が見つかるはずだ。

デザインテンプレート

htmlやcssを一から組むのも良いが、デザインテンプレートをカスタマイズすれば、効率的にサイトを作る事ができる。カスタマイズし易いテンプレート集を紹介する。

11. TAG index

デザイン性の高いテンプレートが容易されている。そのまま使っても良いがカスタマイズにチャレンジして、独自のデザインサイトに仕上げよう。

CMS

ブログ作成だけでなく、一般的なサイト作成にも力を発揮する無料のCMSを紹介する。ただ、一般的なサイト作成に使うためには、カスタマイズが必要で、html、css、phpなどの幅広い知識だけでなく、CMSそのものの仕様を理解しなければならない。

12. WordPress

MovableTypeも有名だが商用利用は有料ライセンスが必要だ。一方、WordPressは商用利用も無料だ。最近のレンタルサーバーは、WordPressに対応しているところが多く、レンタルサーバーによってはボタン一つでのインストールをサポートしている。ブログツールとしてなら、誰でも簡単に使えるツールだ。