klierik

Им все равно. Они читают код каким он есть. Если в шапке нет ничего вадного, пусть лежит перед </body>

ссылку на сайт

Если разговор идет про зоопарк то -- да. На выходе тот же перечень вариантов. Но в рамках использования проще.

1. Мне кажется тут: a.buttn:hover { background-position: 0 -28px; text-decoration: none; } Правильнее использовать -27px, ибо высота объекта 27px и при :hover низ кнопки обрезан. 2. Почитай для чего были придуманы ID и Class. Рационально - использовать Class. Завязки стилей на ID бывает очень-очень редким исключением. 3. Пресс-центр Тег <P> создан что бы описывать тип данных Абзац. Я сомневаюсь что абзац может состоять из одного слова. 4. <a href="#">New<br />Logo</a> такие теги как <br /> в разметке появляются для форматирования контент (пользователь ввел текст через редактор ВИЗИВИГ). Верстальщик же должен избегать их. Не проблема написать: margin-bottom: высота_строки; остальное рассматривать не вижу смысла на данном этапе. ошибок много.

как же он может отступить, если значение отрицательное?

Возьму на заметку. Спасибо.

Я не помню где какая картинка была использованна, потому что эти данные всегда присутствуют в сорасах: Типичная ситуация: background: url(../images/blocks/twist/controls.png) 0 50% no-repeat; background-image: url(data:image/png;base64, ... ); В таком случае при надобности всегда известно что править А те кто не умеют читать base64, загрузят картинку. Очень важный факт который тут стоить зацепить - конечный вес стилей. Его нельзя сбрасывать со счетов. Но есть обратная сторона вопроса - есть ли смысл заморачиватся изза пары десятков килобайт? А на этот вопрос отвечает уже заказчик в рамках ТЗ для Оптимизации ресурса А вот с градиентами я сейчас использую другой путь: https://github.com/twitter/bootstrap/blob/master/less/mixins.less Раздел // Gradients Все современные браузеры уже отрисуют что надо. А вот с тем же ИЕ8 можно справится, подставив в фон просто картинку. Быстро и удобно (в рамках моего режимо разработки). Хотя данный подход сейчас скорее експерементальный, и, как раз, проходит в рамках создания крупного проекта, но пока что все идет отлично. Ближе к концу ситуация будет более прозрачна и понятна достоен ли данный подход на жизнь. Внести изменения в данном случае просто.

В основном все картинки, которые приходится вставлять в качесте фона, я прописываю как URL и так же дублиую как Base64. А дайте-ка хоть ссылочку на то что умеет в ST2 из картинки создать base64. [update] Encode/Decode Image to data:URL Под Mac комбинация: Ctrl + Shift + D

А что в этом плохого? А я и не говорил что это плохо. Я рекомендовал делать так.

1. Скрипты перед закрывающим </body> 2. Избранное <span>0</span> Тут надо не <p> а <div>, ибо это не абзац. Таких ошибок много. 3. <h4>Навигатор Prology iMAP-400M</h4> <a href="#"><img src="img/item.png" alt="Новинка-1" /></a> <br /> <span>1440 руб.</span> А вот тут без <br />. Данный тег, как правило, используется в контенте. К примеру когда пользователь набирает текст через ВИЗИВИГ. 4. Категории товаров должен я бы поместил в список, ибо это список товаров. 5. Не хорошо класть <figure> внутрь тега <a>, так как <figure> - это блочный тип данных, а <a> строчный. 6. <div class="reccomend"> <h2>Мы рекомендуем</h2> <ul class="list-one"> <li><a href="#">Пенный очиститель стекол LEDO 400 мл (LD-02)</a></li> <li><a href="#">Размораживатель стекол LEDO 500 мл (LD-21)</a></li> <li><a href="#">Шампунь автомобильный Silver 500 мл (HB0046))</a></li> </ul> <ul class="list-two"> <li><a href="#">Пенный очиститель стекол LEDO 400 мл (LD-02)</a></li> <li><a href="#">Размораживатель стекол LEDO 500 мл (LD-21)</a></li> <li><a href="#">Шампунь автомобильный Silver 500 мл (HB0046))</a></li> </ul> </div> Тут можно было обойтись одним списком. Не вижу причин что бы разделять их на два. 7. Я могу ошибатся, но согласно HTML 5 в коде ожидается встретить только один раз тег <nav> - и это должна быть главная навигация по сайту. Но я могу ошибатся по данному вопросу.

С iMac 27 не потаскаешься Он то харош многим, но это стационарник все жж ( А мне то бы и домой, и на работу, и вообще куда захочу.

Скорее всего это связанно с ОС. Возможно у тебя Windows7 и выключенно сглаживание шрифтов (хотя тогда и ИЕ не должен был бы сглаживать их). А еще можно почитать статью Свойства CSS, влияющие на рендеринг шрифта

думается мне что проблема на твоем компьютере со сглаживанием, ибо: Chrome, Mac

А кто его знает? Когда будет +2 монитора тогда и буду думать. Самая простая реализация (в случае если из коробки не поедет) это поставить USB внешнюю видеокарту. Но я более чем уверен что я не первый кто про это подумал, то что опыт за бугром и у нас в гугле должен быть. Ну и я так же не собираюсь пока такую мультимониторную систему создавать. В начале куплю MacBook а там и все остальное. В идеале, на данный момент мне кажется так пары 23"-24" манитора по бокам 15" ноутбука должно быть самое оно. Или же ноутбук использовать только в рамках вычислительнх мощностей. В таком случае 3и монитора из серии Dell U2413 ну совсем было бы замечательно )

1. IDE + Editor 2. Browser 3. Image Editor У меня даже Chrome открыт в 2 окна на 2 монитора, ибо нехватает. PS: в качестве одного из мониторов роль играет ноутбук.

а можно ссылочку, очень хочется увидеть вживую.

интересно. надо будет взглянуть )

правда ) так и есть. это - http://www.adobe.com/ru/products/creativecloud.html ?

В идеале именно так. А в жизни в макетах дизайнеры пишут как им виднее. Не всегда по сетке выглядит хорошо. Очень часто в макетах, даже если присутствует сетка, контент по ней не расположен. Как горизонтально так и вертикально. Вертикальные отступы могут 5/10/15/20, а могут быть 13/16/18. Раздражает неимоверно. А пренебрегать этими ньюансами нельзя. Данные несоответствия не имею привязку к какой-то стране -- так , в основном, везде. Что СНГ что Европа, США, Австралия. Даже на сегодняшний день модульная сетка в макете это редкость.

В ST2 нет Magicento Это для меня важно. Только что попробовал открыть проект дважы - неполучилось. Никакая программа не сможет отворматировать CSS так, что бы учитывалась иерархия вложеностей. Тут только сапописное. Я описываю CSS таким образом, что бы смотря на него я мог в голове создать HTML структуру, не открывая темплейт. Это нереально удобно ) Так мы говорим о предпочтениях в рамках диалога а не спора Вертикальные отступы тут предугадать никак. По горизонтале сетка делается один раз, естесвтенно. Но теже Загловки, перечни разнотипных блоков которые имеют разные дизайны, могут иметь и имеют свои ньюансы в размерах шрифтов, полях, отступах. Лично я не могу проследить на глаз такие ньюансы ( Спасает плагин. Меня это Бесит! Так же как и сетка 26/75/12 с которой сейчас работаю *WALL* Никаких обид ) Тут дело разнице требований к верстке со стороны заказчика.

Переехал на LESS после того как внедрили BootStrap. Взял обычный кусок стилей (в примере очень маленькая конструкция): /* @group Sorter */ .sorter { } /* view mode */ .sorter > .view-mode { } /* sort by */ .sorter > .sort-by { } .sorter > .sort-by > label { } .sorter > .sort-by > select { } .sorter > .sort-by > a { } .sorter > .sort-by > a > img { } .sorter .link-feed {} /* @end */ переписал на Less /* @group Sorter */ .sorter { /* view mode */ .view-mode {} /* sort by */ > .sort-by { > label {} > select {} > a { > img {} } } > .link-feed {} } /* @end */ Парсер съел всю красоту форматирования кода и выглядит он как УГ. Но примеры можно посмотреть на Less/Sass/Scss сайтах. Перестал писать на чистом CSS. Да и файликов у меня ну мало в проектах. И переменные спасают на ура. И миксины тоже. ПОменял водном месте - изменилось везде. Шикарно то как БЭМ люболю много лет. ZenCoding использую и в HTML и в CSS.

Плагин Magicento под PhpStorm Открыть один и тот же проект дважды

Даннй пост является продолженнием начатого диалога из темы Интрументы для разработчика На момент написания этого поста разговор ведется об удобстве пользования средой разработки и соответствии дизайну. Принимайте участие Так можно же запустить еще одну версию программы. Но тут дело вкуса и удобства. Это твой вариант. Все что не на Apple - это хакинтош. ИМХО. (и ИМХО самой компании Apple и over 9000 юристов) Я замеряю все отступы при нарезке макета. Да и если дизайн сделан по сетке, то глаз не подводит. И предпочитаю ставить все размеры отступов в относительных единицах. (горизонтальные в процентах, а вертикальные в em'ах). А попиксельное соответствие считаю глупым капризом заказчика/дизайнер. Думаю что дизайнер и верстальщик это должно быть одно лицо(но тут может загореться жестокий спор), чтобы не было ситуации аля "у меня на макете не так" или "я не буду это делать". Сомневаюсь что можно дважды открыть один и тот же проект в PhpStorm. Да и он отлично работает с разметкой, но он такой медленный. Я всегда отталкивался от того, что конкретное приложение должно идеально выполнять поставленную задачу. По-этому у меня всегда было 2 редактора для HTML/CSS. Я ниразу не встречал такого редактора, в котором, личном мне, было бы писать html коди стили одновременно. Всегда что-то хромает. Особенно это касается удобств форматирования кода. Кода разработка велась под Windows, то я использовал Dreamweaver и TopStyle. Под Ubuntu тоже что-то было. Под OSX PHPStorm + ST2. В данном конкретном случае в PhpStorm есть Magicento и они в сумме для моей сферы разработки работают на отлично. Но писать CSS в Phpstorm это ужас. Ну не удобен он в форматировании стилей. Уж лучще CSSEdit (им я пользовался до ST2). Кстати, ST2, в свою очередь мне нравится тем, что он очень шустрый. Работать с ним очень приятно. Его расширяемость так же поражает. Однажды настроил его под свои нужды и пользуюсь по сей день. Что же касается PixelPerfect то я им пользуюсь много лет. Таким образом я использую всю тех. информацию которая представлена в макете, для описания физических характеристик. А вот соответствие макету оставляю на плечи плагину. Я зачастую могу заметить несоответсвие дизайну даже на 1пк, но ведь не всегда же. Всегда можно что-то упустить, особенно если макет сдержит огромное множество мелких деталий (иконок, градиентов, линий, прочее). Можно ошибится в размере шрифта (я не проверяю размер каждого шрифта в макете ибо считаю это избыточным). PixelPerfect в данном случае это вспомогательныэ инструмент, который позволяет очень существеннно секономить время, подогнать элемент под дизайн "на лету" средствами разработчика и правильное значение внести в стили. Его можно считать "руководством по допущеным ошибкам" для разработчика. Тут сразу два бонуса: 1) перепроверить не упустил/забыл ли что-то; 2) проверить и подонать результат под дизайн Да и задачи у нас стоят в рамках -- Максимальное соответствие макету, ибо исполняемые проекты дорогостоющие.

если требуется положить текст на тень то ичего не мешает контент положить в div (а он сокрее всего и так там будет лежать) и этому же диву задвать отрицательные отступы .content { margin: -15px; }

Потому что у меня открыто допустим 10-20 HTML шаблонов и 20 - 30 Less файлов. Мне они в рамках одной среды разработки вообще не нужны ибо это не удобно. В итоге для каждого дела свой самый удобный редактор. Каждый из них на отдельном мониторе что позволяет одновременно видеть и HTML и CSS -- а это очень-очень удобно! По поводу "ST2 - не IDE" согласен. Тут скорее дело привычки так обзывать. У меня поднята Mac OS X 10.6.8 retail версия. А это говорит о том что это самая полноценная OSX без вмешательств. А под моё железо установлены только драйвера. Так что не смотря на то что Хакитош назвать корректнее, но тоже не совсем правильно, ибо сама ОС совершенно без изменений. В общем тут кому как ) А что значит просто так? Я кладу дизайн поверх и при определенном разрешении у меня все совпадает 1:1 (в рамках разумного). А как ты проверяешь соответствие дизайну? На глаз? Главная задача данного плагина показать разработчику есть ли и в чем она разница между страницей и дизайном. А для адаптивности существует свой дазийн со своими изменениями, которые так же вносятся в рамках соответствующих правил. Это очень полезный инструмент, если уметь им пользоватся. Под FireFox аналог -- PixelPerfect