古玩类的外贸购物网站设计以前没接触过,和客户沟通之后,客户也没有什么明确的要求,所以第一个版面完全是按照自己的思路来。 因为是古玩类的,所以使用了黑色作为主色调、土黄色作为点缀,整个网站还是先采上下再左右的布局方式,头部是导航、注册、登录、搜索这些常见模块,下面是一个大的图片切换。左侧主要是方便客户快速选择自己想的要产品的,包括从产品分类、价格、材质这三个方面,下面有一个出件订阅的功能,方便收集用户信息。右侧主要是产品展示模块,因为考虑到网站的优化,所以有一个新闻板块。下面是常见的帮助中心、社交分享、版权信息等 但是这个效果图并没有被客户认可,客户去掉了图片切换、新闻模块,虽说购物网站没有图片切换的很少,但客户要求了也没有办法,颜色也应客户的要求由黑色变成了灰色,最终效果图: 基本上全部是产品的展示,客户这样要求了,所以就修改成这个样子了,客户就是想让人一进来首先看到的就是他的产品信息,这样相对来说比较直观、明了!
2014年10月31日
自适应网页设计中应该注意的细节问题
元素宽度不要使用绝对宽度 由于网页会根据屏幕宽度调整布局,所以不能使用绝对宽度的布局,也不能使用具有绝对宽度的元素。这个很重要,也就是说CSS代码不能指定像素宽度:width:xxx px; 只能设定百分比宽度: width: xx%; 或者 width:auto; 相对大小的字体 字体也不能使用绝对大小(px),而只能使用相对大小(em),这里说一下,1em=16px,可根据实际需要来换算 body {font: [...]
2014年10月30日
各种js特效
1.文档预览效果,也就是跳转到了另一个页面。 <script language=”javascript” type=”text/javascript”> location.href=”Default.aspx”; </script> Default.aspx为同级目录下跳转到的文件 2.上传文本域代码 <div style=”margin-top:14px;”> [...]
2014年10月27日
jQuery购物车点击加减,数量随之变化,商品总价也随之变化
购物网站中,在加入购物车时,会出现类似于这种选择商品数量的按钮,不仅可以自己手动改变框框里面的数字,而且点击减号时,数量会随着点击次数逐渐减小,最小是0,同理按加号,数量就会随之增加。随着数量的变化,商品总价也会自己随着变化。如下图 代码如下 <script> $(function(){ $(“.add”).click(function(){ var t=$(this).parent().find(‘input[class*=text_box]‘); t.val(parseInt(t.val())+1) setTotal(); }) [...]
2014年10月23日
jQuery特殊图片切换效果
jQuery图片切换有很多种方式,多数都是一张一张的轮播,切换,这里这个方法是指一组图片和文字轮播,看下图: 主要效果为,右侧图片先从中间像两侧缓慢出来,然后停顿几秒,左侧图片和文字,按钮再从右到左缓慢出来。这种效果十分适用于衣服,鞋子,包包之类的网站,一侧展示模特效果图,另一侧展示产品,产品下面附上型号标题。下面我们来看看是如何实现这种jQuery特殊图片切换效果的。 主要是有两个图片框架,当出来上面那组图片的其中一张时,其他该组图片隐藏起来,既是display: none;对应到下面那组样式为display: list-item的图片,具体的js代码如下图 var idx_timer=setInterval(‘idx_photo()’,5000); idx_timer=setInterval(‘idx_photo()’,5000); 这两个主要是控制图片轮播速度的,一个是刚刚加载进去时候的速度,一个是进入后图片的轮播速度,建议填一样的 $(proImg).parents(‘li:first’).show(idx_pro_mask); [...]
2014年09月29日
中英文双语版外贸石材行业企业风站设计
石材类的网站,也是在和客户沟通过之后才去 google 了解了一下这个行业,由于以前没接触过个行业,所以在设计过程中也走了一些弯路,按照以前的思路做过两个版面,最过经过修改和客户沟通过过后,最终定下的版面属于简洁型! 最终的效果图: 由于是石材行业,所以最终采用了深灰色为主,有了少许的绿色做点缀,象征着这种材料的绿色、健康!企业网站主要还是以宣传为主,所以首页大部分分以文字为主,只在下面部分放了重点推荐的产品,考虑到后期的优化,所以首页设计有一个新闻版块,来经常更新信息。上面部分采用了左中右三部分的结构,左侧放了部分推荐的产品分类,中间主要是关于公司的一些信息,让客户访问这个网站能快速了解到这个公司信息,给客户形成初步印象! 整个网站比较简洁,与很多其他的企业网站的不同在于,首页展示了大量的文字信息,没有复杂的结构,所有内容一目了然,还是很好的! 中文版部分版面: 由于中、西文化的差异,所以中文版的网站采用了与英文完全不同的风格,比较符合中国浏览者的浏览习惯,中文版的相对来说比较大众化!
2014年09月26日
兼容IE、Firefox等多浏览器的加入收藏(BookMark)代码
说起加入收藏,对于建站的人来说并不陌生,尤其是中文网站这个功能可以说是必备的功能,而这些功能都是通过JS实现的,但由于现阶段浏览器众多,而且每一家厂商对不同的JS的兼容性不统一,所以很容易造成有些js效果在有些浏览器上浏览时效果出来不了,这时我们就必须针对不同的浏览器有不同的写法。虽说英语网站客户对这个功能要求的比较少,但是还是有一些客户需要有这个功能! JS代码: <script type=”text/javascript”> function addBookmark(title,url) { if (window.sidebar) { [...]
2014年09月11日
Div ul等框架背景透明,内容文字不透明(css)
Div ul透明css样式代码 background-color:#935637; filter:alpha(opacity=50);适用于IE6/7/8浏览器 -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5;适用于w3c标准,即适用于火狐,谷歌,苹果等等 一般一起写就能适用于各种浏览器 [...]
2014年08月29日
外贸购物网站列表页面实现多个缩略图预览效果
多数的外贸购物网站一个产品都会有多个图片显示,通常我们会在产品详细页面才显示产品的不同颜色以及细节图片,而且一个页面只能有一个这种效果,也就是说如果要看同一产品的不同颜色及细节图我们必须要进入到产品详细页才可以,这就多了一个步骤,如果能在产品列表页面就能显示出这些信息,那么浏览者就会更有针对性,只有自己喜欢的才进入详细页浏览,节省时间,这个效果如何实现呢? 引入jquery这个不必多说,这个Jquery的版本最好不要太低, 最关键的是我们还需要引入多个JS, <script type=”text/javascript”> “ZAL” in window || (window.ZAL [...]
2014年07月31日
Jquery 可以自动伸缩的搜索框
通常情况下,外贸网站中的搜索功能都是由搜索框各一个搜索按钮组成,我们做的最多的就是给搜索框或按钮一个不同的CSS样式,让其与整个网站的风格匹配。便有时候为了让网站整体风格匹配,默认情况下会将搜索框隐藏,只出现搜索按钮,在浏览者需要搜索的时候搜索框才会出现,那么这样的功能该如何实现呢,下面我们来看看实现这个效果的方法,当然Jquery是肯定会用到的: 默认情况下搜索框和搜索按钮肯定都是必不可少的: <div> <div id=”sb-search”> <form> <input placeholder=”Enter your search [...]
2014年07月28日
骑行服、自行车配件外贸购物商城设计
外贸购物商城做得比较多,骑行服、自行车配件之类的外贸购物网站以前也做过,所以做起来相对也比较轻松,这个客户自己没有说什么要求,可以完全自己发挥,因为是骑行,又是自行车行业的,所以动感较强,最终选定了红色、黑色搭配,展现出狂热、稳定!结构上沿用通常做法,头部就是放置LOGO、购物车、搜索、导航之类的,然后下边是大的图片切换,下面会有图片+文字展示的产品分类和一部分可以后台自定义的产品,底部有关于企业的一些介绍和购物帮助之类的信息和版权,整体效果: 整体上自己发挥的空间比较大,做完之后,自己也有进步! 如果你有外贸购物商城网站建站需求,欢迎随时联系我们 QQ客服:415682727 电话:020-39907297
2014年06月30日
纯CSS绘制多边形(五角星、五边形)
如果网页要用到五角星,我们通常想到的最直接方法是在Ps里面绘制一个五角星再存成图片插入网页中,下面我们就来看看如何通过CSS绘制五角星: 网页代码: CSS样式 #star-five { margin: 50px 0; position: relative; [...]
外贸陶瓷企业网站设计制作
陶瓷类的外贸网站,第一次接触到这到行业,如果是购物网站兴许还好下手一些,但是企业站就需要点儿时间了,好在客户自己的要求比较清晰,刚开始沟通就发过来一网站要求参考,别的也没多说,然后就根据参考站然后再结合自己的思路出了首页效果图,客户看过之后觉得还是参考站的结构比较好,所以结构上就以她发来的网站做参考了,但是版块在实际操作时还是有区别,因为所属行来和产品不同,所以也做了部分调整,这样反复修改了几次,首页总算是确定下来了,接下来就是内页了,原本首页确定以后内页相对来说是十分简单的,但是应客户要求,很多内页的版面都需要重新设计,而且页面比较我,所以在设计的过程中花了不少的时间。最后经过与客户的多次沟通,内页也都确定下来了。总体来说整个制作过程还是相对愉快的,客户是一个比较细心的人,所有的要求都讲得很清楚,所以也让我少走了很多弯路,非常感谢! 第一次的效果图: 最终效果图: 更多网站案例可到onepound官网浏览!
2014年05月27日
日语外贸电子产品购物商城设计
第一次做日语的网站,以前对日语的网站也接触的比较少,和客户交流过后自己又看了不少的日语网站才着手开始做,这个客户的主要产品是手机保护壳 附件等周边产品。这个客户比较细心,虽说前前后后改了很多次,但总体来说还是挺顺利的。从对日语网站的一无所知到这个购物商城做下来,我也算对日语网站有了一点儿小小的了解。日语网站和英文网站的差别还是特别大的,大多数的日语网站首页出现轮换图片的比较少,但他们首页右上方会有很多的广告图片,各种尺寸的都有,有的甚至会超过一屏的位置,而且首页大多会有一个位置放日历,其他如功能方面和英文的差不多! 效果图如下: 虽然后来也修改了不少,但自己也成长了不少!
2013年12月30日
新上线的外贸女装企业站
最近刚上线了一个外贸女装的展示型风站,网站以简洁的风格主,颜色选用客户已经定好的梅红色。由于客户要求简洁大气,最初的时候只做了刚好一屏的高度,但是客户看后觉得东西太少,就又在原来的基础上展示了一部分产品。 网站头部放的东西比较少,右侧加上了二维码 中间部分设计了一个比较大的图片轮换,图片切换不同于一般的简单切换,而是采用了多种不同的过渡效果自由变换,使得整个网站看起来更为活泼、时尚 底部有部分产品的展示,使得整个版面更为充实! 如果你有外贸企业网站建站需求,欢迎随时联系我们 QQ客服:415682727 电话:020-39907297 MSN:xueposter@gmail.com
2013年10月31日
即将上线的外贸企业站
长时间以来都是一直在做外贸购物网站,拿到这个外贸企业站的时候还有点儿束手无策呢,不过好在客户的要求比较明确,要求简洁一些,以黑色为主,而且也发来了参考站,所以在做的时候也还算顺利,做效果图的时候做了两种风格的,我自己觉得比较好的一版竟然被客户否决了(不过,客户喜欢就好) 考虑到网站后期需要做优化,所以在首页添加了NEWS这个版块! 如果你有外贸购物网站建站需求,欢迎随时联系我们 QQ客服:415682727 电话:020-39907297 MSN:xueposter@gmail.com 全国免费电话:800-999-8262 更多 外贸网站建设案例》》 官网:https://www.onepound.cn
2013年08月29日
css解决外贸网站文章两端对齐的问题
通常情况下,在外贸网站建设过程中,对于文章的排版是一般只是做一个文字大小和行高的设定即可。文章通常是左侧文字是齐的,右侧由于单词的长短不一,多数是参差不齐的,但有客户特别要求所有文章的文字的两端也要对齐,开始以为这个功能实现不了,仔细查阅资料过后才知道原来CSS有一隐藏属情可以解决这一问题。 下面就对这个属情做一个详细的分析: text-justify : auto | distribute | distribute-all-lines | [...]
2013年07月30日
SuperSlide 插件实现外贸站中无限制选项卡效果
在外贸网站建设过程中,对于选项卡这个效果,相信多数人并不陌生,尤其是外贸购物网站,会经常用到选项卡这个效果,我们最常用的是通过JS实现,但这样就有一个弊端,如果选项卡的个数未知的情况下,JS就无法控制,容易报错,下面我们就来看看通过SuperSlide 插件轻松解决这一问题。 首先需要引入两个js 测试效果代码: /* css 重置 */ *{margin:0; padding:0; [...]
2012年10月30日
外贸建站新功能之产品批量管理
最近万方后台新增加了一个产品的批量管理功能 主要是对产品进行批量上传,将产品导出到excel表格内,以及批量修改产品 这个功能的好处就是既可以快速新增,修改产品又可以将一天内最近的一次修改信息保存到服务器上,这样就可以在发生不可恢复性的错误时(如将产品误删),将最近时间段的产品还原(此操作需万方工作人员协助完成) 该功能的操作很简单: 1。如果你是上传新产品,那么请到后台批量上传产品页面下载模板,然后再模板内添加数据,最后上传模板添加产品 2。如果你是修改产品信息,那么请到批量导出产品页面,将产品信息导出来,修改后再到上传产品页面上传 注意:如果是修改产品,请导出最新的产品信息,以免丢失产品 如果你有外贸购物网站建站需求,欢迎联系 QQ客服:415682727 电话:020-39907297 [...]
2012年09月29日
外贸建站网站打开过慢的原因
外贸建站网页打开过慢,这时你是否会认真考虑 他是由于客户的网速引起的还是由一些其他原因导致的?例如: 数据库、服务器、编程语言、web容器… 外贸网站网页打开速度一般在2秒以内为宜,如果太慢就会导致客户流失,就拿我来说好了,如果我要买某一件商品,而恰巧朋友介绍一个网站说那里的商品很 好,于是我就进去瞅瞅,但是打开了半天网站还是一直在那转悠转悠,这个时候我就会毫不犹豫的关掉该网站,并且再不会进入这个网站。一般客户 都是没什么耐心的,他打开你的网站就希望立即有东西展示在他眼前,最好那个东西恰巧又是他喜欢的,那样他就不用一直在点击网页。。。 今天我就来说一下导致外贸建站网页打开速度过慢的原因之一————数据库 大家可以先来看一个例子: 从一个8万条数据的表里面取12条数据 优化前: [...]