2013-05-22

Webページ作成で使っているジェネレータ



 自分自身何が得意かとWebプログラムと答えます。それもWebデザインです。
 プログラマーという職業について最初は目に見えない。とくにDB周りの開発をやっていたのですがここ最近はもっぱらWeb開発です。
 まぁデザインといっても自分でデザインしたものはなく、エンドユーザの意見をベースに作り上げてるものなのでまだWebプログラムですね。
 ただ、Webプログラムもデザインはやるということで当然、HTMLやCSSといった開発をやっています。
 
 そんな中、自分が今使っているジェネレータをいくつか紹介したいと思います。


統一されたHTMLタグを作る。


 HTMLタグはSEOなどの視点を考慮すると結構大事な要素です。まぁ当然のことですね。
 それぞれ開発者にはテンプレートがあると思いますが、自分は専用のテンプレートは用意していません。
 最初こそ、テンプレートを持っていたのですが、コロコロ変えてしまったりしてテンプレートらしいテンプレートの使い方ができなかったのが主な理由です。
 それをジェネレータで解決させました。
 http://mizzz.jp/tg/


 ここのサイトです。ここは過去にも紹介した記事になるので詳しくはhttp://knowledge-am04labo.blogspot.jp/2012/08/csshtml.htmlから。
 このジェネレータを利用することで汎用的なタグを作ることができます。また用途に分けて、且つベースを崩さずに利用できることも利点の一つです。
 おかげでHTMLを作成する際はここから作業が進むのでテンプレートを探す手間が省けます。(まぁテンプレートの場所も統一させればもんだいないでしょうが。。。)
 
 

ボタンのジェネレータは自分と相性がいいものを


 次にボタンのジェネレータです。
 http://css-button-generator.com/


 ここを利用しているのですが、こういうジェネレータはGoogle先生に聞くとたくさん答えてくれます。
 その中で自分と相性がよさそうなものを選んで利用することが作業の効率化の一番じゃないかと思います。
 ちなみにここを利用する理由はジェネレータで作成したボタンのコードをHTML、CSS含め開発コードへ簡単にコピペできるとこです。
 他のサイトも同じような機能があると思うのですが、このジェネレータに慣れてしまったので今は他を使う気になっていません。
 用意されている色も自分好みでもありますし。


グラデーションを出したいとき

 ボタンやバーといった、ページを装飾するパーツの背景などにグラデーションのかかった色を設定したい場合は
 http://www.colorzilla.com/gradient-editor/


 ここを利用しています。
 ここはいくつかの色を使いグラデーションを作る中で光沢のあるグラデーションを作ることができます。
 またこの光沢の方向を変えたりできるので便利です。
 ちなみにここはカラーの指定をRGBだったり16進数だったりに変えることができるのでコード規約とかにも対応できそうです。
 これにも言えることですが、自分がこのジェネレータと相性がいいので重宝しています。


用意された色がない場合


 上二つで上げたジェネレータにはいくつかの色が用意されています。
 用意されている色を使っても全然見栄えよくできるのですが、中には「これじゃない」という衝動を抑えきれないときがあると思います。
 「もっといい色があるだろう」と。
 そんなときに使うのが
 http://colorschemedesigner.com/


 です。こちらも過去に紹介した記事があるのでhttp://knowledge-am04labo.blogspot.jp/2012/11/web.htmlから。
 こちらは類似色も出してくれるのでグラデーションのイメージもつかめます。
 またベースカラーを16進数で入力することも可能なので、ある程度色が固まっている場合でもすぐに使えます。



 ここまで4つ。今自分が使っているジェネレータを紹介しました。
 記事の中にもありますが、これらは相性が良かったのでいまだに使っています。
 他にも便利なジェネレータは多くありますので相性がいいものを選択できればと思います。
 これが結構作業効率上げてくれるんです。
 

0 件のコメント:

コメントを投稿