logo

ちょっとしたコーディングルールをまとめてみた

・切り出しデータの拡張子

基本的にはPNGで統一

・ディレクトリ構成(例)

分かりやすく簡略化したディレクトリ内容

{root}

|{css}

|{img}

||{common}

||{top}

||{bnr}

||{(コンテンツディレクトリ)}

|| …

|{js}

index.html(or index.php)

※なるべく正式な名称でディレクトリを生成(スペース分はアンダースコア使用)

[例]花と名付ける時

× /hana → ○ /flower

・.htaccessの設定

1.wwwの統一(簡略化で基本的無し)

2.拡張子の非表示の有効化(簡略化)→リンクの指定も拡張子無しで指定

[例]

http://www.sample.com/test.php

→ http://sample.com/test

・アナリティクスコード

JavaScriptでの読み込み

・クラス、IDの指定(チェインケース)

new itemと設定する場合は、.new-item と指定する。

new item 1と設定する場合は、.new-item-01(#new-item01) と指定する。

※WPとの統一

※JavaScriptの場合はスネークケースとする。※-とマイナスを混同しないため。

・リンクの指定

相対パス

・JavaScriptへのリンク

SSL化も踏まえてtype属性を指定しておく。

・jQueryの読み込み

読み込みは内部リンクの読み込み(SSL化考慮)

・その他

インデントサイズは2em

閉じタグは同じ行の外側に設置

[例]

■CSSへの記述

・アルファベット順の記述 ※ベンダープレフィックス除く

.sample {

     background: #fff;

     color: #000;

     width: 100%;

}

■ブラウザ対応バージョン

IE:9/10/11/最新版~

Chrome:最新版

Firefox:最新版

Safari:最新版

※上記バージョンは確認段階での対応状況です。必ずしもその他のブラウザが動作しない訳ではございません。

・・・とだらだら書きましたが、コレでやっているわけでもコレが正しいわけでもありませんのでお気をつけください。
参考まで。

ワンポイントアドバイスの実績最新記事

広報企画社の実績を見る

お問い合わせはこちら