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

Создание сайтов в стиле стимпанк – стилизация под эпоху Викторианской Англии. Интерфейс сайта в стиле стимпанк всегда привлекает внимание пользователей. На таких сайтах ключевым становится механический элемент. Веб-дизайн в стиле стимпанк широко использует многочисленные кнопки, винты, трубы, гайки, паровые клапаны, часовые механизмы.

Рассмотрим сайты в стиле стимпанк внимательнее

Большинство сайтов в стиле стимпанк создано с помощью Java Script. Так, на сайте TheSteamemporium представлено выпадающее меню. Это безупречно красиво и интересно для пользователя, только иногда не совсем удобно как для юзера, так и для поисковика.

Состаренные фотографии

Сайт Steampump  использует состаренную фотографию и надпись «Enter», созданную с помощью Penmanship.

Сопровождение в каждом разделе

На сайте Stephanehalleux  каждую рубрику сопровождает своеобразный робот в соответствующем стиле.

Фишка сайта

Большое значение в таких сайтах имеет "фишка" – небольшой но броский элемент, который будет ассоциироваться у пользователя с этим сайтом. Сайт Freakangels своей фишкой сделал  причудливую машину на винтах с крыльями (прямая ассоциация с ангелами).

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

На Іantregillis навигация продумана таким образом, что пользователя сопровождает подзорная труба, через которую можно видеть планеты. Прокручивая настройки прибора, пользователь выбирает ту или другую дату (день и месяц) и попадает автоматически на страницу с интересующей его датой.

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

Flash и HTML

Довольно-таки большая часть сайтов в стиле стимпанк использует технологию Flash или динамику HTML.

Галерея сайтов в стиле стимпанк

Ниже представлена подборка интересных сайтов в стиле стимпанк. Каждая картинка имеет линк на сайт.

Судьба стимпанк в вебдизайне

Можно найти и другие примеры сайтов, созданных в стиле стимпанк (А, быть может, вы знаете такие сайты, и готовы поделиться с общественностью?). Сложно не согласиться с тем, что сегодня достаточно большое количество сайтов созданы в стиле стимпанк и с элементами стимпанка. Насколько это серьезно? Можно ли назвать стимпанк тенденцией в вебдизайне? И что такое стимпанк для вебдизайна – стиль, подходящий только для одной ниши, или стиль, который действительно заслуживает внимания и способен получить широкое распространение? На эти вопросы сложно ответить однозначно, поэтому ждем ваших мнений!

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

 1. Акцент на простоту и юзабилити

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

2. Интерактивный дизайн

Технологии HTML5, CSS3 и jQuery позволяют делать любой дизайн интерактивным. Все элементы реагируют на движение мышки или тачскрина. Это позволяет не смотреть сайт, а изучать его, открывая все новые и новые динамические эффекты.

3. Мобильный дизайн

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

4. Социальная интеграция

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

5. Крупная типографика

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

6. Декоративные шрифты

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

7. Графические ленты и баннеры

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

8. Круги в дизайне

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

9. Умеренные текстуры

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

10. Большое фото на бэкграунде

Большая фотография на заднем фоне имеет необыкновенно сильное воздействие на посетителя. Поэтому она скорее всего будет активно используется в дизайнах и в наступившем году.

11. Векторные персонажи

Использование графического векторного персонажа – еще один проверенный способ сделать сайт более персонифицированным и произвести впечатление на посетителя.

12. Эффект трехмерности

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

13. Фиксированное меню навигации

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

14. Многоколоночное меню

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

Источник: http://www.designonstop.com/

Предлагаем вашему вниманию новые сайты созданные нашей студией в начале 2012 года.

ВСЕХ С НОВЫМ ГОДОМ!

Представляем вашему вниманию новый разработанный нами сайт мастера кукол

Елены Михайловой!

Сайт : www.lenadoll.com

Вот что говорит сама Елена :

Я рада приветствовать Вас на моем сайте. Добро пожаловать в мир кукол!

Меня зовут Елена Михайлова. Выношу на Ваш суд свои работы. В них весь мой внутренний мир, моё настроение.

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

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

Я очень надеюсь, что после просмотра, Вы на миг окажетесь в сказочном мире, в мире детства и фантазий.

Сайт : www.lenadoll.com

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

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

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

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

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

Перечислим главные моменты в разработке сайта.

1) Дизайн сайта:

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

2) Функционал и юзабилити сайта:

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

Далее юзабилити. Что же это такое?

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

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

Юзабилити сайта определяется пятью качественными параметрами:

* Learnability: На сколько легко для пользователей выполнять основные задачи, сталкиваясь с данным интерфейсом в первый раз.

* Эффективность: Пользователи уже знакомы с дизайном, насколько быстро они теперь  могут выполнять задачи?

* Запоминаемость (memorability): Когда пользователи вернутся к данному интерфейсу после некоторого перерыва в его использовании, как легко они смогут восстановить приобретенное ранее умение.

* Ошибки: Сколько ошибок делают пользователи, насколько серьёзны эти ошибки и как легко они могут их исправить.

*  Приятность в использовании. Насколько удобен и приятен процесс использования дизайна интерфейса?

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

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

3) Контент сайта:

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

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

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

Специфика восприятия информации в Интернет отличается от печатных материалов, поэтому при выборе доменного имени существуют определенные нюансы:

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

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

Далее несколько слов об использовании дефиса. Рассмотрим все аргументы «за» и «против» использования дефиса в имени домена. Общепризнанные отрицательные аспекты, следующие:

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

2. Зачастую доменные имена, с дефисом в названии выглядят непрофессионально. Разве успешные и большие компаний пишут доменные имена своих сайтов, используя дефис?

3. Домен должен быть оптимизирован под людей, а не под поисковые системы, и имя домена должно быть удобным, простым и запоминающимся для людей, и исключать возможность ошибки.

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

Положительные аспекты при выборе доменного имени с дефисом, следующие:

1. Если особенности языка диктуют использование дефиса в определенных словах. По-другому, без дефиса такие слова просто не пишутся, по правилам грамматики.

2. Практика показывает, что длинное название домена, состоящее из двух длинных слов через дефис, отлично воспринимается, не доставляет особых проблем, а дефис лишь улучшает читаемость.

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

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

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

Так что включение дефиса в назание домена зависит от многих факторов и предпочтений.

Продолжаем разбираться дальше.

Если с названием компании возникли сложности, подумайте о названии по основной продукции или услуге.

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

Если вы уже примерно определились с выбором, напоследок проверьте:

* Звучность домена
* Простоту написания
* Запоминаемость
* Ассоциативность
* Занято ли имя в других доменных зонах
* Не созвучен ли домен с именем известного бренда или компании

И никогда не забывайте о плюсах короткого доменного имени.

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

Удачи вам в поиске вашего домена!

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

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

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

На самом деле однозначного ответа, где можно использовать шрифт, а где нельзя, просто нет.

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

Чтобы визуально подобрать шрифт для веб, представляем Вам замечательный зарубежный сервис:

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

На последок выделяем еще 2 ресурса, на которых можно найти интересные шрифты:

www.fonts2u.com и www.fontov.net.

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

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

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

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

1. Kind Company

2. Astheria

3. iA

4. Edenspiekermann

5. The Morning News

6. Daniel Brown’s

7. Aen Tan

8. PANOPTES.WEB

9. This Studio

10. Kemistry Gallery

11. Cubic

12. OPX

13. Abercrombie & Fitch

14. Andreas Markdalen

15. The Journal of Popular Noise

16. FLOWmarket

17. Muller

18. 80/20

19. Sav

20. Typesites

21. Typography for Lawyers

22. 3rings

23. SeptemberIndustry

24. Grade Design

25. ico design

26. Nikolay Saveliev

27. AisleOne

28. SARAH BERNHARD

29. Bravo Istanbul

30. SIGMA6

31. PearsonLloyd

32. Experimental Jetset

33. Visuelle.co.uk

34. HUGE

35. The Consult

36. Non-Format

37. MarionaDesign

38. Build

39. Mezzetty

40. MARKUS JANS

41. Modula

42. Buro Ink

43. Kate Moross

44. hellonoam

45. Berit Somme

46. Studio8 Design

47. Thomas Cheng

48. SPVZ

49. RBG6

50. Airport Bags

51. SIESTA

52. Fabian Weber

53. ab+c

54. iconwerk

55. Fell Swoop

56. JAPAN CAR

57. Soulellis Studio

58. Daniel Freytag

59. SOFA

60. Mytton Williams

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

Инструкция

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

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

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

4) На этом этапе начинающие сайтостроители часто сталкиваются с насущным вопросом – где собственно взять конкретную информацию для своего контента. В целом, вариантов здесь множество и выбор источников зависит от тематики сайта и его задач. Если создается коммерческий ресурс, призванный продвигать услуги или товар определенной компании, быть ее виртуальным представительством, то, разумеется, все представленные на сайте сведения должны быть получены только от представителей данной фирмы и точно соответствовать действительности.

5) Для развлекательного или новостного блога в качестве источника информации можно использовать многочисленные новостные ленты (lenta.ru, Яндекса, Новости, NEWSru.com и т.п.) или делать переводы с зарубежных информационных порталов. Для тематических сайтов подойдут любые оффлайновые издания (справочники, энциклопедии, специализированные журналы, научно-популярные книги).

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

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

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

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

Справка: (Content management system CMS) - программное обеспечение, позволяющее владельцу web-сайта самостоятельно управлять содержимым этого сайта через web-интерфейс без специальных знаний в области программирования.
На сегодняшний день существует множество систем управления сайтом, более известных под аббревиатурой CMS.

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

Вместе с тем существуют готовые решения.
При всем многообразии CMS на просторах интернета, предлагаем Вашему вниманию достойную, интуитивную и современную систему CMS Made Simple.

CMS Made Simple административная система которую наша студия использует в разработке наших сайтов.
CMS Made Simple написана на языке PHP и является свободным программным обеспечением, распространяемым с лицензией GPL.
Система полностью переведена на более чем 30 языков, в том числе русский.
Программа хороше зарекомендовала себя как на небольших сайтах, так и при работе на интернет порталах (в условиях высокой посещаемости).

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

Студия "Design ONE"