Кот |
Привет, Гость! Войдите или зарегистрируйтесь.
Привет, Вика. Думаю не будем отходить далеко от канона и начнем с разбора основных твоих ошибок. Как предпочитаешь работать со старым дизайном или будем делать новый?
Создай тестовик, он нам понадобится.
тестовик - http://test75.mybb.ru/
Отредактировано danessa (2012-06-10 17:31:15)
Ты как делаешь дизайн: сначала рисуешь макет в фотошопе, а потом натягиваешь на таблицу или сразу с кодом работаешь?
Сперва макет в фотошопе) Ну там.. фон, шапка. Потом вставляю в код, смотрю, как это выглядит. А потом уже доделываю остальную графику, шрифты и ставлю скрипты.
Первым делом позаботимся о шапке, для этого нужно найти хороший красивый исходник.
Я пользуюсь этими сайтами:
http://www.zerochan.net/
http://artfile.ru/
http://www.flash-screen.com/
Выбери исходник, который тебе по нраву. Обратимся к тематике фентези.
я взяла вот эти:
http://uploads.ru/i/2/F/6/2F6zU.jpg
http://uploads.ru/i/D/S/f/DSfY0.jpg
http://uploads.ru/i/u/g/V/ugV50.jpg
http://uploads.ru/i/T/Y/2/TY2Nq.jpg
Отредактировано danessa (2012-06-11 11:41:58)
Так... ну думаю, что из этого вполне можно будет что-то слепить.
http://savepic.net/2935085.jpg
http://savepic.net/2940205.jpg
http://savepic.net/2919725.jpg
http://savepic.net/2923821.jpg
Идем в фотошоп, создаем новый документ размером 1300px на 1200px. Вообще размер изображения будет зависеть от того, какую по ширине шапку мы планируем, но, думаю, в этот раз обойдемся небольшой.
Далее планируем цветовую гамму, которая будет на нашем форуме. Я делаю это на глаз, но можно пользоваться вот этим сайтом:
http://www.colorhunter.com/
Загружаешь туда свое изображение и он выдает тебе твою будущую цветовую схему.
Для своих исходников я выбрала голубые, охровые и оранжевые тона.
Составляем макет. Для этого нам понадобится рамка, обрамляющая тело форума. Ее можно сделать по этому уроку, либо из обычной деревянной рамки для фото (их полно здесь: http://www.lenagold.ru/fon/clipart/r/ram.html )
Так же в фотошопе нам нужно продумать иконки сообщений. Здесь твой полет фантазии не ограничивается ничем, это может быть что угодно: надпись, предмет, картинка и т.д. Я сделала иконки из исходной картинки и добавила надписи.
В итоге мой макет выглядит так:
http://uploads.ru/i/4/C/U/4CUFu.jpg
Вот что у меня вышло)
http://uploads.ru/i/M/C/k/MCkqO.jpg
(Графику буду подгонять после окончания технического курса :3)
Теперь нам нужно правильно разрезать макет:
http://uploads.ru/i/w/I/r/wIrGL.jpg
Отредактировано danessa (2012-06-12 09:09:56)
пусть будет так.
http://uploads.ru/i/H/M/3/HM3WJ.jpg
Ты отметила не правильно: слишком широко для шапки и футера. Обрезать нужно по границе изображения, где картинка окончательно стала однотонной.
Иначе шапка и футер будут весить больше, чем могли бы. И из-за этого страница будет грузиться медленней.
Отредактировано danessa (2012-06-12 17:37:54)
Значит вот так :3
http://uploads.ru/i/L/5/P/L5Pn8.jpg
