Блог 5 советов верстальщику

Перехватываю эстафету советов верстальщику  и предлагаю свои 5 пунктов, которые могут быть кому то полезными. Довольно много верстальщиков поддержали эту идею и делились своими мыслями. Надеюсь, что не повторился. Итак, мои 5 советов по html/css верстке сайтов.

  1. Если ты уделяешь верстке 1 час в день — не жди успеха. Если за версткой ты не замечаешь как летит время, можешь работать целый день и это приносит удовольствие — значит ты верстальщик-фанатик, и со временем ты сможешь верстать как твои кумиры.
  2. Не останавливайся на достигнутом! Читай больше статей про html/css верстку. Броди по блогам верстальщиков, там можно найти много новой и полезной для себя информации. Все знать ты не можешь.
  3. Собирай и структурируй свою библиотеку решений по верстке и создавай свои фреймворки. Это поможет сэкономить много времени при верстке.
  4. Таблицы используй только для вывода табличных данных. Не слушай тех, кто говорит, что таблицами верстать быстрее и надежнее. Это говорят ленивые верстальщики, которые выучили 5 лет назад табличную верстку (тогда она была актуальной), а сейчас не хотят переучиваться. Грамотная блочная верстка справится с макетами любой сложности!
  5. Не напрягай мозг, заучивая новые теги, приемы и технологии верстки. Не обязательно все помнить и держать в голове, важнее знать, где это найти в случае необходимости! Если ты будешь много верстать — все это само собой отложится в памяти.

Поделиться ссылкой на статью:

Предыдущая статья
Следующая статья

Комментарии

Волотко Дмитрий 27 мая 2008 года, 3:02 #

Здравые советы.

webmolot 27 мая 2008 года, 3:17 #

Рад, что тебе понравились )

Денис 15 июля 2008 года, 8:06 #

Не нашел контактов, поэтому пишу в комментарий.
Скажите, как с вами можно связаться? У меня есть вопрос по этому посту. Хотел спросить вашего разрешения на публикацию.

Если удобно — можете написать мне на e-mail, который “не публикуется”, но который я прилежно вписал. :)

webmolot 29 июля 2008 года, 5:28 #

Связаться со мной можно по:
ICQ: 446-086-927
e-mail: webmolot@gmail.com
или через форму заказа на сайте

vic 06 января 2009 года, 23:54 #

А как создаются эти самые фреймворки? Можно примерчик!
Спасибо!

webmolot 07 января 2009 года, 2:48 #

Например, перед вами стоит задача сверстать резиновый макет с 3-мя колонками, где боковые — фиксированные по ширине и тянутся вниз. Вы открываете этот фреймворк и начинаете работу. Завтра задача поменялась, колонки должны все тянуться пропорционально. Загружаете другой фреймворк.

Для каждой, даже самой несложной задачи можно создать свой фреймворк (заготовку), который ускорит работу по решению типовых задач.

Neroto 18 января 2009 года, 23:45 #

:))))) хорошо пишешь

Вадим 21 января 2009 года, 3:12 #

То есть, фреймуорк — это типа заготовленного шаблона?

webmolot 21 января 2009 года, 3:31 #

типа того

Макс 03 февраля 2009 года, 12:55 #

Не соглашусь с тем, что фреймворк — это «типа заготовленного шаблона». Моё мнение, фреймворк — это набор правил вёрстки, набор каких-то классов, которые включаются в каждую вёрстку, набор стандартных решений. Т.е. шаблон может быть частью фреймворка. Примеры фреймворков — blueprintcss, yui css.

webmolot 03 февраля 2009 года, 17:44 #

Думаю, не стоит спорить по этому вопросу. Приведу лучше определение из Википедии:
Framework — термин, имеющий размытое значение. Обычно используется в программировании, обозначая «простую концептуальную структуру, используемую для решения сложной, проблемной задачи». Значение этого термина существенно зависит от контекста его использования.

Вовка 08 февраля 2009 года, 14:34 #

блин ребята тут у вас прост кладяз инфы
огромнейшее спосибо за советы поклон до земли для мя как для начинающего оч важная инфа

Геннадий Селиверстов 10 октября 2009 года, 10:53 #

Супер,а теперь кто-нибудь просто обязан объяснить мне,что такое «верстка». =)

html шаблоны сайтов 23 ноября 2009 года, 20:50 #

По 4 пункту не согласен. иногда есть проекты где без таблиц ну никак. Ни один из готовых 3 column css layout не может себя корректно вести если его содержимое становится больше его самого. И никакие overflow:hidden не помогут. Остается 2 пути: или шаманить с яваскриптом или сделать за 1 минуту на таблице. Время — это деньги и соотвественно лучше выбрать более быстрое решение.

Achilles_sm 27 января 2010 года, 23:10 #

Прекрасно работает overflow:hidden… Таблицы — нах. Ты это написал, чтобы ссылку на свой сайт оставить? noindex надо в каментах поставить, чтобы вот такие ахтунги бесплатно не наживались…

Дмитрий 04 февраля 2010 года, 14:18 #

Полностью согласен! Нужно находить оптимальное решение для конкретной задачи. Можно и на таблицах сделать, и на блоках.

zoOm 15 февраля 2010 года, 12:35 #

Как говорили наши препода в универе, инженер — это не тот человек который все знает, а который знает где что можно найти :). Так и здесь!

Alex 10 марта 2010 года, 16:51 #

Спорить о том, как верстать, блоками или таблицами — все равно, что спорить, чем пользоваться при еде — вилкой или ложкой. Зависит от задачи. А пока будете спорить, кто-то всё съест палочками. ;)

Dmitriy 18 декабря 2010 года, 0:26 #

передай эстафету :)

GRean 11 февраля 2011 года, 18:50 #

По 4 пункту не соглашусь аналогично! С таблицей проще работать, чем с капризными дивами, хотя бы пропорции при масштабировании страницы сохраняются. Единственный минус таблиц- это ожидание загрузки всей таблицы, только потом вывод контента. Но это не так страшно, если правильно все организовывать. Я уж научился делать скелет сайта на таблицах, а вся мишура внутренняя на дивах. Да и к тому же css3 ни насколько от таблицы не ушел, хотя бы взглянуть на тот же grid. Профессионал, это тот, кто умеет применить найденное, а не тот кто знает где что найти(украсть, как характерно всем нам нашей нации).
А на счет верстки только на дивах, это уже переросло в религию.

webmolot 28 февраля 2011 года, 11:24 #

GRean, можете не соглашаться. Но если вас пугают капризные дивы, подумайте, может вы еще не научились ими управлять? Меня тоже пугают тигры в клетке, а кто-то их гладит, как котят :)

Олег 24 октября 2011 года, 17:08 #

Думал сегодня избавиться от табличного «костяка» и сверстать все полностью дивами…. Столкнулся с проблемой реализации структуры:
фиксированная центральная колонка ( например 987px ) и резиновые колонки по бокам. Думал сделать аналогично распространенной: боковые — фиксированные, центральная — резина, но ничего толком не вышло… Как определить проценты боковых блоков, если центральная часть — 987px?

webmolot 22 января 2012 года, 0:16 #

Олег, решение можете посмотреть здесь http://www.dynamicdrive.com/style/layouts/item/css-liquid-layout-36-fluid-fixed-fluid/

Bagira 24 мая 2012 года, 9:42 #

Я уже все это слышала.

Васек 31 октября 2013 года, 18:51 #

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

webmolot 04 ноября 2013 года, 17:07 #

Нету какого-то одного макета, по которому можно научиться верстать и решить все проблемы верстки. Совет один, верстайте побольше различных макетов, и проблемы обязательно вас найдут, а вам останется с ними справиться ;)

Мимо проходил 12 июля 2014 года, 2:55 #

Один небольшой комментарий — про «используйте таблицы для табличных данных» — не совсем верно. не надо фанатеть от таблиц, но и замыкаться на блоках тоже не надо — от задачи зависит, что будет лучше.
Ну и всегда можно изобразить из любых тегов табличку через display:table-*

Написать комментарий

Используйте в комментариях html-теги

ссылка — <a href=""> </a>
выделение — <strong> </strong>
удалённый текст — <del> </del>
цитата — <blockquote> </blockquote>
фрагмент кода html — <pre lang="html"> </pre>
фрагмент кода css — <pre lang="css"> </pre>

Подпишитесь!

Внимание! АКЦИЯ!

Вступите в группу Вконтакте и получите бесплатную консультацию по верстке. Расскажите друзьям про группу и получите 5% скидку на услуги Webmolot.com