оригинал статьи: 10 Steps To The Perfect Portfolio Website
автор: Lee Munroe
перевод: Yarcher

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

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

По этой теме вас могут заинтересовать еще вот эти две статьи:

Из чего состоит хороший сайт-портфолио?

1. Логотип

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

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

Мохит использует псевдоним CSS жокей

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

2. Цеплялка

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

Вопросы ответы на которые помогут в придумывании ярких заголовков:

  • Кто вы? Дизайнер? Писатель? Программист?
  • Что вы делаете? Дизайн веб-сайтов? Разрабатываете игры?
  • Откуда вы? Страна? Город?
  • Вы фрилансер или работаете на студию? Заинтересованы ли вы в поиске работы?

tag2.jpg

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

3. Портфолио

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

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

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

Лейт Тейлов (Leigh Taylor) показывает скриншоты своих работ и публикует список программ которые он использовал в работе над проектом.

4. Услуги

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

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

Крис Спунер (Chris Spooner) ясно показывает какие услуги он предлагает: принт и веб.

5. О себе

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

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

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

Чукей Ихжаси (Chikezie Ejiasi) показывает свое фото и рассказывает нам, как правильно произносится его имя.

6. Контакты

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

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

Стюарт Джонстон (Stuart Johnston) расположил контактную информацию на всех страницах сайта, но сделал и удобную контакную форму.

7. Блог

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

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

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

Крис Уолэйс (Chris Wallace) использует свой блог о веб-дизайне, чтобы помогать другим дизайнерам и участвовать в дискуссиях.

8. Призыв к действию

Спросите себя, что вы хотите получить от своего сайта-портфолио. Вы хотите получать заказы? Хотите привлекать новых читателей? Может вы просто хотите, чтобы люди узнали о вас.

Каждая страница должна содержать призыв к действию «Следующий шаг». Лучший способ сделать это—разместить кнопку «Призыв к действию» на видном месте. Сделайте кнопку ссылкной на ваш блог, портфолио или страницу с контактной информацией. Используйте в тексте кнопки подходящие фразы, например: «Сделать заказ», «Показать портфолио», «Нанять меня».

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

3. Используйте сайты социальных сетей

Теперь когда люди заинтересованы вами и вашей работой, предложите им стать друзьями на других сайтах. Расскажите им, что они могут найти вас в Twitter, Facebook, Flickr, LinkedIn и т.д. Используйте максимально социальные сети и имейте много друзей к которым можно обратиться в случае необходимости.

Сэм Браун (Sam Brown) разместил ссылки на другие сайты которые он использует. Это дает нам возможность связаться с ним на этих сайтах.

10. Язык и общение

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

Мариус Розендал (Marius Roosendaal) использует расслабленный и дружественный тон на своем сайте.

Дополнительные советы:

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

40+прекрасный сайтов-портфолио

Robbie Manson

Screenshot

F. Claire Scroggins

Screenshot

Timothy van Sas

Screenshot

Ole Martin Kristiansen

Screenshot

Maru Velázquez

Screenshot

Chikezie Ejiasi

Screenshot

Miki Mottes (Flash)

Screenshot

Jakub Krcmar

Screenshot

Mopa

Screenshot

Chris J. Lee

Screenshot

Pedro Lamin

Screenshot

Cartonblanc (Flash)

Screenshot

Leigh Taylor

Screenshot

Alex Coleman

Alex Coleman

Sarah Longnecker

Sarah Longnecker

Toby Powell

Toby Powell

Jay Hafling

Jay Hafling

Elliot Jay Stocks

Elliot

Tony Geer

Tony Greer

Marius Roosendaal

Marius Roosendaal

Ryan O’Rourke

Ryan O'Rourke

<img /> is everything (Phil Thompson)

Img Is Everything

Leigh Taylor

Leigh Taylor

Design Me (Marek Levak)

Design Me

Matt Dempsey

Matt Dempsey

Brad Candullo

Brad Candullo

Andre Augusto

Andre Augusto

Rob Hawkes

Rob Hawkes

Magnus Jepson

Magnus Jepson

Corking Design (Daniel Cork)

Corking Design

Evan Eckard

Evan Eckard

Alexandru Cohaniuc

Alexandru Cohaniuc

Miles Dowsett

Miles Dowsett

Andrew Bradshaw

Andrew Bradshaw

Shannon Moeller

Shannon Moeller

Vitor Louranco

Vitor Louranco

Mark Dearman

Mark Dearman

Wong Yeng Kit

Wong Yeng Kit

Chris Wallace

Chris Wallace

Spoon Graphics (Chris Spooner)

Spoon Graphics

Fabiano Meneghetti

Fabiano Meneghetti

Mark Wallis

Mark Wallis

Chris Morris

Chris Morris

Paiko (Heiko Brömmelstrote)

Paiko

Conan Robbins

Conan Robbins

Henry Jones

Henry Jones

Winnie Lim

Winnie Lim

Greg One (Gregoire Hoin)

Greg One

Mark Hadley

Mark Hadley

David Appleyard

David Appleyard

Design Moves Me (Roy Vergara)

Design Moves Me

Brian Murchison

Brian Murchison

Mike Precious

Mike Precious

Digital Deceptions (Duncan)

Digital Deceptions

Chirag Solanki

Chirag Solanki

Jason Reed

Jason Reed

Johnston North (Stuart Johnston)

Johnston North

Penflare Designs (Sean Farrell)

Penflare Designs

Nine Lion (Chikezie Ejiasi)

Nine Lion Design

Brian Wilkins

Brian Wilkins

Jason Santa Maria

Jason Santa Maria

David Hellmann

David Hellmann

Guillaume Pacheco

Guillaume Pacheco

Dave Lam

Dave Lam

Luke Stevens

Luke Stevens

James Lai

James Lai

Alessandro Cavallo

Allesandro Cavallo

CSS Jockey (Mohit)

CSS Jockey

Kerry Nehil

Kerry Nehil

Darren Hoyt

Darren Hoyt

Matthew Brown

Matthew Brown

Digital Mash (Rob Morris)

Digital Mash

The Things We Make (Mike Kus)

The Things We Make

Ed Merritt

Ed Merritt

 

Комментарии  

 
#1 Тим 2009-10-13 21:00 очень классная статья!!!
Спасибо!
Цитировать
 

Добавить комментарий


Защитный код
Обновить