Нужно ли веб-дизайнерам уметь программировать?

Нужно ли веб-дизайнерам знать основные современные методы CSS и HTML?

Да.

Почему или почему это не важно для разностороннего веб-дизайнера?

Я ответил «да», потому что вы использовали слово « базовый» .

Крайне важно, чтобы веб-дизайнеры знали основные методы HTML и CSS, точно так же, как архитекторы должны знать кое-что о физике и материаловедении, дизайнеры полиграфии должны знать кое-что о процессе печати CMYK, а модельеры должны знать кое-что о ткани.

Если вы ничего не знаете о методах CSS и HTML, вы не можете называть себя «веб-дизайнером». Ты просто художник или что-то в этом роде.

Комментарии о ваших мыслях:

Передние веб-разработчики должны быть достаточно опытными, чтобы кодировать любой дизайн.

ЛОЖЬ. Это чрезмерное упрощение. Некоторые вещи плохо переводятся в сеть. Некоторые проекты могут развалиться или не работать на определенной платформе или размере экрана, которые необходимо поддерживать.

Веб-дизайнер должен знать ограничения в зависимости от аудитории и требований к производительности. Дизайнер, знающий CSS и HTML, знает, как настроить дизайн, чтобы базовый код можно было сделать максимально отзывчивым и эффективным.

Веб-дизайнеры должны понимать, как пользователи будут взаимодействовать с их дизайном.

Вы описали UX-дизайн , а это совершенно другая дисциплина. Хотя дизайн взаимодействия с пользователем включает в себя аспекты графического дизайна, на самом деле он имеет очень мало общего с CSS или HTML.

Хотя хорошие разносторонние веб-дизайнеры должны быть знакомы с UX-дизайном, они также часто сотрудничают со специалистами по UX.

Магазины дизайна предпочли бы, чтобы дизайнеры занимались дизайном, а кодирование оставили разработчикам.

Это может быть частично верно, но не полностью. Одной из популярных парадигм в системах управления контентом является MVC (модель/представление/контроллер). Многие дизайн-студии хотят, чтобы дизайнеры имели некоторое представление о кодировании HTML/CSS, чтобы они могли сосредоточиться на представлении контента («представлении»), в то время как разработчики сосредоточились на модели/контроллере.

Это не означает, что в некоторых магазинах нет художников-графиков, которые просто сосредотачиваются на графических элементах и ​​перемещают пиксели, но, на мой взгляд, они не являются веб-дизайнерами. На большом веб-сайте могут работать художники-графики, веб-дизайнеры, дизайнеры UX, веб-разработчики и специалисты по базам данных, которые сотрудничают для создания готового веб-сайта. Фрилансер, создающий небольшие сайты, может заниматься всеми дисциплинами и называть себя веб-дизайнером/разработчиком.

Веб-дизайнер должен понимать, как работает код и на что он способен, точно так же, как дизайнер полиграфии понимает, как будут выглядеть чернила на бумаге и как бумагу можно согнуть или разрезать. Любой дизайнер должен понимать ограничения и сильные стороны выбранного носителя.

Если веб-дизайнер создает этот сногсшибательно великолепный сайт, ему или ей надлежит либо изучить основы кодирования, либо посидеть с программистом на нескольких этапах процесса, чтобы проверить, можно ли создать великолепный сайт. Так что я бы сказал, что веб-дизайнер как минимум должен знать о коде.

Я думаю, что утверждение «разработчик может закодировать что угодно» является благовидным, точно так же, как вы не можете сказать, что все, что можно распечатать, можно точно воспроизвести в Интернете с помощью HTML/CSS.

Лорен, Гоппе и Фаррей говорят правду, поэтому я не буду перефразировать то, что они сказали. Из соображений практичности позвольте мне предложить другой взгляд на ваши явные и неявные вопросы.

Лучший подход для разработчика тот же, о котором печатники бьют в барабан с тех пор, как Гутенберг напечатал свой первый шрифт: настаивайте на том, чтобы дизайнер привлек вас к проекту с самого начала. Дайте понять, что вы должны участвовать в обсуждении до того, как на экране появится хоть один пиксель.

Когда я работаю над проектом полиграфического дизайна, который включает в себя что-то необычное, я сразу же вступаю в переговоры с типографией и переплетчиками. Они знают о своем ремесле чертовски больше, чем я, поэтому я делаю своей задачей вовлечь их в процесс с самого начала. К сожалению, начинающие дизайнеры, особенно когда они только что закончили школу и еще не познакомились с реальным миром, иногда пренебрегают этим простым шагом и попадают в тупик без спасательного круга.

Проведите кампанию в блогах, на форумах, с клиентами и менеджерами проектов, с местными школами и группами пользователей и с любым дизайнером в пределах досягаемости: «Поговорите со своим разработчиком, прежде чем начать проектировать!»

Разработчик будет получать комплименты от дизайнеров, которые понятия не имеют, о чем просят, точно так же, как отделы допечатной подготовки иногда получают непригодные для использования иллюстрации (а дизайнеры получают брифы, которым может следовать только мазохист). Но вы можете предотвратить много разочарований и траты времени, если будете настаивать на месте за столом планирования.

Да и нет. Знание того, как работает ваша целевая среда, важно, но на самом деле не важно, что вы понимаете конкретный код, необходимый для того, чтобы система работала таким образом. Другими словами, я бы не стал беспокоиться о конкретном синтаксисе для создания закругленных углов во всех основных браузерных движках, но я бы посчитал важным, чтобы вы понимали, можете ли вы создавать закругленные углы во всех основных браузерах (и сколько кода требуется). сделать так).

Например, всего несколько лет назад мы все еще были обременены IE6. У нас был очень красивый дизайн для корпоративного интранет-приложения, но он сильно зависел от прозрачных оверлеев. IE6 мог отображать PNG8, но не учитывал альфа-канал в PNG24, а для использования непрозрачности на основе CSS требовались фильтры ActiveX и другие проблемы. Для достижения желаемого эффекта можно было бы перескакивать через обручи, но каждый обруч представляет собой более длительный цикл разработки, более высокий уровень ошибок, более сложное обслуживание и т. д. В дополнение к прямым затратам человеко-часов на разработку и поддержку этой (теперь хлопотной) конструкции, кроме того, существовала альтернативная стоимость, связанная с тратой часов разработчика на исправление запутанной кодовой базы вместо работы над версией N + 1.

В таких ситуациях необходимо измерять стоимость/выгоду каждого визуального эффекта в дизайне:

• Насколько удивителен визуальный эффект?
  Можно ли заменить его другим не менее эффектным визуальным эффектом, который не требует столько строительных ресурсов?

• Можно ли правильно воспроизвести эффект на мишени? Если ваш первоначальный дизайн не может быть точно воссоздан целевым объектом, ваш дизайн должен быть заменен самым близким приближением, которое будет доступно. (К счастью, это становится все меньше и меньше проблемой для веб-дизайнеров.)

• Сколько времени вы заложили в бюджет?
  Можете ли вы позволить себе больше человеко-часов в строительстве для достижения желаемого эффекта? Если нет, можете ли вы изменить дизайн функции за меньшее время?

• Какая часть кодовой базы должна быть реорганизована, чтобы приспособиться к вашему визуальному элементу?
  Если проектирование и конструирование выполняются одновременно или если вы обновляете устаревшее приложение, насколько сложно программистам будет внедрить вашу визуализацию? Не только часы, потраченные на переписывание, но и возможные часы отладки и поддержки только что измененного кода.

Существует некоторое совпадение между приведенными выше пунктами списка и некоторыми другими пунктами, которые не перечислены. Дело в том, что даже в этом коротком списке есть бизнес-затраты, которые необходимо учитывать. Вы сможете гораздо эффективнее оценить ситуацию, если поймете, как на самом деле работает целевая система.

Если у вас есть понимание ограничений CSS или HTML до создания дизайна, вы можете создавать проекты, которые без проблем пройдут через фазу построения. У вас также будет уверенность в том, что ваш проект может быть реализован, и сила знания приблизительной стоимости. Это всегда удобно иметь под рукой.

По моему опыту (я кодер, а не дизайнер) вопрос не столько в том, что веб-дизайнер должен знать о коде. Но они должны знать, как их работа применяется внутри браузера.

Самая большая проблема с дизайнерами, не обладающими достаточными знаниями о сети/браузерах, заключается в том, что они создают проекты, которые выглядят красиво, но на самом деле не работают внутри браузера. Всего несколько вещей, которые некоторые, возможно, не учли:

• Использование шрифтов. Они используют шрифты, установленные вместе с их PhotoShop, которых нет у обычного пользователя. Или они используют шрифты Mac, которых нет в Windows/Linux.
• Несоблюдение размера экрана/браузера. Дизайн не предназначен для показа на небольших компьютерах. Поскольку ноутбуки/планшеты меньшего размера становятся все более популярными, необходимость учитывать меньшие размеры экрана становится все более важной.
• Что должно произойти при изменении размера экрана браузера? Учел ли дизайнер, что должно происходить с дизайном при изменении размера браузера.
• А как же полосы прокрутки. Дизайн обычно поставляется с заполнителями «lorem ipsum». Что, если в этот заполнитель помещается много текста, и нам нужны полосы прокрутки, где мы должны их разместить.
• Много изображений. Некоторые проекты требуют, чтобы вы вырезали много png. Это может привести к длительному времени отклика веб-сервера, так как начальная страница требует, чтобы браузер загружал все эти файлы png.

Это проблемы, с которыми я сталкивался при работе с дизайнерами. Это не проблемы, связанные с тем, что дизайнер ничего не знает о коде. Но проблемы с тем, чтобы не думать о том, как дизайн используется.

Более широкое понимание среды, в которой человек работает, всегда делает его лучшим художником и мастером в этой области.

Со многими веб-дизайнерами, которые не разбираются в разработке интерфейса, трудно работать не столько потому, что они плохие веб-дизайнеры, сколько потому, что они вообще не являются веб-дизайнерами. Они графические дизайнеры с некоторым опытом печати и пытаются создавать брошюры и плакаты, а не настоящие веб-сайты.

Это все равно, что нанять ландшафтного дизайнера для ремонта вашей ванной комнаты. У них есть чувство дизайна, и, вероятно, они понимают некоторые основы, но есть вероятность, что они гораздо лучше озеленят вашу лужайку перед домом, чем плитку в душе.

Десять лет назад, когда большинство веб-сайтов все еще строились как заводские сборочные конвейеры, было не так уж важно, чтобы один человек делал PSD, следующий делал HTML, а следующий добавлял БД и т. д.

Но в наши дни наиболее прогрессивное веб-создание выполняется с помощью гибкого процесса, и команды разнообразны, с добавлением множества методологий пользовательского опыта, прогрессивных улучшений, интегрированных серверных и клиентских систем, таких концепций, как реактивный веб-дизайн. Таким образом, большая часть процесса проектирования должна выполняться в коде . Будь то прототипирование, пользовательское тестирование, итеративный дизайн или что-то еще, код — это среда, и команда должна его понимать.

Нет, не всем в команде нужно уметь писать плагины jQuery. Но команда должна, по крайней мере, знать, что это такое, а в команде UX/Web должны быть люди, которые МОГУТ написать их, поскольку в конечном итоге все, что будет спроектировано, должно быть построено.

Да. Художник должен понимать среду, в которой он работает, будь то художник со своим маслом и холстом, скульптор со своим мрамором и резцом или веб-дизайнер со своим HTML и CSS.

Раньше я работал в индустрии видеоигр. Лучшие гейм-дизайнеры были творческими людьми с сильными техническими наклонностями, которые понимали постоянно меняющиеся ограничения среды и могли разрабатывать для нее. Люди, которые не могут переусердствовать и разбавить реализацию своего видения, заканчивают отстой.

Недавно я занимался веб-разработкой, в которой опыт дизайнера полностью связан с печатными СМИ. В результате были довольно красивые страницы, которые были бы фантастическими в печатном виде, но довольно плохо работали в качестве веб-сайта.

Для меня разрыв между дизайнером и разработчиком произошел много лет назад, но потом люди поняли, что веб-дизайн — это гораздо больше, чем просто создание макета.

Для меня, когда кто-то называет себя веб-дизайнером, я ожидаю:

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

Для меня веб-дизайнер — это тот, кто может создать клиентскую часть сайта.

У хорошего веб-дизайнера будет все это, а также понимание того, как выбор, который он делает в процессе проектирования, влияет на UX сайта.

Когда кто-то говорит веб-разработчик, я ожидаю:

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

У хорошего веб-разработчика будет все это, и он сможет понять, как выбор архитектуры, который он сделает, повлияет на интерфейс сайта и функциональность, доступную пользователям.

Вы также получаете людей, которые специализируются на UX и других областях, которые более горизонтальны, чем веб-дизайн, поскольку они применяются в различных средах разработки.

edit: Если у кого-то есть пример хорошей группы дизайнеров, которая отделяет графический дизайн от веб-дизайна, мне было бы очень интересно.

Дизайнеры должны иметь представление о том, как работает кодирование. Иногда это единственный способ уберечь разработчика интерфейса от убийства . Чтобы усвоить эту идею, непосредственный опыт может быть самым простым способом.

Конечно, есть и другие, но вашему бизнесу не помешает научиться немного программировать на Javascript. (На самом деле времена меняются, и есть легионы парней с дизайнерскими навыками, которые могут использовать javascript для выхода из своих DOM, но это совсем другая история)

Мои общие мысли:

• Передние веб-разработчики должны иметь дело с ужасными бэкендами и многими уровнями идиосинкразии, чтобы возиться с тонкостями вашего дизайна. Большинство этих идиосинкразий вызваны неправильным выбором готовых бэкэндов со стороны руководства и крадут огромное количество времени, чтобы разобраться с ними.

• Веб-дизайнеры, имея дело с такими напряженными людьми, постоянно рискуют своей жизнью . И должны серьезно рассмотреть некоторые из этих аспектов интерфейса, вместо того, чтобы бросать дизайн на стол и бежать с криком в офис: «Я закончил, я закончил, с этого момента во всем виноват разработчик! "

• Магазины дизайна должны гореть.

Зависит от того, где вы работаете.

Если вы работаете в крупной компании, то все это могут быть отдельные роли:

1. Специалист по UX или архитектуре — планирует информационную архитектуру/организацию сайта/делает каркасы

2. Дизайнер - оформляет сайт с помощью фотошопа или другого инструмента

3. Front End Developer — делает html/css/javascript/json/xml/etc. и пишет шаблонный код, который интегрирует переднюю часть с задней

4. Back End Developer — программирование, благодаря которому все на самом деле работает динамически.

Большинство мест среднего уровня требуют, чтобы дизайнер также принимал решения по UX. Но в небольших местах может потребоваться дизайнер, чтобы сделать все 3 вышеперечисленные вещи. Однако интерфейс — это сложная область, и в ней есть люди с разными навыками. Если вы дизайнер, которому нужно заниматься внешним интерфейсом, от вас определенно не следует ожидать, что вы знаете что-то большее, чем HTML/CSS и JQuery или какие-то другие фреймворки. Ожидать, что дизайнер будет знать более глубокие аспекты интеграции javascript и серверной части, — это слишком многого.

Конечно, если вы фрилансер, вам нужно знать и делать все самому;)

Я думаю, что веб-дизайнеры должны знать HTML/CSS — даже если они ограничены основами — ради того, чтобы иметь возможность создавать веб-дизайны и веб-интерфейсы, которые работают на носителе.

Веб-дизайнеры могут решить не писать HTML/CSS самостоятельно, но знание того, как работает разметка и CSS, необходимо для работы веб-дизайнером. Веб-дизайнерам, возможно, не нужно быть ниндзя HTML/CSS, но им полезно знать (по крайней мере), как их макеты веб-макетов преобразуются в веб-сайт.

Нужно ли веб-дизайнерам уметь программировать?

Да, веб-дизайнеру приходится иметь дело с такими программами, как Adobe Photoshop, Illustrator и InDesign, чтобы создать дизайн для Интернета. Затем этот дизайн связан с кодированием, чтобы сделать его онлайн. И для этого для веб-дизайнера очень важно понимать компоненты своего дизайна, которые можно представить в виде кодирования. Для этого они должны иметь знания кодирования, не полностью понимающие, но с основами.

Лично все зависит от ваших навыков и требований. Умение быстро учиться и схватывать материал. Требования - финансы. Для изучения чего-то потребуется время, а это на какое-то время убьет вашу продуктивность.

Так что, если у вас есть много свободного времени, идите вперед и учитесь программировать.

Последние четыре года я работаю дизайнером и умею редактировать базовые вещи. У меня просто не хватает времени, чтобы изучать код профессионально.