Coding Rules

本サイトのマークアップの基本ルールです。

マークアップ

本サイトは以下のバージョンのHTMLで記述しています。

Version	XTML 1.0
Charset	ShiftJIS

本サイトはheadとbodyをファイルを以下の用に分けて制作していきます。

Tags	ファイル名	内容
head	xxxhead.html	headのファイルです。headタグは記述しません。
body	xxx.html	bodyのファイルです。bodyタグは記述しません。

head

以下のような記述をします。 xxxのところは任意で記述してください。

    
xxxxx

      <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />

<meta name="author" content="xxxx"/>
<meta name="copyright" content="xxxx"/>
<meta name="keywords" content="HARE,GRIND,COLLECTION,ストリート,ファッション,アパレル,カジュアル,スケーター,スケート,SK8,コレクション,point,styling,スタイリング,スタイリスト,アイテム" />
<meta name="description" content="xxxxxxxxx" />
<title>xxxxx</title>

<meta http-equiv="Content-Style-Type" content="text/css"/>
<meta http-equiv="Content-Script-Type" content="text/javascript"/>
<link rel="stylesheet" type="text/css" media="all" href="/xxx/xxxx/css/xxx.css" />

<meta property="og:locale" content="ja_JP" />
<meta property="og:type" content="website" />
<meta property="og:title" content="xxxxxxx" />
<meta property="og:site_name" content="xxxxxxx" />
<meta property="og:description" content="xxxxxx" />
<meta property="og:url" content="xxxxxx" />

body

基本的に以下の用な構造で制作します。

        ...省略
    

        ...省略
    

        ...省略
    

      <div class="warpper">
    <div class="header">
        ...省略
    </div>
    <div class="main">
        ...省略
    </div>
    <div class="footer">
        ...省略
    </div>
</div>
    

各パーツのマークアップはComponentsを参照シてください。

Layout

レイアウトについて本サイトのレイアウトはグリッドシステム採用しています。 12カラムのレイアウト構造です。

詳しくはBaseStyleを参照してください。

外部ファイル読み込み

ファイルの読み込みについて説明します。 JavascriptやCSSの外部ファイルのパスですが基本的にルート相対で記述します。

    リンク

      <a href="/xxx/xxx/xxx.css">リンク</a>

CSSファイル

CSSファイルは基本的に一つにまとめminify化して読み込みます。 CSSファイルは上から下に読むので上からセレクタ強度が弱い順に記述します。例外としてプラグイン等のデフォルトCSSは本サイトオリジナルのCSSの最後に記述してください。詳しくCSS Rulesを参照してください。

CSSファイルはhead内で読み込みます。

Javascriptファイル

Javascript（以下はjs）ファイルもCSS同様一つにまとめminfiy化して読み込みます。本サイトはjQueryを採用しています。 jQueryは最初に読み込む用してください。以下の様な順番でjsファイルを読み込み一つにまとめます。

    jQuery > load時実行JS > プラグイン系JS 　> イベントハンドラ制御系ｊS

      jQuery > load時実行JS > プラグイン系JS 　> イベントハンドラ制御系ｊS

jsファイルは基本的に</body>手前で読み込みます。

禁止事項

以下の内容を禁止とシます。

・IDセレクタは基本使用しない。
・レイアウト目的の<br />は使用しない。
・レイアウト目的で全角＆半角スペースを使用しない。
・レイアウト目的で 使用しない。

※ は単位の前のみ使用する(半角スペースではなくNo Break Spaceという意味の為)