心雨在线科技--专业提供APP开发|合成游戏开发|公众号小程序分销商城｜多级别制度营销商城|高端网站建设及改版|公众号开发｜H5页面制作|软件平台开发

网页设计实例分析:日式网页设计案例分析

发布时间：2018-05-17浏览次数：865 <table style="BORDER-RIGHT: #cccccc 1px dotted; TABLE-LAYOUT: fixed; BORDER-TOP: #cccccc 1px dotted; BORDER-LEFT: #cccccc 1px dotted; BORDER-BOTTOM: #cccccc 1px dotted" cellspacing="0" cellpadding="6" width="95%" align="center" border="0"><tbody><tr> <td style="WORD-WRAP: break-word" bgcolor="#fdfddf"> 网页制作Webjx文章简介：在很多人眼里，日本是一个隐忍、充满禅意的国家。以寺庙、茶道、电子产品而闻名。既传统，又现代。日本的建筑设计、书刊设计受世界瞩目。但是不知怎么的，日本的网页设计风格很怪异。有点像1998年的网页风格。 </td> </tr></tbody></table> <span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 14px/25px Tahoma, Verdana, 宋体; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px">在很多人眼里，日本是一个隐忍、充满禅意的国家。以寺庙、茶道、电子产品而闻名。既传统，又现代。日本的建筑设计、书刊设计受世界瞩目。但是不知怎么的，日本的<a href="http://www.webjx.com/">网页设计</a><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 14px/25px Tahoma, Verdana, 宋体; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px">风格很怪异。有点像1998年的网页风格。 <a target="_blank" href="http://www.rakuten.co.jp/">Rakuten</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="710" height="480" src="http://www.webjx.com/files/allimg/131223/1958330.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> <a target="_blank" href="http://www.nicovideo.jp/">NicoNicoDouga</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="710" height="613" src="http://www.webjx.com/files/allimg/131223/1958331.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> <a target="_blank" href="http://gigazine.net/">Gigazine</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="710" height="516" src="http://www.webjx.com/files/allimg/131223/1958332.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> 看看日本这些最流行的网站(比如 <a target="_blank" href="http://www.goo.ne.jp/">Goo</a>, <a target="_blank" href="http://www.rakuten.co.jp/">Rakuten</a>, <a target="_blank" href="http://www.yomiuri.co.jp/">Yomiuri</a>, <a target="_blank" href="http://www.nicovideo.jp/">NicoNico</a>, <a target="_blank" href="http://okwave.jp/">OKWave</a>, <a target="_blank" href="http://www.cosme.net/">@cosme</a>)，你会发现他们都有共同点: 文字排布紧密 图像质量偏低 网页栏数太多 亮的刺眼的色彩和闪动的Banner 过度使用一些过时的技术，比如Flash 为什么其他设计日本人那么在行，<a href="http://www.webjx.com/">网页设计</a>这么糟烂呢？原因有很多，如下： <h4 style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; COLOR: rgb(51,51,51); PADDING-BOTTOM: 0px; PADDING-TOP: 25px; FONT: bold 1.5em/1.33em 'microsoft yahei', arial, sans-serif; PADDING-LEFT: 0px; MARGIN: 10px 0px 20px; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 0px; Be-width: 0px">语言差异</h4> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Sir, is that a middle finger ?" width="614" height="345" src="http://www.webjx.com/files/allimg/131223/1958333.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> Photo by <a target="_blank" href="http://www.shootjapan.com/">shootjapan.com</a> 表意文字 – 中文和日文都属于表意文字，寥寥数语，但是信息量可以很大。在西方人眼里看来，这些文字可能看上去混杂无比，但是能够让日文使用者在短时间内表达出大量的意思。 缺少强调 – 日文没有斜体，也没有大写字母，不像拉丁语系，很多通过大小写、倾斜来提供视觉暗示。因此，日文文本的信息层级组织不是特别容易，设计师需要分栏、配图来进行信息分层。 语言障碍 -互联网上大部分编程语言是由西方人和英语使用者设计的。很多的资源、资料都是用英文体现的。因此新的技术、趋势被引入到日本需要一定时间的延迟。 <h4 style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; COLOR: rgb(51,51,51); PADDING-BOTTOM: 0px; PADDING-TOP: 25px; FONT: bold 1.5em/1.33em 'microsoft yahei', arial, sans-serif; PADDING-LEFT: 0px; MARGIN: 10px 0px 20px; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 0px; Be-width: 0px">文化差异</h4> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="614" height="346" src="http://www.webjx.com/files/allimg/131223/1958334.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> 危险回避 – 在日本文化中，不鼓励冒险和出格的行为。一旦某件事情有了先例，便会有很多人跟随，不管这种先例是不是问题的最佳解决方案。日本的很多流行风格都是如此，略微带一点保守。 消费意识– 日本人的防范心理很强，往往会仔细阅读技术规格和产品描述，在做出购买决定前，他们不会轻易的被标题和图像诱惑。“少即是多”的理论在这里并不适用，日本人需要详细的产品说明。 广告意识– 很多日本公司把互联网当成一个推广平台，而没把互联网当成强大的综合工具。在他们眼里，互联网只是类似宣传册，小空间密集信息宣传，而不是一种行之有效的交互工具。 城市文化 - 漫步东京涉谷，你会被无处不在的霓虹灯广告“袭击”,嘈杂的弹球房，喧闹的人群主要由上班族和学生组成。这种繁杂同样体现在互联网上。除此之外，日本国土面积狭小，惜地如金，空间不能有一丝一毫的浪费，因此这种理念体现在<a href="http://www.webjx.com/">网页设计</a>中，日本的网站很少采用留白。 岗位要求<span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 14px/25px Tahoma, Verdana, 宋体; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> - 我们再来看看日本的招聘广告，你会发现往往这么写“招聘网络高手”、“招聘网络管理员”，让我感觉仿佛回到了十多年前，那时候公司招IT人，都是要求编码、运营、设计一手包办——而现在的日本依然有很多公司这么干。所以很多有潜力、有天赋的日本网页<span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 14px/25px Tahoma, Verdana, 宋体; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px">设计师选择了另谋高就，去别的地方施展他们的才华。 <h4 style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; COLOR: rgb(51,51,51); PADDING-BOTTOM: 0px; PADDING-TOP: 25px; FONT: bold 1.5em/1.33em 'microsoft yahei', arial, sans-serif; PADDING-LEFT: 0px; MARGIN: 10px 0px 20px; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 0px; Be-width: 0px">技术差异</h4> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="[Shibuya] Umbrella Bokeh" width="614" height="411" src="http://www.webjx.com/files/allimg/131223/1958335.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> Photo by <a target="_blank" href="http://www.flickr.com/photos/scion02b/3079276821/">scion_cho</a> 手机后遗症 - 在iPhone还没流行之前，日本的手机普及率就很客观，那时日本手机以翻盖居多，因此移动互联网专门对翻盖手机进行了优化。所以，现在的日本网页设计深受影响，喜欢把内容塞进狭小的空间里。 网络字体– 非拉丁语系的字体很少（中文，日本..），主要是因为表意文字跟表音文字不同，每个字都需要重新调节，设计起来非常耗时。因此日本设计师更喜欢用图片，避免使用不标准的字体。 Windows XP & IE 6 – 尽管软硬件迅速发展，但是还有很多人在使用Win XP和IE6，尤其是在公司中。 以上，大致就是这么几点 <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Japan - Back to the Future Poster" width="614" height="826" src="http://www.webjx.com/files/allimg/131223/1958336.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> 漫步东京，总是感觉自己身处于“80年代所设想的未来景象”中，主要归功于日本的建筑。 一方面，我看到了很多日本设计在大量炮制，很落伍，丝毫不考虑到当前的设计趋势。 另一方面我又看到很多能工巧匠，一丝不苟的在做事情，作品难以置信的美丽实用。 当然，有一部分的日本<a href="http://www.webjx.com/">网页设计</a>还是不错的，像<a target="_blank" href="http://www.uniqlo.com/jp/">UNIQLO</a>,<a target="_blank" href="http://www.muji.net/">MUJI</a>, <a target="_blank" href="http://cookpad.com/">CookPad</a> 以及<a target="_blank" href="http://www.kinokuniya.co.jp/">Kinokuniya</a> 的网站，功能与形式兼备。我们来看看吧！ <a target="_blank" href="http://www.uniqlo.com/jp/">Uniqlo</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="710" height="482" src="http://www.webjx.com/files/allimg/131223/1958337.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> <a target="_blank" href="http://www.ishiyamasenko.co.jp/">Ishiyama Senkoh</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="710" height="390" src="http://www.webjx.com/files/allimg/131223/1958338.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> <a target="_blank" href="http://www.museum.toyota.aichi.jp/">Toyota Municipal Museum Of Art</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="toyota art" width="710" height="472" src="http://www.webjx.com/files/allimg/131223/1958339.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> <a target="_blank" href="http://hanamichiya.jp/">Hanamichiya</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="710" height="504" src="http://www.webjx.com/files/allimg/131223/19583310.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> <a target="_blank" href="http://swiss.2ngen.jp/">Swiss</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="710" height="448" src="http://www.webjx.com/files/allimg/131223/19583311.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> <a target="_blank" href="http://taromag.misaquo.org/">Taromagazine</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="710" height="401" src="http://www.webjx.com/files/allimg/131223/19583312.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> <a target="_blank" href="http://www.takeopapershow.com/">Takeo Paper Show</a> <img style="MAX-WIDTH: 100%; BORDER-TOP: rgb(230,230,230) 1px solid; HEIGHT: auto; BORDER-RIGHT: rgb(230,230,230) 1px solid; VERTICAL-ALIGN: middle; WHITE-SPACE: normal; WORD-SPACING: 0px; BORDER-BOTTOM: rgb(230,230,230) 1px solid; TEXT-TRANSFORM: none; COLOR: rgb(82,82,82); PADDING-BOTTOM: 16px; TEXT-ALIGN: center; PADDING-TOP: 16px; FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; PADDING-LEFT: 16px; BORDER-LEFT: rgb(230,230,230) 1px solid; ORPHANS: 2; WIDOWS: 2; LETTER-SPACING: normal; PADDING-RIGHT: 16px; BACKGROUND-COLOR: rgb(246,246,246); TEXT-INDENT: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px" alt="Salary Man Street" width="710" height="391" src="http://www.webjx.com/files/allimg/131223/19583313.jpg"><span style="WHITE-SPACE: normal; WORD-SPACING: 0px; TEXT-TRANSFORM: none; FLOAT: none; COLOR: rgb(82,82,82); FONT: 12px/21px Arial, Helvetica, Arial, sans-serif; ORPHANS: 2; WIDOWS: 2; DISPLAY: inline !important; LETTER-SPACING: normal; Be-width: 0px"> 原文地址：<a target="_blank" href="http://randomwire.com/why-japanese-web-design-is-so-different/">randomwire</a>

返回列表上一篇 | 交互设计案例分析:银行卡号输入交互设计下一篇 | 网页设计技巧:Icon Font制作细节案例

【本站公告】

选择以下客服马上在线沟通：

网页设计实例分析:日式网页设计案例分析

深圳公司