Müssen Webdesigner wissen, wie man programmiert?


31

Als Webentwickler, sowohl Front-End- als auch Back-End-Architekt, arbeite ich mit vielen verschiedenen Designern zusammen und finde es manchmal frustrierend, mit Design-Comps zu arbeiten, bei denen keine Überlegungen angestellt wurden, wie man das Design in einfachem CSS und HTML umsetzt. Andererseits wird von mir als Entwickler erwartet, dass ich Code aus jedem Design erstellen kann.

Müssen Webdesigner grundlegende moderne CSS- und HTML-Techniken kennen? Warum oder warum nicht ist das für einen rundlichen Webdesigner wichtig?

Einige allgemeine Gedanken:

  • Front-End-Webentwickler sollten in der Lage sein, jedes Design zu programmieren.
  • Webdesigner sollten verstehen, wie Benutzer tatsächlich mit ihrem Design interagieren.
  • Design-Shops lassen Designer lieber entwerfen und überlassen die gesamte Programmierung den Entwicklern.

5
Was Sie beschrieben, sind Grafikdesigner, keine Webdesigner.
Jin

Designer ohne Medium sind wie Komponisten ohne Instrument.
Adam

Meiner Erfahrung nach bedeutet "Front-End" für alles, was mit Web oder Software zu tun hat, Benutzeroberfläche, GUI oder SCHNITTSTELLE. Ist das der Sinn, den du meintest?
user179700

Antworten:


23

Müssen Webdesigner grundlegende moderne CSS- und HTML-Techniken kennen?

Ja.

Warum oder warum nicht ist das für einen rundlichen Webdesigner wichtig?

Ich habe mit "Ja" geantwortet, weil Sie das Wort " Basic" verwendet haben .

Es ist absolut notwendig, dass Webdesigner grundlegende HTML- und CSS-Techniken beherrschen, genauso wie Architekten etwas über Physik und Materialwissenschaften wissen müssen, Druckdesigner etwas über den CMYK-Druckprozess wissen müssen und Modedesigner etwas über Stoffe wissen müssen.

Wenn Sie nichts über CSS- und HTML-Techniken wissen, können Sie sich nicht als "Webdesigner" bezeichnen. Du bist einfach ein Künstler oder so.

Kommentare zu deinen Gedanken:

Front-End-Webentwickler sollten in der Lage sein, jedes Design zu programmieren.

Falsch. Dies ist eine Vereinfachung. Einige Dinge lassen sich nicht gut ins Web übersetzen. Einige Designs fallen möglicherweise auseinander oder funktionieren auf einer bestimmten Plattform oder Bildschirmgröße, die unterstützt werden muss, nicht.

Ein Webdesigner muss Einschränkungen kennen, die von der Zielgruppe und den Leistungsanforderungen abhängen. Ein Designer, der sich mit CSS und HTML auskennt, kann das Design optimieren, damit der zugrunde liegende Code so reaktionsschnell und effizient wie möglich ist.

Webdesigner sollten verstehen, wie Benutzer tatsächlich mit ihrem Design interagieren.

Sie haben UX Design beschrieben , eine völlig andere Disziplin. Obwohl User Experience Design Aspekte des Grafikdesigns umfasst, hat es wirklich sehr wenig mit CSS oder HTML zu tun.

Gute, abgerundete Webdesigner sollten mit UX Design vertraut sein, es ist jedoch auch üblich, dass sie mit UX-Spezialisten zusammenarbeiten.

Design-Shops lassen Designer lieber entwerfen und überlassen die gesamte Programmierung den Entwicklern.

Dies mag teilweise zutreffen, aber nicht vollständig. Ein beliebtes Paradigma in Content-Management-Systemen ist MVC (Model / View / Controller). Viele Designläden möchten, dass die Designer mit der HTML / CSS-Codierung vertraut sind, damit sie sich auf die Darstellung des Inhalts (die "Ansicht") konzentrieren können, während sich die Entwickler auf das Modell / den Controller konzentrieren.

Das soll nicht heißen, dass einige Geschäfte keine Grafiker beschäftigen, die sich nur auf grafische Elemente konzentrieren und Pixel verschieben - aber sie sind aus meiner Sicht keine Webdesigner. Auf einer großen Website arbeiten möglicherweise Grafiker, Webdesigner, UX-Designer, Webentwickler und Datenbankspezialisten zusammen, um eine fertige Website zu erstellen. Ein Freiberufler, der kleinere Websites erstellt, kann sich in allen Disziplinen versuchen und sich selbst als Web-Designer / Entwickler bezeichnen.


17

Ein Webdesigner sollte verstehen, wie Code funktioniert und was er kann, genauso wie ein Druckdesigner versteht, wie Tinte auf Papier aussieht und wie Papier gefaltet oder geschnitten werden kann. Jeder Designer sollte die Einschränkungen und Stärken des gewählten Mediums verstehen.

Wenn ein Webdesigner diese umwerfende Website erstellt, ist es für ihn oder sie erforderlich, entweder die Grundlagen des Codierens zu erlernen oder an einigen Stellen des Prozesses mit einem Codierer zusammenzusitzen, um zu überprüfen, ob die Website der umwerfenden Website erreicht werden kann. Ich würde sagen, ein Webdesigner muss mindestens etwas über Code wissen .

Ich finde es falsch zu sagen, "ein Entwickler kann alles codieren", genauso wie man nicht sagen kann, dass alles, was gedruckt werden kann, mit HTML / CSS exakt im Web reproduziert werden kann.


1
+1, vor allem für "muss über Code wissen ". Ich habe mit Leuten gearbeitet, die keine Codezeile schreiben konnten, aber ein Verständnis für das Medium hatten und offen genug waren, um zu respektieren, was der Entwickler sagte. Es hat immer sehr gut funktioniert.
Pekka unterstützt GoFundMonica

6

Lauren, Ghoppe und Farray sprechen alle beruhigend, also werde ich nichts von dem aufbereiten, was sie gesagt haben. Lassen Sie mich aus praktischen Gründen Ihre expliziten und impliziten Fragen noch einmal aufgreifen.

Der beste Ansatz für einen Entwickler ist derselbe, an dem Drucker herumgespielt haben, seit Gutenberg seinen ersten Typ geschnitten hat: Bestehen Sie darauf, dass der Designer Sie von Anfang an in das Projekt einbezieht. Machen Sie deutlich, dass Sie an der Diskussion beteiligt sein müssen, bevor ein einzelnes Pixel auf den Bildschirm gelangt.

Wenn ich an einem Print-Design-Projekt arbeite, bei dem es um ungewöhnliche Dinge geht, bin ich sofort in Gesprächen mit Druckern und Buchbindern. Sie wissen verdammt viel mehr über ihr Handwerk als ich, deshalb ist es meine Aufgabe, sie gleich zu Beginn mit einzubeziehen. Unglücklicherweise vernachlässigen beginnende Designer, besonders wenn sie gerade erst die Schule verlassen haben und noch nicht mit der realen Welt vertraut sind, diesen einfachen Schritt und landen in Deep Kimshee ohne Lebensretter.

Kampagne in Blogs, Foren, mit Kunden und Projektmanagern, mit lokalen Schulen und Benutzergruppen und jedem Designer in Reichweite: "Sprechen Sie mit Ihrem Entwickler, bevor Sie mit dem Entwerfen beginnen!"

Ein Entwickler wird Comps von Designern erhalten, die keine Ahnung haben, wonach sie suchen, genauso wie die Druckvorstufenabteilungen manchmal unbrauchbare Grafiken erhalten (und Designer erhalten Briefs, denen nur ein Masochist folgen würde). Aber Sie können viel Frust und Zeitverschwendung vermeiden, wenn Sie auf einem Platz am Planungstisch bestehen.


Genau! Als Entwickler finde ich es toll, Feedback zu Machbarkeit und Implementierungskosten eines bestimmten Designs geben zu können. Je detaillierter ich darüber nachdenken kann, warum ein Teil eines Entwurfs __un__praktikabel ist, desto besser können meine Designer in Zukunft (kostengünstiger) Entwürfe erstellen. Selbst wenn Designer keinen Code schreiben können, sollten sie in der Lage sein, darüber zu kommunizieren, und sie sollten versuchen, die Feinheiten des Frameworks / Tools zu verstehen, die Entwicklern zur Verfügung stehen. (Und je besser sie können,
desto

1
Ironischerweise habe ich kürzlich die Designphase für eine Website abgeschlossen, bei der der Entwickler hinter drei Ebenen der Unternehmensbürokratie steht und auf die überhaupt nicht zugegriffen werden kann. Es dauerte Wochen, bis eine Antwort auf die Frage "In welcher Form würden Sie die Designdateien bevorzugen?" - Eine äußerst unbefriedigende Arbeitsweise, die den Kunden Probleme bereiten wird. Mit etwas Glück werden sie bald eine Offenbarung haben.
Alan Gilbertson

5

Ja und nein. Es ist wichtig zu wissen, wie Ihre Zielumgebung funktioniert, aber es ist nicht wirklich wichtig, dass Sie den spezifischen Code verstehen, der erforderlich ist, damit das System auf diese Weise funktioniert. Mit anderen Worten: Ich würde mir keine Gedanken über die spezifische Syntax zum Erstellen abgerundeter Ecken in allen wichtigen Browser-Engines machen, aber ich würde es für wichtig halten, dass Sie verstehen, ob Sie abgerundete Ecken in allen wichtigen Browsern erstellen können oder nicht (und wie viel Code erforderlich ist) dazu).

Zum Beispiel waren wir noch vor ein paar Jahren mit IE6 ausgerüstet. Wir hatten ein absolut ansprechendes Design für eine Unternehmens-Intranet-Anwendung, die jedoch in hohem Maße auf transparente Overlays angewiesen war. IE6 konnte PNG8s anzeigen, respektierte jedoch nicht den Alpha-Kanal in PNG24s. Um CSS-basierte Opazität zu verwenden, waren ActiveX-Filter und andere Probleme erforderlich. Um den gewünschten Effekt zu erzielen, könnten Reifen durchgesprungen werden, aber jeder Reifen steht für einen längeren Entwicklungszyklus, eine höhere Fehlerrate, eine schwierigere Wartung usw. Zusätzlich zu den direkten Kosten in Mannstunden für die Entwicklung und Wartung dieses (jetzt mühsamen) Designs. Es gab auch die Opportunitätskosten, Entwicklerstunden mit dem Patchen einer klobigen Codebasis zu verbringen, anstatt an Version N + 1 zu arbeiten.

In solchen Situationen muss das Kosten-Nutzen-Verhältnis jedes visuellen Effekts in einem Entwurf gemessen werden:

  • Wie beeindruckend ist der visuelle Effekt?
    Kann es durch ein anderes gleichermaßen wirkungsvolles Bildmaterial ersetzt werden, das nicht so viele Baumaterialien benötigt?

  • Kann der Effekt auf dem Ziel korrekt reproduziert werden? Wenn Ihr ursprüngliches Design vom Ziel nicht genau wiederhergestellt werden kann, muss Ihr Design mit der größtmöglichen Annäherung ersetzt werden, die verfügbar ist. (Zum Glück wird dies für Webdesigner immer weniger zum Problem.)

  • Wie viel Zeit haben Sie eingeplant?
    Können Sie sich mehr Arbeitsstunden im Baugewerbe leisten, um den gewünschten Effekt zu erzielen? Wenn nicht, können Sie die Funktion in kürzerer Zeit neu gestalten?

  • Wie viel der Codebasis müsste umgestaltet werden, um Ihre visuelle Darstellung zu ermöglichen?
    Wenn Design und Konstruktion gleichzeitig ablaufen oder Sie eine ältere Anwendung neu entwickeln, wie schwierig wird es dann für die Programmierer sein, Ihre visuellen Elemente einzubeziehen? Nicht nur die Stunden, die für das Neuschreiben erforderlich sind, sondern auch die potenziellen Stunden für das Debuggen und Verwalten des neu geänderten Codes.

Es gibt eine gewisse Überlappung zwischen den obigen Aufzählungspunkten und einigen anderen Punkten, die nicht aufgeführt sind. Der Punkt ist, dass selbst in dieser kurzen Liste Geschäftskosten berücksichtigt werden müssen. Sie können die Situation viel effizienter einschätzen, wenn Sie wissen, wie das Zielsystem tatsächlich funktioniert.

Wenn Sie die Einschränkungen von CSS oder HTML kennen, bevor Sie einen Entwurf erstellen, können Sie Entwürfe erstellen, die die Konstruktionsphase problemlos durchlaufen. Sie können sich auch darauf verlassen, dass Ihr Design umgesetzt werden kann und dass Sie die ungefähren Kosten genau kennen. Das ist immer griffbereit.


5

Nach meiner Erfahrung (ich bin ein Programmierer, kein Designer) ist es nicht so sehr eine Frage, die der Webdesigner über Code wissen sollte. Sie sollten jedoch wissen, wie ihre Arbeit in einem Browser angewendet wird.

Das größte Problem bei Designern ohne ausreichende Kenntnisse über Web / Browser ist, dass sie Designs erstellen, die schön aussehen, aber nicht wirklich im Browser funktionieren. Nur ein paar Dinge, an die manche vielleicht nicht gedacht haben:

  • Verwendung von Schriftarten. Sie verwenden mit ihrem PhotoShop installierte Schriftarten, die der durchschnittliche Benutzer nicht hat. Oder sie verwenden Mac-Schriftarten, die unter Windows / Linux nicht vorhanden sind.
  • Mangel an Respekt für die Bildschirm- / Browsergröße. Das Design soll nicht auf kleineren Computern angezeigt werden. Da kleinere Notebooks / Tablets immer beliebter werden, wird es immer wichtiger, kleinere Bildschirmgrößen zu berücksichtigen.
  • Was soll passieren, wenn Sie die Größe des Browserbildschirms ändern? Hat der Designer berücksichtigt, was mit dem Design geschehen soll, wenn die Größe des Browsers geändert wird?
  • Was ist mit Bildlaufleisten. Das Design wird normalerweise mit "lorem ipsum" -Platzhaltern geliefert. Was ist, wenn viel Text in diesen Platzhalter eingefügt wird und wir Bildlaufleisten benötigen, wo sollen wir sie platzieren?
  • Viele Bilder. Bei einigen Designs müssen Sie viele PNGs ausschneiden. Dies kann zu langen Antwortzeiten vom Webserver führen, da der Browser auf der ersten Seite alle diese PNGs herunterladen muss.

Das sind die Probleme, die ich bei der Arbeit mit Designern gesehen habe. Hierbei handelt es sich nicht um Probleme, bei denen der Designer nichts über Code weiß. Aber es geht darum, nicht darüber nachzudenken, wie das Design eingesetzt wird.


Toller Punkt zu Schriftarten. Ich habe PSDs zum Arbeiten gebracht, bei denen ich nicht einmal die verwendeten Schriftarten auf meinem Computer installiert habe.
Chris_O

4

Ein breiteres Verständnis des Mediums, in dem man arbeitet, macht einen immer zu einem besseren Künstler und Handwerker in diesem Bereich.

Viele Webdesigner, die keine Ahnung von Front-End-Entwicklung haben, können nur schwer damit arbeiten, weil sie schlechte Webdesigner sind, aber weil sie überhaupt keine Webdesigner sind. Sie sind Grafikdesigner mit etwas Druckhintergrund und versuchen, Broschüren und Plakate zu erstellen, anstatt tatsächliche Websites.

Es ist wie die Einstellung eines Landschaftsgestalters, um Ihr Badezimmer umzugestalten. Sie haben ein Gespür für Design und verstehen wahrscheinlich einige der Grundlagen, aber wahrscheinlich können sie Ihren Vorgarten viel besser gestalten als Ihre Dusche.

Vor einem Jahrzehnt, als die meisten Websites noch wie Fertigungsstraßen aufgebaut waren, war es nicht so schwierig, die PSD von einer Person, die HTML von der nächsten und die DB von der nächsten Person usw. zu erstellen.

Aber heutzutage wird das fortschrittlichste Webbuilding mit einem agilen Prozess durchgeführt. Die Teams sind vielfältig und verfügen über zahlreiche Methoden zur Verbesserung der Benutzerfreundlichkeit, integrierte Back - und Front - End - Systeme, Konzepte wie reaktives Webdesign usw Als solches muss ein Großteil des Designprozesses im Code stattfinden . Sei es Prototyping, Benutzertests, iteratives Design oder was auch immer, der Code ist das Medium und das Team muss es verstehen.

Nein, nicht jeder im Team muss in der Lage sein, jQuery-Plugins zu schreiben. Aber das Team sollte zumindest wissen, was sie sind und das UX / Web-Team sollte Leute haben, die sie schreiben KÖNNEN, da letztendlich alles gebaut werden muss, was entworfen wird.


4

Ja. Ein Künstler sollte das Medium verstehen, in dem er arbeitet, sei es ein Maler mit Öl und Leinwand, ein Bildhauer mit Marmor und Meißel oder ein Webdesigner mit HTML und CSS.

Ich habe in der Videospielbranche gearbeitet. Die besten Spieledesigner waren kreative Leute mit einer starken technischen Neigung, die die sich ständig ändernden Grenzen des Mediums verstanden und für dieses entwerfen konnten. Menschen, die diese Überreichweite nicht erreichen können und die Verwässerung ihrer Vision nicht in den Griff bekommen, sind am Ende am Lutschen.

Ich habe kürzlich einige Webentwicklungen durchgeführt, bei denen der Hintergrund des Designers ausschließlich in Printmedien lag. Das Ergebnis waren ziemlich schöne Seiten, die im Druck fantastisch gewesen wären, aber als Website eher schlecht funktionierten.


4

Für mich ist die Trennung zwischen Designer und Entwickler schon vor Jahren passiert, aber dann haben die Leute gemerkt, dass Webdesign viel mehr ist als nur ein Mock-up.

Für mich, wenn sich jemand Webdesigner nennt, erwarte ich:

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

Für mich ist ein Webdesigner jemand, der die Client-Seite einer Site erstellen kann.

Ein guter Webdesigner wird all dies haben und ein Verständnis dafür haben, wie sich die Entscheidungen, die er während des Designprozesses trifft, auf die Benutzeroberfläche der Site auswirken.

Wenn jemand Webentwickler sagt, erwarte ich:

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

Ein guter Webentwickler wird über all dies verfügen und in der Lage sein zu verstehen, wie die von ihm getroffenen Architekturentscheidungen das Front-End der Site und die den Benutzern zur Verfügung gestellten Funktionen beeinflussen.

Sie erhalten auch Leute, die sich auf UX und andere Bereiche spezialisiert haben, die horizontaler sind als das Webdesign, da sie sich auf eine Reihe verschiedener Entwicklungsumgebungen beziehen.

edit: Wenn jemand ein Beispiel für eine gute Designgruppe hat, die das Grafikdesign vom Webdesign trennt, wäre ich sehr interessiert.


3

Designer sollten eine Vorstellung davon haben, wie das Codieren funktioniert. Dies ist manchmal die einzige Möglichkeit, um zu verhindern, dass der Front-End-Entwickler tötet . Um diese Idee zu erlangen, ist die direkte Erfahrung möglicherweise der einfachste Weg.

Es gibt sicherlich andere, aber es kann Ihrem Unternehmen nicht schaden, wenn Sie lernen, ein wenig Javascript zu programmieren. (Tatsächlich ändern sich die Zeiten und es gibt Legionen von Leuten mit Designer-Kenntnissen, die JavaScript aus ihren DOMs entfernen können, aber das ist eine ganz andere Geschichte.)

Meine allgemeinen Gedanken:

  • Front-End-Webentwickler müssen sich mit furchtbaren Backends und vielen Eigenheiten auseinandersetzen, um sich mit Ihren Design-Feinheiten zu beschäftigen. Die meisten dieser Eigenheiten werden durch die schlechte Auswahl von vorgefertigten Backends auf der Management-Seite verursacht und nehmen sich viel Zeit, um damit umzugehen.

  • Webdesigner riskieren im Umgang mit solchen gestressten Personen ständig ihr Leben . Und sollte einige dieser Front-End-Angelegenheiten ernsthaft in Betracht ziehen, anstatt das Design auf den Tisch fallen zu lassen und schreiend ins Büro zu rennen "Ich bin vorbei, ich bin fertig, von nun an ist alles die Schuld des Entwicklers! "

  • Designläden sollen brennen.


2

Kommt darauf an, wo du arbeitest.

Wenn Sie für ein großes Unternehmen arbeiten, können dies einzelne Rollen sein:

  1. UX oder Architekturspezialist - plant die Informationsarchitektur / Organisation der Site / erstellt Wireframes

  2. Designer - entwirft die Website mit Photoshop oder einem anderen Tool

  3. Front-End-Entwickler - Ist HTML / CSS / Javascript / JSON / XML / etc. und schreibt Templating-Code, der Front-End mit Back integriert

  4. Back-End-Entwickler - Führt die Programmierung aus, mit der alles dynamisch funktioniert

Bei den meisten Stellen auf mittlerer Ebene muss der Designer auch die UX-Entscheidungen treffen. Bei kleineren Umgebungen muss der Designer möglicherweise alle drei oben genannten Aufgaben ausführen. Allerdings ist das Front-End ein schwieriger Bereich und es gibt Leute mit unterschiedlichen Fähigkeiten. Wenn Sie ein Designer sind, der Front-End-Arbeiten ausführen muss, sollten Sie auf keinen Fall mehr als HTML / CSS und JQuery oder eine andere Frame-Arbeit kennen. Von einem Designer zu erwarten, dass er die tieferen Aspekte von Javascript und Back-End-Integration kennt, ist zu viel verlangt.

Wenn Sie freiberuflich tätig sind, müssen Sie natürlich alles selbst wissen und tun;)


1
Das OP fragt nicht, ob ein Web Designer auch ein Experten-Programmierer sein soll, sondern ob der Web Designer die Grundlagen von HTML und CSS kennen soll. Selbst wenn Sie ein Webdesigner sind und niemals eine HTML- oder CSS-Datei anfassen müssen, sollten Sie immer noch wissen, ob Ihr Design als Website für Ihre Zielgruppe überhaupt machbar (oder überhaupt möglich ) ist.
Shauna

2

Ich denke, Webdesigner sollten HTML / CSS kennen - auch wenn es nur auf die Grundlagen beschränkt ist -, um Webdesigns und Webschnittstellen erstellen zu können, die auf dem Medium funktionieren.

Webdesigner können sich dafür entscheiden, HTML / CSS nicht selbst zu schreiben, aber zu wissen, wie Markup und CSS funktionieren, ist für Webdesigner von entscheidender Bedeutung. Webdesigner müssen möglicherweise keine HTML / CSS-Ninjas sein, aber es hilft ihnen (zumindest) zu wissen, wie ihre Weblayout-Kompositionen in eine Website konvertiert werden.


1

Müssen Webdesigner wissen, wie man programmiert?

Ja, Webdesigner müssen sich mit Software wie Adobe Photoshop, Illustrator und InDesign auseinandersetzen, um ein Design für das Web zu erstellen. Dann befasst sich dieses Design mit der Codierung, um es online zu machen. Und dafür ist es für den Webdesigner sehr wichtig, die Komponenten des Designs zu verstehen, die als Codierung dargestellt werden sollen. Dafür sollten sie die Kenntnisse der Codierung haben, die sie nicht vollständig verstehen, aber mit den Grundlagen vertraut sind.


0

Persönlich hängt alles von Ihren Fähigkeiten und Anforderungen ab. Fähigkeiten, die in der Lage sind, Dinge schnell zu lernen und zu erfassen. Voraussetzungen sind Finanzen. Etwas zu lernen wird Zeit brauchen, und das würde Ihre Produktivität vorerst zerstören.

Wenn Sie also viel Zeit zum Töten haben, lernen Sie das Codieren.

Ich bin seit vier Jahren Designer und kann grundlegende Dinge gut bearbeiten. Ich habe einfach nicht genug Zeit, um Code auf professionelle Weise zu lernen.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.