Ладно, выражусь тогда ещё проще !!! В Фотошопе я только делаю макет сайта и затем его нарезываю, а потом перехожу к верстке в Дриме ? Верно ?Или же тогда для чего нужен фотошоп ? Сделать макет и так понятно, но ведь большая чать людей ещё там и нарезывают !!!! Или же раскройку лучше в ImageReady делать ?
Если коротко, то в фотошопе только подготавливают графику для размещения на сайте.
Нарезка делается в шопе. Вёрстка - в дриме.
Но процесс нарезки - это отдельный разговор. Всё, что в дальнейшем может быть реализовано при помощи HTML+CSS, должно быть там и реализовано. Подчас это означает скрупулёзную нарезку десятков мелких элементов.
Плюс графика должна быть оптимизирована для облегчения конечного сайта. Важно выбрать правильный формат, качество изображения и поработать с таблицей цветов для достижения лучшего соотношения вес+качество.
Термин «нарезка» – архаизм. В 90-х годах прошлого века кто-то может быть что-то и «нарезал» (посредством использования слайсов в Adobe Photoshop), но к современным методам верстки этот термин не имеет никакого отношения.
Именно поэтому эта большая часть людей и создает [Только зарегистрированные пользователи могут видеть ссылки. ] [Только зарегистрированные пользователи могут видеть ссылки. ], засоряя тем самым и без того до безобразия загаженную Сеть...но ведь большая чать людей ещё там и нарезывают
А как чичас делають?Термин «нарезка» – архаизм. В 90-х годах прошлого века кто-то может быть что-то и «нарезал» (посредством использования слайсов в Adobe Photoshop), но к современным методам верстки этот термин не имеет никакого отношения.
Вот уж истинная удача, что Димон ошибся разделом )
В дримвивере уже ваяю вовсю... А вот с нарезкой задержался в 90-ых ) Научите
Сейчас принято представлять все декоративное оформление сайта исключительно с помощью CSS. Поэтому двумерная модель, подразумевающая тупое разрезание графического макета сайта (с помощью инструмента Slice Tool в Adobe Photoshop) на кучу разных мелких «прямоугольников» с их последующей вставкой во множество табличных ячеек, является не более чем пережитком прошлого. Каскадные таблицы стилей позволяют свободно позиционировать элементы веб-страниц не только в двух измерениях, но также и в третьем измерении (посредством их наложения друг на друга). Подобный подход позволяет добиться полной ортогональности аспектов содержания и представления в документах с учетом их правильного структурирования (семантической корректности).А как чичас делають?
Каскадные таблицы стилей, суля по поиску - не являются версткой сайта. Версткой на данный момент является табличная и блочная...Сейчас принято представлять все декоративное оформление сайта исключительно с помощью CSS. Поэтому двумерная модель, подразумевающая тупое разрезание графического макета сайта (с помощью инструмента Slice Tool в Adobe Photoshop) на кучу разных мелких «прямоугольников» с их последующей вставкой во множество табличных ячеек, является не более чем пережитком прошлого. Каскадные таблицы стилей позволяют свободно позиционировать элементы веб-страниц не только в двух измерениях, но также и в третьем измерении (посредством их наложения друг на друга). Подобный подход позволяет добиться полной ортогональности аспектов содержания и представления в документах с учетом их правильного структурирования (семантической корректности).
Сори, все таки является версткой. Вот статья небольшая...Сейчас принято представлять все декоративное оформление сайта исключительно с помощью CSS. Поэтому двумерная модель, подразумевающая тупое разрезание графического макета сайта (с помощью инструмента Slice Tool в Adobe Photoshop) на кучу разных мелких «прямоугольников» с их последующей вставкой во множество табличных ячеек, является не более чем пережитком прошлого. Каскадные таблицы стилей позволяют свободно позиционировать элементы веб-страниц не только в двух измерениях, но также и в третьем измерении (посредством их наложения друг на друга). Подобный подход позволяет добиться полной ортогональности аспектов содержания и представления в документах с учетом их правильного структурирования (семантической корректности).
"CSS-вёрсткаДо появления CSS оформление веб-страниц осуществлялось непосредственно внутри содержимого документа. Однако с появлением CSS стало возможным принципиальное разделение содержания и представления документа. За счёт этого нововведения стало возможным лёгкое применение единого стиля оформления для массы схожих документов, а также быстрое изменение этого оформления.
Преимущества CSS вёрстки:
- Несколько дизайнов страницы для разных устройств просмотра. Например, на экране дизайн будет рассчитан на большую ширину, во время печати меню не будет выводиться, а на [Только зарегистрированные пользователи могут видеть ссылки. ] и сотовом телефоне меню будет следовать за содержимым.
- Уменьшение времени загрузки страниц сайта за счет переноса правил представления данных в отдельный CSS-файл. В этом случае браузер загружает только структуру документа и данные, хранимые на странице, а представление этих данных загружается браузером только один раз и [Только зарегистрированные пользователи могут видеть ссылки. ].
- Простота последующего изменения дизайна. Не нужно править каждую страницу, а лишь изменить CSS-файл.
- Дополнительные возможности оформления. Например, с помощью CSS-вёрстки можно сделать блок текста, который остальной текст будет обтекать (например для меню) или сделать так, чтобы меню было всегда видно при прокрутке страницы."
Про таблицы я у вас начитался. Они мне уже снятся )Сейчас принято представлять все декоративное оформление сайта исключительно с помощью CSS. Поэтому двумерная модель, подразумевающая тупое разрезание графического макета сайта (с помощью инструмента Slice Tool в Adobe Photoshop) на кучу разных мелких «прямоугольников» с их последующей вставкой во множество табличных ячеек, является не более чем пережитком прошлого. Каскадные таблицы стилей позволяют свободно позиционировать элементы веб-страниц не только в двух измерениях, но также и в третьем измерении (посредством их наложения друг на друга). Подобный подход позволяет добиться полной ортогональности аспектов содержания и представления в документах с учетом их правильного структурирования (семантической корректности).
А по поводу "третьего измерения" - вы лукавите, нету там его, видимость одна ) Реальное 3Д разве что яваскриптами можно закодить.
Под нарезкой я имел в виду лишь создание изображений с помощью слайсов, но никак не использование табличной вёрстки. Разве слайсы мешают создавать "трёхмерную" вёрстку? Скрыл лишние слои - сохранил фрагмент. Затем другие слои скрыл - снова сохранил. Вот тебе и готовые "измерения" для оформления сайта средствами CSS.
Я просто подумал, что современные умы могли сочинить более прогрессивные средства для нарезки.
Чем дальше в лес, тем больше дров)
Смею заверить Вас, что на самом деле «табличной верстки», «блочной верстки», «СSS-верстки», «дивной верстки» и т.п. НЕ СУЩЕСТВУЕТ. Существует так называемая семантическая верстка и говнокод. Если Вы будете продолжать заниматься этим направлением деятельности и все больше углубляться в детали, со временем Вы это обязательно поймете.Версткой на данный момент является табличная и блочная...
Собственно говоря, об этом речь и шла.Преимущества CSS вёрстки
Это Вы немного не в ту степь. Речь шла о свободном позиционировании элементов не только в двумерном пространстве, но и с помощью CSS-свойства [Только зарегистрированные пользователи могут видеть ссылки. ], которое являет собой самое что ни на есть третье измерение.А по поводу "третьего измерения" - вы лукавите, нету там его, видимость одна ) Реальное 3Д разве что яваскриптами можно закодить.
Нет, не мешают. Тем не менее, во-первых, они просто для этого не требуются. А во-вторых, они мешают полностью абстрагироваться от старых понятий двумерности – поменять сложившиеся стереотипы (старое «визуальное мышление») на новый ортогональный стиль разметки.Разве слайсы мешают создавать "трёхмерную" вёрстку?
Как вы нарезаете psd-макеты? Если слово "нарезка" вам не по душе, назовём это подготовкой картинок для вёрстки, например.
Тут дело не в том, что мне «по душе», а что – нет. Просто сам термин «нарезка» в первую очередь ассоциируется с инструментом «Slice Tool» (обратите внимание на соответствующую иконку в Adobe Potoshop – это ни что иное как нож). Как следствие, я просто не вижу никакого смысла употреблять в устной и письменной речи всякие архаизмы, зачастую попросту сбивающие начинающих веб-разработчиков с толку.Как вы нарезаете psd-макеты? Если слово "нарезка" вам не по душе, назовём это подготовкой картинок для вёрстки, например.
Жжоте )) Вы предлагаете забраковать вполне подходящее под этот вид деятельности название, но не предлагаете другого, такого же ёмкого и короткого термина. Причём бракуете вы его, основываясь на иконке фотошопа )Тут дело не в том, что мне «по душе», а что – нет. Просто сам термин «нарезка» в первую очередь ассоциируется с инструментом «Slice Tool» (обратите внимание на соответствующую иконку в Adobe Potoshop – это ни что иное как нож). Как следствие, я просто не вижу никакого смысла употреблять в устной и письменной речи всякие архаизмы, зачастую попросту сбивающие начинающих веб-разработчиков с толку.
Нарезка - слово понятное и очень широко используемое. Используемое именно для описания действия, "расщепляющего" psd-макет на составные части для дальнейшего сбора страницы при html-вёрстке. Давайте забудем о нарезке в области веб-дизайна и обратимся к значению этого слова в повседневной жизни. Что это, как не деление чего-то большого на несколько маленьких частей. Так же происходит и с дизайном, который мы делим на уголочки, иконки, шапку, подвальчик, всякие закорючки и фончики. А вопрос ассоциаций "нарезки" с инструментом "Slice Tool" уж больно субъективен, чтобы на основании его браковать удобный термин.
Как бы то ни было, на мой вопрос вы не ответили. Как вы режете (подготавливаете, раскладываете) макет для вёрстки? Если не слайсами, то чем?
Не знаю, где Вы увидели, чтобы я что-то кому-то тут предлагал. Вы поинтересовались моим мнением – я Вам свое мнение вполне внятно изложил. Вы же, в свою очередь, вправе называть вещи так, как Вам только будет угодно.Жжоте )) Вы предлагаете забраковать вполне подходящее под этот вид деятельности название, но не предлагаете другого, такого же ёмкого и короткого термина.
На самом деле дело не только в иконке. По моему скромному мнению сама концепция слайсов подталкивает разработчиков к восприятию графического макета как к некоему набору прямоугольных областей, которые прямо напрашиваются на то, чтобы их впоследствии запихнули в говнотабличные говноячейки. Происходит это оттого, что принцип слайсов основывается на их «прилипании» друг к другу, что, в свою очередь, мешает мысленно отделить смысловую графику от декоративного оформления. С другой стороны, семантическая верстка совершенно не требует такого «прилипания». Рекомендую также обратить внимание на [Только зарегистрированные пользователи могут видеть ссылки. ]. Посмотрите предложенный макет и скажите, в каком там месте можно что-то порезать с помощью слайсов?)Причём бракуете вы его, основываясь на иконке фотошопа )
К сожалению, как я смог в очередной раз заметить, объяснять на пальцах все эти прописные истины – дело пустое и неблагодарное...
Простите великодушно, что не ответил сразу. Исправляю это досадное недоразумение:Как бы то ни было, на мой вопрос вы не ответили. Как вы режете (подготавливаете, раскладываете) макет для вёрстки? Если не слайсами, то чем?
1. Выделяю выборочные фрагменты графического макета с помощью инструмента Rectangular Marquee Tool.
2. Копирую полученное содержимое в буфер обмена Windows.
3. Создаю новый графический файл, вставляю в него содержимое буфера обмена.
4. При необходимости модифицирую полученный результат (корректировка размеров фоновых изображений, заготовки для CSS-спрайтов и т.п.)
5. Сохраняю полученный результат в наиболее подходящем формате с наиболее оптимальным соотношением размер/качество.
6. Если на выходе получен PNG-файл, очищаю его от информации о гамме с помощью PNGOUT.
P.S.
Скажите честно, Вы хорошо ознакомились с такими понятиями как «разделение структуры и представления», «семантическая верстка» и «отличие смысловой графики от декоративного оформления»? Если не совсем хорошо, Вам будет очень сложно понять, почему использование слайсов на сегодняшний день – есть вещь совершенно ненужная.
Совсем не обязательно использовать свойство прилипания у слайсов. И не обязательно сразу обозначать все фрагменты, можно постепенно. По сути "мой" метод нарезки при помощи них на выходе выдаёт такой же результат, как у вас. Я также, как и вы, вырезаю каждый фрагмент отдельно, просто использую не буфер обмена + новый файл, а слайсы. При подготовке нескольких схожих элементов количество действий получится даже меньше, чем при копировании каждого элемента отдельно. Например, при создании нескольких уголков одной панельки, графического меню и т.п.
Макет фригера, конечно, навороченный, но слайсам подвластно всё ) Хоть и долго это будет...
К счастью, я вас понял. Тут уж, как рука набита, ибо заметного преимущества в вашем методе я не заметил, как впрочем и в "моём".
Хорошо ознакомился ) Раньше я не знал лишь о принципах семантической вёрстки и микроформатах.Скажите честно, Вы хорошо ознакомились с такими понятиями как «разделение структуры и представления», «семантическая верстка» и «отличие смысловой графики от декоративного оформления»? Если не совсем хорошо, Вам будет очень сложно понять, почему использование слайсов на сегодняшний день – есть вещь совершенно ненужная.
Вот она – истина. АминьХоть и долго это будет...
Кстати, хороший вывод из нашей дискуссии: слайсы хороши при подготовке нескольких схожих элементов, а буфер - при нарезке макетов с многоуровневой графикой. Слово "нарезка" заменить по вкусуВот она – истина. Аминь
Вот теперь аминь )
Okey, давайте будем думать не только о себе, но и о начинающих веб-разработчиках. В частности, к чему была вся эта полемика? К тому, что во многих «неокрепших умах» запросто может поселиться идея о том, что нарезка = слайсы -> Image Ready -> Save Optimazed As HTML and Images = очередной говнотабличный говнокод.
Я очень рад (искренне), что у Вас получается использовать слайсы разумно. Даже не смотря на то, что, как Вы сами и заметили, иногда это бывает «довольно долго» => неоптимально. Но не все же такие грамотные, как Вы?) Т.е. для подавляющего большинства начинающих разработчиков использование слайсов означает (к сожалению) именно описанную чуть выше последовательность действий... Вот что удручает.
Да ладно вам удручаться. Всё ведь отлично, на самом деле )Okey, давайте будем думать не только о себе, но и о начинающих веб-разработчиках. В частности, к чему была вся эта полемика? К тому, что во многих «неокрепших умах» запросто может поселиться идея о том, что нарезка = слайсы -> Image Ready -> Save Optimazed As HTML and Images = очередной говнотабличный говнокод.
Я очень рад (искренне), что у Вас получается использовать слайсы разумно. Даже не смотря на то, что, как Вы сами и заметили, иногда это бывает «довольно долго» => неоптимально. Но не все же такие грамотные, как Вы?) Т.е. для подавляющего большинства начинающих разработчиков использование слайсов означает (к сожалению) именно описанную чуть выше последовательность действий... Вот что удручает.
По поводу неокрепших умов: мы с вами в этой теме, как раз, всё подробненько обсудили. И даже вывод сделали
Кто хочет учиться - научится. А остальным вы ничем не поможете, как бы ни хотелось.
Ваши права
