Раскройка шаблона сайта (картинки)

Народ помогите пожалуйста ! Я скачал бесплатный шаблон сайта. В архиве был файл PSD то есть фотошоповский исходник дизайна первой страницы. В фотошопе меняю названия кнопок и ит.д. в шаблоне и затем жму "Сохранить для Web" в итоге имею html-ку, которую открываю через Dreamweaver CS4 и вот ТУТ НАЧИНАЕТСЯ. Когда пытаюсь вставить текст, то дизайн сайта начинает расползаться, то есть части дизайна разъезжаются. Что делать ? Как я понимаю это зависит от раскройки ? Так ? Как и чем мне раскроить эту страницу, чтобы она не разъезжалась и более того, как сделать так что, когда я пишу текст то у меня почему то текс (квадратное окно его) замещает область картинки моего сайта а мне хочется чтобы он наверх ложился на фон сайта и когда его много, то автоматом двигался вниз без разъезжания дизайна сайта.
Заранее прошу прощение за туфтологию. Спасибо

Тема переехала в «верстку».

Видимо Вы слишком много текста вставляете либо переносы не ставите. Некоторые картинки из «картинки просто» надо, видимо, перенести в «фоновая картинка». Лучше даже сразу вставить текст в Фотошопе, а потом лишь раскроить. В общем, ручная работа.

Цитата:

---

Заранее прошу прощение за туфтологию. Спасибо

---

И правда туфта )

В процессе создания любого сайта можно выделить 3 этапа:
1. Дизайн (разработка psd-макета)
2. Вёрстка (та самая "раскройка" или html-кодинг)
3. Программинг (PHP, Perl, ASP и т.д.)

Фотошоп создаёт примитивный html-код. Он лишь режет одну большую картинку на несколько маленьких.
Процесс создания хорошей работоспособной вёрстки куда сложнее и выполняется только вручную. Тут есть ряд сложностей, таких как кроссбраузерность (воспринимаемость кода разными браузерами), резина (растягиваемость страницы на экранах с разными разрешениями), валидируемость (оценка соответствия вёрстки W3C стандартам). Поисковики вам в помощь [Only registered and activated users can see links. Click Here To Register...]
Благо на российском рынке эта услуга совсем недорогая и колеблется в районе 1000-2000 руб. за страницу. Разумеется, есть и более сложные задачи с соответствующим ценником. Внутренние разделы (имеющие схожий дизайн с главной) обычно делаются ещё дешевле.

Цитата:

---

И правда туфта )

В процессе создания любого сайта можно выделить 3 этапа:
1. Дизайн (разработка psd-макета)
2. Вёрстка (та самая "раскройка" или html-кодинг)
3. Программинг (PHP, Perl, ASP и т.д.)

Фотошоп создаёт примитивный html-код. Он лишь режет одну большую картинку на несколько маленьких.
Процесс создания хорошей работоспособной вёрстки куда сложнее и выполняется только вручную. Тут есть ряд сложностей, таких как кроссбраузерность (воспринимаемость кода разными браузерами), резина (растягиваемость страницы на экранах с разными разрешениями), валидируемость (оценка соответствия вёрстки W3C стандартам). Поисковики вам в помощь [Only registered and activated users can see links. Click Here To Register...]
Благо на российском рынке эта услуга совсем недорогая и колеблется в районе 1000-2000 руб. за страницу. Разумеется, есть и более сложные задачи с соответствующим ценником. Внутренние разделы (имеющие схожий дизайн с главной) обычно делаются ещё дешевле.

---

Подскажите тогда, чем вообще выполняется верстка, точнее какой программой ?

Цитата:

---

Подскажите тогда, чем вообще выполняется верстка, точнее какой программой ?

---

Ну например тем же Dreamweaver [Only registered and activated users can see links. Click Here To Register...]

Цитата:

---

Благо на российском рынке эта услуга совсем недорогая и колеблется в районе 1000-2000 руб. за страницу.

---

Бывает и 1000-2000$.

Цитата:

---

Подскажите тогда, чем вообще выполняется верстка

---

Руками.

Цитата:

---

Подскажите тогда, чем вообще выполняется верстка, точнее какой программой ?

---

Да хоть блокнотом. Я использую PHPExpertEditor из-за подсветки синтаксиса.
Dreamweaver вставляет много лишнего мусора в код и страница из-за этого грузится дольше. Правды ради надо сказать, что разницы вы, скорее всего, не почувствуете. Но она есть ) И в солидных крупных проектах подобные потери совершенно недопустимы. Поэтому рекомендую сразу начинать учиться верстать ручками.

Цитата:

---

Бывает и 1000-2000$.

---

Одна страница без javascript? [Only registered and activated users can see links. Click Here To Register...] Покажите мне это чудо ) И таких заказчиков [Only registered and activated users can see links. Click Here To Register...]

Цитата:

---

В процессе создания любого сайта можно выделить 3 этапа:
1. Дизайн (разработка psd-макета)
2. Вёрстка (та самая "раскройка" или html-кодинг)
3. Программинг (PHP, Perl, ASP и т.д.)

---

НАРОД, ТОГДА ПОДСКАЖИТЕ КАКИЕ ПРОГРАММЫ НУЖНЫ ДЛЯ КАЖДОГО ИЗ ЭТАПОВ СОЗДАНИЯ САЙТА.
1.ДЛЯ ПЕРВОГО КАК Я ПОНИМАЮ В ОСНОВНОМ ИСПОЛЬЗУЮТ PHOTOSHOP
2.ДЛЯ ВТОРОГО НАСКОЛЬКО Я ПОНЯЛ IMAGEREADY
3.НУ А ТРЕТИЙ И ТАК ПОНЯТНО

Тогда для чего нужен вообще dreamweaver ? Или же им тоже верстку производят ?

И подскажите, как опытные люди в этом, с чего начинать изучение и какие именно
программы разбирать и учить ? не хочется не нужные вещи мусолить ! К примеру в интернете куча статей, но у всех свои мнения как и в какой программе что лучше делать !
Я, правда, сделал несколько сайтов давненько, но знаий никаких не прилагал почти (их просто не было и нет [Only registered and activated users can see links. Click Here To Register...]), так как взял просто готовые шаблоны и через dreamweaver изменил под себя !

По программам вам всё уже разжевали выше.
Чтобы начать учиться, нужно [Only registered and activated users can see links. Click Here To Register...].
Например [Only registered and activated users can see links. Click Here To Register...].

Чтобы начать мне хватило этого скринкаста: [Only registered and activated users can see links. Click Here To Register...]. А дальше книжки и практика.

Матерь Божья, конца и края не видно.

Цитата:

---

Dreamweaver вставляет много лишнего мусора в код и страница из-за этого грузится дольше. Поэтому рекомендую сразу начинать учиться верстать ручками.

---

Пожалуйста, объясните мне, на основании чего Вы выдвигаете эту космическую гипотезу о том, что в Dreamweaver-е, в отличие от блокнота или PHPExpertEditor, категорически невозможно «верстать ручками»? Откуда берутся такие стереотипы, что, мол, если Dreamweaver, то это обязательно «куча мусора» в коде?

Цитата:

---

Одна страница без javascript? [Only registered and activated users can see links. Click Here To Register...] Покажите мне это чудо ) И таких заказчиков [Only registered and activated users can see links. Click Here To Register...]

---

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

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

Цитата:

---

Пожалуйста, объясните мне, на основании чего Вы выдвигаете эту космическую гипотезу о том, что в Dreamweaver-е, в отличие от блокнота или PHPExpertEditor, категорически невозможно «верстать ручками»? Откуда берутся такие стереотипы, что, мол, если Dreamweaver, то это обязательно «куча мусора» в коде?

---

Вы говорите за других, поэтому и не видно ни конца, ни края )
Я не выдвигал никаких гипотез, тем более о том, что в дримвивере "категорически невозможно верстать ручками".
"Стереотипы" о мусоре берутся после ознакомления с этой программой и применением её функций на деле. Если не использовать эти функции, а писать код как в блокноте, то зачем ставить такую массивную софтину?
Правда, я давно с ней не работал. Возможно, в современных версиях появилось много нового, полезного и интересного. Если так, поделитесь, плиз.

Цитата:

---

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

---

Даже если не обращать внимания на шквал незнакомых для меня слов [Only registered and activated users can see links. Click Here To Register...] , одни только яваскрипты могут иметь стоимость в десятки тысяч доляров... Но звучит убедительно ) Благодарю вас, буду теперь ламеров стращать понятиями [Only registered and activated users can see links. Click Here To Register...]
Если вас не затруднит, раскройте, пожалуйста, эти диковины:
1. Четкое разделение структуры и представления (это о html и css?)
2. Неуклонное соблюдение семантики структурных элементов (это о валидации опять же?)
3. Солидная «кучка» микроформатов (вот это очень интересно)
4. Обеспечение максимальной доступности контента для людей с ограниченными возможностями (что в себя включает?)
5. Адаптация контента не только для экранов мониторов, но также и для КПК, скрин-ридеров и печатающих устройств (можно дополнить wap-версией)

Цитата:

---

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

---

А за так не покажете? [Only registered and activated users can see links. Click Here To Register...]

Почитал ваш [Only registered and activated users can see links. Click Here To Register...].
Качаю его )

Цитата:

---

Я не выдвигал никаких гипотез, тем более о том, что в дримвивере "категорически невозможно верстать ручками".

---

Простите великодушно, но я вроде бы пока еще не разучился читать по-русски:

Цитата:

---

Dreamweaver вставляет много лишнего мусора в код и страница из-за этого грузится дольше. Поэтому рекомендую сразу начинать учиться верстать ручками.

---

Разве это не прямое утверждение, что Dreamweaver и «верстать ручками» – есть суть понятия несовместимые?

Цитата:

---

Если не использовать эти функции, а писать код как в блокноте, то зачем ставить такую массивную софтину?

---

Смею предположить, что, если уж Вы нашли мой «труд о дримвивере», по всей видимости Вы уже нашли и ответ на данный вопрос)

Цитата:

---

Если вас не затруднит, раскройте, пожалуйста, эти диковины

---

1. [Only registered and activated users can see links. Click Here To Register...].
2. [Only registered and activated users can see links. Click Here To Register...] (не имеет ничего общего с валидацией).
3. [Only registered and activated users can see links. Click Here To Register...]-[Only registered and activated users can see links. Click Here To Register...]-[Only registered and activated users can see links. Click Here To Register...]-[Only registered and activated users can see links. Click Here To Register...]-[Only registered and activated users can see links. Click Here To Register...].
4. [Only registered and activated users can see links. Click Here To Register...], [Only registered and activated users can see links. Click Here To Register...].
5. Wap-версия тут совсем ни при чем. Речь шла о возможности просматривать веб-сайты с помощью широчайшего спектра различных устройств вывода, что достигается посредством CSS.

Цитата:

---

А за так не покажете?

---

не) так не честно) [Only registered and activated users can see links. Click Here To Register...]

Цитата:

---

Разве это не прямое утверждение, что Dreamweaver и «верстать ручками» – есть суть понятия несовместимые?

---

Блин, вы меня поймали за хвост [Only registered and activated users can see links. Click Here To Register...] На самом деле, я имел в виду нецелесообразность использования дрима в качестве блокнота, ибо не знал о его многочисленных полезностях. Но вы мне раскрыли на них глаза, за что примите мой виртуальный поклон )

Цитата:

---

Смею предположить, что, если уж Вы нашли мой «труд о дримвивере», по всей видимости Вы уже нашли и ответ на данный вопрос)

---

Исчерпывающий )

Цитата:

---

не) так не честно) [Only registered and activated users can see links. Click Here To Register...]

---

Ну и ладно [Only registered and activated users can see links. Click Here To Register...]

P.S. Спасибо вам за сцылочки!

Всем спасибо за советы, НО на последок хотелось бы добавить и спросить. Дело в том что учебники и т.д. начинаются и долго тянуться с всякого рода примеров тегов и т.д. Этим я владею наполовину и знаю теги. У меня вопрос скорее более не базовый. Вот к примеру, сделал я макет в PSD, А ЗАТЕМ что ? Как я понял я должен создать, к примеру, в Дриме таблицу и уже с PSD макета в Photoshope вырезать и вставлять в таблицу в Дриме фрагменты сайта, подгонять их под нужный размер и т.д. ? Так я понимаю ? Точнее будет правильнее спросить на верном ли я пути ? [Only registered and activated users can see links. Click Here To Register...] Дело в том что когда я делаю макет в Photoshope то жму "Сохранить для Web" и мне уже тут и готовый Index.html и папка Images к нему, НО как я понял за основу этот index.html брать нельзя ? То есть все что мне в конечном виде выдал фотошоп мне следует расценивать ТОЛЬКО как нарезанные картинки (кнопки, элементы дизайна и т.д.) а файл index.html который сделал фотошоп можно вообще удалить ?????? Или же нужно делать верстку на основе этого index файла фотошопа ? То есть если быть короче, сначала делается макет в PSD а затем разрезается и уже монтируется и корректируется в ТАБЛИЦУ, созданную в Дриме ?
Заранее спасибо. Простите неопытного ламера [Only registered and activated users can see links. Click Here To Register...]

Dimon.by, повторюсь.
[Only registered and activated users can see links. Click Here To Register...] — здесь всё понятно и наглядно.

Цитата:

---

Dimon.by, повторюсь.
[Only registered and activated users can see links. Click Here To Register...] — здесь всё понятно и наглядно.

---

Так там же всё на английском....[Only registered and activated users can see links. Click Here To Register...]

=) Там и так всё понятно должно быть. А вообще английский надо знать, без него в наше время трудно.

Цитата:

---

Блин, вы меня поймали за хвост [Only registered and activated users can see links. Click Here To Register...]

---

Вот такой я вредный) [Only registered and activated users can see links. Click Here To Register...]

Цитата:

---

Спасибо вам за сцылочки!

---

Да простят меня окружающие за небольшой оффтоп, но тема «1000 рублей за верстку» – весьма больная тема. Ведь вот что удивительно: отдать, к примеру, 30-60 тысяч рублей за хороший дизайн сайта – это как бы в порядке вещей. Или взять, опять же, к примеру, стоимость работы программиста: за хороший интернет-магазин можно запросто выставить счет тыщ на 50, а то и на 100. Но вот что касается верстки – это 1000 рублей. И все тут. Складывается такое впечатление, что данный этап веб-разработки совершенно не требует ни знаний, ни ума, ни времени. В то время как именно от качества верстки зависят такие наиважнейшие свойства сайта как правильное отображение в браузерах нынешнего и будущих поколений, скорость загрузки веб-страниц, успех индексации контента поисковыми роботами и совместимость с различными устройствами вывода...

Цитата:

---

Дело в том что учебники и т.д. начинаются и долго тянуться с всякого рода примеров тегов и т.д.

---

И правильно делают. Потому что без четкого и досконального понимания той или иной технологии ни один «вспомогательный инструмент» не будет Вам полезен.

Цитата:

---

Вот к примеру, сделал я макет в PSD, А ЗАТЕМ что ?

---

А затем – забыть о существовании Дрима до тех пор, пока Вы не выучите должным образом HTML и CSS и не сверстаете парочку сайтов в обычном блокноте Windows.

Цитата:

---

Как я понял я должен создать, к примеру, в Дриме таблицу

---

[Only registered and activated users can see links. Click Here To Register...] слово «таблица».

Цитата:

---

НО как я понял за основу этот index.html брать нельзя ?

---

Нельзя.

Цитата:

---

То есть все что мне в конечном виде выдал фотошоп мне следует расценивать ТОЛЬКО как нарезанные картинки (кнопки, элементы дизайна и т.д.)

---

Как редкостную блевотину это следует расценивать.

Цитата:

---

а файл index.html который сделал фотошоп можно вообще удалить ??????

---

Проще изначально его не создавать.

Ладно, выражусь тогда ещё проще !!! В Фотошопе я только делаю макет сайта и затем его нарезываю, а потом перехожу к верстке в Дриме ? Верно ? [Only registered and activated users can see links. Click Here To Register...] Или же тогда для чего нужен фотошоп ? Сделать макет и так понятно, но ведь большая чать людей ещё там и нарезывают !!!! Или же раскройку лучше в ImageReady делать ?

Если коротко, то в фотошопе только подготавливают графику для размещения на сайте.

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

Термин «нарезка» – архаизм. В 90-х годах прошлого века кто-то может быть что-то и «нарезал» (посредством использования слайсов в Adobe Photoshop), но к современным методам верстки этот термин не имеет никакого отношения.

Цитата:

---

но ведь большая чать людей ещё там и нарезывают

---

Именно поэтому эта большая часть людей и создает [Only registered and activated users can see links. Click Here To Register...] [Only registered and activated users can see links. Click Here To Register...], засоряя тем самым и без того до безобразия загаженную Сеть...

Цитата:

---

Термин «нарезка» – архаизм. В 90-х годах прошлого века кто-то может быть что-то и «нарезал» (посредством использования слайсов в Adobe Photoshop), но к современным методам верстки этот термин не имеет никакого отношения.

---

А как чичас делають? [Only registered and activated users can see links. Click Here To Register...]
Вот уж истинная удача, что Димон ошибся разделом )
В дримвивере уже ваяю вовсю... А вот с нарезкой задержался в 90-ых ) Научите [Only registered and activated users can see links. Click Here To Register...]

Цитата:

---

А как чичас делають?

---

Сейчас принято представлять все декоративное оформление сайта исключительно с помощью CSS. Поэтому двумерная модель, подразумевающая тупое разрезание графического макета сайта (с помощью инструмента Slice Tool в Adobe Photoshop) на кучу разных мелких «прямоугольников» с их последующей вставкой во множество табличных ячеек, является не более чем пережитком прошлого. Каскадные таблицы стилей позволяют свободно позиционировать элементы веб-страниц не только в двух измерениях, но также и в третьем измерении (посредством их наложения друг на друга). Подобный подход позволяет добиться полной ортогональности аспектов содержания и представления в документах с учетом их правильного структурирования (семантической корректности).

Цитата:

---

Сейчас принято представлять все декоративное оформление сайта исключительно с помощью CSS. Поэтому двумерная модель, подразумевающая тупое разрезание графического макета сайта (с помощью инструмента Slice Tool в Adobe Photoshop) на кучу разных мелких «прямоугольников» с их последующей вставкой во множество табличных ячеек, является не более чем пережитком прошлого. Каскадные таблицы стилей позволяют свободно позиционировать элементы веб-страниц не только в двух измерениях, но также и в третьем измерении (посредством их наложения друг на друга). Подобный подход позволяет добиться полной ортогональности аспектов содержания и представления в документах с учетом их правильного структурирования (семантической корректности).

---

Каскадные таблицы стилей, суля по поиску - не являются версткой сайта. Версткой на данный момент является табличная и блочная...[Only registered and activated users can see links. Click Here To Register...]

Цитата:

---

Сейчас принято представлять все декоративное оформление сайта исключительно с помощью CSS. Поэтому двумерная модель, подразумевающая тупое разрезание графического макета сайта (с помощью инструмента Slice Tool в Adobe Photoshop) на кучу разных мелких «прямоугольников» с их последующей вставкой во множество табличных ячеек, является не более чем пережитком прошлого. Каскадные таблицы стилей позволяют свободно позиционировать элементы веб-страниц не только в двух измерениях, но также и в третьем измерении (посредством их наложения друг на друга). Подобный подход позволяет добиться полной ортогональности аспектов содержания и представления в документах с учетом их правильного структурирования (семантической корректности).

---

Сори, все таки является версткой. Вот статья небольшая...

"CSS-вёрсткаДо появления CSS оформление веб-страниц осуществлялось непосредственно внутри содержимого документа. Однако с появлением CSS стало возможным принципиальное разделение содержания и представления документа. За счёт этого нововведения стало возможным лёгкое применение единого стиля оформления для массы схожих документов, а также быстрое изменение этого оформления.

Преимущества CSS вёрстки:

• Несколько дизайнов страницы для разных устройств просмотра. Например, на экране дизайн будет рассчитан на большую ширину, во время печати меню не будет выводиться, а на [Only registered and activated users can see links. Click Here To Register...] и сотовом телефоне меню будет следовать за содержимым.
• Уменьшение времени загрузки страниц сайта за счет переноса правил представления данных в отдельный CSS-файл. В этом случае браузер загружает только структуру документа и данные, хранимые на странице, а представление этих данных загружается браузером только один раз и [Only registered and activated users can see links. Click Here To Register...].
• Простота последующего изменения дизайна. Не нужно править каждую страницу, а лишь изменить CSS-файл.
• Дополнительные возможности оформления. Например, с помощью CSS-вёрстки можно сделать блок текста, который остальной текст будет обтекать (например для меню) или сделать так, чтобы меню было всегда видно при прокрутке страницы."

Цитата:

---

Сейчас принято представлять все декоративное оформление сайта исключительно с помощью CSS. Поэтому двумерная модель, подразумевающая тупое разрезание графического макета сайта (с помощью инструмента Slice Tool в Adobe Photoshop) на кучу разных мелких «прямоугольников» с их последующей вставкой во множество табличных ячеек, является не более чем пережитком прошлого. Каскадные таблицы стилей позволяют свободно позиционировать элементы веб-страниц не только в двух измерениях, но также и в третьем измерении (посредством их наложения друг на друга). Подобный подход позволяет добиться полной ортогональности аспектов содержания и представления в документах с учетом их правильного структурирования (семантической корректности).

---

Про таблицы я у вас начитался. Они мне уже снятся )
А по поводу "третьего измерения" - вы лукавите, нету там его, видимость одна ) Реальное 3Д разве что яваскриптами можно закодить.
Под нарезкой я имел в виду лишь создание изображений с помощью слайсов, но никак не использование табличной вёрстки. Разве слайсы мешают создавать "трёхмерную" вёрстку? Скрыл лишние слои - сохранил фрагмент. Затем другие слои скрыл - снова сохранил. Вот тебе и готовые "измерения" для оформления сайта средствами CSS.
Я просто подумал, что современные умы могли сочинить более прогрессивные средства для нарезки.

Чем дальше в лес, тем больше дров)

Цитата:

---

Версткой на данный момент является табличная и блочная...[Only registered and activated users can see links. Click Here To Register...]

---

Смею заверить Вас, что на самом деле «табличной верстки», «блочной верстки», «СSS-верстки», «дивной верстки» и т.п. НЕ СУЩЕСТВУЕТ. Существует так называемая семантическая верстка и говнокод. Если Вы будете продолжать заниматься этим направлением деятельности и все больше углубляться в детали, со временем Вы это обязательно поймете.

Цитата:

---

Преимущества CSS вёрстки

---

Собственно говоря, об этом речь и шла.

Цитата:

---

А по поводу "третьего измерения" - вы лукавите, нету там его, видимость одна ) Реальное 3Д разве что яваскриптами можно закодить.

---

Это Вы немного не в ту степь. Речь шла о свободном позиционировании элементов не только в двумерном пространстве, но и с помощью CSS-свойства [Only registered and activated users can see links. Click Here To Register...], которое являет собой самое что ни на есть третье измерение.

Цитата:

---

Разве слайсы мешают создавать "трёхмерную" вёрстку?

---

Нет, не мешают. Тем не менее, во-первых, они просто для этого не требуются. А во-вторых, они мешают полностью абстрагироваться от старых понятий двумерности – поменять сложившиеся стереотипы (старое «визуальное мышление») на новый ортогональный стиль разметки.

Как вы нарезаете psd-макеты? Если слово "нарезка" вам не по душе, назовём это подготовкой картинок для вёрстки, например.

Цитата:

---

Как вы нарезаете psd-макеты? Если слово "нарезка" вам не по душе, назовём это подготовкой картинок для вёрстки, например.

---

Тут дело не в том, что мне «по душе», а что – нет. Просто сам термин «нарезка» в первую очередь ассоциируется с инструментом «Slice Tool» (обратите внимание на соответствующую иконку в Adobe Potoshop – это ни что иное как нож). Как следствие, я просто не вижу никакого смысла употреблять в устной и письменной речи всякие архаизмы, зачастую попросту сбивающие начинающих веб-разработчиков с толку.

Цитата:

---

Тут дело не в том, что мне «по душе», а что – нет. Просто сам термин «нарезка» в первую очередь ассоциируется с инструментом «Slice Tool» (обратите внимание на соответствующую иконку в Adobe Potoshop – это ни что иное как нож). Как следствие, я просто не вижу никакого смысла употреблять в устной и письменной речи всякие архаизмы, зачастую попросту сбивающие начинающих веб-разработчиков с толку.

---

Жжоте )) Вы предлагаете забраковать вполне подходящее под этот вид деятельности название, но не предлагаете другого, такого же ёмкого и короткого термина. Причём бракуете вы его, основываясь на иконке фотошопа )
Нарезка - слово понятное и очень широко используемое. Используемое именно для описания действия, "расщепляющего" psd-макет на составные части для дальнейшего сбора страницы при html-вёрстке. Давайте забудем о нарезке в области веб-дизайна и обратимся к значению этого слова в повседневной жизни. Что это, как не деление чего-то большого на несколько маленьких частей. Так же происходит и с дизайном, который мы делим на уголочки, иконки, шапку, подвальчик, всякие закорючки и фончики. А вопрос ассоциаций "нарезки" с инструментом "Slice Tool" уж больно субъективен, чтобы на основании его браковать удобный термин.
Как бы то ни было, на мой вопрос вы не ответили. Как вы режете (подготавливаете, раскладываете) макет для вёрстки? Если не слайсами, то чем?

Цитата:

---

Жжоте )) Вы предлагаете забраковать вполне подходящее под этот вид деятельности название, но не предлагаете другого, такого же ёмкого и короткого термина.

---

Не знаю, где Вы увидели, чтобы я что-то кому-то тут предлагал. Вы поинтересовались моим мнением – я Вам свое мнение вполне внятно изложил. Вы же, в свою очередь, вправе называть вещи так, как Вам только будет угодно.

Цитата:

---

Причём бракуете вы его, основываясь на иконке фотошопа )

---

На самом деле дело не только в иконке. По моему скромному мнению сама концепция слайсов подталкивает разработчиков к восприятию графического макета как к некоему набору прямоугольных областей, которые прямо напрашиваются на то, чтобы их впоследствии запихнули в говнотабличные говноячейки. Происходит это оттого, что принцип слайсов основывается на их «прилипании» друг к другу, что, в свою очередь, мешает мысленно отделить смысловую графику от декоративного оформления. С другой стороны, семантическая верстка совершенно не требует такого «прилипания». Рекомендую также обратить внимание на [Only registered and activated users can see links. Click Here To Register...]. Посмотрите предложенный макет и скажите, в каком там месте можно что-то порезать с помощью слайсов?)

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

Цитата:

---

Как бы то ни было, на мой вопрос вы не ответили. Как вы режете (подготавливаете, раскладываете) макет для вёрстки? Если не слайсами, то чем?

---

Простите великодушно, что не ответил сразу. Исправляю это досадное недоразумение:

1. Выделяю выборочные фрагменты графического макета с помощью инструмента Rectangular Marquee Tool.
2. Копирую полученное содержимое в буфер обмена Windows.
3. Создаю новый графический файл, вставляю в него содержимое буфера обмена.
4. При необходимости модифицирую полученный результат (корректировка размеров фоновых изображений, заготовки для CSS-спрайтов и т.п.)
5. Сохраняю полученный результат в наиболее подходящем формате с наиболее оптимальным соотношением размер/качество.
6. Если на выходе получен PNG-файл, очищаю его от информации о гамме с помощью PNGOUT.


P.S.
Скажите честно, Вы хорошо ознакомились с такими понятиями как «разделение структуры и представления», «семантическая верстка» и «отличие смысловой графики от декоративного оформления»? Если не совсем хорошо, Вам будет очень сложно понять, почему использование слайсов на сегодняшний день – есть вещь совершенно ненужная.

Совсем не обязательно использовать свойство прилипания у слайсов. И не обязательно сразу обозначать все фрагменты, можно постепенно. По сути "мой" метод нарезки при помощи них на выходе выдаёт такой же результат, как у вас. Я также, как и вы, вырезаю каждый фрагмент отдельно, просто использую не буфер обмена + новый файл, а слайсы. При подготовке нескольких схожих элементов количество действий получится даже меньше, чем при копировании каждого элемента отдельно. Например, при создании нескольких уголков одной панельки, графического меню и т.п.
Макет фригера, конечно, навороченный, но слайсам подвластно всё ) Хоть и долго это будет...
К счастью, я вас понял. Тут уж, как рука набита, ибо заметного преимущества в вашем методе я не заметил, как впрочем и в "моём".

Цитата:

---

Скажите честно, Вы хорошо ознакомились с такими понятиями как «разделение структуры и представления», «семантическая верстка» и «отличие смысловой графики от декоративного оформления»? Если не совсем хорошо, Вам будет очень сложно понять, почему использование слайсов на сегодняшний день – есть вещь совершенно ненужная.

---

Хорошо ознакомился ) Раньше я не знал лишь о принципах семантической вёрстки и микроформатах.

Цитата:

---

Хоть и долго это будет...

---

Вот она – истина. Аминь [Only registered and activated users can see links. Click Here To Register...]

Цитата:

---

Вот она – истина. Аминь [Only registered and activated users can see links. Click Here To Register...]

---

Кстати, хороший вывод из нашей дискуссии: слайсы хороши при подготовке нескольких схожих элементов, а буфер - при нарезке макетов с многоуровневой графикой. Слово "нарезка" заменить по вкусу [Only registered and activated users can see links. Click Here To Register...]
Вот теперь аминь )

Okey, давайте будем думать не только о себе, но и о начинающих веб-разработчиках. В частности, к чему была вся эта полемика? К тому, что во многих «неокрепших умах» запросто может поселиться идея о том, что нарезка = слайсы -> Image Ready -> Save Optimazed As HTML and Images = очередной говнотабличный говнокод.

Я очень рад (искренне), что у Вас получается использовать слайсы разумно. Даже не смотря на то, что, как Вы сами и заметили, иногда это бывает «довольно долго» => неоптимально. Но не все же такие грамотные, как Вы?) Т.е. для подавляющего большинства начинающих разработчиков использование слайсов означает (к сожалению) именно описанную чуть выше последовательность действий... Вот что удручает.

Цитата:

---

Okey, давайте будем думать не только о себе, но и о начинающих веб-разработчиках. В частности, к чему была вся эта полемика? К тому, что во многих «неокрепших умах» запросто может поселиться идея о том, что нарезка = слайсы -> Image Ready -> Save Optimazed As HTML and Images = очередной говнотабличный говнокод.

Я очень рад (искренне), что у Вас получается использовать слайсы разумно. Даже не смотря на то, что, как Вы сами и заметили, иногда это бывает «довольно долго» => неоптимально. Но не все же такие грамотные, как Вы?) Т.е. для подавляющего большинства начинающих разработчиков использование слайсов означает (к сожалению) именно описанную чуть выше последовательность действий... Вот что удручает.

---

Да ладно вам удручаться. Всё ведь отлично, на самом деле )
По поводу неокрепших умов: мы с вами в этой теме, как раз, всё подробненько обсудили. И даже вывод сделали [Only registered and activated users can see links. Click Here To Register...]
Кто хочет учиться - научится. А остальным вы ничем не поможете, как бы ни хотелось.