Чи потрібно веб-дизайнерам знати, як кодувати?

Як веб-розробник, як архітектор переднього та заднього кінців, я працюю з багатьма різними дизайнерами, і іноді мені стає неприємно працювати з дизайнерськими компіляторами, де не було думки про те, як досягти дизайну в базових CSS та HTML. З іншого боку, як розробник, я, як очікується, зможе створити код з будь-якого дизайну.

Чи потрібно веб-дизайнерам знати основні сучасні методи CSS та HTML? Чому чи ні, це не важливо для добре закругленого веб-дизайнера?

Деякі загальні думки:

• Веб-розробники для переднього плану повинні бути достатньо кваліфікованими, щоб кодувати будь-який дизайн.
• Веб-дизайнери повинні мати розуміння того, як реально взаємодіють користувачі зі своїм дизайном.
• Дизайнерські магазини, швидше, мають дизайн дизайнерів, а все кодування залишають розробникам.

Чи потрібно веб-дизайнерам знати основні сучасні методи CSS та HTML?

Так.

Чому чи ні, це не важливо для добре закругленого веб-дизайнера?

Я відповів "так", тому що ви вживали слово basic .

Абсолютно важливо, щоб веб-дизайнери знали основні методи HTML та CSS, таким же чином, як архітектори повинні знати щось про фізику та матеріалознавство, дизайнери друку повинні знати щось про процес друку CMYK, а модельєри повинні щось знати про тканину.

Якщо ви не знаєте нічого про CSS і HTML методів , які Ви не можете називати себе «веб - дизайнер». Ти просто художник чи щось таке.

Коментарі до ваших думок:

Веб-розробники для переднього плану повинні бути достатньо кваліфікованими, щоб кодувати будь-який дизайн.

Помилковий. Це надмірне спрощення. Деякі речі не дуже добре перекладаються в Інтернет. Деякі конструкції можуть розпастись або не працювати на певній платформі чи розмірі екрана, які потрібно підтримувати.

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

Веб-дизайнери повинні мати розуміння того, як реально взаємодіють користувачі зі своїм дизайном.

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

Хоча хороші добре закріплені веб-дизайнери повинні ознайомитись з UX Design, їм також спільно співпрацювати з фахівцями 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 та інших сферах, більш горизонтальних, ніж веб-дизайн, оскільки вони застосовуються до багатьох різних середовищ розробки.

редагувати: Якщо у когось є приклад хорошої групи дизайну, яка відокремлює графічний дизайн від веб-дизайну, я був би дуже зацікавлений.

Дизайнери повинні мати уявлення про те, як працює кодування. Іноді це єдиний спосіб не допустити, щоб їх розробник перейшов у самогубство . Для здобуття цієї ідеї прямий досвід може бути найпростішим способом.

Звичайно, є й інші, але це не може зашкодити вашому бізнесу навчитися трохи програмувати Javascript. (Насправді часи змінюються, і є легіони хлопців із дизайнерськими навичками, які можуть виводити JavaScript за межі своїх DOM, але це зовсім інша історія)

Мої загальні думки:

• Розробники веб-сторінок передній частині повинні мати справу з жахливими порушеннями та багатьма рівнями ідіосинкразії, щоб турбуватися з вашими тонкощами дизайну. Більшість цих ідіосинкразій спричинені поганим вибором попередніх факсів на керівній частині та викрадають значну кількість часу для вирішення.

• Веб-дизайнери, маючи справу з такими стресовими людьми , постійно ризикують своїм життям . І варто серйозно розглянути деякі з цих питань, замість того, щоб кинути дизайн на їхній стіл і тікати, кричачи в кабінет "Я закінчую, я закінчую, відтепер у цьому все вини чорта! "

• Дизайнерські магазини повинні горіти.

Залежить від місця роботи.

Якщо ви працюєте у великій компанії, то це можуть бути окремі ролі:

1. Спеціаліст з архітектури UX або архітектури - планує інформаційну архітектуру / організацію сайту / робить каркаси

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

3. Front End Developer - чи html / css / javascript / json / xml / тощо. і записує шаблон шаблону, який інтегрує передній кінець і задній

4. Back End Developer - чи програмування, завдяки якому все насправді працює динамічно

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

Звичайно, якщо ви займаєтесь фрілансом, вам потрібно знати і робити все самостійно;)

Я думаю, що веб-дизайнери повинні знати HTML / CSS - навіть якщо це обмежується лише основами - задля того, щоб мати можливість створювати веб-дизайни та веб-інтерфейси, які працюють на носіях.

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

Чи потрібно веб-дизайнерам знати, як кодувати?

Так, веб-дизайнеру доводиться мати справу з таким програмним забезпеченням, як Adobe Photoshop, Illustrator та InDesign, щоб створити дизайн для Інтернету. Тоді ця конструкція займається кодуванням, щоб зробити його в Інтернеті. І для цього дуже важливо, щоб веб-дизайнер розумів компоненти тамтешнього дизайну, які представляли як кодування. Для цього вони повинні мати знання кодування, не повністю розуміючи, але з основами.

Особисто все залежить від ваших навичок та вимог. Навички здатні швидко вчитися та розуміти речі. Вимоги, що стосуються фінансів. Щоб навчитися чомусь, знадобиться час., І це враз знищить вашу продуктивність.

Тож якщо у вас багато часу на вбивство, продовжуйте вчитися кодувати.

Я був дизайнером останні чотири роки, і я добре редагую основні речі. У мене просто немає часу, щоб вивчити код про спосіб.