SlideShare a Scribd company logo
1 of 17
Основы WEB-дизайна
Что такое Web-дизайн?
 Содержимое. Сюда входят форма и
организация содержимого сайта.
 Зрительные образы. Это относится к
компоновке экранного пространства на сайте.
Создается с помощью HTML, CSS, Flash.
 Технология. HTML ,CSS , WEB-
программирование (JavaScript, PHP).
 Доставка. Скорость и безотказность доставки
сайта по сети Internet.
 Назначение. Причина, по которой сайт
существует.
Пирамида Web-дизайна
Сетевая среда
Компоненты сетевой среды
 Сторона сервера. Сюда входят аппаратное и программное
обеспечение Web-сервера, а также программные элементы и
встроенные технологии. Диапазон этих технологий простирается
от простых программ CGI, написанных на PERL, до комплексных
многозвенных приложений на основее PHP или Java; здесь же
учитываются прикладные технологии, например — серверы баз
данных, которые могут обеспечивать поддержку Web-сайта.
 Сторона клиента. Сторона клиента связана с Web-браузером и
поддерживаемыми им технологиями, такими как языки HTML, CSS
и JavaScript, элементы управления ActiveX и сменные модули
Netscape, которые используются для создания представления
страницы или обеспечения интерактивных функций.
 Сеть. Сеть характеризует различные элементы связности,
предназначенные для доставки Web-сайта пользователю. Такими
элементами могут быть различные сети в общедоступной части
сети Internet или частные соединения внутри корпорации, которые
зачастую называются внутренней сетью.
Типы Web-сайтов
 Отвлечённые классификации
 Информационные сайты
 Операционные сайты
Типы Web-сайтов
Классификация сайтов по обобщённым
категориям
 Информационные сайты
 Операционные сайты
 Сайты сообществ
 Развлекательные сайты
 Прочие сайты
Классификация сайтов по
принадлежности
 Коммерческие сайты
 Правительственные сайты
 Образовательные сайты
 Филантропические сайты
 Персональные сайты
Визуальные классификации
 Тексто-ориентированные
Визуальные классификации
 Сайты в стиле GUI
Визуальные классификации
 Метафорические сайты
Визуальные классификации
 Экспериментальные сайты
Более четкое определение Web-
дизайна
 Web-дизайн — это мультидисциплинарная
область деятельности, относящаяся к
планированию и производству Web-
сайтов, которое включает (но не
исчерпывается) техническую разработку,
структурирование информации,
визуальный дизайн и доставку по сети.
Основные вопросы Web-дизайна
 нужды дизайнера и чаяния пользователей;
 равновесие формы и функции;
 качество исполнения;
 соотношение традиции и новшества.
Дизайн, ориентированный на
пользователя
 Общепринятая ошибка, совершаемая при
Web-разработке, состоит в том, что
слишком часто сайты создаются скорее
для дизайнеров и удовлетворения их
нужд, чем для непосредственных
пользователей.
 Вы- не пользователь
 Пользователи не дизайнеры
Баланс формы и функции
 Обеспечьте связь внешнего вида сайта и его
назначения
 Исполнение сайта должно быть
безукоризненным или практически безупречным
 Выполняйте разработки для
среднестатистического пользователя, но
учитывайте различия
 Высказывайте должное уважение к
соглашениям, связанным с графическим
пользовательским интерфейсом
 Не существует никакого «правильного» WEB-
дизайна, подходящего для любого сайта

More Related Content

Viewers also liked

Seo проектирование сайта
Seo проектирование сайтаSeo проектирование сайта
Seo проектирование сайтаИрина Шамина
 
Frigin ener sys_ekbpromo_voroneg
Frigin ener sys_ekbpromo_voronegFrigin ener sys_ekbpromo_voroneg
Frigin ener sys_ekbpromo_voronegekbpromo
 
Отказоустойчивость веб-проекта: мониторинг, резервирование, обслуживание
Отказоустойчивость веб-проекта: мониторинг, резервирование, обслуживаниеОтказоустойчивость веб-проекта: мониторинг, резервирование, обслуживание
Отказоустойчивость веб-проекта: мониторинг, резервирование, обслуживание1С-Битрикс
 
Ринат Ибрагимов - Региональное SEO: продвижение сайтов, созданных на  Drupal
Ринат Ибрагимов - Региональное SEO: продвижение сайтов, созданных на  DrupalРинат Ибрагимов - Региональное SEO: продвижение сайтов, созданных на  Drupal
Ринат Ибрагимов - Региональное SEO: продвижение сайтов, созданных на  DrupalDrupalSib
 
«Проект усиления энергобезопасности, развития энергетики и энергоэффективност...
«Проект усиления энергобезопасности, развития энергетики и энергоэффективност...«Проект усиления энергобезопасности, развития энергетики и энергоэффективност...
«Проект усиления энергобезопасности, развития энергетики и энергоэффективност...BDA
 
Андрей Уманский "10 ошибок тех, кто начинает продавать в интернете"
Андрей Уманский "10 ошибок тех, кто начинает продавать в интернете"Андрей Уманский "10 ошибок тех, кто начинает продавать в интернете"
Андрей Уманский "10 ошибок тех, кто начинает продавать в интернете"Prom
 
Дизайн и юзабилити коммерческих сайтов
Дизайн и юзабилити коммерческих сайтовДизайн и юзабилити коммерческих сайтов
Дизайн и юзабилити коммерческих сайтовДима Руселевич
 
Cyber Bionics #iotconfua
Cyber Bionics #iotconfuaCyber Bionics #iotconfua
Cyber Bionics #iotconfuaAndy Shutka
 
«Импортозамещающие абсорбционные тепловые насосы и холодильные машины»
«Импортозамещающие абсорбционные тепловые насосы и холодильные машины» «Импортозамещающие абсорбционные тепловые насосы и холодильные машины»
«Импортозамещающие абсорбционные тепловые насосы и холодильные машины» BDA
 
Вероника Табакова. Дизайн сайтов. Бизнес-пирожки 2016
Вероника Табакова. Дизайн сайтов. Бизнес-пирожки 2016Вероника Табакова. Дизайн сайтов. Бизнес-пирожки 2016
Вероника Табакова. Дизайн сайтов. Бизнес-пирожки 2016Businesss Pirozki
 
«Договорные условия работы малой генерации на розничных рынках электрической ...
«Договорные условия работы малой генерации на розничных рынках электрической ...«Договорные условия работы малой генерации на розничных рынках электрической ...
«Договорные условия работы малой генерации на розничных рынках электрической ...BDA
 
Презентация 2.5.1.1 - Подраздел Система электроснабжения (ИОС1)
Презентация 2.5.1.1 - Подраздел Система электроснабжения (ИОС1)Презентация 2.5.1.1 - Подраздел Система электроснабжения (ИОС1)
Презентация 2.5.1.1 - Подраздел Система электроснабжения (ИОС1)Павел Ефимов
 
Rest
RestRest
RestNoveo
 
Практическое руководство по оценке удобства использования сайта. Вебинар WebP...
Практическое руководство по оценке удобства использования сайта. Вебинар WebP...Практическое руководство по оценке удобства использования сайта. Вебинар WebP...
Практическое руководство по оценке удобства использования сайта. Вебинар WebP...Академия интернет-маркетинга «WebPromoExperts»
 
Саканян Е.И. «Фармакопея стран ЕАЭС и Государственная фармакопея Российской Ф...
Саканян Е.И. «Фармакопея стран ЕАЭС и Государственная фармакопея Российской Ф...Саканян Е.И. «Фармакопея стран ЕАЭС и Государственная фармакопея Российской Ф...
Саканян Е.И. «Фармакопея стран ЕАЭС и Государственная фармакопея Российской Ф...ФГБУ «НЦЭСМП» Минздрава России
 
AzovDevMeetup 2016 | Сертификация ISTQB для QA инженера | Артём Кравченко
AzovDevMeetup 2016 | Сертификация ISTQB для QA инженера | Артём КравченкоAzovDevMeetup 2016 | Сертификация ISTQB для QA инженера | Артём Кравченко
AzovDevMeetup 2016 | Сертификация ISTQB для QA инженера | Артём КравченкоJSC “Arcadia Inc”
 
Энергетика сегодня. База для инноваций
Энергетика сегодня. База для инновацийЭнергетика сегодня. База для инноваций
Энергетика сегодня. База для инновацийЭнергия будущего
 
Frigin enersys novosibirsk_ekbpromo
Frigin enersys novosibirsk_ekbpromoFrigin enersys novosibirsk_ekbpromo
Frigin enersys novosibirsk_ekbpromoekbpromo
 

Viewers also liked (20)

Seo проектирование сайта
Seo проектирование сайтаSeo проектирование сайта
Seo проектирование сайта
 
Frigin ener sys_ekbpromo_voroneg
Frigin ener sys_ekbpromo_voronegFrigin ener sys_ekbpromo_voroneg
Frigin ener sys_ekbpromo_voroneg
 
Отказоустойчивость веб-проекта: мониторинг, резервирование, обслуживание
Отказоустойчивость веб-проекта: мониторинг, резервирование, обслуживаниеОтказоустойчивость веб-проекта: мониторинг, резервирование, обслуживание
Отказоустойчивость веб-проекта: мониторинг, резервирование, обслуживание
 
Ринат Ибрагимов - Региональное SEO: продвижение сайтов, созданных на  Drupal
Ринат Ибрагимов - Региональное SEO: продвижение сайтов, созданных на  DrupalРинат Ибрагимов - Региональное SEO: продвижение сайтов, созданных на  Drupal
Ринат Ибрагимов - Региональное SEO: продвижение сайтов, созданных на  Drupal
 
«Проект усиления энергобезопасности, развития энергетики и энергоэффективност...
«Проект усиления энергобезопасности, развития энергетики и энергоэффективност...«Проект усиления энергобезопасности, развития энергетики и энергоэффективност...
«Проект усиления энергобезопасности, развития энергетики и энергоэффективност...
 
Андрей Уманский "10 ошибок тех, кто начинает продавать в интернете"
Андрей Уманский "10 ошибок тех, кто начинает продавать в интернете"Андрей Уманский "10 ошибок тех, кто начинает продавать в интернете"
Андрей Уманский "10 ошибок тех, кто начинает продавать в интернете"
 
Дизайн и юзабилити коммерческих сайтов
Дизайн и юзабилити коммерческих сайтовДизайн и юзабилити коммерческих сайтов
Дизайн и юзабилити коммерческих сайтов
 
Cyber Bionics #iotconfua
Cyber Bionics #iotconfuaCyber Bionics #iotconfua
Cyber Bionics #iotconfua
 
«Импортозамещающие абсорбционные тепловые насосы и холодильные машины»
«Импортозамещающие абсорбционные тепловые насосы и холодильные машины» «Импортозамещающие абсорбционные тепловые насосы и холодильные машины»
«Импортозамещающие абсорбционные тепловые насосы и холодильные машины»
 
Вероника Табакова. Дизайн сайтов. Бизнес-пирожки 2016
Вероника Табакова. Дизайн сайтов. Бизнес-пирожки 2016Вероника Табакова. Дизайн сайтов. Бизнес-пирожки 2016
Вероника Табакова. Дизайн сайтов. Бизнес-пирожки 2016
 
«Договорные условия работы малой генерации на розничных рынках электрической ...
«Договорные условия работы малой генерации на розничных рынках электрической ...«Договорные условия работы малой генерации на розничных рынках электрической ...
«Договорные условия работы малой генерации на розничных рынках электрической ...
 
Презентация 2.5.1.1 - Подраздел Система электроснабжения (ИОС1)
Презентация 2.5.1.1 - Подраздел Система электроснабжения (ИОС1)Презентация 2.5.1.1 - Подраздел Система электроснабжения (ИОС1)
Презентация 2.5.1.1 - Подраздел Система электроснабжения (ИОС1)
 
Rest
RestRest
Rest
 
жанибек мухаметкалиев
жанибек мухаметкалиевжанибек мухаметкалиев
жанибек мухаметкалиев
 
Практическое руководство по оценке удобства использования сайта. Вебинар WebP...
Практическое руководство по оценке удобства использования сайта. Вебинар WebP...Практическое руководство по оценке удобства использования сайта. Вебинар WebP...
Практическое руководство по оценке удобства использования сайта. Вебинар WebP...
 
Sveto tunneli 03_11_2016 (1)
Sveto tunneli 03_11_2016 (1)Sveto tunneli 03_11_2016 (1)
Sveto tunneli 03_11_2016 (1)
 
Саканян Е.И. «Фармакопея стран ЕАЭС и Государственная фармакопея Российской Ф...
Саканян Е.И. «Фармакопея стран ЕАЭС и Государственная фармакопея Российской Ф...Саканян Е.И. «Фармакопея стран ЕАЭС и Государственная фармакопея Российской Ф...
Саканян Е.И. «Фармакопея стран ЕАЭС и Государственная фармакопея Российской Ф...
 
AzovDevMeetup 2016 | Сертификация ISTQB для QA инженера | Артём Кравченко
AzovDevMeetup 2016 | Сертификация ISTQB для QA инженера | Артём КравченкоAzovDevMeetup 2016 | Сертификация ISTQB для QA инженера | Артём Кравченко
AzovDevMeetup 2016 | Сертификация ISTQB для QA инженера | Артём Кравченко
 
Энергетика сегодня. База для инноваций
Энергетика сегодня. База для инновацийЭнергетика сегодня. База для инноваций
Энергетика сегодня. База для инноваций
 
Frigin enersys novosibirsk_ekbpromo
Frigin enersys novosibirsk_ekbpromoFrigin enersys novosibirsk_ekbpromo
Frigin enersys novosibirsk_ekbpromo
 

Similar to веб дизайн

Продвижение отраслевого сайта. Практикум
Продвижение отраслевого сайта. ПрактикумПродвижение отраслевого сайта. Практикум
Продвижение отраслевого сайта. Практикумimba_ru
 
How to create a successful website? REX09
How to create a successful website?  REX09How to create a successful website?  REX09
How to create a successful website? REX09VIS-A-VIS design agency
 
Дизайн сайта как средство повышения его информативности. С. Добровольская.
Дизайн сайта как средство повышения его информативности. С. Добровольская.Дизайн сайта как средство повышения его информативности. С. Добровольская.
Дизайн сайта как средство повышения его информативности. С. Добровольская.Таня Быстрова
 
Денис Дмитренко. О сайтах. VIS-A-VIS
Денис Дмитренко. О сайтах. VIS-A-VISДенис Дмитренко. О сайтах. VIS-A-VIS
Денис Дмитренко. О сайтах. VIS-A-VISAndrew
 
Денис Дмитренко. О сайтах. VIS-A-VIS
Денис Дмитренко. О сайтах. VIS-A-VISДенис Дмитренко. О сайтах. VIS-A-VIS
Денис Дмитренко. О сайтах. VIS-A-VISAndrew
 
О сайтах мп и конструкторе сайтов
О сайтах мп и конструкторе сайтовО сайтах мп и конструкторе сайтов
О сайтах мп и конструкторе сайтовbinec
 
Готовим сайты на 1С-Битрикс
Готовим сайты на 1С-БитриксГотовим сайты на 1С-Битрикс
Готовим сайты на 1С-БитриксIRCIT
 
Управление сайтом
Управление сайтом Управление сайтом
Управление сайтом Annely Nurkaliyeva
 
Обзор возможностей IBM WebSphere Portal v8
Обзор возможностей IBM WebSphere Portal v8Обзор возможностей IBM WebSphere Portal v8
Обзор возможностей IBM WebSphere Portal v8Andrey Mikheev
 
Дизайн, разработка веб-сайтов и веб-приложений
Дизайн, разработка веб-сайтов и веб-приложенийДизайн, разработка веб-сайтов и веб-приложений
Дизайн, разработка веб-сайтов и веб-приложенийKsentra
 
SEO продвижение
SEO продвижениеSEO продвижение
SEO продвижениеWelcomSEO
 
Управляем сайтом: Быстро. Просто. Эффективно.
Управляем сайтом: Быстро. Просто. Эффективно.Управляем сайтом: Быстро. Просто. Эффективно.
Управляем сайтом: Быстро. Просто. Эффективно.Евгений Курбанов
 
1С-Битрикс» - платформа для создания и управления корпоративным сайтом
1С-Битрикс» - платформа для создания и управления корпоративным сайтом1С-Битрикс» - платформа для создания и управления корпоративным сайтом
1С-Битрикс» - платформа для создания и управления корпоративным сайтомborovoystudio
 
Reklaman - to - Translate center
Reklaman - to - Translate centerReklaman - to - Translate center
Reklaman - to - Translate centerReklaman
 
Корпоративный сайт нашего времени: лучшие технологии «1С-Битрикс» для бизнеса
Корпоративный сайт нашего времени: лучшие технологии «1С-Битрикс» для бизнесаКорпоративный сайт нашего времени: лучшие технологии «1С-Битрикс» для бизнеса
Корпоративный сайт нашего времени: лучшие технологии «1С-Битрикс» для бизнесаborovoystudio
 
Loyalty program for bank
Loyalty program for bankLoyalty program for bank
Loyalty program for bankpotapova 3663
 
1С-Битрикс: От Старта к Большому бизнесу
1С-Битрикс: От Старта к Большому бизнесу1С-Битрикс: От Старта к Большому бизнесу
1С-Битрикс: От Старта к Большому бизнесуЕвгений Курбанов
 

Similar to веб дизайн (20)

Продвижение отраслевого сайта. Практикум
Продвижение отраслевого сайта. ПрактикумПродвижение отраслевого сайта. Практикум
Продвижение отраслевого сайта. Практикум
 
How to create a successful website? REX09
How to create a successful website?  REX09How to create a successful website?  REX09
How to create a successful website? REX09
 
Дизайн сайта как средство повышения его информативности. С. Добровольская.
Дизайн сайта как средство повышения его информативности. С. Добровольская.Дизайн сайта как средство повышения его информативности. С. Добровольская.
Дизайн сайта как средство повышения его информативности. С. Добровольская.
 
Денис Дмитренко. О сайтах. VIS-A-VIS
Денис Дмитренко. О сайтах. VIS-A-VISДенис Дмитренко. О сайтах. VIS-A-VIS
Денис Дмитренко. О сайтах. VIS-A-VIS
 
Денис Дмитренко. О сайтах. VIS-A-VIS
Денис Дмитренко. О сайтах. VIS-A-VISДенис Дмитренко. О сайтах. VIS-A-VIS
Денис Дмитренко. О сайтах. VIS-A-VIS
 
Dev
DevDev
Dev
 
Seo and Marketing Requirements in Web Architecture
Seo and Marketing Requirements in Web ArchitectureSeo and Marketing Requirements in Web Architecture
Seo and Marketing Requirements in Web Architecture
 
О сайтах мп и конструкторе сайтов
О сайтах мп и конструкторе сайтовО сайтах мп и конструкторе сайтов
О сайтах мп и конструкторе сайтов
 
Готовим сайты на 1С-Битрикс
Готовим сайты на 1С-БитриксГотовим сайты на 1С-Битрикс
Готовим сайты на 1С-Битрикс
 
Управление сайтом
Управление сайтом Управление сайтом
Управление сайтом
 
Обзор возможностей IBM WebSphere Portal v8
Обзор возможностей IBM WebSphere Portal v8Обзор возможностей IBM WebSphere Portal v8
Обзор возможностей IBM WebSphere Portal v8
 
Дизайн, разработка веб-сайтов и веб-приложений
Дизайн, разработка веб-сайтов и веб-приложенийДизайн, разработка веб-сайтов и веб-приложений
Дизайн, разработка веб-сайтов и веб-приложений
 
SEO продвижение
SEO продвижениеSEO продвижение
SEO продвижение
 
Управляем сайтом: Быстро. Просто. Эффективно.
Управляем сайтом: Быстро. Просто. Эффективно.Управляем сайтом: Быстро. Просто. Эффективно.
Управляем сайтом: Быстро. Просто. Эффективно.
 
Microsoft Office Share Point Server 20072
Microsoft Office Share Point Server 20072Microsoft Office Share Point Server 20072
Microsoft Office Share Point Server 20072
 
1С-Битрикс» - платформа для создания и управления корпоративным сайтом
1С-Битрикс» - платформа для создания и управления корпоративным сайтом1С-Битрикс» - платформа для создания и управления корпоративным сайтом
1С-Битрикс» - платформа для создания и управления корпоративным сайтом
 
Reklaman - to - Translate center
Reklaman - to - Translate centerReklaman - to - Translate center
Reklaman - to - Translate center
 
Корпоративный сайт нашего времени: лучшие технологии «1С-Битрикс» для бизнеса
Корпоративный сайт нашего времени: лучшие технологии «1С-Битрикс» для бизнесаКорпоративный сайт нашего времени: лучшие технологии «1С-Битрикс» для бизнеса
Корпоративный сайт нашего времени: лучшие технологии «1С-Битрикс» для бизнеса
 
Loyalty program for bank
Loyalty program for bankLoyalty program for bank
Loyalty program for bank
 
1С-Битрикс: От Старта к Большому бизнесу
1С-Битрикс: От Старта к Большому бизнесу1С-Битрикс: От Старта к Большому бизнесу
1С-Битрикс: От Старта к Большому бизнесу
 

веб дизайн

  • 2. Что такое Web-дизайн?  Содержимое. Сюда входят форма и организация содержимого сайта.  Зрительные образы. Это относится к компоновке экранного пространства на сайте. Создается с помощью HTML, CSS, Flash.  Технология. HTML ,CSS , WEB- программирование (JavaScript, PHP).  Доставка. Скорость и безотказность доставки сайта по сети Internet.  Назначение. Причина, по которой сайт существует.
  • 5. Компоненты сетевой среды  Сторона сервера. Сюда входят аппаратное и программное обеспечение Web-сервера, а также программные элементы и встроенные технологии. Диапазон этих технологий простирается от простых программ CGI, написанных на PERL, до комплексных многозвенных приложений на основее PHP или Java; здесь же учитываются прикладные технологии, например — серверы баз данных, которые могут обеспечивать поддержку Web-сайта.  Сторона клиента. Сторона клиента связана с Web-браузером и поддерживаемыми им технологиями, такими как языки HTML, CSS и JavaScript, элементы управления ActiveX и сменные модули Netscape, которые используются для создания представления страницы или обеспечения интерактивных функций.  Сеть. Сеть характеризует различные элементы связности, предназначенные для доставки Web-сайта пользователю. Такими элементами могут быть различные сети в общедоступной части сети Internet или частные соединения внутри корпорации, которые зачастую называются внутренней сетью.
  • 6. Типы Web-сайтов  Отвлечённые классификации  Информационные сайты  Операционные сайты
  • 8. Классификация сайтов по обобщённым категориям  Информационные сайты  Операционные сайты  Сайты сообществ  Развлекательные сайты  Прочие сайты
  • 9. Классификация сайтов по принадлежности  Коммерческие сайты  Правительственные сайты  Образовательные сайты  Филантропические сайты  Персональные сайты
  • 14. Более четкое определение Web- дизайна  Web-дизайн — это мультидисциплинарная область деятельности, относящаяся к планированию и производству Web- сайтов, которое включает (но не исчерпывается) техническую разработку, структурирование информации, визуальный дизайн и доставку по сети.
  • 15. Основные вопросы Web-дизайна  нужды дизайнера и чаяния пользователей;  равновесие формы и функции;  качество исполнения;  соотношение традиции и новшества.
  • 16. Дизайн, ориентированный на пользователя  Общепринятая ошибка, совершаемая при Web-разработке, состоит в том, что слишком часто сайты создаются скорее для дизайнеров и удовлетворения их нужд, чем для непосредственных пользователей.  Вы- не пользователь  Пользователи не дизайнеры
  • 17. Баланс формы и функции  Обеспечьте связь внешнего вида сайта и его назначения  Исполнение сайта должно быть безукоризненным или практически безупречным  Выполняйте разработки для среднестатистического пользователя, но учитывайте различия  Высказывайте должное уважение к соглашениям, связанным с графическим пользовательским интерфейсом  Не существует никакого «правильного» WEB- дизайна, подходящего для любого сайта