网页设计的案例分析（精选7篇）

“悠里悠闲自在”通过精心收集，向本站投稿了7篇网页设计的案例分析，下面小编给大家整理后的网页设计的案例分析，希望大家喜欢！

网页设计的案例分析

篇1：网页设计的案例分析

在我们美丽的地球村里,绿色随处可见,如草、叶等的绿。绿色象征着生命、青春与和平。绿色,是一种中性色,介于黄色与蓝色之间,是最适合人眼注视的色彩。由于接近自然的特性,绿色给人沉稳、平静、舒适的感觉。因此,绿色也是在网页设计中使用得最广泛的颜色之一。下面笔者就通过不同的绿色搭配方式来分析下绿色在网页设计中的色彩和文字颜色搭配。

绿色设计可以结合任何其他颜色,纹理和阴影,可以直观地改变用户的印象。添加纹理可以使颜色变暗,光滑的表面纹理则更加丰富性和富有深度。

1.绿色+白色+暗红色

如下图所示,主色调、辅色调HSB模式的数值可看出,主色调与辅色调是同一种色,只是在明度上有所不同,让页面多了些空间感、层次感。由于绿色本身的特性,所以整个网页看起来很清爽舒适。中间使用白色块面,拉开了两种绿色之间距离,增加了视觉节奏感。点晴色暗红色的加入为网页增添了一分光彩,极具诱惑感,页面瞬间活跃提神了不少,使得整个页面配色清新爽朗。

2.绿色同类色+多种点睛色

上图中用色较多,主色调为明度稍低的黄绿色,辅助色则为高明度的黄绿色,二者形成强烈反差,增加了页面层次感。此图的点晴色有4种,包括红色与主色调绿色、蓝色与橙红色,二者互相形成对比色。虽说点晴色较多,但都按色相环顺序出现在页面上,形过一个缓和的过渡效果,让人感觉到舒服而非突兀。整个页面色彩谐调,重点突出,层次分明,热闹多彩又不失井然有序。这样的网页配色方案的设计适用于小清新类的服装网站。现今的小清新取景都倾向于海边、公路,若是主色调仍是以白色、黄粉色为主,则会显得单调枯燥。在此笔者建议可以试试看绿色加上多色点睛色的配色方案,你会大有收获。

3.突出绿色+强暗色系

此图中大家一眼就能看出位于正中间的绿色植物,与周围纯度很高的黑色相比,这样的绿色显得醒目,形成鲜明的刺激对比。这两组色彩虽然不是严格意义上的对比色,但足够在页面中形成鲜明对比,整个页面瞬间被烘托得鲜活起来。就像是在油锅中加入水滴一样,瞬间显得生动,有效地突出网页前景。整个页面显得通透鲜活,主题鲜明。此外,加入了棕色和白色的,耀眼的绿色得到平衡,起到舒缓视觉的效果,有效平衡了绿色与暗黑色的强烈对比较果。

结论:

中国人普遍认为绿色是青春,向上,活力的代表,在网页设计中也越来越多的运用绿色系,以显示网页设计的年轻的生命力。运用绿色系,在第一时间给人健康、成熟、稳重、开阔的心理感受,传递网站正能量。运用绿色系配色方案的还有很多,站长朋友们不妨多去设计类的网站浏览,寻找灵感。

[分享网页设计的案例分析]

篇2：网页设计就业前景分析

在网络飞速发展的今天，中国的网民数量已经超过了3亿，是全球拥有最多网民的国家。网页设计如今变成一个很热门的技术，虽然懂的人很多，学的人也多，但是真正设计水平过硬的人却很少,网页设计培训正好解决了这个问题。通过网页设计培训课程，能够全面掌握网页设计方法、网页设计流程，网页设计软件工具、网页设计知识，能够运用软件开发技术，开发电子商务网站或企业分布式B/S架构多层应用程序。从而，毕业时成为合格的网页设计人才。

网页设计的两大要点是：整体风格和色彩搭配。对于整体风格要注意几点：将你的标志logo，尽可能的放在每个页面上最突出的位置;突出你的标准色彩;总结一句能反映贵站精髓的宣传标语;相同类型的图像采用相同效果。而网页色彩的搭配可彩：第一，用一种色彩。这里是指先选定一种色彩，然后调整透明度或者饱和度，这样的页面看起来色彩统一，有层次感。第二，用两种色彩。先选定一种色彩，然后选择它的对比色。第三，用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿;或者土黄，土灰，土蓝。

网页设计培训的内容有Dreamweaver、Flash、Firework、Photoshop、HTML&XML。Dreamweaver是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。你现在所浏览的网页就是用它做出来的。Flash网页的动画制作，这块在现在比较吃香。Flash 是交互式矢量图和 Web 动画的标准。网页设计者使用 Flash 创作出既漂亮又可改变尺寸的导航界面以及其他奇特的效果。Firework也是 Macromedia 公司的产品，是真正的网页作图软件。Firework可用于在网页布局排版时对你用Photoshop所绘制的网页效果图进行切片。Photoshop是图形处理软件，可以绘制网页的效果图。

实际上，网页设计培训能够让你学会网页设计和网页设计的一些设计技巧，但是要成为网页设计高手光靠这点是绝对不够的。网页设计是一个感性思考与理性分析相结合的复杂的过程，它的方向取决于设计的任务，它的实现依赖于网页的制作。此外，网页设计人员还要学会网站运营，网站优化等相关知识

网页设计就业前景分析

篇3：阿里巴巴网页设计布局分析网页设计

阿里巴巴是全球B2B电子商务的著名品牌，是目前全球最大的商务交流社区和网上交易市场，也许是取决于“良好的定位、稳定的结构、优秀的服务”，阿里巴巴如今已成为全球首家拥有210万商人的电子商务网站。成为全球商人网络推广的首选网站。

下面让我们来对阿里巴巴的网页设计布局进行分析：

阿里巴巴中国站(china.alibaba.com)被google收录的中文网页数量8月份数据为530，不仅从被收录的网页数量上来说，要远远高于同类网站的平均水平，更重要的是，阿里巴巴的网页质量比较高，潜在用户更容易通过搜索引擎检索发现发布在阿里巴巴网站的商业信息，从而为用户带来更多的商业机会，阿里巴巴也因此获得更大的网站访问量和更多的用户。

1．从整体结构看：

设计作品的整体效果是至关重要的，在设计中切勿将各组成部分孤立分散，那样会使画面呈现出一种枝蔓纷杂的凌乱效果。点击打开阿里巴巴的网站，访问者可以很快的查找到自己所要寻找的信息和内容，理由是它的每个页面都有独立的标题，并且网页标题中含有有效的关键词，每个网页还有专门设计的META标签，而且图形和文本层叠有序，框架结构明显。从整体上看网站上的图片不是很多，因为它知道搜索引擎读不出来图片的信息和内容的。

2．从页面的相互关系看：

阿里巴巴的各组成部分在内容上的内在联系和表现形式上的相互呼应很明确，并注意到了整个页面设计风格的一致性，并且在搜索引擎搜索信息的情况下，阿里巴巴将它的主要业务放在了整个框架的最左边也就是搜索引擎最关注的地方，

它抓住了搜索引擎的在搜索信息的特点。实现视觉上和心理上的连贯，使整个页面设计的各个部分极为融洽。

3. 页面分割的角度看：

分割，是指将页面分成若干小块，小块之间有视觉上的不同，这样可以使观者一目了然。阿里巴巴在这方面就做的很出色。它在信息量很多时，将关键词列出来，将画面进行了有效的分割，使关注者更清楚的知道关键词的背后就是他所要的信息。所以网页设计中有效的分割可以被视为对于页面内容的一种分类归纳。

4．从页面对比的角度看：

对比就是通过矛盾和冲突，使设计更加富有生气。对比手法很多，例如：多与少、曲与直、强与弱、长与短、粗与细、疏与密、虚与实、主与次、黑与白、动与静、美与丑、聚与散等等。阿里巴巴在网页设计中无论是颜色、文本信息、文字的大小、格式、等等都无可非议。因为它给人的感觉很协调很舒服。

5．从页面和谐的角度看：

和谐是指整个页面符合美的法则，浑然一体。如果一件设计作品仅仅是色彩、形状、线条等的随意混合，那么作品将不但没有“生命感”，而且也根本无法实现视觉设计的传达功能。和谐不仅要看结构形式，而且要看作品所形成的视觉效果能否与人的视觉感受形成一种沟通，产生心灵的共鸣。这是设计能否成功的关键。打开阿里巴巴的网页一开始给人有点单一的感觉，因为它的色彩不时很鲜明，但是从整体角度在看会发现它的颜色和线条的搭配让人的视觉效果和它的网页达到一种想沟通的效果，尤其是它框架两边的空白部分从美学角度可以说明两点：一是显示阿里巴巴企业的卓越；二是显示网页品味的优越感。所以从整体上体现出了网页的格调。

所以阿里巴巴之所以能够做到今天这样的成就，可以看出它在每一个方面的专业化和深入的程度。所以其他的网站在设计布局的同时有必要向阿里巴巴深入的学习。