タカシマヤのデザインガイドライン

提供：Wiki@KDS
2008年4月30日 (水) 09:28時点における192.168.200.252 (トーク)による版
ナビゲーションに移動 検索に移動

タカシマヤのデザインメモです。
動的の仮アップは以下URL参照。
http://test-takashimaya3.z-xcv.com/product/00002508.html

テキスト・リンク

●TEXT:#333333
●LINK:#0000EE、下線なし
●HOVER:#0000EE、下線あり

●テキストサイズは「12px(サイズ) / 16px or 18px(行間)」を基本とする。
【サイズリスト】
・10px / 14px
・12px / 16px or 18px 　←これが標準サイズ
・14px / 18px
・16px / 20px or 22px

検索エリアの背景色

●基本的に「#e3e3e3」である。
●ページによっては変わるケースもあり。

アーティクル

アーティクルとは動的ページ（サムネイルページ）特定エリアに入る要素です。
デザイン（グラフィック）処理をしたバナーと勘違いする人が多いですがそれは違います。あくまで由良さんが命名した単なるディレクトリ名「article」です。

店舗情報

店舗連動のアーティクルは下部に「店舗情報」が入ることがある。

●背景:#f0f0f0のbgをひき、マージンは10px。
●枠：#e0e0e0の1px。
●テキスト例
【店舗情報】
タカシマヤ東京店でも「第●回 山形展」を開催いたします。ぜひご来場ください。
会期：2008年5月○日(木) →5月○日(火) 午前10時→午後8時 （※最終日は午後6時で閉会）
会場：東京店 8階催会場


ブランドアーティクル

●「ブランドアーティクル」はテンプレート有。
●縦の最小は202px。（あとはテキスト次第で伸びる）
●【ブランド】でLayout検索すると出てきます。
●参考にするなら…　(070821)タオル美術館、(080401)EMAKIエマキ

タカシマヤ京都スタイル

●京都スタイルのアーティクルは、166pxが最低ライン。テキスト文字数が増えれば、あとは成り行きに任せて。

ランキング画像

定例更新時にランキングの更新が頻繁にあります。デザイナーは画像のみを用意して、当該する本アップ日のフォルダにJPG画像を置くこと。

コスメBPランキング（5位まで）

●サイズ…60x60【枠含む★c2c2c2】
●ファイル名(例)…photo_51818.jpg

いちおしスウィーツ（3位まで）

●サイズ…85x65【枠なし】
●ファイル名(例)…img_ranking01.jpg、img_ranking02.jpg

ギフト（5位まで）

●サイズ…60x60【枠なし】
●ファイル名(例)…img_product_234825.jpg

オンラインバール（各1位のみ）

●サイズ…48x48【枠なし】
●ファイル名(例)…item_ranking_wine_36928.jpg

出産祝の贈りもの（5位まで）

●サイズ…61x61【枠なし】
●ファイル名(例)…img_rank01.jpg、img_rank02.jpg

ロゴ

●「マル高(takashimaya)」ロゴ…【RGB色】#FF0000。
●「TAKASHIMAYA ONLINE SHOPPING」ロゴ…【RGB色】#CA0000。このロゴは光画では制作したものではありません。

横幅サイズ指定

横幅:750px
●【メインエリア548px】21px【共通エリア・フリーエリア181px】

メインエリア:548px
●2列の場合、【268px】12px【268px】
●3列の場合、【176px】10px【176px】10px【176px】
とする。

パン屑

ショッピングの第2階層である「大カテ」名から記述。
テキスト表示で12px、#333333を想定。当該ページはBOLD表示。

商品画像・イメージサイズ

基本的に、商品画像には枠を含めない。

●特集：100×100px
●アイテムピックアップ：58×58px
●関連リンク：48×48px

●商品スペック記述
「ブランド名」と「商品名」をテキストリンク#0000EEにする。

・ブランド名は[○○○○]とし、10px/14px。半角の[]を使用で全て統一。
・商品名は12px/16px
・金額にはリンクを貼らない。金額部分は#333333のテキスト。場合によってはBold。

総合TOP

・2007年08月31日(金)：「ピンクの薔薇」右「赤い薔薇」に変更。
・2008年03月01日(土)：「赤い薔薇」→「ピンクの薔薇」に変更。

主要バナー

●『TOP Flash』プロモバナー：566×172（枠は含まない）
shopping/flashdata/banner/bnr_flash_070419_mothersday.jpg

●『TOP Flash』右メニュー(4個)：181×36
shopping/flashdata/banner/title/ttl_070419_mothersday.jpg
shopping/flashdata/banner/title/ttl_070419_mothersday_on.jpg

●『右側共通エリア』バナー：161×55（1pxの枠含む。#c2c2c2）
shopping/top/img/banner/img_banner_070419_shinjuku.gif

●『大カテ』プロモバナー(左)：272×177（1pxの枠含む。#c2c2c2）
shopping/[大カテ]/img/top/main_bnr_m070419_swarovski.jpg

●『大カテ』プロモバナー(小)：272×87（1pxの枠含む。#c2c2c2）
shopping/[大カテ]/img/top/main_bnr_s070419_maternity.jpg

●『タカシマヤ特集ページ』バナー：200×75（1pxの枠含む。#c2c2c2）
shopping/special/img/bnr_right_070419_lucky.jpg

●『各店』おすすめバナー：120×42（1pxの枠含む。#c2c2c2）
store/banner/e_070426_01.jpg

●『各店』主要5店舗：142×50（1pxの枠含む。#c2c2c2）
store/shopping/banner/onlineShop_banner_070419_01.gif

「https://wiki.kohga.tokyo/index.php?title=タカシマヤのデザインガイドライン&oldid=2627」から取得