ЖЖ-дизайн за 10 дней
Друзья мои, я тут такую штуку придумала... Давайте вы сами себе сделаете дизайны, а? Не самые сложные конечно, все справятся.
Убьёте сразу двух зайцев: познакомитесь поближе с кодами и сделаете себе авторский дизайн : )
В течение 10-ти дней я буду выкладывать по одному уроку посвящённому определённой теме: например, фону журнала или оформлению поста.
Если вы не будете тормозить и пропускать занятия, через 10 дней у вас будет дизайн вашей мечты
Итак, начнём. Начинать надо с поиска и подготовки картинок. Мы не будем делать головоломные конструкции, поэтому нам будет достаточно двух картинок: фон и заглавная картинка журнала.
Вы можете выбрать что-то одно, а можете вообще отказаться от использования графики.
Внимание: если собираетесь использовать графику, необходимо хотя бы минимальное знакомство с графическими редакторами. Например, нужно уметь уменьшить картинку и сохранить её для публикации в веб.
Если вы не знаете как это делать, но очень хотите узнать - яндекс вам в помощь. В сети туча информации по этому поводу и здесь мы эти вопросы рассматривать не будем.
Так же надо определиться с цветовой гаммой. Можно подобрать цвета в фотошопе или воспользоваться, например, такой штукой:
http://kuler.adobe.com/
Чтобы сохранить понравившийся сет, я обычно делаю скриншот.
Теперь рассмотрим два сакральных вопроса:
1. Где брать картинки?
Можете поискать их на бесплатных стоках (по этой теме хороший пост на Хабре) или в яндексе с гуглом.
Так как вы не собираетесь использовать картинки в коммерческих целях, вобщем-то пофиг где их брать.
Единственное что: если вам известен автор изображения - укажите его в профиле. Хотя бы затем, чтобы люди смогли увидеть другие работы этого автора, если им понравилась картинка, которую выбрали вы.
Ещё хороший сайт по теме: http://www.lenagold.ru/. Там очень много фонов.
Так же можно поискать иконки и кисти. Кисти - если захотите сами что-то нарисовать.
Можно использовать свои фотографии или рисунки.
2. Где хранить картинки?
Мой любимый сервис - ЯндексФотки.
Очень удобная работа с альбомами и отдельными картинками, можно обрезать фотографию и немного подредактировать цвета.
Так же у них есть программа для обработки фоток. Сама не пробовала, но думаю что яндекс фигни не предложит. Кто потестит - скажите как оно.
Так же есть:
http://www.radikal.ru/
http://tinypic.com/
и множество других фотосервисов.
Владельцы платных и рекламных аккаунтов могут загружать картинки в свои фотоальбомы.
Внимание: я пользовалась только яндексом. Про работу с остальными сервисами ответить не смогу.
Спрашивайте друг друга, взаимопомощь приветствуется.
Как брать картинку с яндекса:
Внимание: если яндекс отдаёт картинку меньшего чем нужно размера, берите последний из списка - по ссылке Оригинал
Ещё полезное: Как скруглить углы? Урок более недоступен в связи с закрытием Я.ру
И последнее: требования к картинкам.
Ширина шапки обычно равна ширине журнала или ширине постов.
Если не знаете как измерить ширину ленты, сделайте скрин и померьте в фотошопе:
Второй вариант - наложить вашу картинку поверх скриншота журнала и уменьшить до нужного размера.
Фон может повторяться, занимая собой всё пространство под записями или может быть одиночной картинкой.
Картинка для первого варианта должна хорошо стыковаться сама с собой, проще поискать готовое.
Вес одиночной картинки не должен превышать 100-150 кб, иначе никто не дождётся её загрузки.
Важная деталь: универсального размера фона не существует, потому что у всех разное разрешение экрана, и подогнать под все не получится.
Если у кого-то экран больше чем ваша картинка, из-под неё будет торчать фон.
Продумайте этот момент.
На сегодня всё : )
Задание:
1. Подумайте над оформлением вашего журнала, можете сделать наброски (любым удобным способом).
2. Подберите и сохраните себе подходящие картинки, можно несколько.
3. Обрежьте или уменьшите их до нужного размера и сохраните с оптимизацией для веб (File > Save for Web)
UPD: Сколько времени займёт выполнение задания?
Ориентировочно - от 10 до 30 минут на каждый урок. Иногда больше, иногда меньше, смотря что вы задумали : )
Никаких подвигов при этом от вас не потребуется, только самые простые действия.
UPD2: На основе системы стилей S2!
UPD3: Для всех аккаунтов, кроме спонсируемых
Если есть вопросы по теме - спрашивайте
Баннер акции
http://community.livejournal.com/journals_covers/78018.html">
http://img-fotki.yandex.ru/get/4101/yoksel.4b/0_3465d_f4699295_orig" width=350 height=76 title="" border="0">
Распространение информации крайне приветствуется
Чем больше людей узнает об акции, тем красивее будут журналы, по которым мы ходим : )
Навигация по урокам
День 1. Поиск картинок
День 2. Стиль и фон
День 3. Ширина журнала
День 4. Фон ленты
День 5. Шапка журнала
День 6. Сайдбар
День 7. Посты
День 8. Страницы комментариев
День 9. Метки и календарь
День 10. Хозяйке на заметку
Курс окончен, что дальше?
1. Уроки никуда не денутся, и все могут пользоваться ими и дальше.
2. Я буду продолжать отвечать на вопросы к урокам, но при одном условии: вы пробуете делать сами и просите помощи только если не получается.
Если вы раскрыли клювик и ждёте готовые коды - вы не по адресу.
Напротив - если вы думаете, действуете, экспериментируете - я всегда рада помочь.
Задавайте вопросы строго по теме поста
ВНИМАНИЕ: сейчас у меня нет возможности отвечать на все вопросы.
В уроках есть практически всё необходимое чтобы справиться самостоятельно.
Крайне рекомендую зайти в последний урок и установить упомянутые там плагины - они помогут вам решить ваши проблемы, в том числе если я не смогу вам ответить.
Или же сразу перейдите в Генератор дизайнов и не ломайте голову : )
3. Если вы производите стилей больше, чем успеваете носить - добро пожаловать в layouts_ru : )
4. Если вам лень всё это читать или коды оказались вам не по зубам, воспользуйтесь вот этим
и бесплатно сделайте себе дизайн вашей мечты.
Специальных знаний не требуется : )
Убьёте сразу двух зайцев: познакомитесь поближе с кодами и сделаете себе авторский дизайн : )
В течение 10-ти дней я буду выкладывать по одному уроку посвящённому определённой теме: например, фону журнала или оформлению поста.
Если вы не будете тормозить и пропускать занятия, через 10 дней у вас будет дизайн вашей мечты
Итак, начнём. Начинать надо с поиска и подготовки картинок. Мы не будем делать головоломные конструкции, поэтому нам будет достаточно двух картинок: фон и заглавная картинка журнала.
Вы можете выбрать что-то одно, а можете вообще отказаться от использования графики.
Внимание: если собираетесь использовать графику, необходимо хотя бы минимальное знакомство с графическими редакторами. Например, нужно уметь уменьшить картинку и сохранить её для публикации в веб.
Если вы не знаете как это делать, но очень хотите узнать - яндекс вам в помощь. В сети туча информации по этому поводу и здесь мы эти вопросы рассматривать не будем.
Так же надо определиться с цветовой гаммой. Можно подобрать цвета в фотошопе или воспользоваться, например, такой штукой:
http://kuler.adobe.com/
Чтобы сохранить понравившийся сет, я обычно делаю скриншот.
Теперь рассмотрим два сакральных вопроса:
1. Где брать картинки?
Можете поискать их на бесплатных стоках (по этой теме хороший пост на Хабре) или в яндексе с гуглом.
Так как вы не собираетесь использовать картинки в коммерческих целях, вобщем-то пофиг где их брать.
Единственное что: если вам известен автор изображения - укажите его в профиле. Хотя бы затем, чтобы люди смогли увидеть другие работы этого автора, если им понравилась картинка, которую выбрали вы.
Ещё хороший сайт по теме: http://www.lenagold.ru/. Там очень много фонов.
Так же можно поискать иконки и кисти. Кисти - если захотите сами что-то нарисовать.
Можно использовать свои фотографии или рисунки.
2. Где хранить картинки?
Мой любимый сервис - ЯндексФотки.
Очень удобная работа с альбомами и отдельными картинками, можно обрезать фотографию и немного подредактировать цвета.
Так же у них есть программа для обработки фоток. Сама не пробовала, но думаю что яндекс фигни не предложит. Кто потестит - скажите как оно.
Так же есть:
http://www.radikal.ru/
http://tinypic.com/
и множество других фотосервисов.
Владельцы платных и рекламных аккаунтов могут загружать картинки в свои фотоальбомы.
Внимание: я пользовалась только яндексом. Про работу с остальными сервисами ответить не смогу.
Спрашивайте друг друга, взаимопомощь приветствуется.
Как брать картинку с яндекса:
Внимание: если яндекс отдаёт картинку меньшего чем нужно размера, берите последний из списка - по ссылке Оригинал
Ещё полезное: Как скруглить углы? Урок более недоступен в связи с закрытием Я.ру
И последнее: требования к картинкам.
Ширина шапки обычно равна ширине журнала или ширине постов.
Если не знаете как измерить ширину ленты, сделайте скрин и померьте в фотошопе:
Второй вариант - наложить вашу картинку поверх скриншота журнала и уменьшить до нужного размера.
Фон может повторяться, занимая собой всё пространство под записями или может быть одиночной картинкой.
Картинка для первого варианта должна хорошо стыковаться сама с собой, проще поискать готовое.
Вес одиночной картинки не должен превышать 100-150 кб, иначе никто не дождётся её загрузки.
Важная деталь: универсального размера фона не существует, потому что у всех разное разрешение экрана, и подогнать под все не получится.
Если у кого-то экран больше чем ваша картинка, из-под неё будет торчать фон.
Продумайте этот момент.
На сегодня всё : )
Задание:
1. Подумайте над оформлением вашего журнала, можете сделать наброски (любым удобным способом).
2. Подберите и сохраните себе подходящие картинки, можно несколько.
3. Обрежьте или уменьшите их до нужного размера и сохраните с оптимизацией для веб (File > Save for Web)
UPD: Сколько времени займёт выполнение задания?
Ориентировочно - от 10 до 30 минут на каждый урок. Иногда больше, иногда меньше, смотря что вы задумали : )
Никаких подвигов при этом от вас не потребуется, только самые простые действия.
UPD2: На основе системы стилей S2!
UPD3: Для всех аккаунтов, кроме спонсируемых
Если есть вопросы по теме - спрашивайте
Баннер акции
http://community.livejournal.com/journals_covers/78018.html">
Распространение информации крайне приветствуется
Чем больше людей узнает об акции, тем красивее будут журналы, по которым мы ходим : )
Навигация по урокам
День 1. Поиск картинок
День 2. Стиль и фон
День 3. Ширина журнала
День 4. Фон ленты
День 5. Шапка журнала
День 6. Сайдбар
День 7. Посты
День 8. Страницы комментариев
День 9. Метки и календарь
День 10. Хозяйке на заметку
Курс окончен, что дальше?
1. Уроки никуда не денутся, и все могут пользоваться ими и дальше.
2. Я буду продолжать отвечать на вопросы к урокам, но при одном условии: вы пробуете делать сами и просите помощи только если не получается.
Если вы раскрыли клювик и ждёте готовые коды - вы не по адресу.
Напротив - если вы думаете, действуете, экспериментируете - я всегда рада помочь.
Задавайте вопросы строго по теме поста
ВНИМАНИЕ: сейчас у меня нет возможности отвечать на все вопросы.
В уроках есть практически всё необходимое чтобы справиться самостоятельно.
Крайне рекомендую зайти в последний урок и установить упомянутые там плагины - они помогут вам решить ваши проблемы, в том числе если я не смогу вам ответить.
Или же сразу перейдите в Генератор дизайнов и не ломайте голову : )
3. Если вы производите стилей больше, чем успеваете носить - добро пожаловать в layouts_ru : )
4. Если вам лень всё это читать или коды оказались вам не по зубам, воспользуйтесь вот этим
и бесплатно сделайте себе дизайн вашей мечты.
Специальных знаний не требуется : )