コーディング基本

必須事項

1. 【HTML】UIkit3のルールで制作してください。既存のテーマは使用しないでください。

UIkitを想定してデザインを制作しています。他のフレームワークやテーマでは、カスタマイズや公開後のメンテナンスがしづらくなるのでNGです。

https://getuikit.com/docs/introduction

 

以下URLから最新のCDNを取得して使用してください。CDN以外の方法はNGです。

https://getuikit.com/docs/installation

 

既存のテーマはデザイナー側の学習コストが必要になったり、ブレイクポイントをテーマに合わせないといけないなど問題が多いため、使用しないでください。

 

 

 

2. 【SCSS】Scout-appでコンパイルが通ることを必須とします。

納品前に必ずscout-appの最新版(2.18.16)でコンパイルが通るようにしてください。

scout-app official site & download

 

ツールやバージョンが違うだけで変換不可になる場合があるため、制作中のツールは問いませんが、納品時の条件を統一します。

 

 

 

3. タスクランナー等不要で第三者が修正できるように。

クライアントがご自身で公開後の修正を行う案件があります。そのためできるだけシンプルな状態で納品する必要があります。

制作時の使用は問題ないのですが、当方で修正時にgulpやfoudationを通さないと直せない作りは絶対にしないようお願いします。

 

 

 

対応ブラウザ

以下のブラウザを標準対応のブラウザとします。

 

Windows環境

  • 制作時に最新のGoogle Chrome
  • 制作時に最新のMicrosoft Edge
  • 制作時に最新のMozilla Firefox
  • Microsoft Internet Explorer 11以上(表現不可能なCSSは使用無しで問題ありません。)

 

Macintosh環境

  • 制作時に最新のSafari

 

スマートフォン・タブレット環境

  • Safari
  • Google Chrome

※発売から3年以内の端末でご確認お願い致します。

 

 

印刷対応

特に要望がない限り、特別な対応はしないものとします。

 

 

 

ブレイクポイント

基本1つです。

 

  • 960px未満(uikitの@m未満)…スマホ&小サイズタブレット
  • 960px以上(uikitの@m以上)…中サイズ以上のタブレット&デスクトップ版

 

uikitのルールにあわせています。

https://getuikit.com/docs/width

 

必要に応じてその他サイズのuikitの記号(@s、@lなど)やCSS上でのメディアクエリを利用してください。

 

 

 

ディレクトリ構造

テーマファイルの構成は原則として下図の通りでお願いします。

 

[sitename(テーマ名)]
  ├ [scss] -------------------------------------:SCSSファイルを格納
  │
  ├ [css] --------------------------------------:装飾用CSSファイルを格納
  │
  ├ [js] ---------------------------------------:JSファイルを格納
  │ 
  ├ [img] ---------------------------------------:画像ファイルを格納
  │
  ├ style.css ----------------------------------:テーマ説明のためのファイル
  │
  ├ functions.php ------------------------------:テーマのための関数(下記以外の内容)
  ├ functions-css.php --------------------------:CSSファイルの呼び出し
  ├ functions-js.php ---------------------------:JSファイルの呼び出し
  ├ functions-shortcode.php --------------------:自作ショートコード一覧
  │
  ├ index.php ----------------------------------:メインインデックスのテンプレート
  ├ header.php ---------------------------------:テーマヘッダー
  ├ footer.php ---------------------------------:テーマフッター
  ├ page.php -----------------------------------:テーマフッター
  ├ single.php ---------------------------------:個別投稿
  ├ archive.php --------------------------------:アーカイブ
  └ 404.php