加入收藏|设为首页

手机版
$(function(){ $("#sj").hover(function(){ $(".wap_in").show(); },function(){ $(".wap_in").hide(); }); });
惠州-惠城
0752-2285080 130 752 11555
深圳
重庆
昆明
贵阳
$(window).scroll(function(){ var scrollTop = $(document).scrollTop(); if(scrollTop > 0){ $("#top").addClass("s_down"); } else { $("#top").removeClass("s_down"); } initTop = scrollTop; });
新闻中心
经典案例 [ 更多 ]
  • 中国大麦网

  • 田美花园

  • 树年手机

  • 黑龙潭

  • 以幸时尚摄影

合作伙伴

网站制作中关于图片优化的15个原则

2014-05-30 12:07:00 来源:知讯网络 字体大小:TTT
[摘要] 作为一名网页设计师,如何在第一时间打动潜在的客户是至关重要的。如果你设计的东西不能够打动他们,你就会失
    作为一名网页设计师,如何在第一时间打动潜在的客户是至关重要的。如果你设计的东西不能够打动他们,你就会失去一切,这个世界有的时候就是这么的现实。那究竟要注意哪些细节才能够在一个正确的方向去打动客户,让浏览者源源不断呢?下面几点可能是你需要反思的。
1.有明确的标志和口号
    我们知道有一个好的标志是企业形象的开始。好的口号可以让你以更快的速度去曝光自己的站点。在互联网时代,这是重要的开始。
2.让你的页面遵循用户体验,易于浏览
    这点相信我们都有着切身的体会。好的网站是不需要你思考的,它有好的人机交互设计和用户体验。让你以最快的速度去融合于设计,这才是真正的设计,源于生活的设计。这会让你有更多的浏览量的保障。用最段的距离诠释最好的创意。
3.可以方便的与其联系
    网站的设计也算是服务网页,我们必须遵循客户的使用感受和各种提议,所以给予方便的联系可以更好的修正错误的体验方式,让系统更加完善,更快的做出解决方案!
    现在的网站制作中都大量的使用图片,那么我们该如何优化这些图片,以提高网站的访问速度呢?以下就列出了15个网站图片优化的原则。
1. 在网站设计之初,就先要做好规划,比如背景图片如何使用等等,做到心中有数。
2. 编辑图片的时候,要做好裁剪,只展示必要的、重要的、同内容相关的部分。
3. 在输出图片的时候,图片大小要设置妥当,长宽像素就设成你所需要的大小,而不要输出大图片,然后使用的时候,再指定较小的长宽,缩小图片。
4. 尽量组合装饰性的图片,以节省http请求数,在具体使用时,采用CSS sprite的方式。
5. 页面上的边框,背景,尽可能的使用CSS的方式来展示,而不要用图片。
6. 图片使用上,能用png格式的尽量用,以替代过去常用的gif和jpeg格式。在保证质量的情况下,用最小的文件。
7. 在html中明确指定图片的大小。
8. 若使用photoshop的话,缩放图片通常会让图像模糊,可以用smart sharpen来让图片更为出色。
9. 对于GIF和PNG文件格式,最小化颜色位数,可使文件更小。
10. 对于GIF和PNG文件,最小化dithering,可使文件更小。
11. 如果图片上要添加文字,可能的话,就不要把文字嵌入到图片中,而是采用透明背景图片,或者CSS定位让文字覆盖在图片上,既能获得相等的效果,还能把图片更大程度的压缩。
4.最做好的自己
    互联网有这各种纠结,在里面时间长了往往会迷失自己。你需要有一个信念,知道自己的长处,了解自己的不足。面对各种挑战,学会理性应对。在完美和利益间寻找最佳的平衡点。
5.分类你的工作
    好的网站有这很多分支。往往很多小企业在成熟后转型中缺乏大团队的管理经验。人多了,迷失了管理方式。所以,你需要从一开始就有意识的去学会分类你的工作整体,让其整个团队在成长过程中更健康,更快速。
6.学会推荐
    网站如果能得到更多的社会认同将会在更好的氛围里成长。如果你做的是设计类的网站,让更多的设计师知道你的网站,认同你的网站,有的时候是很重要的。它可能会让你的网站在短时间能成为圈内讨论的一个平台!
7.提供一个可下载印刷按钮
    这个功能用的网站并不是很多。但是这样的设置可以让你的网站更好的出现在纸张上,以最好的排列方式。客户可以保存为PDF格式来和朋友分享你的页面。
8.让网站内容清晰明了
    人们浏览页面速度是非常快的。我们都知道,这是一种放松的方式。如果你的文字深奥难懂,可能会失去一部分不耐心的浏览者。如何在短时间内用简短的语言让他们停留也是需要你好好思考的。
$(document).ready(function() { $("#selectXiangGuanLianJie").change(function() { var hrefstr = $.trim($(this).val()); if (hrefstr != "" && hrefstr != "0" && hrefstr != undefined) { var tmp = window.open("about:blank", "", ""); tmp.moveTo(0, 0); tmp.resizeTo(screen.width + 20, screen.height); tmp.focus(); tmp.location = hrefstr; } }) }) var yzhzsfid = "10000007"; $(document).ready(function() { if (para("q")) { $(".ccooperate .item").eq(para("q")).show().siblings().hide(); $(".xymenu li a").eq(para("q")).parent().addClass("current").siblings().removeClass("current"); } else { $(".ccooperate .item").eq(0).show().siblings().hide(); $(".xymenu li").eq(0).addClass("current").siblings().removeClass("current"); } $("input:text,select,textarea").bind({ focus: function() { $(this).css("border-color", "#222") }, blur: function() { $(this).css("border-color", "#bbb") } }) }) function fontSizeChange(){ $(".newspage center.info span").click(function(){ $(this).addClass("current").siblings().removeClass("current"); if($(this).hasClass("small")) $(".zw").css("font-size",14); if($(this).hasClass("middle")) $(".zw").css("font-size",16); if($(this).hasClass("big")) $(".zw").css("font-size",18); }) } fontSizeChange(); $(".rxxm").imgFade(); setFullHeight(); $(window).resize(function(){ setFullHeight(); }); $(".rxxm").imgFade();

深圳知讯
深圳业务咨询

惠州知讯
惠州业务咨询

重庆知讯
重庆业务咨询

贵阳知讯
贵阳业务咨询

昆明知讯
昆明业务咨询

客服李小姐 客服李小姐

客服许小姐 客服许小姐

客服王小姐 客服王小姐

 备案客服 备案客服

var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://"); document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Ff0883abc848f2bd29b354805cee56dbd' type='text/javascript'%3E%3C/script%3E")) var box = new LightBox("idBox"); $("idBoxCancel").onclick = function(){ box.Close(); } $("idBoxOpen").onclick = function(){ //box1.Close(); box.Center = true; box.OverLay.Color = "#000"; box.Show(); } var box1 = new LightBox("idBox1"); $("idBoxCancel1").onclick = function(){ box1.Close(); } $("idBoxOpen1").onclick = function(){ //box.Close(); box1.Center = true; box1.OverLay.Color = "#000"; box1.Show(); } function kefu_close() { document.getElementById("bottomDiv1").style.display="none"; $(".footer").css({"margin-bottom":"0px"}) }