Веб дизайн лекции – Курс лекций по дисциплине «Web-дизайн»

13.11.2020 Советы художника

Содержание

Курс лекций по дисциплине «Web-дизайн»

Лекция 1 Тема: Основные понятия Web-дизайна

Цели: Ознакомить учащихся с основными понятиями web-дизайна; основными задачами web-дизайна в Интернете функции web-дизайнера; определить роль и предмет изучения дисциплины web-дизайна.

План урока.

Организационный момент.
Изложение нового материала.

1) Понятие web-дизайна

2) Задачи web-дизайна

3) Функции web-дизайнера

Закрепление изученного.
Итог урока.

Ход урока.

Организационный момент.

Отметить присутствующих. Сообщить тему урока. Настроить учащихся на восприятие материала.

Изложение нового материала.

Понятие web- дизайна

Термин Web-дизайн состоит из двух частей. Первая часть — Web — это сокращенное написание слов World Wide Web — Всемирная Паутина. Вторая часть термина — слово «дизайн» — происходит от английского слова design, что означает: проектировать, конструировать, планировать, чертить, создавать рисунок. Таким образом, предварительный перевод термина Web-design с английского языка на русский язык может быть таким: «проектирование для Интернета».

Для уточнения смысла этого термина рассмотрим существующие понятия и определения.

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

Изобразительными средствами дизайна являются: точка, линия, фактура, текстура, цвет, форма, пропорция и др. Кратко рассмотрим следующие термины.

Текстура — характер поверхности какого-либо объекта, обусловленный его внутренним строением, структурой, объективными физическими свойствами (дерево, металл, стекло, ткань).

Фактура — внешние свойства поверхности объекта (гладкая, шероховатая, зеркальная). Фактура характеризует качество обработки поверхности объекта.

Форма — внешнее очертание, наружный вид, контур объекта.

Цвет — свойство тел вызывать определенное зрительное ощущение в соответствии со спектральным составом и интенсивностью отражаемого или испускаемого ими видимого излучения. Основные параметры цвета — цветовой тон, насыщенность и светлота. Цветовой тон определяется спектральным составом света, насыщенность — количеством добавляемого серого цвета, а светлота — яркостью.

Теперь дадим определение Web-дизайна. Заметим, что в литературных источниках встречаются другие написания этого термина: Веб-мастеринг, Веб-дизайн.

Web-дизайн — новый жанр изобразительного искусства, основанный на применении специфических инструментов (компьютера и программ-редакторов), специальных языков программирования (HTML, JavaScript, Java, Perl, C++, PHP и др.) и сетевых технологий (CGI, CSS, SSI и др.). Целью Web-дизайна является проектирование (создание) объектов (Web-страниц, баннеров, апплетов, скриптов, отдельных элементов Web-страниц), размещаемых в Интернете.

Web-дизайнер (или несколько русифицированные термины: Web-мастер, Веб-мастер) — художник-программист, занимающийся Web-дизайном.

Кроме обязанностей, связанных с дизайном, Веб-мастеру нередко приходится также выполнять обязанности системного администратора и программиста (по крайней мере, иметь хорошее представление о сетевых технологиях и языках программирования). Порой Web-дизайнеру приходится генерировать идеи, воплощать их в реальную жизнь и быть, к сожалению, единственным зрителем своего произведения. В других крайних случаях дизайнеров ждет головокружительный успех, как это случилось с американскими студентами — разработчиками каталога Yahoo.

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

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

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

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

Основной задачей профессиональных Web-дизайнеров является привлечение большого числа посетителей на созданный ими сайт. И если на страницы дизайнеров-любителей заходят два-три посетителя в неделю, то коммерческие сайты посещают ежедневно тысячи людей. Этому способствует неразрывное единство художественного оформления сайта и его предметного содержания (единство формы и содержания). Не последнюю роль в создании популярности играет умение «раскрутить» сайт.

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

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

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

Проектирование страниц или сайтов осложняется еще и тем обстоятельством, что одна и та же страница отображается по-разному разными браузерами (Internet Explorer, Netscape Navigator, Opera) и в окнах разного размера. Во многих случаях браузер самостоятельно «решает» как будет выглядеть загружаемая страница. Изменить внешний вид страницы может и пользователь, например, путем отключения опции загрузки рисунков, анимации.

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

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

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

Как правило, теплые тона на рисунке обладают свойством «приближаться», а холодные — «удаляться». Другими словами, предметы, нарисованные теплыми тонами, будут казаться расположенными ближе предметов, изображенных холодными тонами.

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

Белый, черный и серый цвета называются ахроматическими, все прочие — хроматическими. Особенности воздействия цвета на человека изучает наука колористика.

Перечислим некоторые важные рекомендации по созданию Web-сайта. Целесообразно не перегружать страницу большим числом деталей. Это связано с тем, что человек за короткое время способен воспринять и запомнить не более 7-8 объектов.

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

На всех страницах одного сайта рекомендуется использовать одинаковые панели навигации, размещенные в одинаковых местах. Каждая Web-страница сайта должна иметь ссылку на главную страницу сайта.

На последней стадии проектирования сайта целесообразно проверить работоспособность всех сделанных гиперссылок. Завершая проектирование сайта, желательно просмотреть его с помощью различных браузеров (MS Internet Explorer, Netscape Navigator, Opera).

Кратко рассмотрим вопрос оценки допустимого объема Web-страницы. В современном динамичном мире каждому человеку нужно успеть многое сделать. Поэтому люди экономят каждое мгновение дарованной им жизни. Пользователи, путешествующие по сети, «проскакивают» мимо тех Web-страниц, которые недопустимо долго загружаются на их компьютеры. По этой причине при проектировании сайта дизайнеру необходимо уметь заранее оценить примерное время загрузки и допустимый объем создаваемой ими страницы. Считая, что предельно допустимое время ожидания загрузки Web-страницы составляет 30-40 секунд, а средняя скорость поступления информации по коммутируемому каналу — 10-20 Кбит/с, получаем желательный объем проектируемой Web-страницы — 300-800 Кбит, т. е. 37,5-100 Кбайт. Естественно, что при использовании выделенного канала скорость загрузки, как правило, возрастает в 3-4 раза, и поэтому допустимый объем страницы в перспективе может быть увеличен.

studfiles.net

26 полезных видеолекций для веб-дизайнеров

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

Практикующий дизайнер Максим Солдаткин рассматривает эту профессию со всех сторон: можно ли ей научиться без художественного образования, как быть фрилансером веб-дизайнером, как грамотно составлять ТЗ на работу, где искать клиентов и много других интересных тем.

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

8 базовых навыков веб дизайна для начинающих с нуля

Профессия: веб-дизайнер и дизайнер интерфейсов UX & UI

Сущности в веб-дизайне и интерфейсах

А/Б тестирование

Как сделать модульную сетку 960 grid

Куда ехать дизайнеру на фриланс зимовать

Первые деньги в веб-дизайне

Как сделать лендинг Landing Page

Как сделать идеальный сайт для поиска стилиста New You

10 рабочих способов найти клиентов на веб-дизайн

Как сделать интерактивный прототип сайта или мобильного приложения за 1 минуту

Как дизайнеру найти вдохновение для дизайна сайта или интерфейса

Как сделать адаптивный сайт под разные размеры экрана

Как написать пользовательский сценарий

Что такое рекламный инсайт и как придумать хороший инсайт

Как написать техническое задание (ТЗ) на дизайн сайта

Идеальная типографика и микротипографика

ТОП 5 правил типографики на веб-сайтах

Типографика: как подобрать шрифтовую пару для сайта

Как дизайнеру сверстать сайт?

HTML и CSS для веб-дизайнера

Как подготовить макет сайта для верстки, для верстальщика

Как делать только 1 вариант дизайна

Стили в графическом дизайне

Дизайн сайта в Photoshop (Фотошопе) с нуля за 60 минут самому

Ответы на вопросы в рамках курса веб-дизайна

Фото на обложке: ShutterStock

infogra.ru

Конспект лекции «Основы Web-дизайна» — Конспект

Информационные технологии в деятельности учителя-предметника

Конспект лекции «Основы Web-дизайна»

Понятие сайта

Информация, доступная в Internet, располагается на компьютерах (Web-серверах), на которых установлено специальное ПО. Значительная часть этой информации организована в виде Web-сайтов. Для просмотра Web-сайтов используются специальные программы, которые называются браузерами (Internet Explorer и др.).

Web-сайт – это

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

Web-сайты бывают

личные (персональные)
информационные (сайты учебных заведений)
дистанционного образования
коммерческие (internet-магазины)
развлекательные

Web-страница представляет собой текстовый файл с расширением *.htm (*.html), который содержит текстовую информацию и специальные команды — HTML-коды, определяющие в каком виде эта информация будет отображаться в окне браузера.

Вся графическая, аудио- и видео информация непосредственно в Web-страницу не входит и представляет собой отдельные файлы:

*.gif, *.jpg — графика,

*.mid, *.mp3 — звук,

*.avi — видео.

В HTML-коде страницы содержатся только указания на такие файлы.

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

Создание сайта

Этапы создания сайта.

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

Состав команды для создания сайта.

Администратор. Организует совместную работу между членами группы. Следит за ходом выполнения работ. Дает необходимые указания и рекомендации. Следит за поступлением новой информации
Веб-дизайнер. Создает фирменный стиль и логотип учебного заведения. Реализует его в графических программах (Photoshop, CorelDraw, Flash)
Веб-программист. Занят в написании различных программ для веб-сайта. Например: написание форума, гостевой книги, скриптов для динамического обновления новостей
Веб-мастер. Объединяет в себе функции веб-дизайнера и веб-программиста. Отвечает за общее представление веб-сайта в Интернете.
Верстальщик. После того как создан фирменный стиль сайта и реализован дизайн одной из страниц веб сайта, необходимо сформировать основные страницы, создать структуру и наполнить страницы информацией
Наборщик. Набирает необходимую текстовую информацию для сайта используя редакторы Word, Excel (или другие)
Редактор. Проверяет подготовленный материал для размещения на сайте с литературной точки зрения. Исправляет ошибки, корректирует тексты
Менеджер. Занимается раскруткой и рекламой веб-сайта.

Планирование сайта

Решив создать свой сайт и разместить его в Интернет, вы в первую очередь определяете

Какой он, ваш пользователь?

примерная возрастная группа и пол;
с какой целью он к вам придет;
каким браузером он пользуется;
на какой скорости подключен к сети;
какие у него настройки.

Содержание или контент — является одной из самых важных составляющих. Если на сайте нет полезной информации, способной заинтересовать определенный круг людей, то можно ставить вопрос о необходимости существования сайта как такового.

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

Советы по планированию содержания

На первой (титульной) странице размещать заголовок сайта, ссылки на страницы с основной информацией и некоторые общие сведения
Не подавайте весь текст на входной странице. Иногда кажется, что автор боится, что посетитель уйдет, не узнав главного. На первой странице в идеале должна быть зацепка — ключевое слово или фраза, которые “остановят” посетителя.
Ограничивать длину страниц 3-4 экранами, первая страница — 1 экран.
При необходимости со страниц содержащих основную информацию организовывать ссылки на страницы с более подробной информацией

При планировании структуры Web-сайта основным критерием является то, насколько легко пользователи могут получить нужную информацию.

Время загрузки

Странички нужно оптимизировать для получения наименьшего их размера (разумеется, в пределах разумного)

50 Кб — 100Кб — это максимальный объем (вес), который может иметь страничка вместе со всей графикой, находящейся на ней

Если требуется разместить информацию большего размера, то предупредите об этом пользователя или распределите информацию по нескольким страничкам

Оформление сайта

Дизайн – размещение и оформление элементов содержания и навигации

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

Выразительность — качество композиции, проявляется в том, что изображение быстро захватывает внимание зрителя, ясно показывает процессы, которые дизайнер хотел отобразить. Выразительность проявляется в умелом использовании контрастов по цветам, светлоте, размерам. Например, эффектно смотрятся объемные фигуры

Выявление центра — подчеркивание той части, которая выражает главную идею. Центр находится чуть выше середины экрана, но может быть смещен «активным» элементом композиции — ярким, большим предметом, другим контрастным объектом.

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

Шрифт

Оформление документа: выделение необходимых частей текста цветом, применением СТРОЧНЫХ символов, их курсивного и полужирного начертания, а также изменение размера шрифта.
Удобочитаемость: текст выполнен темным цветом на светлом фоне и быть контрастным (не брать пестрый фон).
Ширина строки документа: строка «идеальной ширины» должна умещать порядка 50-70 знаков. При их большем количестве скорость чтения замедляется и утомляемость наступает быстрее.
Мелкий текст, мелкие надписи на картинках делайте шрифтом без засечек.
Любая надпись — должна быть читаемой, то есть доносить до зрителя необходимую информацию.
На одной работе не должно быть очень много шрифтов разных стилей. Это раздражает зрителей.
Любая стилистическая невыдержанность произведения действует отрицательно на смотрящего.
Лучше применить один-два вида шрифтов, но использовать буквы разных размеров либо цветов.
Поменьше пользуйтесь так называемым пляшущим или разноуровневым текстом

Графика — это визуальное средство подчеркивания и выделения информации, раскрываемой текстом Web-страницы.

Внешний вид и привлекательность сайта в значительной мере зависит от наполняющей его графики

Пути получения графического изображения:

создание изображения в графическом редакторе ;
поиск в библиотеках графических изображений (ClipArt, Internet),
сканирование с печатного экземпляра.

Большая часть времени тратится на загрузку изображений. Не перегружайте страницу графикой не несущей смысловой нагрузки.

Наполнение сайта

Графические форматы

GIF (Graphic Interchange Format) — формат графического обмена. GIF-файлы — это файлы растровых изображений, в которых используется не более 256 цветов. (прозрачная, анимированная графика и рисунки).

JPEG (Joint Photographic Experts Group) — JPEG — файлы представляют собой растровые изображения, в которых может быть использовано до 16.7 млн. цветов. При каждом сохранении такого файла качество изображения ухудшается. (фотографии)

Работа с цветом

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

Сочетания цветов также бывают плохие. Самыми неприятными являются следующие цветовые сочетания:

красный — зеленый,
оранжевый — синий,

Оранжевый цвет гипнотизирует и притягивает

Причины, по которым не следует использовать музыку:

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

Звук имеет право на существование, если:

пользователю предоставлена возможность самому указать, хочет он звук, или нет;
он несет смысловую нагрузку

Нельзя использовать музыку в декоративных целях !!!

Размещение сайта

Размещение на web-сервере в организации, в которой Вы работаете
Размещение на каком-либо web-сервере в Интернет (хостинг)

Бесплатный хостинг

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

Платный хостинг

(или и т.п.)

Гарантируется стабильная работа веб-сайта
Гарантируется определенная скорость доступа к веб-сайту
Различные дополнительные услуги (до нескольких электронных адресов (mail@), размещение других сайтов под данным именем, возможность размещения программ)

Регистрация сайта

Бесплатный хостинг

Заполнение определенной веб-формы (описание размещаемого ресурса, название, Ваш e-mail)
Выдача Вам имени и пароля для размещения веб-сайта

Платный хостинг

Заполнение определенной веб-формы (описание размещаемого ресурса, название, Ваш e-mail, адрес, паспортные данные)
Выбор системы оплаты (почтовый перевод, Интернет (web money)
Оплата за размещение веб-сайта
Выдача Вам имени и пароля для размещения веб-сайта

Размещение сайта

Выдача логина (имени пользователя) и пароля для входа на удаленный веб-сервер

Например: логин: school пароль: sc76Ht

Адрес удаленного веб-сервера: ftp:

Использование программы Far для входа по протоколу ftp (протокол передачи файлов) для входа на удаленный веб-сервер
Копирование файлов в каталог на удаленном веб-сервере по протоколу ftp
Просмотр web-сайта по указанному адресу через броузер

Решение проблем

Проверить веб-сайт на наличие технических ошибок

Написать письмо в службу технической поддержки данного веб-сервера
Сменить хостинг (в случае бесплатного хостинга)

Марийский региональный центр интернет образования, 2006

refdb.ru

НОУ ИНТУИТ | Лекция | Основы Web-дизайна

Аннотация: В данной лекции описаны основы разработки Web-страниц — трехслойная, клиент/серверная архитектура, модели систем Web и т.д

Контекст разработки Web

Многие люди являются «авторами» страниц Web, немногие являются «разработчиками» сайтов Web. Возможно, вы также присоединитесь к сообществу разработчиков.

Создание страницы Web

Сегодня создание страницы Web является не слишком трудной задачей. Многие стандартные программные пакеты персональных компьютеров обладают встроенными средствами для преобразования документов текстовых процессоров, электронных таблиц, баз данных и т.д. в специально кодированные документы, которые могут быть доступны в Web. Специальные пакеты для создания страниц Web, такие, как Microsoft FrontPage и Macromedia Dreamweaver, позволяют легко создавать страницы Web с помощью технологии перетаскивания (Drag-and-Drop). В большинстве таких случаев даже не нужно знать о существовании специального языка кодирования HTML (язык разметки гипертекста), который неявно все это обеспечивает.

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

Разработка Web

«Разработка» Web, в противоположность «созданию» страниц Web, выходит далеко за пределы использования кодов разметки и нескольких подключаемых модулей или метода сценариев для создания привлекательных или информативных страниц Web. Этот термин относится к использованию специальных стратегий, инструментов и методов для создания страниц Web и сайтов Web, характеризуемых как трехуровневые, клиент/серверные системы обработки информации. Давайте рассмотрим эти термины более подробно, чтобы понять разнообразие задач, для которых разрабатываются страницы и сайты Web.

Системы обработки информации

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

Системы интранет

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

Системы интернет

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

Системы экстранет

Системы экстранет являются системами бизнес-для-бизнеса (B2B), которые управляют электронным обменом данными (EDI) между деловыми предприятиями. Эти системы обеспечивают информационный поток между организациями – между компанией и ее поставщиками и между компанией и ее сбытовыми организациями – чтобы помочь в координации последовательности закупки, производства и распространения. Электронный обмен данными помогает исключить бумажный поток, сопровождающий бизнес-транзакции, используя технологии Web для пересылки электронных документов между компьютерами, а не между людьми.

Как системы на основе Web приложения EDI устраняют трудности передачи информации между различными программными и аппаратными платформами с изначально различными информационными форматами и различными протоколами обмена информацией.

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

На основе Web

Термин «на основе Web» относится к тому факту, что системы обработки информации полагаются на технологию Интернет, в частности, на так называемую Всемирную паутину (WWW). Поэтому системы на основе Web действуют в технологических рамках со следующими характеристиками.

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

Второе: коммуникационные сети основываются на открытых и публичных технических стандартах, таких, как архитектуры Ethernet, протоколы передачи TCP/IP и протоколы приложений HTTP и FTP. Они не являются частными или патентованными стандартами, но являются принципиально открытыми и свободными для публичного использования.

Третье: системы обработки на основе Web используют широко распространенное, часто бесплатное, программное обеспечение для разработки и работы. Деятельность по обработке происходит с помощью браузеров Web, а не специально написанного программного обеспечения для интерфейса пользователя и для внешнего сбора данных и обработки. Браузеры Microsoft Internet Explorer, Mozilla Firefox, Opera, Netscape Navigator и другие являются средством взаимодействия пользователей с системами обработки информации. Также широко распространенные компьютеры серверов Web выполняют основные функции бизнес-обработки, а серверы баз данных обеспечивают хранение информации, доступ к ней и извлечение.

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

www.intuit.ru

34 лучшие лекции для дизайнеров

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

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

Приятного просмотра!

«Я — арт директор»

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

Лауреат бессчётного числа российских и международных конкурсов дизайна, автор десятков, если не сотен, логотипов, часть которых мы видим почти каждый день: аптечная сеть 36,6, радио «Серебряный дождь», политическая партия «Яблоко» и.т.д.

Украл, выпил, в дизайн!

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

Видеоурок по препрессу. Цветоделение

Емкий и качественный матеркласс по препрессу и цветоделению на примере подготовки к печати каталога.

Как работать с «творческими индивидуальностями»

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

Дизайн собственного мозга

«Не думаю, что думать можно научить любого. Но каждого пятого — можно. А каждого второго из каждого пятого можно научить придумывать то, что называется дизайном».

Презентация дизайн проекта. Рекомендации арт-директору

Дмитрий Карпов о методике презентации проекта, построении и систематизации доводов, гипотез и результатов исследований для убедительного представления проекта клиенту.

Креативный дизайн: Знаки любви, символы ненависти

Слова или фразы превращаются в визуальные мемы и начинают самостоятельную жизнь. Смыслы перетекают из текстов в изображения и обратно, мутируют, приобретают заразность вирусов, приспосабливаются к новым контекстам.

Как анализировать эти трансформации, понять их закономерности и использовать для синтеза символов в рекламе? Научим.

Семинар по типографике в стенах студии Не Кино

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

Как открыть собственную дизайн-студию?

Если Вы решили открыть собственную дизайн-студию, перед вами встанет множество вопросов: как зарегистрировать компанию? что выбрать: ИП или ООО? какие есть виды налогообложения? какой вид максимально подойдёт мне?

Основы визуальных комуникации брендов

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

Анимация это сложно

Лекция Павла Мунтяна.

Дизайн периодических изданий

Лекция Леонида Бершидского “Особенности журнального рубрикатора” на курсе “Дизайн периодических изданий”.

Леонид рассматривает структуру журналов “Итоги”, “Огонек”, Star Hit, “Гастраномъ”, рассказывает о личном опыте работы в изданиях и раскрывает секрет идеального рубрикатора Men’s Health.

Три поколения дизайна упаковки

Основатель и креативный директор ДизайнДепо рассказывает о contact space в дизайне упаковки в Московском музее дизайна в рамках цикла лекций “Три поколения дизайна упаковки”.

Переход на новый уровень в InDesign

Лекция по работе в программе Adobe Indesign.

Ресурсные состояния творчества

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

Каким должен быть дизайн?

Арт-директором студии Артемия Лебедева коротко расскажет о том, каким должен быть дизайн и укажет на основные ошибки дизайнеров.

Базовые приемы в дизайне взаимодействий

Короткая лекция о практике мышления категориями цифровых интерактивных взаимодействий. Проектирование восприятия, действий и впечатлений пользователя.

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

20 минут об управлении творческой командой

Двадцатиминутка с семинара по управлению креативным подразделением. Дизайнерами, проектировщиками, копирайтерами. Тактики влияния на процессы.

Веб дизайн — мертв. Реанимация своими руками

Выступление на Microsoft Design Camp 2013. Тематический обзор форматов в веб-дизайне. Иногда может показаться что веб-дизайн остановился в развитии, предсказуемые решения, устаревающие технологии.

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

Брендинг

Крайне интересная лекция о грамотном подходе к созданию качественного брендинга. Много интересного, рекомендуем.

Отложи дела до завтра

Доклад для тех, кто иногда замечает, что время сочится как песок сквозь пальцы. Иногда кажется, что чтобы всё успеть, в сутках должно быть 48 часов.

Но даже если бы это было так, то кроме того, что с работы удавалось бы уходить не в 22:00, а в 46:00, ничего бы не изменилось.

Провинциальные лекции VII. Агентство «PUNK YOU BRANDS»

На очередной Провинциальной лекции выступили представители барнаульского агентства PUNK YOU BRANDS (http://punk-you.ru/). В рамках лекции «Созидающая сила троллинга или Панки хой!» Ильдар Шале и Данил Снитко рассказали почтенной аудитории о жизни, заказах, клиентах, фестивале фэйковой рекламы и прочих прелестях работы в крутом брендинговом агентстве.

Мэппинг: искусство на фасаде здания

Лекция продюсера и художника Алексея Шустова и видео-художника Федора Аптекарева, в рамках образовательной программы выставки «Пространство LUCIDA».

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

Артемий Лебедев на Бали (Конференция 9.10.13)

Видео с замечательной встречи с читателями Артемия Лебедева, что прошла 9.10.13 за острове Бали.

Сергей Шапиро – Открытая лекция в Академии Wordshop

Открытая лекция Сергея Шапиро “Авторский леттеринг и каллиграфия” в Академии Коммуникаций Wordshop.

Алгебра вкусовщины или как выбрать дизайн

Множество копий ломается на тему каким цветом сделать заголовок или производится ли нужный эффект эмоциональной картинкой на главной странице.

Как правило, спорить можно до хрипоты о «холодных» или «теплых» тонах, о «силе убеждения». А можно просто измерить — с привлечением пользователей. О том, как этот сделать и каких результатов можно добиться и пойдет речь в докладе.

В. Меламед о современных тенденциях в иллюстрации
Семинар В. Меламед в Студии Артемия Лебедева.

Графический дизайн. Форум «МЕДЬ»

Башев Денис — дизайнер-график, арт-директор. Работал в Shandesign, Front:Design и PHPG, повышал квалификацию на «Бархатной школе каллиграфии» и в Central Saint Martins, создатель дизайн-студии Province.

В настоящее время работает в LOGVINDESIGN. Опыт работы – 12 лет.

Работа дизайнера в условиях сжатых сроков

Лекция Сергея Андронова, арт-директора агентства Hungry Boys, о тонкостях web-дизайна и использовании Creative Cloud в своей работе.

Ивановский о дизайне

Комментарий автора: Попросили рассказать про будущее дизайна, полтора часа бредил. Кажется, никто не просек. (процентов 30% того что произностится — гон)

Из чего слеплен дизайн-мыслитель

Лекция Родиона Арсеньева креативного директора агентства Red Keds на тему “Из чего слеплен дизайн-мыслитель”

Веб-дизайнер: творческая профессия для независимого человека

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

infogra.ru

НОУ ИНТУИТ | Лекция | Основы Web-дизайна

Контекст разработки Web

Создание страницы Web

Разработка Web

Системы обработки информации

Системы интранет

Системы интернет

Системы экстранет

На основе Web

www.intuit.ru

26 лекций от Нетологии о создании сайтов и веб-дизайне

Теория и практика для тех, кто работает с визуальным контентом: от подбора иллюстраций и создания незабываемых презентаций до разработки интерфейсов.

Также спикеры рассуждают о профессии веб-дизайнера, о дизайне в целом, а также о развитии собственной дизайн-студии.

Как спроектировать информационную архитектуру сайта

Как подготовить техническое задание на разработку сайта

Особенности проектирования интерфейсов для Smart TV

Что выбрать: адаптивный сайт или мобильную версию

Как адаптировать изображения для мобильной версии сайта

Как создать Customer Journey Mapping

Как провести исследование аудитории

Как избавиться от визуального шума

Как открыть веб студию и заработать на этом

Как представить проект заказчику

Как создать портфолио и найти работу мечты

Как модульные сетки помогают пользователям

Как работать с модульной сеткой

Веб-дизайнер: творческая профессия для независимого человека

Как подобрать референсы для сайта

Основные типы шрифтов: Антиква и Гротеск

Как дизайнеру составить резюме

Дизайн презентаций как искусство

Как найти и устранить проблемы веб-интерфейса

Шесть советов по выбору иллюстраций

Скетчинг и прототипирование

Веб-дизайнер: творческая профессия для независимого человека

Как делать скетчи?

Курс «Веб-дизайнер: эффективный сайт от идеи до реализации»

Сайт как интерфейс взаимодействия с пользователем

Оформление продающих страниц: как повысить доверие к сайту

infogra.ru

Comments

Leave Comment