阅读更多

2顶
0踩

Web前端
网页设计既是一门独立学科,也是一种艺术形式。网页设计的工作至少一半是基于坚实的代码和设计知识,而另一半则是对于美感的认知,什么好看,什么不好看。每一个网页设计师都有着坚实的基础知识和他的核心竞争力,这些确保他能脱颖而出。

那么一个设计师的基础应该从哪里开始构建呢?当然,既然称之为基础,那么它必然不可能一蹴而就。经验是没有替代品的,所以系统的设计课程(无论是否正式教育)还是很有帮助的。另外很重要一点,是你需要不断挑战自己,逼迫自己走出舒适区的边界,只有这样才能拥有更强大的技能,成为更优秀的自己。只有这样才能留住客户,也会让更多客户找上门。



如果成为优秀的网页设计师是你的目标,那么下面所说的7大技能是你必须具备的,尽管它们都不涉及技术和复杂的计算机技巧。

1、熟悉设计的完整流程

请注意,我们强调要了解的是“完整”流程。怎么算是完整呢?网页设计和平面设计有许多重叠的地方,以至于在许多学校教育中它们并没有明确地区分开。这也是为何不少网页设计师对于设计和设计流程有着颇为深入的了解。一般而言,他们的知识结构应该包括下面的内容:
色彩

色彩是网页设计的核心,因为它是快速有效构建主题和样式的基础。另外,色彩和心理学关系紧密,合理地运用色彩可以提高用户体验,让访客流连忘返。
轨迹

这里所说的轨迹是用户浏览网页时视觉运动的轨迹。要掌控用户的浏览轨迹,你需要懂得正确使用色彩、层次结构、深度、形状和线条的方法,明白透视法,空间和方向的运用。
平衡和比例

这所说的平衡和比例指的是视觉上的稳定性和平衡。比例上,了解对称和非对称的使用技巧。在设计信息流的时候,各个元素的比例控制是重点。
间距

其实间距控制说起来并不复杂,一个元素和另一个元素之间的距离控制。但是要让网站用户体验良好,控制好各个元素的间距并不是一句话说的清楚的。较大的间隙能让布局更大气,富有呼吸感;叫窄的间隙能让内容更加靠近,呈现相关性,拥有更加的阅读体验。衡量你的各个元素之间的关系,明白自己的目的,掌握好间距的差异与平衡。
2、让HTML如臂使指

作为网页设计师,你无需像其他程序那样精通C/C++并能让自家的扫地机器人自动发推,但是你必须熟悉HTML代码。有些设计师认为不懂代码也无所谓,但是更多的设计师开始认识到熟悉HTML代码是成为合格设计师的必备技能。即使不够熟悉,最起码你得了解HTML的基础知识,最起码!

HTML是所有网页的基础框架,网页设计师了解它是应有之义。了解它意味着你能对网页设计有着更精确的掌控,让它拥有更好的可用性,更加易用。你可以拥有属于自己的展示网站,可以更好的出售你的设计和服务,打破设计能力的界限。
3、掌控创意文案的技巧

作为网页设计师,你常常会应客户要求做许多设计之外的工作,有时候甚至会被要求为网站撰写文案,尤其是当网站没有配备专职文案的时候。想想看,如果客户发现他们的网页设计师能写得一手创意爆棚的文案的时候,他们绝对会如获至宝的(当然你也有了涨价的理由了)。不要以为你的文案技能只能在为客户做网站的时候用上,这对于你而言绝对是无与伦比的无形资产,当你做市场营销的时候,设计与文案的结合能让你和其他设计师拉开距离。

好文帮你加技能点:《年度最佳教程!7招教你写出互联网顶尖文案!》
4、坚持不懈学习

作为一个网页设计师而言,“学无止境”并不是一句单纯的口号。你确实需要不停的学习新技能,发掘新创意,它能提高你对设计的热情,打动你的客户。

另外一个让你不得不坚持学习的重要原因来自网页设计行业本身——不断进化的设计趋势和不断涌现的新技术。你刚刚学会了视差滚动和扁平化设计,Material Design 又立刻出现在你眼前。作为一个设计师,学习是需要坚持不断的,只有对新趋势新技术了如指掌才能让你保持住你在设计圈的位置。
5、发掘商业技能

越来越多的设计师开始选择成为自由职业者,而许多还未曾独立的设计师也开始宣传属于自己的设计品牌,这也是为什么在自己身上发掘更多商业技能成为一件必要的事情。你拥有自己的业务,销售的是自己的设计技能,如果没有系统的商业技能,你会挣扎于营销、找客户、维持客户等一系列冗杂的事务中无法脱身。

如果你懂得运营自己的业务,那么你会明白如何通过与客户沟通来做决策,学会在职业生涯中高效处理多任务,保持作为网页设计师的创意思维,灵活多变地的应对多种客户和不同项目,在闲暇的时候发展爱好,锻炼身体。
6、学会倾听的艺术

沟通是一门艺术,而倾听就是其中的关键。和客户构成业务关系,也是起始于你们的沟通,首要的一点,就是听取客户的需求,而这是构成后面一系列沟通与合作的基础。而且,作为一个合格的倾听者,不仅会在客户沟通中起到作用,还会运用到许多其他的地方。作为一名网页设计师,为何你不能具备这一技能呢?

设计师倾听技能包:《告别玻璃心!设计师如何正确听取反馈》

如果你无法正确听取需求,甚至拒绝去听,那么你是无法成为一名合格的网页设计师的。许多客户会在设计过程中,不断提意见或者补充要求,这种情况非常普遍。不称职地忽略这些声音,或者在沮丧中继续修改,伤害客户,还有影响业务。学会倾听,了解要求背后的深层需求和目的,然后提供你的专业意见和建议,实现它,皆大欢喜。
7、向着职业巅峰前进

很多时候我们会用王大锤那句“出任CEO,赢取白富美,走上人生巅峰”来自嘲,但是实际上,每个行业都有它的专业标准和可见的“巅峰”,你需要这样的目标来鞭策自己。也许你无法在一夜之间达到目标,甚至几年之内都无法抵达那里,但是瞄准目标,设定计划,是能够让你保持激情前进。在这个过程中,你会发现更多的方法来加快这一过程。
结语

从本质上来讲,所有的这一切都是为了让你完善自己,走向成熟。当你越努力地奋斗超越单纯的设计,那么你越有可能成为一个名成功的网页设计师。终有一天,你会成为别人眼中仰望的背影。

本文转自优设网
  • 大小: 67.8 KB
来自: 优设网
2
0
评论 共 0 条 请登录后发表评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 小程序中实现搜索功能

    我们本篇利用自定义连接器实现了关键字的模糊匹配功能,总体上还是需要熟悉云开发和微搭低代码的相关知识才可以顺利开发出功能来。涉及到业务逻辑的部分免不了要写前端或者后端的代码,总体上写代码还是更灵活一些,如果用无代码的配置方案就要求官方能力足够好才可以。...

  • 批量替换小程序,支持批量查找

    批量替换小程序,支持批量查找,大小写查找文件,用于多文件的查找和替换,做网站也非常适合

  • regular expression grammer

    语法 表达式说明 . 任何单个字符,用作换行符 (\n) 以外的任何单个打印或非打印字符的通配符。 例如,正则表达式 c.t 可匹配 cat、c t、cot 等字符串,但不能匹配 cost。在本例中,句号 (.) 是一个代表单个字符的通配符。它出现在字母“c”和“t”之间,因此字符“c”和“t”之间的任何单个字符都与表达式匹配 - 即使是空格

  • 小程序原生使用wxs踩坑:使用正则replace字符串报错Unexpected token `/`

    wxs踩坑,使用正则replace字符串报错Unexpected token `/`

  • 小程序基本命令

    onLoad: function () { // 生命周期函数--监听页面加载 onReady: function () { // 生命周期函数--监听页面初次渲染完成 }, onShow: function () { // 生命周期函数--监听页面显示 }, onHide: function () { // 生命周期函数--监...

  • 微信小程序使用正则表达式替换HTML标签

    小程序中直接使用正则会报错,需要用它自身提供的方法: https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxs/06datatype.html 代码: 其中  f  即传入的富文本内容,font为替换之后的内容 let reg = getRegExp("<[^>]+>", "g")...

  • 微信小程序字符串替换

    替换全部   如果需替换字符串需要/要加转义符 var str = 'welcome /our world'; var str2 = str.replace(/\/o/g,'123');

  • 微信小程序-正则表达式

    手机号码验证: if (!(/^((13[0-9])|(14[0-9])|(15[0-9])|(17[0-9])|(18[0-9]))\d{8}$/.test(你要验证的手机号))) { wx.showToast({ title: '手机号码有误', duration: 2000, icon:'none' }); } 邮箱验证 if (!(/^[a-zA-Z0-9_.-]+@[a...

  • 微信小程序使用正则表达式出现xxx.replace报错问题

    js隐藏电话号码的中间几位,xxx.replace报错

  • javascript 正则表达式测试小程序

    备忘只用,代码不完全,没引用xiang

  • 微信小程序搜索框样式并实现跳转到搜索页面(小程序搜索功能)

    主要介绍了微信小程序搜索框样式并实现跳转到搜索页面(小程序搜索功能),需要的朋友可以参考下

  • js/小程序 正则获取指定字符串后的字符串

    场景:源数据字符串为 http://zhipur.com/item?data=SN120180525FEOCE ,需要把 ?data= 后面的字符串(SN120180525FEOCE)取出来 实现:用 stringobj的match()方法实现 代码: var str = 'http://zhipur.com/item?data=SN120180525FEOCE'; var code1...

  • 微信小程序wxs文件中使用正则replace字符串报错

    需求把 12345678 八位数转换成日期格式 1234/56/78 wxml中引入 使用 wxs使用 wxs很多语法不支持,必须使用getRegExp 如果继续replace报错,可能是你的值有问题,要先转换成字符串 wxs有时候会toString等报错,我这里使用var values = ''+value;就成功转换了,并且没有报错。 ...

  • 小程序框架模板替换...

    {{index}}:{{msg}}     Time:{{time}}   在wxml文件中定义模板并使用,其中data="{{...item}}",data在js文件中定义如下:  /**    * 页面的初始数据    */   data: {     item:{       index:0,       msg: "this is a

  • JS replace 方法只替换一次的问题(小程序批量更改img的src值)

    需求:把后端返回的数据,img中的src都添加前缀路径且把每个选项都拆分出来 let ImgUrl = 'src="http://aa/abc' let a = '<p> A.嘻嘻< img src="/data/question/image/20200812234831_549.png" width="40" height="40" alt="" /> </p > <p>B.嘿嘿< img src="/data/question/ima

  • 微信小程序之正则表达式(完整版)

    ///手机号码验证: if (!(/^((13[0-9])|(14[0-9])|(15[0-9])|(17[0-9])|(18[0-9]))\d{8}$/.test(你要验证的手机号))) { wx.showToast({ title: '手机号码有误', duration: 2000, icon:'none' }); } //邮箱验证 if (!(/^[a-zA-Z0-9_.-]+@[a-zA...

  • 微信小程序:正则匹配判断电话号码

    1.js// formSubmit 表单提交 formSubmit:function(e){ console.log('form表单发生点击事件,携带的数据为:',e.detail.value) console.log('电话:', e.detail.value.tel) //表单点击提交的时候获取数据 //正则匹配 // var mobile = ne...

  • 微信账号支持的格式(正则验证的方式JS实现)

    微信账号4个规则微信号是微信的唯一凭证,只能设置1次;可以使用6-20个子母,数字,和下划线和减号;必须以字母开头(字母不区分大小写);不能设置中文.

  • 编写一个程序,实现"全部替换"功能.

    # 编写一个程序,实现"全部替换"功能. def file_replace(): file_name = input("请输入文件名:") # 判断输入的路径或文件是否存在 try: f_read = open(file_name) except: print("路径或文件不存在,请重新输入.") return f...

  • 微信小程序 wxs 使用正则替换字符串

    文章目录什么是 wxs如何使用正则表达式举个例子 什么是 wxs 微信小程序 wxs WXS(WeiXin Script)是小程序的一套脚本语言,结合 WXML,可以构建出页面的结构。 WXS 与 JavaScript 是不同的语言,有自己的语法,并不和 JavaScript 一致。 https://developers.weixin.qq.com/miniprogram/dev/refere...

Global site tag (gtag.js) - Google Analytics