Вход на сайт
Важен ли стандарт при создании Webpage?
563 просмотров
Перейти к просмотру всей ветки
ruslangoyda гость
в ответ toptop 26.05.05 21:23
В фотошопе делать банеры или кнопки или менюшки для сайта дело самое что ни на есть простое, требуется только не большой опыт работы с этой программой.
Ну вот расскажу тебе как я сделал то что ты увидел на первой страничке моего сайта.
Открываешь фотошоп и открываешь новый документ размером width 800 height 600 пикселей , когда ты что-то делаешь на этом документе, пишешь, рисуешь или не важно что, то автоматически создаются слои и что самое ненужное документ предлогается к сохранению в формате PSD что нам совершенно не нужно, я надеюсь что ты хоть что-то можешь сделать в фотошопе, ну там текст нормальный написать, прикол какой-нибудь нарисовать и применить ко всему что ты сделал Layer √ Layer Style и там настраиваешь как это должно выглядеть ( выпуклым или вдавленным). Вообщем когда ты вс╦ это сделал и вид страницы тебя устраивает, нужно склеить слои, это делается так Layer √ Flatten Image и получаешь один слой, можешь его сохранить в формате JPG, если ты хочешь ещ╦ что-то в дальнейшем переделывать с этой страничкой, то перед склеиванием сло╦в сохрани страничку в формате PSD, а потом уже склеивай, потому что если склешь слои, а нужно будет что-то переделывать, то начинай вс╦ заново
Вообщем когда склеил слои , теперь начинается самое главное, нужно сделать ссылки или переход на следующую страницу,только конечно ты должен был уже подготовить то что хочешь чтобы было ссылкой ( текст , кнопка, рисунок).Делается это так, нажимаешь комбинацию клавишь Ctrl-Shift-M и переходишь в программу ImageReady . На панели инструментов находишь инструмент в виде квадратика и руки наложенного на него, называется Rectangle Image Map Tool ,это выделяется прямоугольником, там есть ещ╦ Circle(выделение кругом) и Polygon (выделение по точкам √ это когда объекты неправильной формы находятся рядом и их нельзя выделить не задев соседнего, а нужно, тогда применяют полигон.Для смены вида выделений на мышке нажимаем левую сторону и двигаешь немного, тогда выпадут все виды выделений. Вобщем выделяем объект и потом клацаем на н╦м 2 раза и внизу в другом окне, там где было сначало Animation открывается раскладка Slice и там нужно заполнить Name пишем название этой ссылки, ну как название файла, URL куда хотим перейти, ну название сайта или путь к документу или следующей странице, если почта, пишем mailto:vasa@pupkin.com ( шутка пишите свой адрес после mailto),Target пишем _blank это чтобы ссылка открывалась в новом окне.В принципе вс╦ готово.Теперь нам нужно сохранить это. Жм╦м кнопки
File √ Optimized As открывается сохранить как страничку html пишите название этой странички, указываете где хотите сохранить и вс╦ готово. Заходите туда где сохраняли и там есть ваш файл.html и папка Images c вашим изображением. Открывает страничку, видите то что вы нарисовали, все ссылки работают нормально, открываем просмотр кода и вот оно то что тебе так не нравиться, код написанный программой фотошоп.
Надеюсь вам пригодится моя лекция. Удачи.
Ну вот расскажу тебе как я сделал то что ты увидел на первой страничке моего сайта.
Открываешь фотошоп и открываешь новый документ размером width 800 height 600 пикселей , когда ты что-то делаешь на этом документе, пишешь, рисуешь или не важно что, то автоматически создаются слои и что самое ненужное документ предлогается к сохранению в формате PSD что нам совершенно не нужно, я надеюсь что ты хоть что-то можешь сделать в фотошопе, ну там текст нормальный написать, прикол какой-нибудь нарисовать и применить ко всему что ты сделал Layer √ Layer Style и там настраиваешь как это должно выглядеть ( выпуклым или вдавленным). Вообщем когда ты вс╦ это сделал и вид страницы тебя устраивает, нужно склеить слои, это делается так Layer √ Flatten Image и получаешь один слой, можешь его сохранить в формате JPG, если ты хочешь ещ╦ что-то в дальнейшем переделывать с этой страничкой, то перед склеиванием сло╦в сохрани страничку в формате PSD, а потом уже склеивай, потому что если склешь слои, а нужно будет что-то переделывать, то начинай вс╦ заново
Вообщем когда склеил слои , теперь начинается самое главное, нужно сделать ссылки или переход на следующую страницу,только конечно ты должен был уже подготовить то что хочешь чтобы было ссылкой ( текст , кнопка, рисунок).Делается это так, нажимаешь комбинацию клавишь Ctrl-Shift-M и переходишь в программу ImageReady . На панели инструментов находишь инструмент в виде квадратика и руки наложенного на него, называется Rectangle Image Map Tool ,это выделяется прямоугольником, там есть ещ╦ Circle(выделение кругом) и Polygon (выделение по точкам √ это когда объекты неправильной формы находятся рядом и их нельзя выделить не задев соседнего, а нужно, тогда применяют полигон.Для смены вида выделений на мышке нажимаем левую сторону и двигаешь немного, тогда выпадут все виды выделений. Вобщем выделяем объект и потом клацаем на н╦м 2 раза и внизу в другом окне, там где было сначало Animation открывается раскладка Slice и там нужно заполнить Name пишем название этой ссылки, ну как название файла, URL куда хотим перейти, ну название сайта или путь к документу или следующей странице, если почта, пишем mailto:vasa@pupkin.com ( шутка пишите свой адрес после mailto),Target пишем _blank это чтобы ссылка открывалась в новом окне.В принципе вс╦ готово.Теперь нам нужно сохранить это. Жм╦м кнопки
File √ Optimized As открывается сохранить как страничку html пишите название этой странички, указываете где хотите сохранить и вс╦ готово. Заходите туда где сохраняли и там есть ваш файл.html и папка Images c вашим изображением. Открывает страничку, видите то что вы нарисовали, все ссылки работают нормально, открываем просмотр кода и вот оно то что тебе так не нравиться, код написанный программой фотошоп.
Надеюсь вам пригодится моя лекция. Удачи.