ウェブåˆå¿ƒè€…も安心ã—ã¦ä½œæˆã§ãã‚‹ã€ç„¡æ–™HTMLãƒ†ãƒ³ãƒ—ãƒ¬ãƒ¼ãƒˆç´ æ24個ã¾ã¨ã‚ - PhotoshopVIP
『フォトショップ・ブイアイピーã€ã®æ–°ç€è¨˜äº‹ã§ã™ã€‚フォトショップやデザインをãŸã®ã—むウェブサイト。2009年３月創刊以æ¥ã€3800を超ãˆã‚‹ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã‚’æ›´æ–°ã—ã¦ã„ã¾ã™ã€‚フリーフォントãªã©ã®ç„¡æ–™ãƒ‡ã‚¶ã‚¤ãƒ³ç´ æï¼é…色やWeb制作ã¨ã„ã£ãŸæœ€æ–°ãƒˆãƒ¬ãƒ³ãƒ‰ã‚‚公開ä¸ã€‚
ã€Webデザイナー必èªã€‘Photoshopã‚„HTMLãªã©ã®ã‚¹ã‚ルを劇的ã«ä¸Šã’られる記事ã¾ã¨ã‚30é¸
Webデザイナーã¨ã—ã¦ã®ã‚ャリアをæ©ã¿å§‹ã‚1年目。基本的ãªã‚¹ã‚ルをå¦ã³ã€æ¥å‹™ã‚’ã²ã¨é€šã‚Šã“ãªã›ã‚‹ã‚ˆã†ã«ãªã£ãŸã‚‚ã®ã®ã€å…ˆè¼©ãƒ‡ã‚¶ã‚¤ãƒŠãƒ¼ã¨æ¯”ã¹ã‚‹ã¨ã€å·®ã‚’æ„Ÿã˜ã¦ã—ã¾ã†ã¨ã„ã†æ–¹ã‚‚ã„ã‚‹ã®ã§ã¯ãªã„ã§ã—ょã†ã‹ï¼Ÿ Webデザイナーã¯ã‚¯ãƒªã‚¨ã‚¤ã‚¿ãƒ¼ç³»ã®è·ç¨®ã§ã‚ã‚‹ãŸã‚ã€ã€Œã‚»ãƒ³ã‚¹ã€ãŒé‡è¦è¦–ã•ã‚Œã‚‹ã‚·ãƒ¼ãƒ³ãŒå¤šã„ã§ã™ã€‚ã—ã‹ã—ã€â€œå¦ã³â€ã«ã‚ˆã£ã¦ã‚¹ã‚ルアップã§ãã‚‹ã®ã‚‚ã¾ãŸäº‹å®Ÿã€‚ã‚€ã—ã‚ã€ãƒ†ã‚¯ãƒŽãƒã‚¸ãƒ¼ã®ç™ºå±•ãŒè‘—ã—ã„æ¥ç•Œã¨ã„ã†ã“ã¨ã‹ã‚‰ã€ãƒ—ãƒã¨ã—ã¦ä»•äº‹ã‚’続ã‘ã‚‹ã®ã§ã‚ã‚Œã°å¦ã³ç¶šã‘ãªã‘ã‚Œã°ãªã‚‰ãªã„ã®ã¯å®¿å‘½ã‹ã‚‚ã—ã‚Œã¾ã›ã‚“。 ãã“ã§ã€ä»Šå›žã¯ã€ŒPhotoshopを使ã£ãŸãƒ‡ã‚¶ã‚¤ãƒ³ã€ã‚„「HTMLãªã©ã®è¨€èªžã‚’使ã£ãŸã‚³ãƒ¼ãƒ‡ã‚£ãƒ³ã‚°ã€ã€ã€ŒWebデザイナーã¨ã—ã¦ã‚¤ãƒ³ãƒ—ットã—ã¦ãŠããŸã„æƒ…å ±ã€ã«é–¢ã™ã‚‹30記事をã”紹介ã—ã¾ã™ã€‚ Photoshopãªã©ã€ãƒ‡ã‚¶ã‚¤ãƒ³ã«é–¢ã™ã‚‹è¨˜äº‹10é¸1.良ã„デザインã£ã¦ï¼ŸæŠ€è¡“ã‚’å¦ã¶å‰ã«çŸ¥ã£ã¦ãŠããŸã„デザイン・レイアウトã®åŸºæœ¬çš„ãªã“㨠ã“
デザイン変更ã¯æŠœæœ¬çš„ã«ã‚„ã‚‹ã¹ãã‹ã€ãã‚Œã¨ã‚‚ã€å°‘ã—ãšã¤ã‚„ã‚‹ã¹ãã‹
å¤ã„ã‚‚ã®ã‚’æ¨ã¦ã€æ–°ã—ã„ã‚‚ã®ã‚’å–り入れるå‰ã«ã€ãã†ã™ã‚‹ã“ã¨ãŒãƒ¦ãƒ¼ã‚¶ãƒ¼ã®ç›®æ¨™é”æˆã®ãŸã‚ã«å¿…è¦ã ã¨ã„ã†ç¢ºå®Ÿãªè¨¼æ‹ ãŒã‚ã‚‹ã“ã¨ã‚’確ã‹ã‚よã†ã€‚ Radical Redesign or Incremental Change? by Hoa Loranger on February 8, 2015 日本語版2015å¹´3月9日公開 ユーザーエクスペリエンスã«é–¢ã‚る最大ã®å•é¡Œã¯ã€ãƒ¡ã‚¬ãƒ¡ãƒ‹ãƒ¥ãƒ¼ã‚’利用ã™ã‚‹ã®ã‹ã€ã‚ã‚‹ã„ã¯ä»–ã®ã‚¿ã‚¤ãƒ—ã®ãƒŠãƒ“ゲーションメニューを利用ã™ã‚‹ã®ã‹ã¨ã„ã£ãŸã‚ˆã†ãªå€‹åˆ¥ã®ãƒ‡ã‚¶ã‚¤ãƒ³èª²é¡Œã®ã“ã¨ã§ã¯ãªã„。求ã‚られã¦ã„ã‚‹ã®ã¯ã€ã‚‚ã£ã¨è¦–野を広ã’ã¦ã€UXã«é–¢ã—ã¦æœ€å„ªå…ˆã™ã¹ã戦略をã¾ãšæ±ºã‚ã‚‹ã“ã¨ã§ã‚る。ã™ãªã‚ã¡ã€å¤§æ”¹é©ã‚’目指ã—ã¦ã™ã¹ã¦ã‚’一気ã«å¤‰ãˆã‚‹ã®ã‹ã€ã‚ã‚‹ã„ã¯å°‘ã—ãšã¤å“質をå‘上ã•ã›ã‚‹ã¨ã„ã†ã‚„り方をå–ã‚Šã€ä¸€æ©ãšã¤é€²ã‚“ã§ã„ãã®ã‹ã€ã§ã‚る。 ユーザーエクスペリエンスã¨ã„ã†ã®ã¯å“質ã«é–¢ã‚る分野ãªã®ã§ã€ãƒ‡ã‚¶ã‚¤ãƒ³ã‚’å¾ã€…ã«å¤‰
スマホã§æ°´å¹³åž‚ç›´æ–¹å‘ã¸ã®ã‚¹ãƒ¯ã‚¤ãƒ—ã€ã‚¹ãƒ©ã‚¤ãƒ‰ãŒå¯èƒ½ãªjQueryプラグイン「jQuery slideToucher pluginã€
twitter facebook hatena google pocket スマホã§ç”»åƒã‚„コンテンツをスワイプã•ã›ã¦è¦‹ã›ã‚‰ã‚Œã‚‹ã¨å¤šãã®ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã‚’é·ç§»ã‚‚å°‘ãªãã¦è‰¯ã„ã‹ã‚‚ã—ã‚Œã¾ã›ã‚“。 jQueryプラグインã®slideToucherãªã‚‰æ°´å¹³ã€åž‚ç›´ã®ä¸¡æ–¹å‘ã«ã‚¹ãƒ¯ã‚¤ãƒ—ã•ã›ã‚‰ã‚Œä¾¿åˆ©ã§ã™ã€‚ sponsors 使用方法 Yuripetusko/slideToucher ? GitHubã‹ã‚‰ãƒ•ã‚¡ã‚¤ãƒ«ä¸€å¼ã‚’ダウンãƒãƒ¼ãƒ‰ã€‚ <script type="text/javascript" src="jquery-1.8.3.min.js"></script> <script type="text/javascript" src="slideToucher.js"></script> <script type="text/javascript"> $("document").ready(function(){ $
å¿…ãšè¨å®šã—ãŸã„ï¼Googleアナリティクスを導入ã—ãŸã‚‰æœ€åˆã«è¡Œã†ã¹ã基本è¨å®š
Googleアナリティクスã¯ã€GoogleãŒç„¡æ–™ã§æä¾›ã—ã¦ã„るウェブサイト分æžãƒ„ールã§ã‚ã‚Šã€å¤šãã®ä¼æ¥ã‚„個人ãŒå°Žå…¥ã—ã¦ã„ã¾ã™ã€‚ ã—ã‹ã—ã€Googleアナリティクスã¯ã€ç°¡å˜ã«å°Žå…¥ã§ãã‚‹ã¨ã„ã†ã“ã¨ã‚‚ã‚ã‚Šã€æœ€åˆã«ãƒˆãƒ©ãƒƒã‚ングコードã ã‘è¨ç½®ã—ã¦è¨å®šãªã©ã¯ç‰¹ã«ã—ã¦ã„ãªã„ã€ã¨ãªã£ã¦ã„るサイトも多ã„ã®ã§ã¯ãªã„ã§ã—ょã‹ã€‚ Googleアナリティクスをã†ã¾ã活用ã™ã‚Œã°ã€ä»–ã®æœ‰æ–™ã®åˆ†æžãƒ„ールã«è² ã‘ãªã„ãらã„ã®æ©Ÿèƒ½ã‚’利用ã™ã‚‹ã“ã¨ãŒã§ãã¾ã™ã€‚ 今回ã¯ã€ãƒˆãƒ©ãƒƒã‚ングコードをè¨ç½®ã—ãŸå¾Œã€ä¸€ç•ªæœ€åˆã«è¨å®šã—ã¦ãŠãã¹ã4ã¤ã®åŸºæœ¬è¨å®šã‚’ã”紹介ã—ã¾ã™ã€‚ Googleウェブマスターツールã¨é€£æºã™ã‚‹ サイトã«é–¢ã™ã‚‹æ§˜ã€…ãªæƒ…å ±ã‚’çŸ¥ã‚‹ã“ã¨ãŒã§ãã‚‹Googleウェブマスターツールã§ã™ãŒã€Googleアナリティクスã¨é€£æºã™ã‚‹ã¨éžå¸¸ã«ä¾¿åˆ©ã§ã™ã€‚ ã€Googleウェブマスターツールã«ã¤ã„ã¦ã¯ä¸‹è¨˜å‚照】 ã€ä¿å˜ç‰ˆã€‘Googleウェブマスターツー
æ–°ç€è¨˜äº‹
『フォトショップ・ブイアイピーã€ã®æ–°ç€è¨˜äº‹ã§ã™ã€‚フォトショップやデザインをãŸã®ã—むウェブサイト。2009年３月創刊以æ¥ã€3800を超ãˆã‚‹ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã‚’æ›´æ–°ã—ã¦ã„ã¾ã™ã€‚フリーフォントãªã©ã®ç„¡æ–™ãƒ‡ã‚¶ã‚¤ãƒ³ç´ æï¼é…色やWeb制作ã¨ã„ã£ãŸæœ€æ–°ãƒˆãƒ¬ãƒ³ãƒ‰ã‚‚公開ä¸ã€‚
ã€HTML5・CSS3】ãŠã—ゃれãªãƒ†ãƒ¼ãƒ–ルデザインã®ã‚µãƒ³ãƒ—ルソース5点 | æ ªå¼ä¼šç¤¾LIG(リグ)｜DX支æ´ãƒ»ã‚·ã‚¹ãƒ†ãƒ 開発・Web制作
地味ãªé›¢å³¶ãƒ©ã‚¤ã‚¿ãƒ¼å†…è—¤ã§ã™ã€‚普段ã¯ã‚³ãƒ¼ãƒ€ãƒ¼ã¨ã—ã¦ä»•äº‹ã‚’ã—ã¦ã„ã¾ã™ãŒã€ãŸã¾ã«ã¯ãƒ‡ã‚¶ã‚¤ãƒŠãƒ¼ã•ã‚“ã®ã‚ˆã†ã«äººã®ç›®ã«è§¦ã‚Œã‚‹ä»•äº‹ã‚‚ã—ã¦ã¿ãŸã„ï¼ ãã“ã§æœ¬æ—¥ã¯ã€æ—¥ã€…ã®æ¥å‹™ã§è¦‹ã‹ã‘ã¦ã“ã‚Œã¯ä½¿ãˆã‚‹ãžã¨æ€ã£ãŸtableã‚’ã€ç‹¬è‡ªã«å†æ§‹ç¯‰ã—ã¦ã‚½ãƒ¼ã‚¹ã‚³ãƒ¼ãƒ‰ã‚’公開ã—よã†ã¨æ€ã„ã¾ã™ã€‚ table作æˆæ™‚ã«å‚考ã«ãªã‚‹ã‚µã‚¤ãƒˆ 本題ã«å…¥ã‚‹ã€ãã®å‰ã«ã€‚XPã®å…¬å¼ã‚µãƒãƒ¼ãƒˆã‚‚終了ã—ã€HTML5＋CSS3ã®æ™®åŠãŒé€²ã‚“ã§ã„ã¾ã™ã€‚今更ãªãŒã‚‰ã€ã“ã®æŠ€è¡“ã§ã©ã‚“ãªtableãŒå®Ÿç¾ã§ãã‚‹ã®ã‹ã€ã¨ã¦ã‚‚ã‚ã‹ã‚Šã‚„ã™ã説明ã•ã‚Œã¦ã„ãŸã‚µã‚¤ãƒˆã‚’ã¾ãšã”紹介ã—ã¾ã™ã€‚ tableå°‚é–€å‚考ページ4é¸ tableå°‚é–€ã®å‚考ページを4ã¤ã»ã©é¸ã‚“ã§ã¿ã¾ã—ãŸã€‚ CSS3を使ã£ã¦ç¾Žã—ã装飾ã•ã‚ŒãŸãƒ†ãƒ¼ãƒ–ルã®ä½œã‚Šæ–¹ï½œWebpark CSS3ã§ã®tableã®ä½œã‚Šæ–¹ã‚’ã€è¦‹ãŸç›®ã¨ã‚½ãƒ¼ã‚¹ã‹ã‚‰è§£èª¬ã—ã¦ã‚ã‚Šã¾ã™ã€‚ テーブル｜CSSデザイン｜スタイルシート（CSS）｜PHP & JavaScr
Grid 日本語版
ãªãœã€ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–ã«åŠ´åŠ›ã‚’費やã™ã®ã‹? ç§é”ã¯å…¨ã¦ã®ãƒ‡ãƒã‚¤ã‚¹ã«ãŠã„ã¦ã€ã‚¹ã‚¯ãƒªãƒ¼ãƒ³ã®ã‚µã‚¤ã‚ºã‚„縦横ã®æ–¹å‘ã¨ã„ã£ãŸãƒ¦ãƒ¼ã‚¶ãƒ¼ã®ç’°å¢ƒã«å·¦å³ã•ã‚Œãšã«ã€ã‚¦ã‚§ãƒ–サイトãŒåˆ©ç”¨ã—ã‚„ã™ããªã‚‹ã“ã¨ã‚’目指ã—ã¦ã„ã¾ã™ã€‚ æ–片化ã•ã‚ŒãŸä¸–ç•Œ 2013å¹´ç¾åœ¨ã€æ•°åƒç¨®é¡žã®ãƒ‡ãƒã‚¤ã‚¹ã¨ã‚¹ã‚¯ãƒªãƒ¼ãƒ³ã‚µã‚¤ã‚ºãŒã‚¤ãƒ³ã‚¿ãƒ¼ãƒãƒƒãƒˆã«ã‚¢ã‚¯ã‚»ã‚¹ã—ã¦ã„ã¾ã™ã€‚ãれら全ã¦ã«å¯¾ã—ã¦ã€ãã‚Œãžã‚Œãƒ¬ã‚¤ã‚¢ã‚¦ãƒˆã‚’è¨è¨ˆã™ã‚‹ã®ã¯ã‚‚ã¯ã‚„ä¸å¯èƒ½ã§ã™ã€‚ãã‚“ãªã“ã¨ã‚ˆã‚Šã€ãƒ‡ã‚¶ã‚¤ãƒ³ã«ã‚ˆã‚Šæµå‹•çš„ãªã‚¢ãƒ—ãƒãƒ¼ãƒã‚’å–り入れるã¹ãã§ã—ょã†ã€‚ モãƒã‚¤ãƒ«ãƒ•ã‚¡ãƒ¼ã‚¹ãƒˆ 最近ã«ãªã£ã¦ã€Œãƒ¢ãƒã‚¤ãƒ«ãƒ•ã‚¡ãƒ¼ã‚¹ãƒˆã€ã¨ã„ã†è¨€è‘‰ãŒãã“らã˜ã‚…ã†ã§èžã‹ã‚Œã‚‹ã‚ˆã†ã«ãªã‚Šã¾ã—ãŸã€‚ãã®è¨€è‘‰ã¯ã€ãƒ¢ãƒã‚¤ãƒ«å‘ã‘ã®ã‚¹ã‚¿ã‚¤ãƒ«ã‹ã‚‰å§‹ã‚ã¦ã€å¿…è¦ã¨ã•ã‚Œã‚‹æ™‚ã«å¤§ããªã‚¹ã‚¯ãƒªãƒ¼ãƒ³ã«æœ€é©åŒ–ã—ãŸã‚¹ã‚¿ã‚¤ãƒ«ã‚’é©ç”¨ã™ã‚‹ã¨ã„ã†ã“ã¨ã‚’æ„味ã—ã¾ã™ã€‚言ã„æ›ãˆã‚‹ã¨ã€ä½œæˆã—ãŸãƒ¢ãƒã‚¤ãƒ«å‘ã‘ã®ã‚¹ã‚¿ã‚¤ãƒ«ãŒãƒ‡ãƒ•ã‚©ãƒ«ãƒˆã«ãªã‚Šã€ãれ以é™ã«æ›¸ãæ›ãˆã‚‹å¿…è¦ã¯ãªã„ã¨ã„ã†ã“ã¨ã§ã™ã€‚ãã‚Œã¯
美ã—ã„UIエレメントãŒ100種類以上ï¼æ¬¡ã®ãƒ—ãƒã‚¸ã‚§ã‚¯ãƒˆã«å½¹ç«‹ã¤ã‚¤ãƒ³ã‚¿ãƒ¼ãƒ•ã‚§ã‚¤ã‚¹ç”¨ã®ç´ æ -Flatic UI Kit
æ•°ãŒã™ã”ã„ã ã‘ã§ãªãã€ãã®ã‚¯ã‚ªãƒªãƒ†ã‚£ã‚‚ç´ æ™´ã‚‰ã—ãã€å•†ç”¨ã‚µã‚¤ãƒˆã§ã‚‚ãã®ã¾ã¾ã™ãã«åˆ©ç”¨ã§ãã‚‹UIエレメントãŒæƒã£ãŸPhotoshopã®PSDç´ æを紹介ã—ã¾ã™ã€‚ å˜ã«ä½¿ç”¨ã™ã‚‹ã ã‘ã§ãªãã€ãƒ‡ã‚¶ã‚¤ãƒ³ã®ãƒãƒªã‚¨ãƒ¼ã‚·ãƒ§ãƒ³ã€ã‚¨ãƒ¬ãƒ¡ãƒ³ãƒˆã®å±•é–‹ãªã©ã€å‹‰å¼·ã«ã‚‚役立ã¡ã¾ã™ã€‚
ヘッダã¯ä¸Šéƒ¨å›ºå®šã§ã€ãƒ•ãƒƒã‚¿ã¯æœ€ä¸‹éƒ¨ã«ã™ã‚‹ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆã€ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–ã«ã‚‚å¯¾å¿œï¼ | コリス
ナビゲーションをé…ç½®ã—ãŸãƒ˜ãƒƒãƒ€ã¯ã‚¹ã‚¯ãƒãƒ¼ãƒ«ã—ã¦ã‚‚常ã«ä¸Šéƒ¨ã«å›ºå®šã•ã‚Œã¦ãŠã‚Šã€ãƒ•ãƒƒã‚¿ã¯ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã®é‡ãŒå°‘ãªãã¦ã‚‚最下部ã«é…ç½®ã•ã‚Œã‚‹ãƒšãƒ¼ã‚¸ã‚’実装ã™ã‚‹ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆã‚’紹介ã—ã¾ã™ã€‚ Sticky footer with fixed navbar コンテンツãŒå°‘ãªãã¦ã‚‚フッタã¯æœ€ä¸‹éƒ¨ã«ã€ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–対応ã§ï¼ デモ Bootstrapã«ç´ 晴らã—ã„デモãŒã‚ã£ãŸã®ã§ã€ãã“ã‹ã‚‰ãƒ‡ãƒ¢ã‚’紹介ã—ã¾ã™ã€‚ デモã§ã¯ã€ãƒŠãƒ“ゲーションãŒã‚るヘッダã¯ã‚¹ã‚¯ãƒãƒ¼ãƒ«ã—ã¦ã‚‚常ã«ä¸Šéƒ¨ã«å›ºå®šã•ã‚Œã¦ã„ã¾ã™ã€‚ デモã®ã‚³ãƒ³ãƒ†ãƒ³ãƒ„é‡ãŒå°‘ãªã„ãŸã‚ã€ç‹ã„表示エリアã§ã€‚ デモページ：幅780pxã§è¡¨ç¤º 実装 実装ã¯ãƒ‡ãƒ¢ã‚’å¿…è¦æœ€å°é™ã«ã—ãŸã‚‚ã®ã§ã€ç´¹ä»‹ã—ã¾ã™ã€‚ HTML 上ã‹ã‚‰ãƒŠãƒ“ゲーションã®ã‚るヘッダã€ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã€ãƒ•ãƒƒã‚¿ã®é †ã§ã€ãƒ˜ãƒƒãƒ€ã¨ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã¯divã§å†…包ã—ã€çµ‚ã‚ã‚Šã«ã‚³ãƒ³ãƒ†ãƒ³ãƒ„é‡ãŒå°‘ãªã„時用ã«pushã®divã‚’é…ç½®ã—ã¾ã™ã€‚ <body> <div
ã±ããŸã - ãƒ•ãƒªãƒ¼å†™çœŸç´ æ・無料ダウンãƒãƒ¼ãƒ‰
日本人女性ã®ç¾Žå®¹ãƒ»ç¾Žè‚Œãƒ•ãƒªãƒ¼ç´ æ 日本人女性ã®ç¾Žå®¹ç³»ãƒ•ãƒªãƒ¼ç´ æをリリースï¼ãƒ¢ãƒ‡ãƒ«ã¯ã€ç¾Žå®¹ã‚’ãã£ã‹ã‘ã«éŸ“国ã«ãƒãƒžã‚ŠéŸ“国ã®å¦æ ¡ã«é€šã†å‚らã€ã‚¨ãƒ³ã‚¿ãƒ¡åˆ†é‡Žã§ã‚‚æ´»èºä¸ã®ã€Œyuriaã€ã•ã‚“。é€æ˜Žæ„Ÿã®ã‚ã‚‹ç´ è‚Œã¨å°è±¡çš„ãªç¬‘é¡”ãŒç‰¹å¾´çš„ã§ã™ã€‚ 今回ã¯ã€ç¾Ž...
Websites for Text and Fonts That You’d Better Add to Bookmarks
2015å¹´1月16æ—¥ フォント, 便利ツール ä¹…ã—ã¶ã‚Šã«ãƒ–ックマークã—ã¦ã„るサイトを整ç†ã—ã¾ã—ãŸã€‚ã¨ã„ã†äº‹ã§ãŠæŽƒé™¤å¾Œã®æ’例行事？ç§ãŒãƒ–ックマークã—ã¦ã„るフォント・Webフォント・テã‚スト関連ã®Webサイトをã€ä¸ã®äººã¸æ„Ÿè¬ã®æ°—æŒã¡ã‚‚è¾¼ã‚ã¦ã‚·ã‚§ã‚¢ã—ã¾ã™ï¼ä½•å¹´ã‚‚ãŠä¸–話ã«ãªã£ã¦ã„るサイトã°ã‹ã‚Šã§ã™ãŒã€ã“ã“最近ã¯Webフォント関連ã®ã‚µã‚¤ãƒˆãŒå¢—ãˆã¦ãã¾ã—ãŸã。ã„ã„ãªï¼ã¨æ€ãˆã‚‹ã‚µã‚¤ãƒˆãŒã‚ã‚Œã°å¬‰ã—ã„ã§ã™ã€‚ ↑ç§ãŒ10年以上利用ã—ã¦ã„ã‚‹ä¼šè¨ˆã‚½ãƒ•ãƒˆï¼ ãƒ•ã‚©ãƒ³ãƒˆé–¢é€£ フォントhack.jp フォントhack.jp 日本語ã®ç„¡æ–™ãƒ•ã‚©ãƒ³ãƒˆã®è¡¨ç¤ºç¢ºèªãŒã§ãるサイト。複数ã®ãƒ•ã‚©ãƒ³ãƒˆã‚’表示ã—ã¦æ¯”較ã™ã‚‹ã“ã¨ã‚‚ã§ãã¾ã™ã€‚ dafont dafont 英å—ã®ç„¡æ–™ãƒ•ã‚©ãƒ³ãƒˆã‚’大é‡ã«é›†ã‚ãŸã‚µã‚¤ãƒˆã€‚大é‡ã™ãŽã¦çœºã‚ã¦ãŸã‚‰ã„ã¤ã‚‚物凄ã時間ãŒãŸã£ã¦ã¾ã™w ライセンスã¯å„自è¦ç¢ºèªã€‚ フォントガレージ フォントガレージ 日本語フォントã®è²©å£²ã‚µã‚¤
ã“ã‚ŒãŒã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å‘ã‘サイトを作るã¨ãã® viewport è¨å®šï¼“パターンã
スマートフォンå‘ã‘ã® Web サイトを作るã¨ãã€viewport ã®è¨å®šæ¬¡ç¬¬ã§ä½¿ã„å‹æ‰‹ãŒå¤§å¹…ã«å¤‰ã‚る。 最近ã¯ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ– Web デザインãŒæµè¡Œã—ã¦ã‚‹ã‘ã©ã‚‚ã€ãã®å¤§å‰æã¨ã—㦠viewport ã®è¨å®šãƒ‘ターンを抑ãˆã¦ãŠãã®ã¯é‡è¦ã ã‚ã†ã€‚ ã“ã®è¨˜äº‹ã§ã¯ã€viewport ã®è¨å®šã«ã‚ˆã£ã¦ã€è¦‹ãŸç›®ãƒ»ä½¿ã„å‹æ‰‹ãŒã©ã†å¤‰ã‚ã‚‹ã‹ã‚’解説ã™ã‚‹ã€‚ パターン1: 何も考ãˆãšã« HTML を書ã ã¾ãšã¯ã€viewport を指定ã›ãšã«ã€å˜ç´”㪠HTML をスマートフォンã§è¡¨ç¤ºã—ã¦ã¿ã‚‹ã€‚ <!DOCTYPE html> <head> <meta charset="utf-8"> </head> <body> <img src="/images/logo-ja.png"> <p>色んãªç´ æãŒã”ã£ãŸç…®ã«ãªã£ãŸæ§˜åã‚’ãŠæ¤€ã§è¡¨ç¾ã—ã¦ã„ã¾ã™ã€‚ 湯気ãŒ<strong>「ã¦ã£ãã€</strong>ã«è¦‹ãˆã‚‹ã®ãŒéš ã—味ã«ãªã£ã¦ã„ã¾
æ–°ç€è¨˜äº‹
『フォトショップ・ブイアイピーã€ã®æ–°ç€è¨˜äº‹ã§ã™ã€‚フォトショップやデザインをãŸã®ã—むウェブサイト。2009年３月創刊以æ¥ã€3800を超ãˆã‚‹ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã‚’æ›´æ–°ã—ã¦ã„ã¾ã™ã€‚フリーフォントãªã©ã®ç„¡æ–™ãƒ‡ã‚¶ã‚¤ãƒ³ç´ æï¼é…色やWeb制作ã¨ã„ã£ãŸæœ€æ–°ãƒˆãƒ¬ãƒ³ãƒ‰ã‚‚公開ä¸ã€‚
ウェブデザインã«ãŠã‘ã‚‹é€éŽã®åŠ¹æžœçš„ãªä½¿ã„æ–¹ã¨æ³¨æ„点
åŠé€æ˜Žã®ãƒ‘ãƒãƒ«ã«ãƒ†ã‚ストをé…ç½®ã—ãŸã‚Šã€ãƒŠãƒ“ゲーションをåŠé€æ˜Žã«ã—ãŸã‚Šãªã©ã€ã‚¦ã‚§ãƒ–デザインã§ã‚ˆã利用ã•ã‚Œã‚‹é€éŽã®ã‚¨ãƒ•ã‚§ã‚¯ãƒˆã®åŠ¹æžœçš„ãªä½¿ã„æ–¹ã¨æ³¨æ„点を紹介ã—ã¾ã™ã€‚ Using Transparency in Web Design- Dos and Don'ts 下記ã¯å„ãƒã‚¤ãƒ³ãƒˆã‚’æ„訳ã—ãŸã‚‚ã®ã§ã™ã€‚ ã¯ã˜ã‚㫠コントラストを作るãŸã‚ã«é€éŽã‚’使ㆠイメージã®é‡è¦ãªéƒ¨åˆ†ã¯éš ã•ãªã„ ã•ã¾ã–ã¾ãªãƒ¬ãƒ™ãƒ«ã®é€æ˜Žåº¦ã‚’使ㆠé€éŽã™ã‚‹ã¨ãƒ†ã‚ストãŒèªã¿ã‚„ã™ããªã‚‹ã¨ã¯é™ã‚‰ãªã„ é€éŽã‚’使ã†ã®ã¯å°‘ã—ã®ã‚¹ãƒšãƒ¼ã‚¹ã« æ¿€ã—ã„コントラストã®ç”»åƒã«ã¯é€éŽã¯ç½®ã‹ãªã„ é€éŽã‚’アートã¨ã—ã¦ä½¿ã† é€éŽã‚’飾りã¨ã—ã¦ä½¿ç”¨ã—ãªã„ 背景ã«é€éŽã‚’使ㆠåŒæ™‚ã«å¤šãã®é€éŽã®ã‚¨ãƒ•ã‚§ã‚¯ãƒˆã¯ä½¿ã‚ãªã„ 循環ã™ã‚‹ã‚¤ãƒ¡ãƒ¼ã‚¸ã«é€éŽã‚’使用ã™ã‚‹ ãŠã‚ã‚Šã« ã¯ã˜ã‚ã« é€éŽã‚’使ã£ãŸã‚¦ã‚§ãƒ–デザインã¯éžå¸¸ã«ç¾Žã—ã„ã§ã™ãŒã€æ…Žé‡ã«ãƒ‡ã‚¶ã‚¤ãƒ³ã™ã‚‹å¿…è¦ãŒã‚ã‚Šã¾ã™ã€‚é€éŽã¯ã‚«ãƒ©ãƒ¼ã®ãƒ–ãƒãƒƒã‚¯ãƒ»
クリック率ã®é«˜ã„テã‚ストリンクã®è‰²ã¯ï¼Ÿã€2013年版】 | ウェブ力å¦
å‰å›žã¨ã®æ¯”較 å‰å›žã®èª¿æŸ»ã‹ã‚‰2å¹´åŠãŒçµŒéŽã—ã¦ã„る訳ã§ã™ãŒã€ä»Šå›žèª¿ã¹ãŸä¸ã§ãƒªãƒ³ã‚¯ã®ãƒ‡ãƒ•ã‚©ãƒ«ãƒˆè‰²ã‚’使ã£ã¦ã„るサイトã¯ã‚ã‚Šã¾ã›ã‚“ã§ã—ãŸã€‚リンクã®è‰²ã¯ãƒ‡ãƒ•ã‚©ãƒ«ãƒˆè‰²ã‚ˆã‚Šã€ã‚„ã‚„å¼±ã„é’色ã«ã™ã‚‹ã¨ã„ã†ã®ãŒæµ¸é€ã—ã¦ããŸã‚ˆã†ã«æ„Ÿã˜ã¾ã™ã€‚ NAVERã¨livedoorã®ãƒªãƒ³ã‚¯è‰²ãŒåŒã˜ã«ãªã£ã¦ã„ãŸã®ã¯çµŒå–¶çµ±åˆã®å½±éŸ¿ã§ã—ょã†ã‹ã€‚ ã¾ãŸã€ã€Œã¯ã¦ãƒ–ã€ã‚„「ã«ã“ã«ã“å‹•ç”»ã€ã®ã‚ˆã†ã«é’ç³»ã§ãªã„色を使ã£ã¦ã„るサイトもã‚ã‚Šã¾ã—ãŸã€‚ã¯ã¦ãƒ–ã¯ãƒªãƒ‹ãƒ¥ãƒ¼ã‚¢ãƒ«ã«ã‚ˆã£ã¦å¤§ãã変ã‚ã£ãŸã®ã§ã™ãŒã€ãƒªãƒ³ã‚¯ã®è‰²ã‚’黒色ベースã«ã—ã¦ã„ãŸã‚“ã§ã™ã。調ã¹ã‚‹ã¾ã§æ°—ã¥ãã¾ã›ã‚“ã§ã—ãŸã€‚ 最é©ãªãƒªãƒ³ã‚¯ã®è‰²ã¯ï¼Ÿ 「リンクã¯é’色ã€ã¨ã„ã†èªè˜ã¯å¤šãã®ãƒ¦ãƒ¼ã‚¶ãƒ¼ã«æµ¸é€ã—ã¦ã„ã‚‹ã®ã§ã€ä¸€èˆ¬çš„ã«ã¯é’色をベースã«ã™ã‚‹ã®ãŒç„¡é›£ã¨è¨€ãˆã¾ã™ã€‚具体的ã«ã¯ãƒ‡ãƒ•ã‚©ãƒ«ãƒˆè‰²ã ã¨å°‘ã—é’ãŒå¼·ã™ãŽã‚‹ã®ã§ã€ã‚„ã‚„â€é’â€ã‚’å¼±ãã—ãŸè‰²ãŒã„ã„ã§ã—ょã†ã€‚ 但ã—ã€ã‚µã‚¤ãƒˆã®ã‚¸ãƒ£ãƒ³ãƒ«ã«ã‚ˆã£ã¦ã¯é’色をé¿ã‘ã‚‹ã¨ã„ã†ã®ã‚‚一ã¤ã®é¸
ã€UI デザイン 練習用 - エアメール風】 - Webサイトã®ãƒ‡ã‚¶ã‚¤ãƒ³ã‚’ã—よã†
Photoshopã§Webサイトã®ãƒ‡ã‚¶ã‚¤ãƒ³ã‚’ã—よã†ã€Œé€£è¼‰ï¼å®Ÿè·µã§å¦ã¶Webサイト制作ガイドã€ç¬¬å››å¼¾ã¯Adobe Photoshopã¨ã„ã†ãƒ„ールを使ã£ã¦å®Ÿå¯¸ã®ã‚µã‚¤ãƒˆãƒ‡ã‚¶ã‚¤ãƒ³ã‚’作æˆã—ã¾ã™ã€‚Photoshopã§èª¬æ˜Žã—ã¦ã„ãã¾ã™ãŒã€åŒæ§˜ã®ã‚°ãƒ©ãƒ•ã‚£ãƒƒã‚¯ãƒ„ールã§ã‚‚OK。Photoshopã¯ä½“験版もã‚ã‚‹ã®ã§ãœã²ã”利用ãã ã•ã„。説明ã—ã‚„ã™ã„よã†ã€ç°¡å˜ãªãƒ‡ã‚¶ã‚¤ãƒ³ã«ã—ãŸã¤ã‚‚ã‚Šã§ã™ãŒã€ã™ã”ãé•·ããªã£ã¦ã—ã¾ã£ãŸã‚ˆã†ãªâ€¦ã€‚ã‚ã‹ã‚Šã«ããã¦ã™ã¿ã¾ã›ã‚“ X( 実践ã§å¦ã¶ Web サイト制作ガイド：ãã® 4目標：実際ã®å¹…ã«ã‚ã£ãŸã‚µã‚¤ãƒˆãƒ‡ã‚¶ã‚¤ãƒ³ãŒä½œã‚Œã‚‹ãƒ»Photoshop ã®åŸºæœ¬çš„ãªãƒ„ールを使ã£ãŸè£…飾ãŒã§ãã‚‹å¿…è¦ãªã‚‚ã®ï¼šAdobe Photoshop対象レベル：Photoshop ã®åŸºæœ¬çš„ãªãƒ„ールã®ä½¿ã„æ–¹ãŒã‚ã‹ã‚‹ç›®æ¬¡èª°ã®ãŸã‚？何ã®ãŸã‚？Web サイトを作り始ã‚ã‚‹å‰ã«ã€‚Web サイトã®æ§‹æˆå›³ã‚’ç°¡å˜ã«ä½œã‚Œã‚‹ä¾¿åˆ©ãƒ„ールWeb サイ
100種以上ã®è‡ªç¤¾åºƒå‘Šé‹ç”¨ã§ã‚ã‹ã£ãŸï¼ãƒãƒŠãƒ¼åºƒå‘Šã‚¯ãƒªã‚¨ã‚¤ãƒ†ã‚£ãƒ–4ã¤ã®åŸºæœ¬ : LINE Corporation ディレクターブãƒã‚°
ã“ã‚“ã«ã¡ã¯ã€ã‚¦ã‚§ãƒ–サービス本部ã®å®®æ¾¤ã§ã™ã€‚ç§ã¯ç¾åœ¨ã€è‡ªç¤¾ã‚³ãƒ³ãƒ†ãƒ³ãƒ„内ã§è‡ªç¤¾ã®ã‚µãƒ¼ãƒ“スをPRã™ã‚‹ãŸã‚自社広告ã®ç®¡ç†ã‚’担当ã—ã¦ã„ã¾ã™ã€‚ NHN Japanã«ã¯æ•°å¤šãã®ã‚µãƒ¼ãƒ“スãŒå˜åœ¨ã™ã‚‹ãŸã‚ã€å¸¸æ™‚20〜30ã®è‡ªç¤¾åºƒå‘ŠãŒé‹ç”¨ã•ã‚Œã¦ã„ã¾ã™ã€‚自社広告ã¯ç´°ã‹ã効果測定を行ã†ã“ã¨ãŒå¯èƒ½ãªã®ã§ã€æ¯Žé€±5〜10ã®ãƒãƒŠãƒ¼ã‚’入れ替ãˆãªãŒã‚‰æœ€é©åŒ–を図ã£ãŸã¨ã“ã‚ã€ã‚³ãƒ³ãƒãƒ¼ã‚¸ãƒ§ãƒ³çŽ‡ã€ã‚¯ãƒªãƒƒã‚¯çŽ‡ãªã©ã€ã»ã¼ã™ã¹ã¦ã®æŒ‡æ¨™ã§åºƒå‘ŠåŠ¹æžœãŒå‘上ã—ã¾ã—ãŸã€‚ 自社広告ã®æŽ²è¼‰ãƒ¡ãƒ‡ã‚£ã‚¢ã«é–¢ã—ã¦ã‚‚ã€livedoorã€livedoorニュースã€livedoor Blogã€NAVER ã¾ã¨ã‚ã€å„種アプリã¨å¤šå²ã«ã‚ãŸã£ã¦ãŠã‚Šã€ä»Šã§ã¯æ–°è¦ãƒ¦ãƒ¼ã‚¶ãƒ¼ç²å¾—ã®ãŸã‚ã®é‡è¦æ–½ç–ã®ä¸€ã¤ã¨ãªã£ã¦ã„ã¾ã™ã€‚ 今回ã¯100種類以上ã®è‡ªç¤¾åºƒå‘Šã‚’制作ã€é‹ç”¨ã—ã¦ã¿ã¦ã‚ã‹ã£ãŸã€åŠ¹æžœã®é«˜ã„広告クリエイティブを作るãŸã‚ã®ã‚³ãƒ„ã‚’ã”紹介ã—ã¾ã™ã€‚ 1. 笑顔 VS æ³£ãé¡” ã¾ãšã¯LINEã®è‡ª
ç§ãŒæ•°å—ã®å‡ºã‚‹ãƒ©ãƒ³ãƒ‡ã‚£ãƒ³ã‚°ãƒšãƒ¼ã‚¸ã‚’作るãŸã‚ã«å¾¹åº•ã—ã¦ã„ã‚‹ï¼—ã¤ã®äº‹
ã‚ãªãŸã¯ã€ãƒ©ãƒ³ãƒ‡ã‚£ãƒ³ã‚°ãƒšãƒ¼ã‚¸ã®ã‚³ãƒ³ãƒãƒ¼ã‚¸ãƒ§ãƒ³çŽ‡ã‚’定期的ã«è¨ˆæ¸¬ã—ã¦ã€æ”¹å–„è¦ç´ ã‚’æ´—ã„出ã—ã€æ”¹å–„ç–を実施ã—ã¦ã€å°‘ã—ã§ã‚‚æ•°å—ãŒä¸ŠãŒã‚‹ã‚ˆã†ã«åŠªåŠ›ã—ã¦ã„ã‚‹ã ã‚ã†ã‹ï¼Ÿ コンãƒãƒ¼ã‚¸ãƒ§ãƒ³çŽ‡ã¯ï¼‘％変ã‚ã‚‹ã ã‘ã§ã€å£²ä¸Šã¯ä½•å€ã‚‚変ã‚ã£ã¦ãる。 例ãˆã°ã€ã‚‚ã¨ã®æˆç´„率ãŒï¼”ï¼…ã ã£ãŸã®ãŒï¼•ï¼…ã«ä¸ŠãŒã‚‹ã ã‘ã§ã€å£²ä¸Šã¯ï¼‘２５％増ã«ãªã‚‹ã€‚ã•ã‚‰ã«ã€ãƒ©ãƒ³ãƒ‡ã‚£ãƒ³ã‚°ãƒšãƒ¼ã‚¸ã‚’公開ã—ã¦ã‹ã‚‰ã€ï¼“ヶ月ã€åŠå¹´ã€ï¼‘å¹´ã¨çµŒã¤ã”ã¨ã«ã€å£²ä¸Šã®é•ã„ã¯æƒ³åƒã§ããªã„ãらã„ã«å¤§ãããªã£ã¦ã„ã。 ã¤ã¾ã‚Šã€ãƒ©ãƒ³ãƒ‡ã‚£ãƒ³ã‚°ãƒšãƒ¼ã‚¸ã®å®šæœŸçš„ãªè¨ˆæ¸¬ã¨æ”¹å–„ã¯ã€å£²ä¸Šã®å¢—åŠ ã«ç›´çµã™ã‚‹é‡è¦ãªä½œæ¥ã 。 ãƒã‚ºéƒ¨ã§ã¯ã€å®šæœŸçš„ã«ãƒ©ãƒ³ãƒ‡ã‚£ãƒ³ã‚°ãƒšãƒ¼ã‚¸ã®è¨ˆæ¸¬ã¨æ”¹å–„ã‚’ã—ã¦ãŠã‚Šã€ç¾åœ¨ã€ãƒªã‚¹ãƒˆå–得ページã¯ï¼—３.ï¼’ï¼…ã€å•†å“ã®è²©å£²ãƒšãƒ¼ã‚¸ã¯ï¼‘ï¼’.１％ã®ã‚³ãƒ³ãƒãƒ¼ã‚¸ãƒ§ãƒ³çŽ‡ãŒå‡ºã¦ã„る。ã“ã‚Œã¯ã€æ¥ç•Œã‚’é¥ã‹ã«ä¸Šå›žã‚‹æ•°å—ã¨è¨€ã£ã¦ã‚‚å·®ã—支ãˆã¯ãªã„ã ã‚ã†ã€‚ ãã“ã§æœ¬æ—¥ã¯ã€ãƒã‚ºéƒ¨ã§ã‚‚è¡Œã£ã¦ã„ã‚‹ã€ã‚³ãƒ³ãƒãƒ¼ã‚¸ãƒ§ãƒ³ã‚’改善ã™ã‚‹ãŸã‚ã®ï¼—ã¤
ウェブデザイナーã«äººæ°—ã®ã‚る有料・無料ã®ãƒ•ã‚©ãƒ³ãƒˆ ベスト10
世界14ヵ国ã®ã‚¦ã‚§ãƒ–デザイナーã«ã‚¢ãƒ³ã‚±ãƒ¼ãƒˆã‚’ã¨ã£ãŸã€äººæ°—ã®ã‚る有料・無料ã®ãƒ•ã‚©ãƒ³ãƒˆ ベスト10を紹介ã—ã¾ã™ã€‚
ランã‚ング
ランã‚ング
ランã‚ング
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
{{#tags}}- {{label}}
{{/tags}}