Как сделать сайт-открытку

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



http://uid.me/natalya_ivanova253


 


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



 

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



Сделать же такой сайт-открытку не просто, а очень просто…



 

Для создания сайта-открытки нам понадобится:




  1. аккаунт ucoz (не пугайтесь ни какого рекламного баннера на странице открытки не будет),
  2. подходящий красивый поздравительный фон (обязательно большого размера или бесшовный),
  3. текст поздравления. Пишем сами или копируем его со специального сайта “поздравлялок&rdquo.


Сделала для вас небольшую подборку фонов-открыток для примера: “С Новым годом”, “со старым новым годом”, “с  Рождеством”, “С днем Рождения”:


 


Нажмите на выбранный фон для увеличения 


Этапы создания сайта-открытки:




  1. Заведите аккаунт по адресу http://uid.me/ Это будет ваш профиль ucoz. Для тех, кто уже зарегистрирован на ucoz все проще – нужно просто авторизоваться.
  2. авторизация,
  3. редактируем свою страничку. Жмите на кнопку “Редактировать”. - Здесь загружаем фон во вкладке “фон страницы”, жмите на кнопку “на весь экран”, чтобы растянуть фон и не осталось свободных полей на экране: 


      
    - Во вкладке “Аватар” вы можете загрузить свое фото, чтобы было понятно от кого поздравление. 


    - Во вкладке “Биография” в разделе Имя пишем текст поздравления, вместо статуса – пожелание, в поле “биография” – полный текст поздравления” 


      
    - Вкладка “Цвета” и “шрифты” помогут в оформлении текста и фона вашей открытки. 


    - Подключаем социальные сети и добавляем ссылки на блоги в соответствующих вкладках.
  4. И последнее выровнять текстовый блок в определенном месте страницы (например, в специально отведенном месте для текста” можно простым перетягиванием, перемещением текста по странице – наводим курсор на текст открытки и тянем в нужную сторону . Обратите внимание на то, что в различных разрешениях экрана – отображение открытки может быть различным. Так что перед тем, как поздравлять друзей протестируйте виртуальную открытку здесьhttp://quirktools.com/screenfly/
  5. Теперь берем ссылку из адресной строки и рассылаем ее друзьям или вставляем в запись блога. Можно оформить запись в блоге и ссылкой с картинки. Для этого возьмем код: 
  6. <a href=”ссылка на вашу открытку”><img src=”url скриншота открытки”></a> 



    Код вставляем в режиме html в блог. 


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



     



    Результат 





Вот и все. Если будут вопросы, то задавайте в комментариях!



URL записи