スマートフォンサイトをデザインã™ã‚‹ä¸Šã§çŸ¥ã£ã¦ãŠãã¹ã10ã®TIPS
スマートフォンサイトをデザインã™ã‚‹ä¸Šã§çŸ¥ã£ã¦ãŠãã¹ã10ã®TIPS iPhoneã‚„Androidã®ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³ã®ä»•æ§˜ã‚’知らãªã„ã‘ã©ãƒ‡ã‚¶ã‚¤ãƒ³ã—ãªãã¡ã‚ƒã„ã‘ãªããªã£ãŸã¨ã„ã†ãƒ‡ã‚¶ã‚¤ãƒŠãƒ¼ã•ã‚“ã«çŸ¥ã£ã¦ãŠã„ã¦ã‚‚らã„ãŸã„10(+1)ã®TIPSã§ã™ã€‚ 1.実機ã§ç¢ºèªã™ã‚‹ 当ãŸã‚Šå‰ã®ã“ã¨ã§ã™ãŒä½œæˆã—ãŸãƒ‡ã‚¶ã‚¤ãƒ³ã‚’実機ã§ç¢ºèªã—ã¦ä¸‹ã•ã„。スマートフォンã¨PCã§ã¯ç›®ã‹ã‚‰ã®è·é›¢ã‚„DPIãŒé•ã„ã¾ã™ã®ã§ã€PCã§ã¯å分ã«è¦‹ã‚ŒãŸã‹ã‚‰ã¨ã„ã£ã¦å®Ÿæ©Ÿã§ç¢ºèªã™ã‚‹ã¨æ–‡å—ãŒå°ã•ã™ãŽã‚‹ã“ã¨ãªã©ãŒã‚ˆãã‚ã‚Šã¾ã™ã€‚書ãã ã—ãŸJPGã‚’FTPã§ã‚¢ãƒƒãƒ—ã—ã¦ç¢ºèªã—ã¦ã‚‚ã„ã„ã§ã™ã—ã€ãƒ¡ãƒ¼ãƒ«ã§ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³ã«é€ã£ã¦ç¢ºèªã—ã¦ã‚‚ã„ã„ã§ã™ã€‚個人的ã«ã¯Dropboxã§è»¢é€ã™ã‚‹ã®ãŒæ‰‹è»½ã§ãŠã™ã™ã‚ã§ã™ã€‚ 2.横幅ã¯320pxã‚‚ã—ãã¯640pxã§ãƒ‡ã‚¶ã‚¤ãƒ³ã™ã‚‹ スマートフォンã§ã¯åŸºæœ¬æ¨ªå¹…ãŒ320pxã§è¡¨ç¤ºã•ã‚Œã‚‹ã®ã§ãƒ‡ã‚¶ã‚¤ãƒ³ã™ã‚‹éš›ã‚‚320pxã§ãƒ‡ã‚¶ã‚¤ãƒ³ã—ã¾ã—ょã†ã€‚ãŸã ã€Re
ã€ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å‘ã‘】新è¦ã§ã‚µã‚¤ãƒˆã‚’作るã®ã«ä½¿ãˆãã†ãªã®ä¸€å¼ã€‚ - CSS HappyLife
å‰å›žã®æ›´æ–°æ—¥ãŒè¦‹ãŸããªã„程ã«æ™‚ãŒæµã‚Œã¦ã„る今日ã“ã®é ƒãƒ»ãƒ»ãƒ»ã€‚ ブãƒã‚°ã‚’æ›´æ–°ã™ã‚‹ãƒ¢ãƒãƒ™ãƒ¼ã‚·ãƒ§ãƒ³ãŒä¸ã€…上ãŒã‚‰ãªã‹ã£ãŸã‚“ã§ã™ãŒã€ã¾ã ã€ã らã らã§ã‚‚良ã„ã‹ã‚‰æ›¸ã„ã¦ã„ããŸã„ãªã¨è¨€ã†æ°—æŒã¡ã¯æœ‰ã‚‹ã‚“ã§ã™ã€‚ãˆã‡ã€‚ ã“ã‚“ã ã‘æ›´æ–°ãŒæ»žã£ã¦ã¦ã‚‚ã€Twitterã¨ã‹ã§æ™‚々ブãƒã‚°èªã‚“ã§ã¾ã™ã£ã¦è¨€ã£ã¦ã‚‚らãˆãŸã‚Šã€æœ€è¿‘ãªã‚‰ã€Œä»Šæ—¥ã‹ã‚‰ã§ãる定時ã§ä¸ŠãŒã‚‹ãŸã‚ã®WEB制作効率アップ術 | カッシーã®WEBる。ã€ã§ã€ã€HTML5】新è¦ã§ã‚µã‚¤ãƒˆã‚’作るã®ã«ä½¿ãˆãã†ãªã®ä¸€å¼ã€‚Ver 1 を紹介ã—ã¦ã‚‚らã£ãŸã‚Šã—ã¦ã†ã‚Œã—ã„åŠé¢ã€æ›´æ–°ã—ã¦ç„¡ã„ãªãƒ¼ã¨ã€ä½•ã¨ã‚‚言ãˆãªã„æ°—æŒã¡ã«ãªã£ãŸã‚Šã€‚ ãªã®ã§ã€ã“ã‚Œã‹ã‚‰ã¯ã¡ã‚‡ã‚ã£ã¨ã§ã‚‚ãƒã‚¿ãŒæœ‰ã‚Œã°æ›´æ–°ã—ã¦ã„ããŸã„ãªãƒ¼ã¨ã€‚ 何をモãƒãƒ™ãƒ¼ã‚·ãƒ§ãƒ³ã«æ›´æ–°ã™ã‚‹ã‹ã¯ã¾ã 見ã¤ã‹ã£ã¦ãªã„ã‘ã©ï¼žï¼œ ã•ã¦ã€ãã‚“ãªè¨³ã§ã€ä»Šå›žã¯ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å‘ã‘ã®æ–°è¦ã§ã‚µã‚¤ãƒˆã‚’作るã®ã«ä½¿ãˆãã†ãªæ„Ÿã˜ã®ä¸€å¼ã§ã™ã€‚ ã€ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å‘ã‘】新è¦ã§ã‚µã‚¤ãƒˆã‚’
fladdict » スマホã®UI考 〜 ボタンã«ã¤ã„ã¦
SuperPopCamã¨ã‹ä½œã£ãŸã¨ãã«ã€ä½“系的ãªè³‡æ–™æ¬²ã—ã„ãªãーã¨ã‹æ€ã£ã¦ãŸã“ã¨ã®ã¾ã¨ã‚。 色々ã¨è‡ªåˆ†ã®ä¸ã®è€ƒãˆã‚’ã¾ã¨ã‚ã‚‹ãŸã‚ã®ãƒ¡ãƒ¢ã€‚世ã®ä¸ã®ã‚¢ãƒ—リã¯æ©Ÿèƒ½ã‚’åŠåˆ†ã«ã—ã¦ã€æ¸›ã£ãŸäºˆç®—分をUIã®ç·´ã‚Šè¾¼ã¿ã«ã¤ãŽè¾¼ã‚“ã æ–¹ãŒçµ¶å¯¾ã‚ˆã„アプリã«ãªã‚‹ã¨æ€ã†ã€‚ 書ã„ã¦ã‚‹ä½œæ¥ãŒä¸€ç•ªè€ƒãˆã¾ã¨ã¾ã‚‹ã®ã§ã€ã¡ã‚‡ã¼ã¡ã‚‡ã¼ã‚ã’ã¦ã„ã“ã†ã‹ã¨ã€ã¾ãšã¯ãƒœã‚¿ãƒ³ã‹ã‚‰ã€‚ 指ã®å¤§ãã•ã®åˆ¶ç´„ã‚’å—ã‘ã‚‹ ・Webã¨ã‚¹ãƒžãƒ›ã‚’比較ã—ãŸå ´åˆã€æœ€å¤§ã®é•ã„。 ・ピクセルå˜ä½ã§ã‚¯ãƒªãƒƒã‚¯ä½ç½®ã‚’制御ã§ãるマウスãƒã‚¤ãƒ³ã‚¿ã¨é•ã„ã€æŒ‡ã¯å¤§é›‘把ã«ã—ã‹ã‚¿ãƒƒãƒ—ä½ç½®ã‚’指定ã§ããªã„。 ・ã“ã®ãŸã‚Appleã¯ãƒœã‚¿ãƒ³ã®æœ€å°ã‚µã‚¤ã‚ºã¨ã—ã¦44pxã¨ã„ã†ã‚¬ã‚¤ãƒ‰ãƒ©ã‚¤ãƒ³ã‚’作ã£ã¦ã„る。 ・視覚的ã«44px以下ã®ãƒœã‚¿ãƒ³ã‚‚実際ã®ãƒ’ットエリアã¯å¤§ãã‚ã«ã™ã‚‹ã€‚ ・ã¾ãŸã“ã‚Œã«ç•™ã¾ã‚‰ãšã€ãƒœã‚¿ãƒ³ã¨ãƒœã‚¿ãƒ³ã®é–“ã®ãƒžãƒ¼ã‚¸ãƒ³ã¯ç©ºã‘られるã ã‘空ã‘ãŸæ–¹ãŒå®‰å…¨ã€‚ ・ã¤ã¾ã‚‹ã¨ã“ã‚「カッãƒãƒªã€ã¤ã‚ãŸãƒœã‚¿ãƒ³ãƒ¬ã‚¤ã‚¢ã‚¦ãƒˆã®ã‚°ãƒ©
スマートフォン用ページã«æŒ¯ã‚Šåˆ†ã‘ã‚‹ã¨ãã¯rel=â€canonicalâ€ã‚’è¨å®šã™ã‚‹
iPhoneã‚„iPadã€Android端末ã®æ™®åŠã§ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å°‚用ã®ãƒšãƒ¼ã‚¸ã‚’用æ„ã™ã‚‹ã‚µã‚¤ãƒˆã‚‚増ãˆã¦ãã¦ã„ã¾ã™ã€‚ スマートフォンã‹ã‚‰ã®ã‚¢ã‚¯ã‚»ã‚¹ã«å¯¾ã—ã¦ã€Œãƒªãƒ€ã‚¤ãƒ¬ã‚¯ãƒˆã«ã‚ˆã£ã¦ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å°‚用ã®URLã«æŒ¯ã‚Šåˆ†ã‘ã‚‹ã¨ãã€ã®æ³¨æ„点を今日ã¯ãŠä¼ãˆã—ã¾ã™ã€‚ rel=â€canonicalâ€ã‚¿ã‚°ã§ã€å¯¾å¿œã™ã‚‹ãƒ‡ã‚¹ã‚¯ãƒˆãƒƒãƒ—用ページã®URLを指定ã—ã¦ãã ã•ã„。 é‡è¤‡ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã®ç™ºç”Ÿã‚’防æ¢ã™ã‚‹ãŸã‚ã§ã™ã€‚ ç¾çŠ¶Googleã¯ãƒ‡ã‚¹ã‚¯ãƒˆãƒƒãƒ—PCã¨ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³ã‚’区別ã›ãšåŒç‰ã«æ‰±ã„ã¾ã™ã€‚ スマートフォン用ã®æ¤œç´¢çµæžœã‚‚用æ„ã—ã¦ã„ã¾ã›ã‚“。 å…±ã«ã€ã‚¦ã‚§ãƒ–クãƒãƒ¼ãƒ©ã®GooglebotãŒã‚¯ãƒãƒ¼ãƒªãƒ³ã‚°ã—ã¾ã™ã€‚ ※従æ¥ã®ãƒ¢ãƒã‚¤ãƒ«ç«¯æœ«ã¯ãƒ¢ãƒã‚¤ãƒ«ã‚¯ãƒãƒ¼ãƒ©ã®Googlebot-MobileãŒã‚¯ãƒãƒ¼ãƒªãƒ³ã‚°ã—ã¾ã™ã€‚詳ã—ãã¯ã“ã¡ã‚‰ã®è¨˜äº‹ã‚’å‚照。 スマートフォン用ã®ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã¯ãƒ‡ã‚¹ã‚¯ãƒˆãƒƒãƒ—用ã®ãƒšãƒ¼ã‚¸ã¨ã€å®Œå…¨ã§ã¯ãªã„ã«ã—ã¦ã‚‚ã»ã¼åŒã˜ã«ãªã‚‹ã¯ãšã§ã™ã€‚
1時間ã§æºå¸¯ã‚µã‚¤ãƒˆã‚’スマートフォン対応ã«ã™ã‚‹æ–¹æ³• | GREE Engineering
åˆã‚ã¦ã®æŠ•ç¨¿ã¨ãªã‚Šã¾ã™ã€‚エンジニアã®matsuã§ã™ã€‚ æºå¸¯å‘ã‘ウェブサイトを1時間ã§ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å¯¾å¿œã™ã‚‹æ–¹æ³•ã‚’紹介ã—ã¾ã™ã€‚ æ¦‚è¦ 2011å¹´4月7æ—¥ã®ãƒ‹ãƒ¥ãƒ¼ã‚¹ã«ã¦æºå¸¯é›»è©±ã®æ–°è¦å¥‘ç´„æ•°ã®ã†ã¡ã€ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³ãŒå ã‚る割åˆãŒ50%を越ãˆã€ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³ãŒæœ¬æ ¼çš„ã«æ™®åŠã™ã‚‹å…†ã—ãŒè¦‹ãˆã¦ãã¾ã—ãŸã€‚ ç¾åœ¨ã€ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å‘ã‘サイトを新è¦æ§‹ç¯‰ã™ã‚‹ãŸã‚ã®ãƒãƒ¥ãƒ¼ãƒˆãƒªã‚¢ãƒ«ã¯æ•°å¤šã出ã¦ã„ã¾ã™ãŒã€æ—¢å˜ã®æºå¸¯ã‚µã‚¤ãƒˆã‚’スマートフォンã«æœ€é©åŒ–ã™ã‚‹æ–¹æ³•ãŒã‚ã¾ã‚Šç´¹ä»‹ã•ã‚Œã¦ã„ãªã„ã®ã§ã“ã®è¨˜äº‹ã§ç´¹ä»‹ã—ãŸã„ã¨æ€ã„ã¾ã™ã€‚ ã“ã®ãƒãƒ¥ãƒ¼ãƒˆãƒªã‚¢ãƒ«ã‚’è¡Œã†ã¨ä»¥ä¸‹ã®ã‚ˆã†ã«ãªã‚Šã¾ã™ã€‚ 実装 全部ã§8ステップã‚ã‚Šã¾ã™ã€‚ ã“ã®ãƒãƒ¥ãƒ¼ãƒˆãƒªã‚¢ãƒ«ã§ã¯ãƒ–ãƒã‚°ã®ãƒˆãƒƒãƒ—ページを例ã«ã¨ã£ã¦èª¬æ˜Žã—ã¾ã™ã€‚ å‰åŠã§ã¯æ–‡å—コードã®å¤‰æ›´ã€HTMLã®å¤‰æ›´ã¨ã„ã£ãŸæ§‹é€ を変更ã—ã¾ã™ã€‚後åŠã§ã¯çµµæ–‡å—ã‚„æ–‡å—スタイルを行ã„ã€ä»•ä¸Šã’ã¨ã—ã¦HTML5ã®ãƒãƒªãƒ‡ãƒ¼ã‚·ãƒ§ãƒ³ã‚’è¡Œã£ã¦ã„ãã¾ã™ã€‚最åˆ
Webサイトã®ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å¯¾å¿œ 7ã¤ã®åŸºæœ¬ãƒ«ãƒ¼ãƒ« | Web担当者Forum
個人利用をä¸å¿ƒã«æ€¥ä¼¸ã‚’続ã‘ã‚‹ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å¸‚å ´ã¯ã€ã‚‚ã¯ã‚„ニッãƒå¸‚å ´ã§ã¯ãªããªã‚Šã¤ã¤ã‚る。éŽåŽ»ã«ä¼æ¥ã‚µã‚¤ãƒˆã®æºå¸¯é›»è©±ï¼ˆãƒ•ã‚£ãƒ¼ãƒãƒ£ãƒ¼ãƒ•ã‚©ãƒ³ï¼‰å¯¾å¿œãŒå•ã‚ã‚ŒãŸã‚ˆã†ã«ã€ä»Šå¾Œã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å‘ã‘ã®ã‚µã‚¤ãƒˆå¯¾å¿œãŒèª²é¡Œã«ãªã‚‹ã¨è€ƒãˆã‚‰ã‚Œã‚‹ã€‚2010å¹´ã¯ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å…ƒå¹´ã¨ã„ã‚ã‚Œã¦ã„ãŸãŒã€2011å¹´ã¯ä¼æ¥ã®ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³ã‚µã‚¤ãƒˆã¸ã®æŠ•è³‡æ¤œè¨ŽãŒæœ¬æ ¼åŒ–ã—ã¦ãã‚‹ã ã‚ã†ã€‚ 2010å¹´ã€ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³ã®å¸‚å ´è¦æ¨¡ã¯æ€¥æˆé•·ã—ã€ã€Žã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³åˆ©ç”¨å‹•å‘èª¿æŸ»å ±å‘Šæ›¸2011ã€ï¼ˆMCPC監修ã€ã‚¤ãƒ³ãƒ—レスR&D発行）ã«ã‚ˆã‚‹ã¨ã€2011å¹´3月末（2010年度）ã®å¥‘ç´„æ•°ã¯ã€å‰å¹´ã®497万契約ã‹ã‚‰63％増ã®810万契約ã¨ãªã‚‹è¦‹é€šã—ã 。調査ã«ã‚ˆã‚‹ã¨ã€å¥‘ç´„æ•°ã¯å¹´å¹³å‡40％以上ã§æ‹¡å¤§ã‚’続ã‘ã€2015年度ã«ã¯4,712万契約ã«ã€ã‚³ãƒ³ãƒ†ãƒ³ãƒ„é…信事æ¥ã‚‚急æˆé•·ã™ã‚‹ã“ã¨ãŒäºˆæ¸¬ã•ã‚Œã¦ã„る。ã“ã†ã—ãŸèª¿æŸ»ã‹ã‚‰ã‚‚ã€ä»Šã‹ã‚‰ã‚µã‚¤ãƒˆã‚’スマートフォンã«å¯¾å¿œã—ã¦ãŠãã“ã¨ãŒæ±ºã—ã¦
1
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
Smart Phone/Mobile Phone Accessory｜radius
スマートフォンブラウザä¸å…·åˆç‰¹é›†
{{#tags}}- {{label}}
{{/tags}}