阅读更多

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 条 请登录后发表评论

发表评论

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

相关推荐

  • 小程序中实现搜索功能

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

  • 正则表达式检验小程序

    qt,边学习边写的一个正则表达式检验小程序,有兴趣可以下载下来进行学习。qt,边学习边写的一个正则表达式检验小程序,有兴趣可以下载下来进行学习。qt,边学习边写的一个正则表达式检验小程序,有兴趣可以下载下来进行学习。

  • 微信小程序正则

    //微信小程序的 var reg = getRegExp('^(\d{3})\d{4}(\d{4})$', 'g'); return tel.replace(reg, '$1****$2'); //普通js的 const reg = /^(\d{3})\d{4}(\d{4})$/ return tel.replace(reg, '$1****$2'); 微信正则是使用两个引号代替普通js正则中的两个反斜线(//),而\为转义字符. /^(\d{3})\d{4}(\d{4})$/ === '...

  • JS正则表达式验证数字非常全

    <script type="text/javascript">function SubmitCk() {var reg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;if (!reg.test($("#txtEmail")...

  • 小程序搜索框搜索、查询(模糊搜索、关键字查询)

    前言: 搜索框搜索的时候,我们想要模糊搜索,关键字查询。 只要有包含搜索框里面的值的话,都会被搜索出来 这种搜索,宁可少输,不可输错。 正文: 演示效果: 关键代码: // 搜索框内容改变事件 inputTyping: function(e) { console.log("input-----",e) var value = e.detail.value var that = this; var usersList = that.data.usersList

  • 小程序基本命令

    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")...

  • 微信小程序 功能函数 替换字符串内的指定字符

    对于文章的代码或者特定文字的替换为目标查找的相关替换方法的坑js方法:str.replace('原字符','目标字符')var str = 'abcadeacf';var str1 = str.replace('a', 'o');alert(str1);// 打印结果: obcadeacfvar str2 = str.replace(/a/g, 'o');alert(str2);...

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

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

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

    手机号码验证: 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...

  • 微信小程序正则表达式

    下面是几个常用验证的正则表达式 用到的请点个赞噢~ var names = /^[\u4E00-\u9FA5A-Za-z]+$/; //姓名 var phonetel = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/; //手机号 var emailnums = /^[a-zA-Z0-9_.-]+@[a-z...

  • 小程序自定义搜索框_将自定义搜索提供程序添加到Windows 7以及高级搜索技巧

    小程序自定义搜索框Disclaimer: Many of my tips have crashed cars, broken lights, and caused lawnmowers to go mad. If anything here seems out of your skill level or at all scary, run screaming away from here, ho...

  • 正则,6位数字密码

    function servicePwd(){ var str = $("#numr").val().trim(); if(str.length!=6){ reg=/^\d{6}$/; if(!reg.test(str)){ alert("请输入6位服务密码"); } }else{ alert("服务密码保存成功...

  • 小程序正则表达式

    改文转载自weixin_39116836的正则表达式,原文地址是:https://blog.csdn.net/weixin_39116836/article/details/80996123 手机验证 var myreg = /^(14[0-9]|13[0-9]|15[0-9]|17[0-9]|18[0-9])\d{8}$$/; if (phone == "") { wx.showToas...

  • 微信小程序-加载html代码并替换html转义符

    最近改小程序bug,需要加载html代码,并且后台返回的html代码里有转义符(类似" <),身为一个安卓程序员,改小程序很是头疼,改了将近2个小时,终于是修改好了(不容易呀,还是安卓舒服)。以下是修改之后的效果图: 先进行转义,以下代码 replaceSpecialChar (str) { str = str.replace(/"/g, '"'); ...

  • 小程序(一) 字符串过滤

    题目描述(60分): 通过键盘输入一串小写字母(a~z)组成的字符串。请编写一个字符串过滤程序,若字符串中出现多个相同的字符,将非首次出现的字符过滤掉。 比如字符串“abacacde”过滤结果为“abcde”。 要求实现函数: void stringFilter(constchar *pInputStr, long lInputLen, char *pOutputStr);

  • 微信小程序正则判断姓名和手机号

    这是page({})里的js data: { userName:'', mobile:'' }, userNameInput: function (e) { this.setData({ userName: e.detail.value }) }, mobileInput: function (e) { this.setDat...

  • 小程序 从后台获取的带有html标签的内容,使用正则表达式处理

    r.data.info = r.data.info.replace(/\<img/gi, '<img class="detailImg" ')

Global site tag (gtag.js) - Google Analytics