网页效果设计
Ⅰ 网页设计效果图你们是怎么设计的
我也曾经遇到过好几次这种问题，我用ps做好效果图给客户看，客户满意后我就切图做。但是ps上无法实现每一个像素的精确（其实也可以，但那样就太费时间了），所以有时候实际做出的网页在版面上会有些出入，比如左右分栏的结构在效果图上是整齐的，做成网页就有长有短，所以不得以要做一些调整。这样一来，遇见比较挑剔的客户就会纠结于我为什么要修改效果图上的方案，每次要解释半天。所以我现在都是一边做效果图，一边在网页上实现，把整个网页做好以后，直接将网页截图给客户看。
Ⅱ 网页设计和前端开发到底有什么区别都是做页面效果吗
网页设计偏重于UI设计，差不多属于美工一类。就是做页面效果。
前端开发，是指前端功能开发，主要是实现前端功能，属于前端编码，
前端开发工程师独立出来主要就是做数据交互、后台处理、SEO优化等工作，要熟练各种脚本语言和运行环境，熟悉XML、SQL、ORACLE等数据库，熟悉AJXA、Jquery、Slivelight、Struct2、CSS4、Html5等网站处理技术。
网页设计（web design，又称为Web UI design，WUI design，WUI），是根据企业希望传递的信息（包括产品、服务、理念、文化），进行网站功能策划，然后进行的页面设计美化工作。作为企业对外宣传物料的其中一种，精美的网页设计，对于提升企业的互联网品牌形象至关重要。
网页设计一般分为三种大类：功能型网页设计（服务网站&B/S软件用户端）、形象型网页设计（品牌形象站）、信息型网页设计（门户站）。设计网页的目的不同，应选择不同的网页策划与设计方案。
网页设计的工作目标，是通过使用更合理的颜色、字体、图片、样式进行页面设计美化，在功能限定的情况下，尽可能给予用户完美的视觉体验。高级的网页设计甚至会考虑到通过声光、交互等来实现更好的视听感受。
网页设计主要以Adobe产品为主，常见的工具包括FW、PS、FL、DW、CDR、AI等，其中DW是代码工具，其他是图形图像和FL动画工具。还有最近几年Adobe新出的EdgeReflow、EdgeCode、Muse。
前者侧重程序实现，后者侧重视觉效果。
Ⅲ 网页设计中，怎么用CSS做出磨砂的背景效果
代码:透明背景(带磨砂玻璃效果) 注：在粘贴到空白模板前一定先打个空格。
<STYLEtype=text/css>
.bodytop{background:#transparent}
.banner{background:#transparent}
.menu{background:#transparent}
.bodyBg{background:#transparent;filter:progid:DXImageTransform.Microsoft.gradient(GradientType='1',enabled='true',startColorstr=#AAFFFFFF,endColorstr=#AAFFFFFF);}
.zone{background:#transparent}
.bodyBottom{background:#transparent}
.feeds.up{background:#transparent}
.feeds.down{background:#transparent}
.feeds.function{background:#transparent}
.feeds.page{background:#transparent}
.aList.sysHand.up{background:#transparent}
.aList.sysHand.down{background:#transparent}
.gbook.sysHand.up{background:#transparent}
.gbook.sysHand.down{background:#transparent}
.gbook.title{display:none;}
.logo{display:none;}
.gbook.page{background:#transparent}
.gbook.login{background:#transparent}
.box_1{background:#transparent}
.box_2{background:#transparent}
.calendar{background:#transparent}
.calendar.mid{background:#transparent}
.calendar.top{background:#transparent}
.calendar.title{background:#transparent}
.calendar.boldtd{background:#transparent}
.calendar.bottom{background:#transparent}
.callboard.mid{background:#transparent}
.callboard.midimg{background:#transparent}
.callboard.front{background:#transparent}
.callboard.back{background:#transparent}
.callboardtable{background:#transparent}
.callboard.up{background:#transparent}
.callboard.down{background:#transparent}
.sysBr{background:#transparent}
.sysBr210{background:#transparent}
.label{background:#transparent}
.label.mid{background:#transparent}
.label.top{background:#transparent}
.label.bottom{background:#transparent}
.photo{background:#transparent}
.photo.mid{background:#transparent}
.photo.image{background:#transparent}
.photo.top{background:#transparent}
.photo.bottom{background:#transparent}
.links{background:#transparent}
.links.up{background:#transparent}
.links.down{background:#transparent}
.links.mid{background:#transparent}
body{background:url("
http://s11.sinaimg.cn/orignal/439175a380fda7635072a
")repeatfixed!important;}
.add{background:#transparent}
.add.ico{background:#transparent}
</STYLE>
Ⅳ 网页设计怎么优化的效果最好，如何改善网页的搜索引擎
网站设计有什么因素会影响网站优化
一、特效画面
我们经常看到一些网站为导航链接添加特殊效果，例如单击项目以展开下面的链接。这些效果通常是用Java实现的，在视觉上非常新颖，但在“搜索引擎”爬虫眼中却没有那么吸引人，相反，它无法解释这个链接。为了让搜索引擎成功检索您的网站网页设计，建议牺牲一些花哨的东西。
二、网页容量
尽量不要超过5万字节的网页，包括图片。庞大的网页下载速度慢，不仅会让普通访客焦虑，也会使蜘蛛不耐烦。这将导致页面浏览量下降，影响企业的宣传效果。
三、频繁弹窗
用户体验虽然和SEO优化有着不同的定义，但是搜索引擎却将两者之间结合到了一起，使两者或多或少都有了关联，而频繁的弹窗会使用户厌烦，从而使用户体验降低，导致页面跳出率高，这样搜索引擎就会做出惩罚。
四、无移动网站
移动端的流量已经超过PC端，如果网站不做移动端的优化和建设移动端网站的话，那么则是会流失一部分用户，所以企业要做好移动端的页面制作和设计，而且移动端的网站跟pc端更加苛刻，因为它需要更加轻巧便捷的页面操作。
为什么设计动画效果会影响优化
1、Flash动画
许多网站为了网站视觉效果，话在首页或打开页面设置Flash动画，过去出现的较为频繁，现在稍微少一些。
Flash动画虽然美观，能吸引人，但蜘蛛是无法识别与收录其中内容的，如果整个页面都是Flash制作的，那么这个页面相当于不存在，不仅如此，Flash动画会增大服务器压力，使页面加载时间变长，在打开体验上有一定弊端，不利于网站优化。
2、Js代码
通常来说，蜘蛛很难抓取到Js代码，或者说很多次计算之后才会抓取。因此，重要信息尽量不要采用Js代码。
Ⅳ 网页的设计有几种方法
第一、靠前、无边框设计。无边框设计在近几年比较流行，在设计页面的时候，将页面中的风格线、边框删掉，用间距来代替的一种设计方法。无边框设计一般是以大图为主，图片本来就是一种分割元素。而内容基本是有规律的，留白间距之间的内容一定要相对一致、重复、紧密，这样用户在浏览的时候才会认为这些内容是一体的。一般来说，小众垂直的产品更适合使用无边框设计。
第二、卡片设计。卡片的设计打破了传统上固定的排版布局方式，提升了版面的使用率，可以给网站建设增加更多的惊喜。那么卡片设计有哪些优势呢？1、可以提高页面的使用率。卡片就好像是一个容器，将类型不一样的内容设置在不一样的卡片中，这样就可以很好地区分内容，还能够统一页面的风格。比如传统列表，内容一般是纵向滚动的方式，能够展示的内容比较有限，卡片式的设计采用的滑动方式，就可以有效地解决空间问题。2、区分卡片上的内容。卡片就好像是一个容器，将不同的内容放置在不同的卡片，更好地区分内容的类型。卡片的维度是不一样的，而且相对独立、有互相有联系，所以通过卡片归纳网站的内容，整个网站就显得更有秩序。3、卡片式设计可以提升可控性、提升体验度。卡片式设计的使用范围比较广泛，可以覆盖、滑动、堆叠，有良好的扩展性和可操作性。
第三、分割线的设计。这也是常见的一种页面布局设计方式，可以更好地帮助用户快速熟悉页面的布局，有良好的内容组织性。分割线可以贯穿整个页面，将不同的内容进行分割，成为独立的信息。
网站建设中的页面布局，有不同的设计方式，而且设计的趋势不断在变化，在设计页面布局之前，就要考虑好合适的样式，不能一味地追求潮流，根据产品的实际需求，选择合适的设计方式。而分割线的设计，想要做得出色，就要处理好线的间距、粗细、颜色等等
Ⅵ 网页设计中 鼠标点击效果实现
<style>
.black{color:black;font-weight:bold;}
a{color:blue;}
</style>
<scripttype="text/javascript"src="jquery.min.js"></script>//载入JQ库
<script>
$("a").click(function(){
$("a").attr("href","#").removeClass("black");
$(this).removeAttr("href").addClass("black");
});</script>
<aclass="black">新闻</a><ahref="#"class="">网页</a><ahref="#"class="">知道回</a><ahref="#"class="">网络答</a>
Ⅶ 页面动态效果和动态网页设计的含义相同吗各自是如何实现的
页面动态效复果是网页的代码制都在页面中，不需要执行asp,php,jsp,.net等程序生成客户端网页代码的网页。静态页面不能自主管理发布更新的页面,如果想更新网页内容,要通过FTP软件把文件DOWN下来用网页制作软件修改（通过fso等技术例外）
常见的静态页面举例：.html扩展名的、.htm扩展名的。
注意：静态页面并非网站上没有动画的就是静态页面。
动态页面是通过执行asp,php,jsp,.net等程序生成客户端网页代码的网页。
动态页面通常可以通过网站后台管理系统对网站的内容进行更新管理。发布新闻，发布公司产品，交流互动，博客，网上调查等，这都是动态网站的一些功能。也是我们常见的。
动态页面常见的扩展名有：.asp .php .jsp .cgi 等。
注意：动态页面的“动态”是网站与客户端用户互动的意思，而非网页上有动画的就是动态页面。
Ⅷ 简述网页设计的风格有哪些
一、首先从功能与设计目标来看， H5专网页主要有以下4大类型：
1.活动运营型
为活动推广运营而打造的H5页面是最常见的类型，形式多变，包括游戏、邀请函、贺卡、测试题等形式。与以往简单的静态广告图片传播不同，如今的H5活动运营页需要有更强的互动、更高质量、更具话题性的设计来促成用户分享传播。从进入微信H5页面到最后落地到品牌App内部，如何设计一套合适的引流路线也颇为重要。
2.品牌宣传型
不同于讲究时效性的活动运营页，品牌宣传型H5页面等同于一个品牌的微官网，更倾向于品牌形象塑造，向用户传达品牌的精神态度。在设计上需要运用符合品牌气质的视觉语言，让用户对品牌留下深刻印象。
3.产品介绍型
聚焦于产品功能介绍，运用H5的互动技术优势尽情展示产品特性，吸引用户买买买。
这一类型的H5页面多见于汽车品牌，LEXUS NX是其中的优秀代表案例。精致和极富质感的建模、细腻的光效营造出酷炫的视觉风格。用手指跟随光的轨迹切割画面揭开序幕，通过合理优雅的触碰、摩擦、滑动等互动形式带领用户一同探索产品的7大特性，宏观和微观都照顾周全。
4.总结报告型
自从支付宝的十年账单引发热议后，各大企业的年终总结现也热衷于用H5技术实现，优秀的互动体验令原本乏味的总结报告有趣生动了起来。
二．形式为功能服务
在确定了专题页的功能目标之后，接下来就是关键的设计阶段了。如何有的放矢地进行设计，需要考虑到具体的应用场景和传播对象，从用户角度出发去思考什么样的页面是用户最想看的最会去分享的。
1.简单图文
简单图文是早期最典型的H5专题页形式。“图”的形式千变万化，可以是照片、插画、GIF等。通过翻页等简单的交互操作，起到类似幻灯片的传播效果。考验的是高质量的内容本身和讲故事的能力。
2.礼物/贺卡/邀请函
每个人都喜欢收到礼物的感觉，抓住这一心理，品牌推出了各种H5形式的礼物、贺卡、邀请函，通过提升用户好感度来潜移默化地达到品牌宣传的目的。既然是礼物，那创意和制作便是重要的加分项。
3.问答/评分/测试
问答形式的H5页面也屡见不鲜了，利用用户的求知欲和探索欲，一路选选选，看最后到底是什么成绩。一条清晰的线索是必要的，最后到达的结果页也需要合理不突兀，如果能辅以出彩的视觉和文案，弱化答题的枯燥感那就再好不过了。
4.游戏
从 “围住神经猫”、“看你有多色”等单纯小游戏再到杜蕾斯“一夜N次郎”（即山寨版“别踩白块儿”）等品牌植入式小游戏，H5游戏因为操作简单、竞技性强，一度风靡朋友圈，但创意缺乏和同质化现象导致用户对无脑小游戏逐渐产生了厌倦。品牌要在游戏上做到成功传播，需要在玩法和设计上多下点功夫。
三．为设计加分的4个要点
一个H5页面设计品质的出众与否，会直接影响其传播效果，甚至影响到用户对品牌形象的认知。在这里总结出以下的设计要点：
1.细节与统一
要成就高品质的用户体验，必须考虑到细节与整体的统一性。复古拟物的视觉风格，那字体就不能过于现代；幽默调侃的调调，那文案措辞就不能过于严肃；打情感内容牌的，动效就不能过于花哨。
2.紧跟热点，利用话题效应
想要你的H5专题页一夜爆红，第一时间抓住热点并火速上线，借机进行品牌宣传也不失为一条捷径。
3.讲个好故事，引发情感共鸣
不论H5的形式如何多变，有价值的内容始终是第一位的。在有限的篇幅里，学会讲故事，引发用户的情感共鸣，将对内容的传播形成极大的推动。
4.合理运用技术，打造流畅的互动体验
随着技术的发展，如今的HTML5拥有众多出彩的特性，让我们能轻松实现绘图、擦除、摇一摇、重力感应、擦除、3D视图等互动效果。相较于塞入各种不同种类的动效导致页面混乱臃肿，我们更提倡的是合理运用技术，用心专注于为用户提供流畅的互动体验。
结语
随着手机硬件的升级、HTML5技术的发展以及微信平台的开放，HTML5的跨平台、低成本、快迭代等优势被进一步凸显，这对身处于移动互联网大潮的企业主、品牌、设计师和开发者来说，都将是一个最好的时代。