COPYRIGHT 2013 CYBRiDGE CORPORATION
COPYRIGHT 2013 CYBRiDGE CORPORATION 2
TEL [] COPYRIGHT 2013 CYBRiDGE CORPORATION 3
2013 1 OS Microsoft Windows XP/Vista/7/8 Macintosh OS X ios 5.0 iphone ipad ipod touch ios 4.x Android 2.3 1.6 2.2 Windows Internet Explorer 7 Firefox Chrome Opera Opera 11.x Macintosh Safari 5.x Firefox Chrome ios Safari Android IE6 Safari 4.x Firefox 3.x Opera Mini Opera Mobile OS IE 1024 768px 320 480px iphone4s640 960px iphone5 640px 1136px Retina 16bit & COPYRIGHT 2013 CYBRiDGE CORPORATION 4
css/ js/ img/ htc/ font/ media/ docs/ index.html company xxx csscss common.css CSS& CSS OOCSS style.css xxx.css home.css JavaScript script.js JS(jQuery) common home index.html xxx bnr HTC Web html index.html html index.html xxx.html content/ Ajax HTML j COPYRIGHT 2013 CYBRiDGE CORPORATION 5
HTML XHTML 1.0 Strict XHTML 1.0 Transitional HTML5 HTML5.html.htm SSI.html /img HTMLGIF JPEG.gif.jpg.png.ico CSS /css HTML CSS.css JavaScript /js HTML JavaScript.js COPYRIGHT 2013 CYBRiDGE CORPORATION 6
HTC HTML Component /htc IEHTC.htcPHP HTML/Dynamic HTML/JavaScriptHTC HTML Component HTML HTC/ Web /font Web.eot.svg.ttf.woff /media.swf.mp3 /doc.doc.xls.pdfd l df COPYRIGHT 2013 CYBRiDGE CORPORATION 7
(1 ) (1 ) 31 _ () ) -2 2 sn_contact_price.gif sn contact--price.gif photo_01.gif photo-01.gif Windows COPYRIGHT 2013 CYBRiDGE CORPORATION 8
31 2 case_home.html 1 () 1 COPYRIGHT 2013 CYBRiDGE CORPORATION 9
COPYRIGHT 2013 CYBRiDGE CORPORATION 10
b m p n mn COPYRIGHT 2013 CYBRiDGE CORPORATION 11
項 目 説 明 項 目 説 明 company 会 社 企 業 guide はじめての 方 ガイドライン ご 案 内 corporate 法 人 の 企 業 の business 事 業 内 容 about とは? feature 特 徴 特 長 特 色 特 性 register it 会 員 登 録 specialty ilt 専 門 特 殊 性 特 徴 特 色 contact お 問 い 合 わせ results 実 績 業 績 terms 利 用 規 約 works 作 品 privacy プライバシーポリシー cases 事 例 実 例 philosophy 理 念 member 会 員 構 成 員 メンバー legal 特 定 商 取 引 法 に 関 する 表 示 access 交 通 アクセス recruit 採 用 情 報 map 地 図 案 内 図 fresh 新 卒 採 用 career 中 途 採 用 faq reservation FAQ よくある 質 問 予 約 news ニュース 最 新 情 報 policy 方 針 info お 知 らせ sitemap サイトマップ history 沿 革 歴 史 introduce 紹 介 greeting, message 挨 拶 flow 流 れ 順 序 profile プロフィール 経 歴 略 歴 rule ルール 規 則 規 定 規 約 http://blog.btmup.com/web-general/contents-directory-file-name-list.html COPYRIGHT 2013 CYBRiDGE CORPORATION 12
項 目 説 明 項 目 説 明 logo ロゴ 画 像 で 使 用 例 :logo.gif logo_footer.gif side_ サイドナビゲーション 画 像 で 使 用 例 :side_xxx.gif if keyv_ キービジュアル 画 像 で 使 用 例 :keyv_xxx.gif icon_ アイコン 画 像 で 使 用 例 :icon_xxx.gif btn_ ボタン 画 像 で 使 用 _on 例 :btn_xxx.gif マウスオーバー 画 像 で 使 用 (ただし 原 則 1 枚 の 画 像 を 使 用 し CSSでポジション 指 定 してマウスオーバー させる 例 外 の 時 に 使 用 ) 例 :btn_xxx_on.gif title_ タイトル 画 像 で 使 用 bg_ 背 景 画 像 で 使 用 例 :bg_xxx.jpg line_ 罫 線 画 像 で 使 用 例 :line_xxx.jpg pht_ 写 真 画 像 で 使 用 例 :pht_xxx.jpg pic_ イラスト 画 像 で 使 用 例 :pic_xxx.gif h_ 見 出 し 画 像 で 使 用 例 :h_xxx.gif tt txt_ テキスト 画 像 で 使 用 例 :txt_xxx.gif bnr_ バナー 画 像 で 使 用 例 :bnr_xxx.gif 例 :title_xxx.gif 1 CSS Sprite COPYRIGHT 2013 CYBRiDGE CORPORATION 13
HTML > alt= Macintosh COPYRIGHT 2013 CYBRiDGE CORPORATION 14
COPYRIGHT 2013 CYBRiDGE CORPORATION 15
COPYRIGHT 2013 CYBRiDGE CORPORATION 16
HTMLMETA <meta> HTML CSS JavaScript LF (Unix) Unicode Unicode Unicode UTF-8 C Unicode BOM BOMByte Order Mark16Unicode UTF-8BOMUnicode UTF-8 BOM BOM [Unicode] COPYRIGHT 2013 CYBRiDGE CORPORATION 17
CI GIF JPEG PNG PNG PNG-8 PNG-24 PNG-32 3 PNG-24 PNG-32.png PNG-8 8256 IE6 GIF PNG-24 24 PNG-32 248 JS IE7 PhotoshopPNG-24PNG-32 GIF.gif PNGGIF Photoshop Fireworks JPEG JPEG.jpg COPYRIGHT 2013 CYBRiDGE CORPORATION 18
JavaScript jquery jquery JavaScript 1.6 jquery 1.8.3 JavaScript</body> JavaScript ファイル 名 内 容 格 納 フォルダ common.js jquery /js/ var 22 var counttime; JavaScript COPYRIGHT 2013 CYBRiDGE CORPORATION 19
jquery CDNGoogle min jquery1 <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/#version#/jquery.min.js"></script> script.js script.js COPYRIGHT 2013 CYBRiDGE CORPORATION 20
WebSEO HTML CSSJavaScript J S i W3C HTML HTTP CSS JavaScriptHTML CSS@import head CSS JS COPYRIGHT 2013 CYBRiDGE CORPORATION 21
Retina --http://www.jpegmini.com/ --http://www.punypng.com/ --http://www.gigafree.net/tool/graphiccomp/caesium.html JPEG GIF PNGGIF PNG8 Smush.it http://www.smushit.com/ysmush.it/ 8bit-PNG Smush.it JavaScript CSS OOCSS(Object-Oriented CSS) classoocss(object-oriented CSS) CSS3 COPYRIGHT 2013 CYBRiDGE CORPORATION 22
* PC#FFFFFF #FFF 6 table table-layout:fixed t l t CSS CSS Optimize CSS http://css.webcreativepark.net/csstidy/ CSS margin:0px margin:0 color:#ffffff color:#fff font:1.0em font:1em padding:5px 10px 5px 10px margin:5px 10px CSS Sprite 1CSS 1HTTP COPYRIGHT 2013 CYBRiDGE CORPORATION 23