====== Вёрстка ====== ===== HTML5 ===== * [[http://diveinto.html5doctor.com/|Dive Into HTML5]] ===== CSS3 ===== * http://css3please.com/ * http://paulirish.com/2012/box-sizing-border-box-ftw/ ===== Софт ===== * [[http://rmcreative.ru/blog/post/nabor-dlja-testirovanija-vjorstki|Идеальный набор для тестирования вёрстки]]: IE6, IE7, IE8, Firefox, Safari, Opera, Chrome. Все виртуализированы и могут работать параллельно. * [[http://firebug.ru/|FireBug]] * [[https://addons.mozilla.org/en-US/firefox/addon/60|Web Developer Toolbar]] * [[http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&displaylang=en|http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&displaylang=en]] (IE) * [[http://dev.opera.com/articles/view/introduction-to-opera-dragonfly/|Dragonfly]] (Opera) ===== Оптимизация графики ===== * [[http://www.phpied.com/image-optimization-7-mistakes/|Image optimization - 7 mistakes]] ===== Полезные онлайн-инструменты ===== * [[http://csstemplater.com/|CSS Layout Generator (Dimox)]] * [[http://www.nealgrosskopf.com/tech/resources/80/|Nth-Child Visual Calculator]] ===== Фреймворки ==== * [[http://css-framework.ru/|css-framework]] * [[http://www.designinfluences.com/fluid960gs/|Fluid 960 Grid System]] * [[http://www.1kbgrid.com/|The 1KB CSS Grid]] ===== Полезные знания ===== * [[http://cssing.org.ua/2005/06/09/css-selectors-weight/|Вес селекторов в CSS]] ===== Приёмы ===== * [[http://vitaly.harisov.name/article/independent-blocks.html|Вёрстка независимыми блоками]] * [[http://rmcreative.ru/blog/post/podkljuchenie-stilja-tolko-dlja-safari|Отдельные файлы для Opera, Safari при помощи @media]] * Отдельный файл для Opera можно подключить как type="opera/css". * Элементы с float лезут за пределы блока — overflow: hidden; zoom: 1 и [[http://rotorweb.ru/mysli-vslux/saying-goodbye-overflow-hidden.html|более человечные методы]] * [[http://www.webmagazine.biz/articles/krossplatformennyj-sposob-perenosa-teksta-code-pre.html|Кроссбраузерный способ переноса строк в code и pre]] * [[http://rmcreative.ru/blog/post/displayinline-block-dlja-vsekh-brauzerov|display:inline-block для всех браузеров]] * [[http://www.cssstickyfooter.com/|Прилепленный к низу футер]] и [[http://habrahabr.ru/blogs/css/67493/|ещё один]] * [[http://habrahabr.ru/blogs/webdev/60665/|Заменяем стандартный элемент input file]] * [[http://sreznikov.blogspot.com/2009/08/1px-rounded-corners.html|Однопиксельные прозрачные уголки]] * [[http://blog.sribna.com/ukrashaem-input-s-pomoschyu-css-prodolzhenie.htm|Украшаем input с помощью CSS]] ===== Боремся с IE ===== * [[http://www.quirksmode.org/css/condcom.html|Условные комментарии]] * [[http://rmcreative.ru/blog/post/whateverhover-v3|hover]] ===== Покажите это дизайнеру ===== * [[http://rmcreative.ru/playground/for-designers/|Веб-дизайнеру на заметку]] ===== Сводные таблички ===== * [[http://www.quirksmode.org/css/contents.html|Совместимость браузеров с селекторами и свойствами CSS]] * [[http://www.campaignmonitor.com/css/|Вёрстка для почтовых клиентов]] * [[http://www.ejeliot.com/samples/clearing/rule-support.html|Очистка float у блоков]]