Alastor

Со всеми предложениями в ПМ.

bbsalex, не отвечай, не накаляй ситуацию. Я тебе в твоей теме во флейме ответил.

Вот и поговорили Я тебя послал, ты меня послал, и оба сидим в бане. Мне похрен, я привычный. И вообще с юмором ко всему стараюсь относиться.

Тут нужно совпадение пары линий жизни. 1. Наличие свободного времени и вдохновения. 2. Наличие бутылки нормального коньяка или пяти бутылок Гиннеса. Ну и маааленькое такое дополнение - после того, как я нарисую и сверстаю главную и внутреннюю страницу шаблона, ты все доделываешь (с моей помощью естественно, чтобы не запутаться), запускаешь сайт и обязательно ставишь мой копирайт внизу со ссылкой на студию. Собственно все.

Пошел на... курсы по вышиванию.

Мишка, я спорить не собираюсь, ты вроде адекватный человек и способен широко мыслить. Для меня хорошая верстка это та, которая одинаково выглядит во всех известных браузерах и не накладывает никаких других ограничений на просмотр сайта. Если ты думаешь, что я делаю только те макетики, примеры которых тут выкладываю, то ты ошибаешься. Я Psywalker'у показывал несколько примеров серьезных работ. Так вот на некоторых сайтах, в разработке и дизайне которых я принимал участие, количество посетителей доходит до 10.000 в день без всякого SEO. Да, место в рейтинге можно купить, кто ж спорит. Все остальное - просто для тунеядцев типа bbsalex, которые въелись в мозг своему руководству и внушают, что SEO необходимо. Я к своим баранам, если позволишь, вернусь. Заходил на форум этого умельца? Пусть покажет сайт СО СВОИМ SEO который ОН продвинул и который постоянно находится, хотя бы, на первых трех страницах того же Яндекса. Я такие сайты могу показать. И они там не из-за SEO, а просто потому что интересные. А он вряд ли покажет. Поэтому, пока я не увижу хотя бы один живой пример работающего SEO, буду считать все это херней.

Нету Verder'a, забанен в очередной раз, я его реинкарнация Кстати, никто не говорит, что я за шаблон дорого беру. Если человек хороший то могу и бесплатно сделать, трудно что-ли.

За нормальный вопрос никто никого посылать не будет. Всегда относился с уважением к людям, которые хотят заработать (пусть даже на гороскопах). Отдельнным пунктом лежат "студии веб-дизайна" с "дизайном" на вордпресс (расстреливал бы). Возвращаясь к теме вопроса. В России, как это не печально, электронная коммерция находится в зачаточном состоянии. Для примера - заказывал дочке Уги (это валенки такие, австралийские, из овечьей шерсти), так вот с Amazon.com доставили быстрее, дешевле и с лучшей гарантией, чем в любом нашем, российском, интернет-магазине. Лично мое мнение - лучший способ оплаты по кредитной/дебетовой карте. Занимался в свое время биллингом (программированием биллинговых систем), но, посмотрев на PayPal - https://www.paypal.com/ru понял, что лучше системы для проведения электронных платежей нет. По системе самой оплаты (то есть как это работает) не скажу, не специалист. Единственное, что могу добавить (по своему опыту), это то, что когда я вижу на любом сайте сообщение типа "отправьте SMS на номер ****" у меня срабатывает рвотный рефлекс. Извини, если немного не по теме. P.S. Виски дает о себе знать, не обращайте внимания на опечатки

Херь все это. Надо делать то, что приносит больше всего денег. А деньги сейчас может принести хороший программинг под iPhone. Начинаю изучать эту тему.

Да, но для этого понадобится не пара месяцев.

sv12, да забей на советы. Просто начинай планомерно изучать все, что тебе интересно и к чему у тебя тяга. Когда нравится то что делаешь, результат, как правило, получается неплохой. А умение и опыт придет со временем. Сначала у всех говно получалось, ты не один такой.

Во-первых надо определиться, кем ты хочешь быть - дизайнером или верстальщиком. Как правило, хороший верстальщик и хороший дизайнер в одном лице вещи несовместимые. А дизайнер может быть неплохим верстальщиком, иметь достаточно навыков для того, чтобы представить свой дизайн людям. Дальше стараешься улучшить это говно (странно звучит). Следующий шаг - домашняя страничка. Только ни в коем случае не блог, он убьет все хорошее в тебе. Ну и пошло-поехало. Только не используй всякие CMS а тем более Ucoz - это флагман дебилизма.

У вашего учреждения должен быть логотип в векторном формате. Вот его выложи куда-нибудь на файлообменник, чтобы можно было скачать. С тем логотипом (в таком качестве), который ты выложил сейчас в своем макете, какой красивый сайт не сделай - получится дерьмо.

Ну извини. Я тут как-то сделал примерно за эти же деньги сайт (есть на форуме), так выслушал столько интересного. После этого поставил минимальную планку. Думаю, тут найдутся люди, которые возьмутся и за меньшие деньги. Только если найдешь таких, проси, чтобы выкладывали макеты в форуме "Обсуждение работ" (или сам выкладывай). Советы даю бесплатно. Выложи логотип конторы в векторе (лучше в .ai формате или на худой конец в .eps) Может время будет набросаю что-нибудь. Образованию надо помогать.

В гривнах не знаю, не слежу за курсом В USD - 300 с небольшим (округлим до 300)

Я прекрасно понимаю ваше руководство. 10.000 рублей и за 2 часа у тебя будет шаблон, который понравится руководству. 1 день - готовый сайт.

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

Это Verder, просто я рекорд ставлю по количеству "забаниваний" на этом форуме Ну извини, значит я не так понял. А можно взглянуть более подробную сетку? Где что будет, внутренние блоки и.т.д. Тогда проще будет понять, как сделать именно то, чего ты добиваешься.

Ну вот, опять забанили... Только вот я не пойму: http://forum.htmlbook.ru/index.php?s=&...st&p=137824 То есть глобальному модератору можно? Но в любом случае от посыла этого урода bbsalex в пешее путешествие с эротическим уклоном я не отказываюсь.

Следующая заметка. Использование Clipping Mask. Наверное многие видели на разных сайтах, как сквозь заголовок, надпись, видна фотография. То есть такой эффект "фотографического текста". В подобном контексте такой прием применяется довольно редко, но он дает представление об использовании этого очень нужного инструмента. Например он используется для создания баннеров или графических кнопок. Работать мы будем вот с таким исходным изображением/простеньким коллажем, которое я специально для вас приготовил. сохраните себе на винт: 1. В фотошопе создаем новый файл (Ctrl+N) по размеру изображения (800x286), цвет фона белый а) Выбираем шрифт Impact, цвет шрифта ЧЕРНЫЙ. Ставим кегль 200pt и пишем верхнюю строку как на картинке, буквы заглавные. б) Тем же шрифтом, черным цветом но не заглавными буквами пишем следующую строку как на картинке. Кегль 88pt (точно по ширине подгонять не стал, на глаз): 2. Переносим нашу фотографию на текст (просто перетаскиваем мышкой), чтобы она его полностью закрывала: 3. Зажимаем Shift и выделяем на панели Layers оба текстовых слоя: 4. Щелкаем по выделенным слоям правой кнопкой мышки и выбираем Rasterize Type: 5. Щелкаем еще раз правой кнопкой и выбираем Merge Layers: Слои объединились в один. 6. Выделяем слой с фотографией, щелкаем правой кнопкой и выбираем Create Clipping Mask: 7. Смотрим результат. Подвигайте фото под текстом для наиболее удачного положения: Оставляю вам простор для творчества. Инструмент Clipping Mask дает очень много возможностей. Удачи.

Собственно, вот результат: http://www.freeway-design.ru/sample/ (я сделал разные цвета у кнопок) А вот и сам код, который прост как коровья лепешка: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Sprite example</title> <style type="text/css"> * { margin:0; padding:0; } body { background:#0054a6; } a.sprite1 { display:block; width:125px; height:20px; background: url(i/s1.png) left top; } a.sprite1:hover {background-position:left 20px;} a.sprite2 { display:block; width:125px; height:20px; background: url(i/s2.png) left top; } a.sprite2:hover {background-position:left 20px;} a.sprite3 { display:block; width:125px; height:20px; background: url(i/s3.png) left top; } a.sprite3:hover {background-position:left 20px;} ul { margin:3em 0; padding:0; } ul li { margin:0; padding:0; list-style-type:none; } </style> </head> <body> <div style="margin-left: 4em; margin-top: 10em;"> <ul> <li><a href="#" class="sprite1"></a></li> <li><a href="#" class="sprite2"></a></li> <li><a href="#" class="sprite3"></a></li> </ul> </div> </body> </html>

Продолжаем. Выше мы рассмотрели простой способ резки изображений (макетов). После небольшой практики вы будете резать макет любой сложности за пару минут. Но иногда, и достаточно часто, возникают ситуации, когда нам, например, надо разрезать то же меню, но требуется, чтобы отступы у блоков были одинаковые. То есть чтобы текст (ссылки) на наших кнопках располагались посередине относительно верха и низа блока. Все просто. Не знаю, может кто-то использует другие методы, но я больше доверяю своим глазам нежели автоматике. Надежней получается. Итак, одинаковые кнопки для меню на спрайтах (пример меню будет ниже). 1. Опять создаем новый файл (Ctrl+N) и закрашиваем его в синий цвет, как в предыдущей заметке. 2. Сделам 3 кнопки. Выберите шрифт Arial --> 14pt --> Sharp. Цвет белый. Чтобы было быстрее просто скопируйте эти три строки в ваш документ: Все были посланы Гулять в парк До вечера субботы 3. Делаем точно так же, как и в предыдущей заметке, то есть сначала привязываем направляющие к меню (Move tool --> тащим мышкой). Snap в меню View должен быть включен. 4. Выбираем инструмент Slice Tool и выделяем им наше меню: 5. Выбираем инструмент Slice Select Tool, наверху нажимаем кнопку Divide, Вводим цифру 3 (у нас 3 пункта меню) и получаем разделенное на 3 равных блока меню: Нажмите несколько раз Ctrl+ для зума (увеличьте до 300%). Внимательно смотрим - результат нас не устраивает. По центру, точно между направляющими находится только средний пункт, а кнопки должны быть одинаковыми: Нам надо это как то исправить. И теперь в дело вступают наши глазки. Для этого мы, не отменяя активного инструмента Slice Select Tool выделяем верхний пункт нашего меню (просто один раз щелкнем по нему) - выделение останется только на нем. Нажимая клавишу "Вверх" (стрелочка на клавиатуре) двигаем рамку выделения до тех пор, пока пункт меню не окажется точно посередине. Средний пункт не трогаем, результат нормальный, а нижний пункт таким же образом двигаем вниз. У нас получилось: Уменьшим приближение до нормального - 100% (Ctrl -) 6. Теперь мы начинаем делать сам спрайт для меню. Делать мы будем ручками, хватит автоматики. а) Выделяем первый пункт меню (инструмент Slice Select Tool по прежнему активен) и нажимаем: Ctrl+C ; Ctrl+N ; Ctrl+V (во всех диалоговых окнаж жмем "ОК"). В результате получается первая вырезанная заготовка: б) Можете повторить процедуру с этим же пунктом меню еще раз, а можете просто сделать дубликат картинки (нам нужно 2 копии): Заготовки у нас есть. Теперь надо их как то объеденить. Смотрим размер кнопки (сверху Image --> Image Size) - размер 125px на 20px. в) Теперь надо создать заготовку под спрайт (Ctrl+N). Размеры мы знаем, высоту увеличивам в 2 раза, то есть создаем новый файл 125px на 40px. Заготовка создана, пока сверните ее, она понадобится чуть позже. Так же пока свернем один из созданных дубликатов кнопки и основной файл. В рабочей области остается только один дубликат. г) В верхнем меню выбираем - Image --> Adjustments --> Hue/Saturation и проставляем значения как на картинке - кнопка при наведении указателя будет меняться с синего на оранжевый: Разворачиваем первый дубликат кнопки (синий) и заготовку под спрайт (который высотой 40px).Режим Snap должен быть включен. И просто перетаскиваем в верхнюю часть нашего спрайта синюю кнопку, а в нижнюю оранжевую (они сами прилипнут к краям): Вот, собственно, у нас получился простенький спрайт. Проделываем ту же операцию с другими кнопками. Сохраняем каждый спрайт куда нам надо. Я не верстальщик, но чтобы работа была до конца доделанной, приведу пример как его использовать и как раз проверим работоспособность того, что мы нарисовали. В следующем посте.

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

Продолжим. Картинку то мы слайсами разделили, а теперь встает резонный вопрос - "И что?". То есть как мы можем быстренько все это сохранить в нужном нам формате. Объясню. 1. Выбираем - File --> Save for Web & Devices (или просто жмем Alt+Shift+Ctrl+S), видим такую картину: В этом же окне выбираем инструмент Slice Select Tool 2. Я специально не стал тримировать наше меню (то есть обрезать его по контуру) чтобы было наглядней. Итак, зажимаем клавишу Shift и выделяем те места изображения, которые нам нужно получить уже разрезанными и помещенными в директорию с изображениями вашего сайта. К примеру нам не нужны правый и нижний блоки, мы просто их не выделяем. Получаем следующее: 3. В настройках сохранения все стандартно: Важно! Для каждого блока вы можете выбрать свой формат. Допустим для меню вы выбрали формат .PNG - то есть выделили с шифтом пункты меню, справа выбрали формат .PNG. Если другие блоки вам нужно сохранить в формате JPEG, то просто задаете им этот формат на выходе. Ну и дальше как обычно жмем Save, выбираете директорию сохранения и получаете: Таким способом вы можете очень быстро разрезать макет любой сложности, не обрезая каждый фрагмент вручную. Следующая заметка будет про точную подгонку отступов для создания меню на спрайтах. Удачи.

А позволь поинтересоваться, каким образом досигалась прозрачность у .png файла? Как вытравливался фон? Смотри - http://freeway-design.ru/ - видишь логотип? Открой в IE6. Никаких косяков. Вот он как раз прозрачный .png на непрозрачном бэкграунде. Да, согласен, бэкграунд светлый, но косяки в обтравке все равно было бы заметно. Так вот твоя проблема решается без всяких фиксов, просто правильной обтравкой в фотошопе и правильно выбранным режимом. P.S. Или я неправильно понял задачу?