Решила разработать веб сайт со своим портфолио работ и услугами которые я предоставляю. Хотела что бы он был ярким, удобным http://i.juliadesign.me/

Был разработан логотип и дизайн веб сайта.

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

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

1. Задайте размер баннера и залейте его желаемым цветом. Я выбрала размер баннера 125х125 пх и выполнила заливку цветом #cfe7c3.  Также я добавила рамку вокруг баннера в 1 пх серого цвета. Считаю, что так баннера смотрятся более аккуратно.

2. Создаем 3 текстовых слоя.

3. Дальше открываем Окна > Анимация. Делаем видимым первый текстовый слой.

4. Затем делаем “Создание копии выделенных кадров”. На этом кадре делаем видимым 2-ой текстовый слой и невидимым 1-ый и 3-ий. Аналогичные действия делаем для 3-го кадра.

5. Выделите все кадры и задайте время отображения кадра.

6. Сохраните баннер в GIF формате под WEB.

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

1. Соблюдайте ширину макета в зависимости от разрешения экрана.

Если Ваш дизайн фиксированной ширины, то эта табличка поможет Вам определиться с шириной макета.

2. Давайте названия всем слоям и группируйте слои по папкам.

Это поможет вам и верстальщику быстро ориентироваться на макете, находить необходимые слои и папки.

3. Используйте для контента распространенные шрифты.

Такие как Arial, Tahoma, Verdana, Times New Roman, Georgia, Helvetika возможно еще некоторые шрифты которые сейчас я не вспомнила. Эти шрифты есть у любого пользователя сети интернет.

4. Не используйте сглаживание шрифтов (исключения могут составлять лишь некоторые заголовки).

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

5. Архивируйте psd файл перед отправкой

psd файлы хорошо сжимаются.

Рыба – это временный текст, которым заполняют макет страницы сайта для создания общей картины дизайна. Он может не иметь смысла. Однако, надо помнить, что текст рыбы для англоязычного сайта и для русскоязычного сайта должен быть разным. Например, для англоязычных сайтов я всегда использую “Lorem ipsum” – это искаженный отрывок из философского трактата Цицирона “О пределах добра и зла” на латинском языке.

Он выглядит так “Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.”

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

Конечно, лучше всего использовать текст, который будет реально размещен на сайте, но если заказчик не успевает Вам его предоставить – используйте рыбу.

Больше всего мне понравились сайты:

Soytuaire.labuat.com – этот сайт абсолютно не похож на все остальные что мне доводилось видеть. Вы можите здесь просто рисовать под музыку незамысловатые сюжеты просто двигая мышкой и у вас это будет получаться независимо от вашего таланта рисовать . Сайт именно что бы расслабиться.

Alexarts.ru – страница дизайнера из Москвы. Красивый фон плюс web 2.0 технологии сделали сайт удобным и креативным.

v5design.com – сайт американской веб студии. К подобным сайтам я не равнодушна. Прекрасная картина природы на фоне в сочетании с музыкой пения птиц и сверчков навивают особую атмосферу. А что касается юзабилити, то, по моему мнению, информация вполне доступна, вот только шрифт мелковат.

Спасибо за хорошее настроение и за вдохновение!

Хочу посоветовать вам несколько книг по юзабилити, которые я прочитала и собираюсь прочитать.

Книга “Web-дизайн. Удобство использования Web-сайтов.” Якоб Нильсен и Хоа Лоранджер.

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

Книга “Веб-дизайн: книга Стива Круга или “не заставляйте меня думать!” Стив Круг.

Главная идея книги – “Не заставляйте меня думать!”. Стив Круг – один из весьма уважаемых консультантов по юзабилити-тестированию и дизайну интерфейсов. В книге описаны принципы правильного подхода к веб-юзабилити, ведь люди не будут пользоваться сайтом, если им не понятно как по нему перемещаться и как искать полезную информацию. Если прочитанное изменит ваши взгляды на веб-дизайн, то в этом не будет ничего удивительного.

Книга “Разработка пользовательских интерфейсов” Дженифер Тидвелл.

Эту книгу я только хочу прочесть. Как показывает практика, книги, которые предлагает издательство O’Reilly, всегда качественны. Так же я много слышала положительных отзывов о данной книге.

Это сайт, который может распознавать шрифт на jpg или gif изображениях. Собственно вот он http://www.myfonts.com

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

Загрузив изображение, я прописала там некоторые буквы как на картинке ниже, т.к программа не всегда корректно может распознать буквы.

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

Создавая свои шедевры, вы можете облегчить свою задачу, воспользовавшись уже готовыми кистями Photoshop. К примеру, абсолютно разные крылья ангелов, Вы сможете найти на сайте http://browse.deviantart.com

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

Творите! И будьте смелыми в своих идеях!