Совет 1: Как сделать оформление для сайта

Первое впечатление – решающее! Это утверждение верно и для сайтов. Как сделать оформление для сайта «цепляющим», интригующим и получить еще больше постоянных посетителей? При выборе оформления наиболее важны цвет и стиль, структура сайта (страницы), навигация.
Инструкция
1
Используйте одну цветовую гамму и один стиль для всех страниц сайта. Это придаст ему связность, сделает сайт цельным и легким для восприятия. Используйте наиболее популярные шрифты и безопасные цвета, чтобы вся информация правильно отображалась на экранах пользователей. Выделяйте в тексте заголовки, абзацы, ключевые слова. Посетители, как правило, просматривают страницу бегло. Сделайте так, чтобы глазу было за что «зацепиться».
2
Шапка сайта - первое, что видит посетитель, открывая страницу. Разместите в ней название сайта, слоган, контактные данные. Также можно использовать шапку для сквозного меню сайта. Структурируйте информацию (контент). Выделите главное и второстепенное на сайте. Основной контент размещайте на главной странице. Менее значимый контент – на вторых и последующих страницах. Сделайте оформление для сайта таким, чтобы любую информацию можно было получить в 2-3 клика. Меню должно быть сквозным, видным на каждой странице в одном и том же месте. Это сделает навигацию по сайту простой и удобной.
3
Для корпоративного сайта обязательными являются атрибуты: логотип, слоган, корпоративный цвет. Сайт должен быть оформлен в едином корпоративном стиле. Сайт-визитка, как правило, имеет одну страницу. Обязательными разделами являются: информация о продукте/услуге и контактные данные. Не перегружайте сайт лишней информацией. Лучше разместите одно большое изображение и минимум текста.
4
При оформлении сайта-портала основное внимание уделите колонкам новостей: их должно быть много, сопроводите их иллюстрациями, сделайте яркие «кричащие» заголовки. Включите необходимую и полезную информацию: погода, курсы валют. «Прикрутите» к порталу форум и доску объявлений. Добавьте "бегущую" строку с наиболее свежей информацией. Если вы создаете интернет-магазин, сделайте оформление для сайта с акцентом на товар. Больше хороших иллюстраций, флэш-изображений – все это привлечет внимание потенциальных покупателей. Форма для регистрации должна быть на видном месте.
5
Наиболее простой способ сделать оформление для сайта – воспользоваться готовыми шаблонами. Но и в этом случае следуйте вышеприведенным рекомендациям, вносите изменения в шаблоны, подгоняйте их под себя.

Совет 2: Как сделать флеш для сайта

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

Вам понадобится
  • - фотографии для ролика;
  • - музыкальный файл;
  • - установленная на компьютер программа Photo Flash Maker Professional.
Инструкция
1
Для создания флеш-ролика, который в дальнейшем можно использовать как самостоятельный файл и для добавления его на сайт, воспользуйтесь программой Photo Flash Maker Professional.
2
Запустите приложение и в левом углу панели инструментов выберите раздел «Файл» и перейдите к опции «Создать проект слайд-шоу». Открыть новый проект также можно нажатием клавиатурных клавиш Ctrl+N.
3
Раздел «Фото» позволяет добавлять в проект изображения, расположенные на компьютере или съемных носителях. Нажмите на клавиатуре кнопки CTRL и P и в открывшемся окне укажите место расположения необходимых для работы картинок. Выберите папку с изображениями и, нажав клавишу CTRL, отметьте нужные фотографии. Затем в рабочем окне нажмите располагающуюся внизу кнопку «Добавить», позволяющую добавлять выделенные изображения. Также программа поддерживает возможность включать в проект сразу все картинки из папки. Для этого нажмите кнопку «Добавить все» или используйте сочетание клавиш Ctrl+F.
4
Для смены картинок в разделе «Фото» выберите пункт «Переходы» и отметьте нужные. Здесь же вы можете указать длительность каждого перехода и время показа изображения.
5
Затем откройте раздел «Музыка» и добавьте звуковой файл. Для этого выберите его из недр компьютера или извлеките из звукового компакт-диска.
6
В разделе «Тема» из перечня предложенных тем выберите оформление для вашего флеш. Здесь же вы можете указать и другие параметры ролика: частоту кадров, длительность перехода, цвет фона, время показа фона, автовоспроизведение при старте, автоповтор при окончании, показ кнопок управления слайд-шоу, добавлении URL к фотографии, продолжение проигрывания ролика после щелчка.
7
Когда все необходимые изменения будут внесены в проект, перейдите в раздел «Публикация» или «Сохранить» и выберите нужный вам формат сохранения файла: создать только Flash-файл, который вы сможете переслать по электронной почте или отправить его на собственный веб-сайт, создать демо или подарочный CD/DVD, а также создать Flash-файл и отправить его Go2Album. В этом случае вы сможете разместить ролик в своем блоге и на сервисах социальных сетей.
8
Затем укажите параметры вывода файла, нажмите кнопку «Опубликовать» и дождитесь окончания процесса.
Источники:
  • делаем flash сайт

Совет 3: Как сделать декорации для фото

Если вы увлекаетесь обработкой фотографий и любите обрамлять изображения в рамки, то вам не помешает установить на компьютер программу «ФотоДекор» - приложение, позволяющее за несколько шагов преобразить фото, применяя к нему различные украшения, рамки и эффекты.
Вам понадобится
  • - компьютер;
  • - программа «ФотоДекор»;
  • - изображение для обработки.
Инструкция
1
Установите на компьютер программу «ФотоДекор», которую можно скачать с официального сайта или с любого другого, где представлен софт для работы с графическими изображениями.
2
Запустите приложение, кликнув по ярлыку на рабочем столе, который автоматически появляется в процессе установки программы, или найдите его в списке программ в меню «Пуск».
3
Теперь добавьте в проект изображение, которое требуется обработать. Сделать это можно несколькими способами: в меню «Файл» на верхней панели инструментов выбрать опцию «Открыть фото» или одновременно нажать клавиатурные клавиши Ctrl+O, также можно нажать на панели инструментов пиктограмму с надписью «Открыть» или в правой части рабочего окна кликнуть надпись «Открыть фотографию». После чего в открывшемся окне укажите место расположения нужного изображения, откройте содержащую фото папку, мышкой выделите картинку и нажмите кнопку «Открыть».
4
После добавления изображения в проект автоматически откроется режим редактирования фото. Воспользовавшись им, передвигая по шкале ползунок, вы можете изменить яркость, контрастность, насыщенность, оттенки, баланс изображения, а также выполнить другие изменения, в частности повернуть и кадрировать фото. После редактирования нажмите кнопку «Применить», для отмены изменений нажмите «Сброс».
5
Для обработки изображения выберите в меню «Файл» пункт «Выбрать оформление», для этой же цели можно использовать клавиши Ctrl+J или кнопку «Обработка» на панели инструментов. В новом окне откроется список доступных разделов: редактирование, автоматическое улучшение, эффекты, шаблоны рамок, генератор рамок, границы, шаблоны открыток, шаблоны коллажей, надписи, эффекты, маски, акцентирование украшение. В эти же разделы вы также можете перейти и из правой части рабочего окна программы. Для этого просто выберите в списке нужный вам пункт.
6
Чтобы наложить на фото красивые рамки, сделать из него открытку, календарь, откройте раздел «Шаблоны открыток», затем выберите один из имеющихся разделов: праздничные, детские, необычные, календари, романтические, универсальные, отметьте понравившуюся рамку и нажмите кнопку «Просмотр», чтобы вы смогли представить, как будет выглядеть ваше фото после обработки. В основном окне, если требуется, измените размер изображения, подогнав его при помощи мышки под рамку. Затем нажмите кнопку «Применить».
7
Если вы хотите добавить к фото надписи или дополнительные украшения, откройте соответствующие разделы, выберите в окне просмотра подходящую картинку или нажмите кнопку «Добавить новую надпись», выбрав для нее шрифт, размер, цвет текста, его стиль, форму и положение. Кнопкой «Применить» закрепите результат.
8
После всех внесенных на фото изменений, сохраните готовое изображение, используя соответствующую опцию в меню «Файл» (Ctrl+S) или кнопку «Сохранить» на панели инструментов, выберите тип изображения, укажите папку назначения для обработанного фото. Также можете воспользоваться функцией «Быстрый экспорт» в меню «Файл».
9
Распечатать готовое фото можно прямо из программы, выбрав соответствующую опцию и указав размер изображения, положение на странице и применив необходимые настройки печати.
Видео по теме
Обратите внимание
Декорировать фото можно и используя другие графические редакторы: "Фотошоп", "Виртуальный художник" и многие другие.
Источники:
  • ФотоДекор - описание программы

Совет 4: Как сделать курсор для сайта

Современные браузеры практически полностью поддерживают стандарт CSS2. Это позволяет web-мастерам использовать всю мощь каскадных таблиц стилей для создания оригинальных элементов дизайна сайтов. Хороший дизайн создается за счет корректного выбора цветового оформления элементов web-страниц, качественного подбора гарнитур используемых шрифтов, правильного расположения текста, изображений и таблиц. Но кроме широких возможностей по изменению типографических свойств отображаемого текста и визуального представления документа, CSS предоставляет средства управления элементами оформления, не относящимися к документу. Так, можно сделать курсор для сайта или отдельных частей его страниц.
Вам понадобится
  • Доступ к редактированию шаблонов страниц или файлов таблиц стилей сайта. Данные для доступа к сайту по протоколу FTP. Программа FTP-клиент, либо файловый менеджер с поддержкой соединения по протоколу FTP.
Инструкция
1
Подготовьте файлы курсоров для сайта. Подумайте, курсоры какого вида, для каких элементов страниц сайта будут использованы. Скопируйте файлы курсоров в отдельный каталог. Файлы курсоров можно взять из бесплатных тем курсоров, доступных для загрузки в интернете. Можно также нарисовать свой собственный курсор, используя редакторы ресурсов популярных IDE (например, Microsoft Visual Studio), либо специализированные программы для редактирования курсоров.
2
Загрузите файлы курсоров на web-сайт. Соединитесь с сайтом по протоколу FTP при помощи программы FTP-клиента, либо файлового менеджера. Скопируйте файлы курсоров на сервер. Загрузите файлы в каталог, доступный из web. Если это необходимо, измените права доступа к файлам курсоров, чтобы они стали доступны для чтения всем пользователям.
3
Загрузите файл таблиц стилей на локальный диск. Определите файл таблиц стилей, который подключается ко всем страницам сайта, для элементов которых необходимо устанавливать курсоры. Загрузите этот файл при помощи FTP-клиента, либо файлового менеджера. Как правило, в темах для популярных CMS, присутствуют такие файлы. Если такого файла нет, просто создайте файл с расширением css на локальном диске и отредактируйте шаблон темы, подключив этот файл в заголовок web-страниц при помощи элемента STYLE.
4
Отредактируйте файл таблиц стилей. Добавьте в наборы правил, сопоставляемых элементам, для которых необходимо задать курсор, строки вида:
cursor: url('<URL_файла_курсора>');
В качестве значения <URL_файла_курсора> необходимо указывать адрес файла курсора на сайте.
5
Загрузите файл таблиц стилей на сервер. Снова воспользуйтесь программой FTP-клиентом. Перезапишите старый файл таблиц стилей на сервере. Отключитесь от сервера.
6
Проверьте полученный результат. Откройте одну из страниц сайта, для элементов которой был назначен курсор. Наведите мышь на данный элемент страницы. Форма курсора должна измениться.
Обратите внимание
Загрузка пользовательских курсоров необходима в достаточно специфических случаях. Избегайте излишнего применения загружаемых курсоров, чтобы не испортить впечатление пользователей о сайте.
Полезный совет
Устанавливайте для элементов страниц стандартные формы курсоров, чтобы браузер мог отображать курсор приемлемой формы в случае недоступности файла курсора на сервере.
Источники:
  • Свойство cursor в CSS2
Источники:
  • "Искусство оформления сайта", С.Н. Бердышев, 2010.
Поиск
Совет полезен?
Добавить комментарий к статье
Осталось символов: 500
к
Honor 6X Premium
новая премиальная версия
узнать больше