25 сентября 2011, 22:36

Скоростная вёрстка

Вот как надо верстать.

Берём макет, открываем и сразу сохраняем его через Save for web (само название этого окошка как бы намекает):
Скоростная вёрстка

Вставляем картинку в код:
Скоростная вёрстка

Сайт уже почти готов, осталось добавить немного навигации, для это как раз есть чудо-теги map и area:
Скоростная вёрстка

Тадам! Cайт готов, можно даже по страничкам походить и от копипаста защитились, это же важно.
Скоростная вёрстка
Поделиться
15 комментариев
cinic
Это стёб такой? :)
olegsmith.com
Главное — гугль все проиндексирует!
Дима Сухачёв
Хех, Тём, вот на заре моего увлечения сайтами, когда я только начинал изучать хтмл и не умел нарезать картинки, делал именно так :-) С одной стороны это смешно. Но, с другой стороны, это решение ложится прямо в метод прогрессивного джипега, и даже во Flex Scope укладывается хорошо. Ведь такой наспех замапеный сайт уже будет работать, пока в это время его верстают по-человечески.
Андрей Гурылёв
Скоростная — если бы этого слова не было в заголовке, я бы смеялся. Однако, действительно скоростная вёрстка. На столько скоростной ещё не придумали, пожалуй. Патентуй запатентованное, Артём ;-)
Кстати, да, я тоже, когда начинал, верстал именно так. А сейчас как зайду на те сайты, сразу тянусь переделать. Но не обратишься же к клиенту «Простите меня, пожалуйста, я сделал вам полную хуйню. Хотите мне заплатить, чтобы я сделал хорошо и современно?» Неувязочка.
Кстати, Артём подобрал не лучший вариант. Здесь небольшой скроллер галереи, он не будет работать при такой вёрстке. То же относится к строке ввода.

Мы все слишком серьёзные, да? х)
Артём Поликарпов
А почему скролер не будет работать? Поиск не будет, а скролер очень даже будет, ну может без анимации :-)
Александр Типугин
Главное доктайп пацанский
Андрей Гурылёв
В смысле на каждый кадр по странице? >< Даже дрожь пробирает от этой мысли)
Алексей
Какой сочный вброс, вау!
А самое смешное, что этот способ иногда оправдан. Заглушку так по-быстрому заебацать самое оно, например.
Артур Пайкин
Для прототипов это идеальный вариант, спаисбо за идею!
Игорь Алексеенко
Прекрасно! А чтобы этот сайт еще и тянулся или пишем картинке width=«100%» или ставим ее бэкграундом и ставим background-size: 100% auto;
Артём Поликарпов
Погоди, а с width=100% <map> дружит?
Игорь Алексеенко
Нет, не дружит.
Игорь Алексеенко
Вообще я думал, что это шутка. Не?
Артём Поликарпов
Не без доли шутки :-)
Артём Самохин
А в Windows 7 делать скриншоты как на Mac можно?
Артём Поликарпов
В интернетах пишут, что отдельное окно захватывается с помощью PrtSc+Alt. Картинка попадает в буфер обмена (на маке сразу на рабочий стол), т. е. нужно ещё потом в Пейнт или Фотошоп вставить. И без тенюшек, конечно.
Артём Самохин
Сработало! Без теней :((.
Артём Самохин
Спасибо :)).
Антон
И во всех браузерах одинаково смотрится, можно использовать любые шрифты
Популярное