网页设计师需要知道如何编码吗?


31

作为Web开发人员,无论是前端还是后端架构师,我与许多不同的设计师一起工作,有时会发现使用设计组件令人沮丧,因为他们没有考虑过如何用基本的CSS和HTML完成设计。另一方面,作为开发人员,我希望能够从任何设计生成代码。

网页设计师是否需要了解基本的现代CSS和HTML技术?为什么这样对全面的Web设计师重要?

一些一般的想法:

  • 前端Web开发人员应具有足够的技能来编写任何设计。
  • Web设计人员应该了解用户如何与他们的设计实际交互。
  • 设计商店宁愿让设计师进行设计,而将所有代码留给开发人员。

5
您描述的是平面设计师,而不是网页设计师。

没有媒介的设计师就像没有乐器的作曲家。
亚当

以我的经验,任何网络或软件的“前端”都意味着UI,GUI或INTERFACE。这是您的意思吗?
2011年

Answers:


23

网页设计师是否需要了解基本的现代CSS和HTML技术?

是。

为什么这样对全面的Web设计师重要?

我回答“是”,因为您使用了基本这个词。

网站设计师必须了解基本的HTML和CSS技术,这与建筑师必须了解物理和材料科学,印刷设计师必须了解CMYK印刷过程以及时装设计师必须了解织物一样,这是绝对必要的。

如果你不知道什么对CSS和HTML技术,你不能称自己是“网页设计师”。您只是一个艺术家或其他什么。

关于您的想法的评论:

前端Web开发人员应具有足够的技能来编写任何设计。

假。这太简单了。有些事情无法很好地转换为网络。某些设计可能会崩溃或无法在需要支持的特定平台或屏幕尺寸上使用。

Web设计人员需要根据受众和性能要求来了解限制。知道CSS和HTML的设计师知道如何调整设计,以便使底层代码尽可能地具有响应性和效率。

Web设计人员应该了解用户如何与他们的设计实际交互。

您已经描述了UX Design,这是一门完全不同的学科。尽管用户体验设计涉及图形设计的各个方面,但实际上与CSS或HTML无关。

优秀且全面的Web设计师应该熟悉UX Design,但与UX专家合作也很普遍。

设计商店宁愿让设计师进行设计,而将所有代码留给开发人员。

这可能部分正确,但并非完全正确。内容管理系统中一种流行的范例是MVC(模型/视图/控制器)。许多设计商店希望设计师对HTML / CSS编码有所了解,以便他们可以专注于内容的表示(“视图”),而开发人员则专注于模型/控制器。

这并不是说有些商店没有雇用图形艺术家,他们只是专注于图形元素并四处推挤像素,但在我看来,他们不是Web Designer。大型网站可能会雇用图形艺术家,Web设计人员,UX设计人员,Web开发人员和数据库专家,他们全都协作以创建一个完整的网站。建立小型网站的自由职业者可能会涉足所有领域,并称自己为Web设计人员/开发人员。


17

网页设计师应该了解代码的工作原理和功能,就像印刷设计师了解纸张上的墨水外观以及纸张如何折叠或裁切一样。任何设计师都应了解所选媒介的局限性和优势。

如果网页设计师正在创建这个简陋的华丽站点,那么他或她要么学习编码的基础知识,要么在过程中的某些时候与编码员坐在一起,检查是否可以实现华丽站点,这是理所应当的。因此,我想说一个网页设计师至少需要了解代码。

我认为说“开发人员可以编写任何东西”是一种似是而非的说法,就像您不能说可以使用HTML / CSS在网络上完全复制可以打印的任何东西一样。


1
+1,特别是对于“需要了解代码”的人。我曾与无法编写代码但对媒介有所了解的人一起工作,并且足够开放以尊重开发人员的意见。它总是工作得很好。
Pekka支持GoFundMonica

6

劳伦,ghoppe和Farray都说得很舒心,所以我不会重复他们所说的任何话。出于实用性考虑,让我对您的显式和隐式问题进行另一种探讨。

对于开发人员而言,最好的方法是自古腾堡(Gutenberg)砍掉他的第一种类型以来,打印机一直在鼓动着同样的方法:坚持要求设计师从一开始就让您参与项目。明确指出,在单个像素到达屏幕之前,您必须参与讨论。

当我参与一个涉及任何异常情况的印刷设计项目时,我会立即与打印机和装订人员进行交谈。他们比我更了解自己的工艺,因此我一开始就让他们参与进来是我的职责。不幸的是,初学者,尤其是刚从学校毕业但还不熟悉现实世界的设计师,有时会忽略这一简单的步骤,最终陷入没有救生圈的金鱼草中。

在博客,论坛,客户和项目经理,本地学校和用户团体以及范围内的任何设计师中进行活动:“在开始设计之前,请与开发人员联系!”

开发人员将从不知道他们要求什么的设计师那里获得补偿,就像印前部门有时会获得无法使用的艺术品一样(设计师只能得到受虐狂追随的简报)。但是,如果您坚持要在计划表上放一个位置,则可以避免很多挫败感和时间浪费。


究竟!作为开发人员,我喜欢能够提供有关特定设计的可行性和实施成本的反馈。我可以更详细地探讨为什么某部分设计“可行”的原因可以帮助我的设计师将来创建更好的(成本更低的)设计。因此,即使设计人员无法编写代码,他们也应该能够进行交流,并且他们应该尝试理解开发人员可用的框架/工具的精妙之处。(他们越能做到,我越能更好地实现他们给我的东西。)
EthanB 2014年

1
具有讽刺意味的是,我最近完成了一个网站的设计阶段,在该网站上,开发人员处于三层公司官僚机构的后面,完全无法访问。花费了数周的时间才得到以下问题的答案:“您希望采用哪种形式的设计文件?” -最不令人满意的工作方式,这将导致客户出现问题。运气好的话,他们很快就会顿悟。
艾伦·吉尔伯森

5

是的,没有。了解目标环境的工作原理很重要,但了解使系统以这种方式工作所需的特定代码并不是很重要。换句话说-我不会担心在所有主要浏览器引擎中创建圆角的特定语法,但是我认为了解您是否可以在所有主要浏览器中创建圆角非常重要(以及需要多少代码)这样做)。

例如,仅在几年前,我们仍然对IE6感到困惑。我们为企业Intranet应用程序设计了一个绝对漂亮的设计,但是它高度依赖透明的覆盖层。IE6可以显示PNG8,但不尊重PNG24中的Alpha通道,并且使用基于CSS的不透明度需要ActiveX过滤器和其他问题。可以跳过箍以达到预期的效果,但是每个箍代表更长的开发周期,更高的错误率,更困难的维护等。除了开发和维护这种(现在很麻烦的)设计的工时所产生的直接成本外,还有一些机会成本,即占用大量开发人员的时间来修补kludgy代码库而不是使用N + 1版本。

在这种情况下,必须衡量设计中每种视觉效果的成本/收益:

  • 视觉效果有多神奇?
    是否可以用不需要那么多Construction资源的同样具有影响力的视觉代替它?

  • 可以在目标上正确再现效果吗? 如果目标无法准确地重新创建原始设计,则需要用最接近的近似替换您的设计。(值得庆幸的是,这对于网页设计师而言已不再是一个问题。)

  • 您预算了多少时间?
    您能否负担更多的建筑工时来达到您想要的效果?如果没有,您可以在更短的时间内重新设计功能吗?

  • 为了适应您的视觉效果,必须重构多少代码库?
    如果设计和构建同时进行,或者您要重新调整旧版应用程序的外观,那么编码人员将视觉效果整合到视觉上将有多难?不仅涉及重写的时间,还包括调试和维护新更改的代码的潜在时间。

上述项目要点与未列出的其他要点之间存在一些重叠。关键是,即使在这个简短列表上,也必须考虑业务成本。如果您掌握了目标系统的实际工作原理,则可以更有效地评估情况。

如果在设计之前已经了解CSS或HTML的局限性,则可以创建将在构造阶段顺利进行的设计。您还将有信心可以实施您的设计,并且知道大概的成本。这在您身边总是很方便的。


5

根据我的经验(我是一名编码人员,而不是设计师),Web设计师应该不了解代码。但是他们应该知道如何在浏览器中应用他们的工作。

对于没有足够了解Web /浏览器知识的设计人员来说,最大的问题是,他们创建的外观看起来很漂亮,但在浏览器中却无法真正使用。可能有些事情可能没有考虑的几件事:

  • 使用字体。他们使用随PhotoShop一起安装的字体,而普通用户则没有。或者他们使用Windows / Linux上不存在的Mac字体。
  • 缺乏对屏幕/浏览器尺寸的尊重。该设计无意在较小的计算机上显示。随着更小的笔记本电脑/平板电脑越来越受欢迎,考虑到较小的屏幕尺寸变得越来越重要。
  • 调整浏览器屏幕大小时应该怎么办?设计人员是否已考虑调整浏览器大小时应进行的设计。
  • 滚动条呢?该设计通常带有“ lorem ipsum”占位符。如果大量文本进入该占位符,并且我们需要滚动条,我们应该将它们放置在哪里呢?
  • 很多图像。有些设计要求您切掉许多png。这可能导致Web服务器的响应时间较长,因为初始页面要求浏览器下载所有这些png。

这些是我与设计师合作时遇到的问题。这些不是设计人员对代码一无所知的问题。但是关于不考虑如何使用设计的问题。


关于字体的要点。我已经使用PSD来工作,甚至没有在计算机上安装使用的字体。
Chris_O 2011年

4

对工作介质的更广泛的了解总是使该领域的艺术家和工匠变得更好。

许多不了解前端开发的Web设计人员很难一起工作,因为他们是不好的Web设计人员,但是因为他们根本不是Web设计人员。他们是具有一定印刷背景的图形设计师,并且正在尝试制作小册子和海报,而不是实际的网站。

这就像雇用园林设计师来改造您的浴室。他们具有设计感,并且可能了解一些基本原理,但是奇怪的是,它们在美化前草坪方面比在平铺淋浴时要好得多。

十年前,当大多数网站仍像工厂车间流水线一样建造时,让一个人做PSD,下一个人做HTML和下一个添加DB等并不是一件大事。

但是,如今,大多数渐进式Web构建都是通过敏捷过程完成的,并且团队也各不相同,并加入了大量的用户体验方法,渐进式增强功能,后端和前端集成的系统,诸如被动式Web设计等概念被抛弃等。因此,许多设计过程必须在代码中进行。无论是原型设计,用户测试,迭代设计还是您拥有什么,代码都是媒介,团队需要了解它。

不,并非团队中的每个人都需要能够编写jQuery插件。但是,团队至少应该知道他们是什么,并且UX / Web团队应该让可以写这些文件的人来编写,最终,无论要设计什么,都必须构建。


4

是。艺术家应该了解他所使用的媒体,无论是画家用油和帆布,雕刻家用大理石和凿子,还是网页设计师用HTML和CSS。

我曾经在电子游戏行业工作。最好的游戏设计师是富有创造力的人,他们具有很强的技术能力,他们了解媒介不断变化的局限性并可以为其设计。无法做到这一点的人和无法实现自己愿景的人最终会陷入困境。

我最近做了一些Web开发,其中设计师的背景完全在印刷媒体中。结果是页面非常漂亮,本来可以印刷精美,但作为网站却工作不佳。


4

对我来说,设计师/开发人员断开连接是几年前发生的事情,但是后来人们意识到,Web设计不仅仅只是制作一个模型。

对我来说,当有人称自己为网页设计师时,我期望:

a) They can design a layout either in a image editing program, or in the browser
b) Can articulate their design choices, and have sensible reasons
c) Proficient (as opposed to basic knowledge) with HTML, CSS, and JavaScript.
d) Basic knowledge of server side programming

对我来说,网页设计师是可以创建网站客户端的人。

一个好的 Web设计师将拥有所有这些,并了解他们在设计过程中所做的选择如何影响网站的用户体验。

当有人说Web开发人员时,我期望:

a) Proficient with at least one server side programming language
b) Basic knowledge of server configurations
c) Basic knowledge of client side technology (JavaScript and AJAX implementations)
d) Basic knowledge of backend architecture

一个好的 Web开发人员将拥有所有这些,并且能够了解他做出的体系结构选择将如何影响网站的前端以及向用户公开的功能。

您还会得到专门研究UX和其他比Web设计更横向的领域的人员,因为它们适用于许多不同的开发环境。

编辑:如果有人有一个优秀的设计团队的例子,可以将图形设计与网页设计区分开,我会非常感兴趣。


3

设计人员应该编码的工作原理有所了解。有时这是防止其前端开发人员杀人的唯一方法。要获得该想法,直接体验可能是最简单的方法。

当然还有其他人,但是学习编写一点Javascript不会损害您的业务。(其实时代在变,并有军队与设计师的技能家伙也可以javascript来摆脱他们的延迟性肌肉酸痛的,但是这是一个完全不同的故事)

我的一般想法:

  • 前端Web开发人员必须处理糟糕的后端和许多级别的特质,才能打扰您的设计细节。这些特性中的大多数是由于管理方面对预制后端错误选择导致的,并浪费了大量的时间来处理。

  • 网页设计师在与这样的压力大的人打交道时,不断冒着生命危险。并且应该认真考虑一些前端问题,而不是把设计丢在桌子上,然后大声尖叫到办公室:“我结束了,我做完了,从现在开始,这都是开发人员的错! ”

  • 设计商店应焚烧。


2

取决于您在哪里工作。

如果您在一家大公司工作,那么这些可能都是个人角色:

  1. 用户体验或架构专家-计划站点的信息架构/组织/制作线框

  2. 设计师-使用Photoshop或其他工具设计网站

  3. 前端开发人员-执行html / css / javascript / json / xml / etc。并编写将前端与后端集成在一起的模板代码

  4. 后端开发人员-是否进行编程以使所有内容真正动态地工作

大多数中级职位也需要设计人员处理UX决策。但是较小的地方可能需要设计师完成上述三项工作。但是前端是一个棘手的领域,里面有来自不同技能的人。如果您是需要做前端工作的设计师,那么绝对不应该期望您比HTML / CSS和JQuery或其他一些框架知识更多。期望设计师知道javascript和后端集成的更深层次的内容的要求太多了。

当然,如果您是自由职业者,则需要自己了解和做所有事情;)


1
OP并不是在问Web Designer是否也应该是专家编码人员,而是在问Web Designer是否应该了解HTML和CSS 的基础知识。即使您是Web设计人员,也不必触摸HTML或CSS文件,您仍然应该足够了解您的设计作为目标受众的网站是否可行(或者就此而言,是否可能)。
肖纳

2

我认为Web设计师应该了解HTML / CSS(即使仅限于基本原理),以便能够创建可在中介上运行的Web设计和Web界面。

Web设计人员可能选择不自己编写HTML / CSS,但了解标记和CSS的工作方式对于成为Web设计人员至关重要。Web设计人员可能不必是HTML / CSS忍者,但可以很好地帮助他们(至少)知道如何将其Web版面设计转换为网站。


1

网页设计师需要知道如何编码吗?

是的, Web设计人员必须处理Adobe Photoshop,Illustrator和InDesign之类的软件才能创建Web设计。然后,此设计处理编码以使其联机。因此,对于Web设计人员而言,了解其中的设计组件以编码形式表示非常重要。为此,他们应该具有编码知识,但不具备充分的基础知识。


0

就个人而言,这完全取决于您的技能和要求。能够快速学习和掌握事物的技能。要求是财务。学习一些东西需要时间,而这会暂时损害您的生产力。

因此,如果您有很多时间要消磨时间,请继续学习编码。

在过去的四年中,我一直是一名设计师,擅长编辑基本内容。我只是没有足够的时间以专业的方式学习代码。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.