您的位置: 新疆信息港 > 教育

淘宝网店海报设计技能我爱骡网站前端开发设

发布时间:2019-05-15 06:55:10

1 : 我爱骡:站前端开发设计中的SEO技能

在进行站前端开发设计的时候,如何做到用户与SEO兼得,是每个站长都要斟酌的问题,很多时候要做到确切不容易,下面整理几个小技能,大家可以看下。

1、文字替换图片

这类手法在LOGO的处理上为常见,很多时候人们会把首页的LOGO加上H1标签,可是H1标签里如果没有文字的话,效果肯定不好,因此很多人会在logo上加上alt描写,但是肯定还是没有直接文字或锚文本来的效果好,这个时候我们就需要用到这个技能了,我们来看1下1般人的做法:

h1 class=main-logo

a href=#

img src=images/g alt=淘客站长 /

/a

/h1

下面我们来看下如何应用CSS实现文字替换图片:

h1 id=tk

span淘客站长/span

/h1

下面是CSS代码:

h1#tk {

width: 250px;

height: 25px;

background-image: url(f);

}

通过这类方法,我们就能够很好的兼顾用户体验和SEO。

2、文章列表字数截取问题

这是所有站都会遇到的问题,如上图所示,文章列表如果字数太多,就会分成两排或把列表挤变形,这个时候就需要截取标题的字数,这样1来对SEO是很不利的,这个时候我们可以用CSS来控制,不截取字数,但是显示的依然是截取字数的,这样1来,在美观及SEO上都能统筹到。

我们来看下页代码:

div class=list

ul

lia href=#多个启发灵感页面站设计多个启发多个启发灵感页面站设计多个启发/aspan⑴4/span/li

lia href=#315个JS广告代码和269个殊效/aspan⑴4/span/li

lia href=#SNS多个启发灵感页面站设计多个启发多个启发灵感页面站设计多个启发站/aspan⑴4/span/li

lia href=#阿里巴巴推商人/aspan⑴4/span/li

lia href=#谷歌评估必应搜索算法/aspan⑴4/span/li

lia href=#谷歌评估必应搜索算法谷歌评估必应搜索算法/aspan⑴4/span/li

lia href=#汉王创艺高手+无线0604数位板/aspan⑴4/span/li

lia href=#跨过后台开发的那道槛/aspan⑴4/span/li

lia href=#09年国外100大设计博客站/aspan⑴4/span/li

lia href=#阿里巴巴推商人/aspan⑴4/span/li

/ul

/div

再来看下CSS代码:

body{

padding:2em;

font-size:12px;

font-family:SimSun;

}

.list{

width:300px;

}

.list ul{

margin:0;

padding:0 0 0 30px;

list-style:none;

background:url( 8px 5px no-repeat;

float:left;

}

.list ul li{

clear: both;

float:left;

width:100%;

height:20px;

}

.list ul li a{

float:left;

margin-right:60px;

padding-right:10px;

height:20px;

line-height:20px;

overflow:hidden;

}

.list ul li span{

float:left;

margin-left:⑹0px;

width:60px;

height:20px;

font:11px/20px Times New Roman, Times, serif;

color:#ccc;

}

再来看下显示效果:

可以看出,标题中过剩的字数已没有显示出来了,而html代码中的标题却很完全。

3、用CSS来控制页的布局

大家都知道在1个页中,越重要的东西越靠前越好,而在实际的页设计中,有的时候由于推敲到用户体验而不能不把重要的内容放到后面,其实,我们还是把重要性强的内容靠前,次要的东西放置靠后1些,然后用CSS来定位实际显示的位置。

上下布局:

html

head

style

#navigation {position: absolute;top: 10px;left: 50%;width: 800px;margin-left: 400px;text-align: left;}

#content {position: absolute;top: 150px;left: 50%;width: 800px;margin-left: 400px;text-align: left;}

body { text-align: center; min-width: 600px;}

/style

/head

body

div id=contentcontent!-- SEO optimized content text goes here.--/div

div id=navigationnavigation!-- navigational elements, ads go here--/div

/body

/html

左右布局:

html

head

style

#navigation {position: absolute;top: 0px;left: 400;width: 200px;margin-left: 400px;text-align: left;}

#content {position: absolute;top: 0px;left: 600;width: 600px;margin-left: 400px;text-align: left;}

body { text-align: center; min-width: 800px;}

/style

/head

body

div id=contentSEO optimized content text goes here./div

div id=navigationnavigational elements, ads go here/div

/body

/html

混合布局:

html

head

style

#top {position: absolute;top: 10px;left: 50%;width: 800px;margin-left: 400px;text-align: left;}

#left {position: absolute;top: 150px;left: 50%;width: 200px;margin-left: 400px;text-align: left;}

#main {position: absolute;top: 150px;left: 50%;width: 600px;margin-left: 200px;text-align: left;}

#right {position: absolute;top: 150px;left: 50%;width: 200px;margin-left: 0px;text-align: left;}

body { text-align: center; min-width: 800px;}

/style

/head

body

div id=mainoptimized main body/div

div id=leftleft panel/div

div id=toptop panel/div

div id=rightright panel/div

/body

/html

本文由我爱骡提供,原文链接:,转载请注明链接出处。

2 : 关于对淘宝女装海报设计的再思考详解

这篇教程是向聚知识的朋友介绍关于对淘宝女装海报设计的1些思考,希望这篇教程能对大家有所帮助!

1开始拿到这张图片的时候,我的想法是把它做成1个系列。1件纯白色的露肩雪纺衫,它的特点可以大致归为两大类:1是素净,恬淡,由于它白,由于它设计简洁明了,没有太多细碎的东西。第2个特点就是性感,由于露肩,露肚子。1件偏年轻的春夏秋装。模特是气质干净俏丽又带着点文静的欧美模特。面料是雪纺,手感想来也是不错的,价位在雪纺短衫中也不低,在200元以上。以上这个思考进程算是对产品的定位,也影响到对设计风格的掌控。

固然,在做海报之前我们要把图片本身的问题解决了:耳机。这个图片拍的在我看来是主题不明的,耳机在我看来是多余的。那末就要动用基本的修图工具把耳机修掉。简约就是美这句话一样适用于商业摄影,细枝末节的东西不要多。

我构思出的1个系列,包括4张1920px宽度的全屏海报:

欧美时尚。深色、纯色背景基本不动,全部画面色采整体偏紫色。

梦幻纯真。由于衣服偏年轻,想表现这类单纯的感觉,所以我想到了蓝色。在搜集参考案例的进程中,想到了蓝色和黄色的搭配,1种相对跳跃、轻盈的搭配。为了体现这类年轻的感觉,又为了将画面尽量的简化,我想到了用1些剪纸的花瓣、云朵,和简单的形状来代替真实场景素材。

春日森林。这个我构思的很好,光与影的效果都构思了,但做出来的效果自己感觉不满意。

古典油画。推敲到这件衣服的特点(素净+性感),斟酌到模特的气质,我选用了古典优化这个题材。其实1开始想做这个题材是由于在某当代艺术站上看到了这张图:

1下子就被这张优化吸引了。为了做1张类似的海报,我找了很多类似油画的素材。

我来先来看1下几个方案:

原图。原图是作为女装案例展现的。的问题是主体不明,既像雪纺衫片子,又像耳机广告。

现在我们单独看这1张:

做完了这1张我的病又犯了,我们做海报到底为了甚么?

这张海报给人的印象就是1个女模特站在画布前摆了个常见的姿式拍了张照片。虽然油画痕迹、艾菲尔铁塔、百合花都是合成上去的,但成型后的画面,没有魔幻。没有玄虚,没有亮点,就是1张简简单单的照片。既然如此,为何不在开始拍摄的时候就悬挂好1张类似的画布呢?这不是简单省事很多吗?

从这个角度看,我做的这张海报只不过是换了个背景,加了几个字,并没有甚么特别的东西。

我们设计海报的目的是什么呢?终究目的是要把东西(雪纺衫)卖出去。1张放在店铺首页的图,它的直接目的就是让买家看见了就产生点击的愿望,点击进入详情页或某个专题页面1探究竟。首页这张大海报的使命就是点击愿望。1定要好看。

海报好看,1是指衣服本身好看。而衣服好不好看,顺不顺买家的心,还要看模特好不好看。也就是说,我认为,1个店铺受不受欢迎重要的是衣服本身、模特拍摄。至于我们美工这类后期的设计工作,只能算是锦上添花的作用。做好了叫锦上添花,做不好叫弄巧成拙。

这里又牵涉到1个问题。作为1个美工,我们应不应当持1种营销的思维去做设计。1开始,我的观点是美工要懂营销。做画面是为了卖东西。这是很多所谓论坛大神的观点,也常常是运营人员对美工的要求。现在,我的观点又变了。我返璞归真了。我认为,设计师从设计的角度动身作出的的作品就是合适营销的。换句话说,设计师作出的作品符合设计的审美原理,那末就是可以顺利销售的。乃至说,设计师的作品在设计上有非常出彩进而出色的地方,那末就是非常能勾起人的审美愿望的,也是能顺利完成营销目的的。

不是说我们美工不能懂营销,相反的,我们美工对营销、对消费心理学要有自己的1套理解,但我们做设计的实际进程应当从设计本身的角度动身,把设计本身做好。好的设计是高大上的,是受买家欢迎的,是能勾出发点击愿望的,由于好的设计满足了人审美的愿望。如果说在1个电商店铺里,设计师把东西做的很有设计感,但卖的不好,那就不能从设计方面找缘由。

以上就是关于对淘宝女装海报设计的再思考详解,希望能对大家有所帮助!

3 : 从站设计看淘宝和拍拍

今天谈谈自己对国内两大C2C站的分析,国内两大C2C站无疑就是淘宝和拍拍了但是两者的差距之差异让人费解,我们先来看看1组数据:

根据易观智库EnfoDesk发布的《2012年第2季度中国上零售市场季度监测》数据显示,2012年第2季度中国上零售(B2C+C2C)市场交易范围到达2788亿元,环比增长27.4%,同比增长45%。其中C2C的交易额为1800亿!

2012年1季度中国C2C购物站市场份额

从上图 可以看出淘宝的市场份额约为拍拍的20倍,腾讯具有中国的用户群,为何在电商C2C市场的份额却如此之少呢?

首先我从两个站设计上来看:淘宝的首页突出了商品搜索和商品分类,搜索和商品分类占了首页版面的近60%,而拍拍的首页设计主要是突出了商品推荐和商品分类,其中商品推荐占了首页页面的近70%.淘宝的首页首先是突出了搜索,将淘宝搜索放在首页头部,并且突出明显,其次是淘宝服务和推荐等。然后的页面就基本上是商品分类内容。拍拍的首页,虽然也将搜索放在了头部但想比较而言没有突出(更像1个普通站的站内搜索),其次的主题内容便是分类及推荐,采取分类信息加相应推荐的方式进行推送。

那么这两种有各有甚么优缺点呢?从美观方面,拍拍更胜1筹;从用户体验角度去看,我更喜欢淘宝的模式,这其实不是由于淘宝知名。由于很明显淘宝的首页布局更能方便用户找到商品,1般用户去上C2C站可能不知道具体要买甚么,但用户1定知道他要哪1类东西,比如说鞋。那么我进淘宝很自然的要末直接在头部突出的搜索框内输入鞋去搜,要末去点进去鞋的类目里面再去找(淘宝的首页也只给了我们这么两种方式)。而拍拍首先搜索框不突出,用户进首页1般不会去搜,而会向下去找分类,分类中却突出了推荐,用户第1眼肯定回去看推荐的商品。然后找不到要的商品才会去看类目。很明显淘宝的设计更容易让用户找到商品。

我在淘宝和拍拍里搜鞋 男。我们在看看两者的搜索结果展现方式:

再看看拍拍的:

用户找商品先看的是甚么呢?大家找商品先看的是甚么呢?没错是图片。但是拍拍的搜索结果列表里明显没有突出图片而是文字和红色字体的价格。对用户体验来说无疑是1处败笔。

从Alexa的数据显示,淘宝的搜索页面月访问率: 25.89%; 6.04%; 2.93% ; 2.86%;共约38%;

拍拍的搜索页面月访问率: 7.84% ; 1.63%; 0.67%; 共约10%;

淘宝的搜索页面访问率近拍拍的4倍,这个数据就很好的证明了拍拍在站设计上的失误。这次就先说这么多,下篇将从运营角度去分析,转载请注明作者信息。作者:小路。理想在路上,Admin5首发。邮箱:zhangjmy@ :.

调经可以吃益母颗粒吗
经血不畅痛经吃什么药
月经后期有血块什么危害
猜你会喜欢的
猜你会喜欢的