Теперь Кью работает в режиме чтения

Мы сохранили весь контент, но добавить что-то новое уже нельзя
Я по образованию: Преподаватель истории и общество...  · 3 янв 2023  ·
club_knowledges

Что такое веб-дизайн?

Веб-дизайн стал формой цифрового творчества, стирая все границы между искусством и коммерцией.
Основы и начала веб-дизайна
Веб-дизайн является одной из основ веб-разработки, часть работы веб-дизайнеров заключается в том, чтобы представить и создать / спроектировать веб-страницу с использованием изображений, форматирования HTML, стандартизации и удобства использования веб-страницы.
Веб-дизайн требует множества различных навыков, стандартов и дисциплин, которые используются при создании и обслуживании веб-сайта. Под термином веб-дизайн мы подразумеваем веб- и графический дизайн, дизайн интерфейса, разработку, стандартизированное кодирование, пользовательскую среду и поисковую оптимизацию.
В то время как некоторые люди овладевают всеми этими навыками самостоятельно, большинство людей обычно работают в командах для более быстрого производства и более профессионального подхода. Чтобы быть более точным, слово веб-дизайн используется для описания передней части (видимой части) веб-сайта, в то время как веб-разработка заботится о функциональности и внутренней части веб-сайта (части кодирования).
История веб-дизайна
Хотя веб-дизайн является относительно новой отраслью бизнеса, он может быть связан с графическим дизайном. В 1989 году, во время работы в CERN, Тим Бернерс Ли объявил о создании глобального протокола передачи гипертекста, который позже получил более популярное название World Wide Web (W3, WWW), и в период с 1991 по 1993 год была создана Всемирная паутина.
Марк Андреессен и Эрик Бина создали Mozaic browser еще в 1993 году. В те времена было много разных браузеров, и большинство из них были созданы для платформы Unix, а веб-страницы были очень насыщены текстом. Не было поддержки графических элементов, таких как изображения или звуки, и Mosaic была создана, чтобы преодолеть это.
W3C был основан в октябре 1994 года, чтобы "раскрыть весь потенциал WWW за счет разработки собранных протоколов и обеспечить его совместимость". Это отбило у компаний охоту приобретать монополию на языки программирования и браузеры. В 1994 году Андреессен основал компанию "Netscape Communications", которая создала свои собственные HTML-теги без традиционного процесса стандартизации. Например, в Netscape 1.1 были команды для изменения цвета фона и форматирования текста в диаграммах. В 1996-1999 годах начались первые войны браузеров. Две ведущие компании, Microsoft и Netscape, боролись за самый популярный браузер на рынке. В этот период появилось много новых технологий в этой области, особенно с CSS, JavaScript и динамическим HTML.
Эволюция веб-дизайна
1996 год. Microsoft анонсировала свой первый конкурентоспособный браузер, который имел свои собственные характеристики и теги. Это был также первый браузер, который поддерживал список различных CSS. Теги диаграмм впервые использовались для отображения диаграмм и данных, но вскоре дизайнеры поняли потенциал использования HTML-диаграмм для создания сложных многоцветных диаграмм и формирования, что было невозможно до тех пор. В то время наибольшее внимание уделялось веб-дизайну и эстетике, и очень мало внимания уделялось семантический и веб-доступность. HTML-сайты уже были ограничены в возможностях своего дизайнера, и даже больше с предыдущими версиями HTML. Для создания сложных проектов веб-дизайнерам приходилось использовать сложные структуры диаграмм и даже использовать пустое GIF-изображение, чтобы оставить пустое место в ячейках диаграммы. Официальные правила CSS были приняты в декабре 1996 года. И это позволяет HTML-коду быть более семантическим, чем представление, и, таким образом, улучшает доступность в Интернете. В этот период был разработан Flash (ранее известный как Futuresplash). Вначале это был простой инструмент для просмотра, и в тот момент он позволял веб-дизайнерам выходить за рамки стандартного HTML-кода.
Конец первых войн
В 1998 году компания Netscape опубликовала NetscapeCommuncator под лицензией с открытым исходным кодом, что позволило тысячам программистов участвовать в улучшении программного обеспечения. Между тем, они решили прекратить его разработку и начать с нуля. В том году был создан проект веб-стандартизации, и он продвигал совместимость HTML и CSS. 2000 год был знаменательным годом для Microsoft, Internet Explorer был выпущен для Mac, и это было важно, потому что это был первый браузер, поддерживающий HTML 4.01 и CSS 1, что повысило его совместимость. Это был также первый браузер, который поддерживал изображения в формате PNG. В этот период Netscape был продан AOL, и это считалось официальным поражением в войнах браузеров.
Инструменты и технологии
Веб-дизайнеры используют различный набор инструментов в зависимости от процессов, в которых они участвуют. Этот инструмент был обновлен time для поддержки более новых стандартов и версий программного обеспечения, но принципы остались. Веб-дизайнеры и графические дизайнеры используют векторную и растровую графику для создания изображений для веб-дизайна или прототипов. Технологии создания веб-сайта, которые используются сегодня, включают стандартизированные теги, которые могут быть написаны вручную или с помощью программного обеспечения WYSIWYG.
Типография
Успешный веб-сайт имеет только несколько типографику, шрифты, которые похожи, вместо того, чтобы использовать много разных шрифтов. Рекомендуется использовать шрифты без засечек или с засечками, но не оба. Типография веб-сайта также должна быть тщательно продумана. Большинство браузеров распознают и поддерживают несколько шрифтов по умолчанию, и дизайнеры любят использовать их, чтобы избежать проблем. Большинство разделов на веб-сайте содержат разделители, чтобы разделить текст на абзацы и сделать веб-сайт более удобным для пользователя.
Внешний вид
Веб-сайты должны быть правильно организованы, чтобы улучшить удобство использования для посетителей. Одним из важнейших факторов в веб-дизайне является расположение элементов внутренней веб-страницы. Большинство веб-сайтов имеют ширину 1024 пикселя, с текстом и изображениями в центре, поэтому они будут лучше отображаться на больших экранах.
Гибкие схемы были разработаны примерно в 2000 году, как замена HTML-диаграмм, с намерением отказаться от традиционного сеточного дизайна. Обычно предполагалось, что у читателей будет установлена ОС Windows с разным разрешением экрана, и веб-дизайнер ничего не сможет с этим поделать. Итак, дизайн должен быть разделен на блоки (боковая панель, блоки контента, рекламные блоки, области навигации, ..), которые были отправлены в браузер, а затем встроены в пользовательский экран браузера, потому что браузер знает подробности о размере и разрешении экрана пользователя, размере окна, шрифтах и т. Д., Поэтому Браузер справится с этим лучше, чем веб-дизайнеры, даже несмотря на то, что такие настройки часто меняют позициичто касается основных блоков контента, то все же гораздо лучше размещать объекты под основным текстом, а затем размещать его сбоку. Таким образом, удобство использования становится намного лучше, особенно при отсутствии горизонтальной прокрутки.
Адаптивный веб-дизайн - это новый подход, основанный на стандартах CSS3, и он имеет более глубокий уровень спецификаций по элементам за пределами каскадного стиля веб-страницы, с лучшим использованием псевдоселекторов CSS media.
Качество кода имеет значение
При создании веб-сайта наилучшей практикой было бы приспособиться к стандартам. Это связано с ошибками в кодировании и предположением, что идентификаторы и классы будут распознавать друг друга надлежащим образом. Обычно это делается с помощью описания функции элемента. Создание веб-сайта, не соответствующего стандартам, может быть действительно плохой идеей, потому что это может сделать ваш сайт непригодным для использования. Стандарты существуют из-за правильного расписания веб-страницы, дизайна и обеспечения того, чтобы закодированные элементы были закрыты надлежащим образом. Проверка с помощью V3C validator может быть выполнена только после завершения правильного объявления веб-страницы (DOCTYPE), которое используется для поиска ошибок кодирования в определенных строках кода. Система определяет ошибки и области, которые не соответствуют стандартам веб-дизайна, и эта информация может быть изменена позже.
Визуальная идентичность и дизайн
Внешний вид веб-сайта должен быть адаптирован к целевой группе, которая планируется. Это может быть возрастная группа или особый взгляд на культуру, которую дизайнер должен понимать, чтобы он мог визуально отразить это. Дизайнеры также должны понимать клиента, его компанию и сферу бизнеса, чтобы они знали, какой тип веб-сайта им нужен. Эстетика и окончательный дизайн веб-сайта никогда не должны вступать в конфликт с содержанием или чем-либо еще, чтобы пользователи могли как можно быстрее находить информацию или товары, за которыми они пришли.
Сосредоточьтесь на пользовательском опыте - UX
Чтобы понять сам веб-сайт, самое главное - понять, как он работает. Пользовательский интерфейс как и понимание сообщения веб-сайта, хорошо организованные элементы должны быть кристально понятны для всех пользователей, особенно если вы хотите, чтобы этот посетитель вернулся. Более опытные пользователи обычно лучше разбираются в функциональности веб-сайта, и если они найдут ваш веб-сайт полезным, они вернутся. Менее опытные пользователи не будут так часто видеть преимущества или недостатки.
Веб-дизайнер должен быть сосредоточен на хорошем дизайне и на том, чтобы как опытные, так и неопытные пользователи находили нужную им информацию.
Web+4