верстка страниц (для новичков) - очень быстрый способ

здесь я не буду писать почему верстать нужно блочно, и в каких случаях имеет смысл верстать таблицей. об этом позже.
многие начинающие сайтостроители задаются вопросом: Как сверстать свой мега супер сайт? то-есть вот придумали Вы картинку, нарисовали её (в Фотошопе,Флеше, Пэйнте) а дальше..как её представить элементарно в html ?
Оно вроде и понятно, мол разрезать на картинки и дальше в блокноте или любом WYSWYG редакторе (Dream Weaver,HtmlPad FisherMan - эти две имхо делают наименьшее количество ненужного мусора)
но ведь как получается..то шапка сдвинется на пиксель вниз..то еще чего. и когда новичок начинает это все делать...получаются какие-то лишние пробелы..или наложения.
можно ли этого всего избежать, если вы к примеру знаете в чем проблема, но вам просто лень разбираться.
Да, есть решение в таком мутном способе :-D
об этом позаботилась компания Adobe разработав свой Photoshop
к примеру мы вставляем картинку (которую нам нужно сверстать в хтмл) а Фотошоп
и разбиваем её на Slice Tool(K) - тоесть указываем на какие кусочки разбить наши будущие гифки или пнг или джепеги.
у меня полилось вот так:

дальше просто делаем File-Jump To Image Ready
нам покажет свой дружелюбный интерфейс это чудо программа
дальше здесь можно колдовать (Output Settings - HTML...) - генерировать верстку таблицами или CSS (по ID или по классам) ...
и в конце выбрать Save Optimized As - HTML AND IMAGES
в итоге у нас получилось самая быстрая верстка.
конечно в целях экономии трафика и времени загрузки рекомендуется сохранять все как для WEB (save for web).
так же таким способом как Вы сами видите у нас абсолютно все сохранится как картинки.
естественно это не очень хорошо....но, наша цель то ведь была просто сверстать, так что бы ничего друг на друга не наезжало..(когда картинка достаточно сложная бывает трудно сходу в блокноте её сверстать без потери дизайнерского смысла)
остальное (сделать все картинки фоном а по ним сверху текст и все их атрибуты вынести в отдельный *.css файл) мы с Вами и ручками сможем сделать ;-)

Submitted byЕгорка (не проверено)on июля 6, 2007 - 01:53

Вот это интересно...

Submitted byburnison июля 6, 2007 - 01:57

Ответ на от Егорка (не проверено)

надеюсь что еще и полезным кому-то окажется

Submitted byАня (не проверено)on января 8, 2008 - 15:28

Ответ на от burnis

очень хочу научиться,но понимаю,что ничего не понимаю из всего,что прочитала)

Submitted byанонимус (не проверено)on марта 31, 2008 - 11:40

А с точки зрения производительно оно как?

Submitted byburnison апреля 22, 2008 - 23:15

Ответ на от анонимус (не проверено)

работать оно будет.

и причем будет валидным.

только это все будет сделано с "фикированным" позиционированием.

резину тут уже не сделать да и вообще много поводов задумать.

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

Там Иван пишет дейсвтительно информативные для новичкоф вещи и повод задуматься для уже матерых....

Лушче о верстке столько инфы на русском я не видел еще.

Если кто-то может дать путевые линки, то буду рад. 

Добавить комментарий

Содержимое данного поля является приватным и не предназначено для показа.

Filtered HTML

  • Допустимые HTML-теги: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type='1 A I'> <li> <dl> <dt> <dd> <h2 id='jump-*'> <h3 id> <h4 id> <h5 id> <h6 id>
  • Строки и абзацы переносятся автоматически.
  • Адреса веб-страниц и email-адреса преобразовываются в ссылки автоматически.