弊社が行っている３つの制作のルール

 

こんばんは、佐谷です。

今日は弊社に新たな仲間が二人も加わりました。

派遣の方が多い弊社では、入れ替わりも激しいのですが、新たなメンバーが加わることでやはり刺激を受けますね。

新生ジーニアスウェブの日も近いのかなと感じております。

 

従業員が増えるということは、それだけ規律やルールが必要になりますよね。

どの企業様も社内での独自のルールがあると思います。

 

今日は、そんな“社内ルール”の話です。

制作中心の話となりますが、ご容赦ください。

弊社はホームページの制作会社です。

いかに効率良く作業をするかが、売上にも直結してきます。

お客様においても、迅速に対応をしてくれる会社のほうが断然嬉しいと思います。

 

効率化を図るためには、どの作業者も同じガイドラインを利用して、テンプレート化させることが必要となります。

 

特にHTMLコーディング作業（デザインしたものをウェブ上に反映させる作業）においては、ガイドラインが必須となります。なぜなら、作業者がバラバラの制作の仕方だと、「どこにどのファイルがあるかわからない」「画像のファイル名がわかりにくい」「どのスタイルシートが作用しているのかがわからない」ということに陥るのです。

 

そこで弊社では、独自の「コーディングガイドライン」を作成することで、統一化を図っております。

すでに制作された後の物は、適用ができない場合がありますが、基本的には以下の3大ルールを掲げています。

 

その1　画像命名のルール

例）「bnr_top_詳細01.jpg」

 

これを行うことで、上記の場合だと「トップページの1番目に使っているボタンだな」ということが一目見てわかります。これだと、ソースを確認しなくてもだいたいどのボタンのことかがわかります。

 

その2 id/class名のルール

例1）「header_links」

例2）「ul_products01」

 

識別名と、詳細を_（アンダースコア）で連結することで、

 

例1）「header部分のリンク」

例2）「商品一覧のリスト」

 

に設定しているスタイルシートだということがわかります。

 

その3　ディレクトリ作成のルール

例1）「images/common」

例2）「images/ページ名」

 

これはこの画像を見て頂ければ、一目でわかります！

これは、新規制作中のサイトのディレクトリです。

「ルール1」と「ルール3」のコンビネーションでとてもわかりやすく画像のファイルがアップされていることがわかります。

 

これによって、作業者の混乱を避けることができ、「ミスで違う画像を上書きしてしまった！」ということもなくなるはずです。

 

人間は見た目がいくら良くても中身が伴っていなければ、魅力的とはいえません。

ウェブサイトも同じことで、いくら表示が綺麗であっても、中身がぐちゃぐちゃのサイトは魅力的ではないし、プロの仕事とはいえません。

 

もしお客様がサイトのソースを見た時に（お客様には知り得ない部分かもしれませんが）、「なんだこれは・・・」となり、信用を失ってしまう可能性もあるのです。

 

我々ジーニアスウェブは、この「ガイドライン」を肝に命じて、これからも質の高い制作を目指していきます！