ログアウト

コーディングルール(全商品共通)

下記と合わせて、検品シートにある項目も確認してください。
システムプレミアム
システムオリジナル
オリジナル
システムプロフェッショナル

歯科の下層原稿の場合
※歯科でコーダーお任せの場合、虫歯の進行、補綴物などにも適宜画像をいれてください。画像はヒーローオリジナルイラスト素材の下記から使用してください。
G:\共有ドライブ\素材\コーディングテンプレート\オリジナル\images\original

hタグ

順番を守る

h1→h2→h3→h4…と順当に当ててください。
h1→h1→h4などバラバラに付けないようにお願いします。
SEO対策上、非常に重要になります。

hタグに英語は入れない

×:<h1>医院紹介<span>Clinic</span></h1>
○:<h1>医院紹介</h1><p>Clinic</p>
検索結果に英語まで入ってしまい、お客さんから「消してほしい」と指摘される場合があり、対応に困るケースが発生しています。
また、英語の見出しはSEO上良好な結果を得ない場合があります。英語は必ずhタグの外に出してください。
※英語しかない見出しの場合は、英語にhタグをつけてください。

classの付け方

「h2.tit01」のclassではなく、「.tit01」のclassを作るようにしましょう。
汎用性のあるクラスを作っていきましょう。

スクロールアニメーションを入れる場合

原則画像のみに適用してください。
テキスト部分にアニメーションを入れるとGoogleのAIが読み込めずSEOが下がる可能性が高いので、やらないでください。

デザインに使われている英語

テキストコーディングできるところは、なるべくテキストでやっていきましょう。(更新で文言が変わることを考慮して)

診療時間表

なるべくテキストコーディングでやっていきましょう。(更新しやすい&美しく見えるように)

画像の書き出し形式とサイズ

全画像共通

横の最小サイズ:横640px
なお、透過する必要のないものは原則jpgにしてください。
画像の原寸サイズをHTMLに記述するようにしてください。(サイズ感はCSSで制御)

ロゴ

オリジナル:svgで書き出す(アウトライン化されているか必ず確認)
システムオリジナル:jpg or png、状況に応じてsvg(svgにする場合はphpデータの書き換えが必要です)

ファビコン

ロゴに合わせてファビコンを設定する
→設定方法
ロゴが無い場合は、クリニック名の1文字目をファビコンとして使用してください。

ファイル名

新規制作の場合のファイル名は、テンプレートを踏襲して付けてください。
既存サイトのリニューアルの際は、ページ構成内容が明らかに同じものは同じファイル名をつけてリダイレクトを行わずに済むようにしてください。(オリジナル→オリジナル/Wordpress→Wordpressの場合)

※新規作成の場合のファイル名の付け方のベースはオリジナルテンプレートの仕様を参照ください。

PCのメインビジュアル

jpgで書き出す(pngだと重いため)

スマホのメインビジュアル

jpgでスマホ用に小さいサイズで書き出す(PC用の大きい画像だと読み込みに時間がかかり、SEOの評価が下がる)

altタグ

原則入れましょう。
ただし、小さな矢印やアイコンなどには付けなくて大丈夫です。(スパム認識される可能性があるため)

アナリティクスコード

基本的に公開直前に入れるようにしましょう。
初期コーディング中に入れてもOKですが、公開検品まではコメントアウトにしておいてください(テスト期間中の不要なデータが蓄積してしまうため)
また、コードは告知サイトから取得しないでください。必ずアナリティクスの画面からコードをコピーしてきてください。
【トラッキングコードの取得方法はこちら】