Pull to refresh
0
0
Кирилл @Halfi

User

Send message

Почему лучше верстать в соответствии с БЭМ — практические примеры

Reading time5 min
Views61K
Про БЭМ (методология написания CSS от ЯндексБлок__Элемент_Модификатор ← наиболее правильная запись расшифровки) нынче можно услышать на каждом шагу. Дело оказалось благим и покатилось по миру. Яндекс даже полез в W3C (связано это или нет — не знаю, но надеюсь, что да — [на самом деле нет]).

Думаю многие, кто ещё не пробовал, но прочитал описание БЭМ, задаются справедливым вопросом: «какая практическая польза от всего этого действа?» На самом деле, не смотря на то самое развёрнутое описание, конкретно уловить основную «фишку» довольно сложно. Описано конечно много плюсов и общее ощущение от методологии положительное, и кажется, что вроде как и не плохо бы попробовать, но нехватает чего-то конкретного. Прямо вот примера на живом что ли. Вот у меня сайт, вот вёрстка не по БЭМ, почему я должен всё менять? Особенно, если учесть тот факт, что БЭМ в принципе отметает все селекторы кроме классов, неужто за это время столько умных мужей в W3C не осознали, что всё настолько неправильно?

За сим возьму на себя смелость привести несколько примеров с которыми вы (конечно если вы каким-то образом связаны с вёрсткой) сталкиваетесь, не побоюсь этого слова, ежедневно. И что изменится в таких ситуациях если бы вёрстка была изначально выполнена в БЭМ.
Читать дальше →
Total votes 87: ↑64 and ↓23+41
Comments285

Используем JPEG с прозрачностью

Reading time3 min
Views37K
Конечно же, формат JPEG не поддерживает прозрачность, но сама идея использовать JPEG вместо PNG для прозрачных текстур будоражит умы довольно давно. Камрад PaulZi не так давно предложил использовать для HTML формат SVG, в котором хранится само изображение и маска. Jim Studt предлагает использовать EXIF поля в JPEG и хранить там маски, а отображать на веб-странице с помощью Canvas.
Оба метода относительно сложны для использования, да и рассчитаны на веб, потому я остановился на самом простом варианте: хранить отдельно lossy JPEG для RGB и lossless маску в PNG, а совмещать их на этапе получения UIImage в программе. Сразу хочу сказать, что пишу на MonoTouch, потому код привожу на C#, хотя в ObjC это делается почти точно так же, с учетом синтаксиса.

Читать дальше →
Total votes 46: ↑42 and ↓4+38
Comments34

ХХ полезных советов для пользователей Git среднего уровня. Часть 2

Reading time4 min
Views25K
Это продолжение статьи ХХ полезных советов для пользователей Git среднего уровня

Про reset, незапланированно снова про альясы, про замечательный filter-branch, про мерджи и разрешение конфликтов с помощью rerere, про rebase (интерактивный и не очень) и, в завершение, про обслуживание своей гитницы.

Читать дальше →
Total votes 38: ↑32 and ↓6+26
Comments35

За что я люблю Yii+Twig: динамическое подключение нужных скриптов

Reading time2 min
Views25K
Навеяно вот этой статьёй.

Хотел бы показать, как работаю с ресурсами я и почему нахожу такой подход дьявольски удобным.
Читать дальше →
Total votes 22: ↑16 and ↓6+10
Comments28

Кастомизация radiobutton без JS

Reading time2 min
Views46K
Однажды, у меня возникла задача, сделать на форме сайта выбор одного из нескольких цветов. Казалось бы, нет ничего проще. Элемент radiobutton, как нельзя лучше, подходит для этой задачи, нужно только чуть-чуть его кастомизировать. Тут-то и начинаются проблемы. Дело в том, что отрисовкой элементов radiobutton и checkbutton управляет не браузер, а ОС. Соответственно, большинство свойств CSS (например, background-color) на них не действует.
Читать дальше →
Total votes 11: ↑6 and ↓5+1
Comments15

Уведомление о том, что браузер устарел

Reading time2 min
Views71K
ТизерОни уходят. Ещё вчера мы были вынуждены прикручивать очередной костыль для IE6/IE7, а сейчас в этом уже нет необходимости. В СНГ у IE6 сегодня всего 0.5% трафика, у IE7 — 1.8%. Они действительно уходят. Думаю, большинство верстальщиков давно уже не добивается попиксельного соответствия макету, а кто-то даже не проверяет на работоспособность сайтов в столь старых браузерах. В таком случае не будет лишним предупредить пользователя, что сайт может работать неправильно, и предложить обновиться. Предлагаю готовый комплект из панельки предупреждения и страницы с предложением выбрать новый браузер.
Читать дальше →
Total votes 73: ↑56 and ↓17+39
Comments81

Одновременно тянущиеся резиновые колонки

Reading time3 min
Views2K
Навеяно этим постом, где устраивающий автора ответ, судя по всему так и не нашли.

Не трогай мертвого


… пронеслась фраза у меня в голове, когда я взялся воротить этот простеиший макетик, дабы найти выход. Все-таки сейчас под старые версии IE практически никто не верстает. Часть этих ребят уверенна, что таким образом они делают неоценимый вклад в развитие веба, хотя сделать под IE6/7 проблем для них нет. Для других же просто удобно игнорировать «старый, никому не нужный браузер», ведь они никогда не умели под них верстать.
Читать дальше →
Total votes 16: ↑11 and ↓5+6
Comments11

Интеграция web приложений с соц сетями или «проставляем лайки»

Reading time3 min
Views16K
Что требовалось: добавить кнопки facebook'а и twitter'а на большинство
разделов приложения.
Что было: одностраничное приложение без статичных адресов.

Итак, нам нужно будет сделать 3 действия:
  • добавить поддержку «хэшбэнг» адресов;
  • сделать статичные страницы для facebook'овского «робота»;
  • собственно, расставить кнопки.

Читать дальше →
Total votes 14: ↑8 and ↓6+2
Comments2

Подводные камни при миграции с MSSQL на MySQL и BLToolkit

Reading time4 min
Views9K
Имеем MSSQL 2008
Хотим MySQL версии 5.х

Зачем это может быть нужно?

Для разработчиков на .NET променять MSSQL на MySQL это наверное все равно, что пересесть с мерседеса на что-то по-проще. Как говорится, к хорошему быстро привыкаешь.
Но есть как минимум две причины сделать это
  • Сэкономить на лицензиях
  • Получить простую master-slave репликацию

Работа с базой MSSQL в нашем случае осуществляется через LINQ провайдер.
При переходе, не хотелось бы терять эту возможность, поэтому для работы с MySQL выбор пал на BLToolkit.

Мигрируем

Самое простое — это переписать код. BLToolkit в отличие от MS-провайдера относится к классу легких ORM, поэтому там немного другие конструкции подключения к базе, но LINQ-выражения останутся теми же.

Думаете осталось перенести данные и все заработает?
Как бы не так.
Узнать, что может быть не так
Total votes 25: ↑20 and ↓5+15
Comments13

The Bricks — фреймворк для создания пользовательского интерфейса

Reading time2 min
Views9.6K


Bricks это бесплатный набор компонентов пользовательского интерфейса. Он предназначен для упрощения создания дизайна и прототипирования будущего сайта. Этот набор позволит вам сэкономить время при разработке веб элементов и станет замечательной основой для создания сайта от дизайна до верстки. Больше не надо тратить время на рисование многочисленных форм, так как они уже включены в этот набор. Просто переместите компонент в свой проект, измените его стиль и пользуйтесь. Это просто, быстро и элегантно.
Читать дальше →
Total votes 83: ↑72 and ↓11+61
Comments48

Пять интересных эффектов при наведении с использованием нескольких фоновых изображений

Reading time6 min
Views22K
Сегодня мы рассмотрим все преимущества использования множественных фонов. Изучим базовые основы и создадим крутые эффекты при наведении с помощью CSS свойств hover и transition.

Ниже приведены пять различных примеров, которыми вы можете воспользоваться для создания собственных удивительных эффектов.

Что должно получиться


Посмотрим на то, что должно получиться в итоге. Подумайте, как можно реализовать эти эффекты чисто на одном CSS.

Демонстрация



Читать дальше →
Total votes 79: ↑74 and ↓5+69
Comments32

Интерактивные уроки Python на Codecademy

Reading time1 min
Views65K
Школа программирования Codecademy открылась в августе прошлого года: за это время миллионы человек изучили основы JavaScript, HTML, CSS и jQuery. Кураторы проекта решили, что пришло время расширить программу обучения с фронтенда на серверную часть — и запустили уроки по Python.

Часть 1: Синтаксис Python (16 упражнений)
  1. Переменные и типы данных
  2. Пробелы и выражения
  3. Комментарии
  4. Математические действия
  5. Проверка (практические задания)
Проект: калькулятор чаевых (5 упражнений)

Уроки проходят в традиционном интерактивном режиме. Пользователь читает инструкции, вводит команды в окно терминала — и сразу видит реакцию системы.
Читать дальше →
Total votes 57: ↑50 and ↓7+43
Comments34

JavaScript-фреймворк Meteor получил 11 миллионов долларов инвестиций

Reading time2 min
Views12K
Необычный и амбициозный фреймворк Meteor, пребывая в статусе preview (текущая версия — 0.3.8) уже получил 4500 подписчиков на Гитхабе и восторженные отзывы сооснователя Facebook Дастина Московица. Теперь на него обратили внимание акулы венчурного капитализма. Основным инвестором стал фонд Andreessen Horowitz. По словам Джефа Шмидта — CEO Meteor Development Group, одиннадцать с лишним миллионов гарантируют активную разработку проекта на протяжении ближайших нескольких лет.


Читать дальше →
Total votes 88: ↑77 and ↓11+66
Comments67

JsRender: Новое поколение jQuery Templates

Reading time3 min
Views37K
Буквально пару месяцев назад, мы начали переписывать весьма крупный сайт, с момента прошлого крупного релиза прошёл не один год, конечно, сайт дорабатывался, правились баги и в итоге в настоящее время создаётся новая версия. В ней будет активно использоваться AJAX, поэтому весьма остро стоял вопрос с генерацией контента на клиенте, полученного в формате JSON. Прошлые шаблоны были собственной разработки, так как на то время вариантов было не так много, которые по разным причинам не подходили, базировались наши шаблоны на jquery, с помощью атрибутов происходило заполнение.

Прежде всего было решено провести тест, при генерации списка из 1500 элементов было получено превосходство в 20 раз, похожие результаты показывает сравнение с jQuery Template (страница с тестами).
Читать дальше →
Total votes 30: ↑27 and ↓3+24
Comments47

PHP process manager

Reading time8 min
Views21K
image

Всем привет!

На Хабре было много статей, о том как писать демоны на PHP и другие fork-нутые вещи. Хочу поделится с вами своими наработками на схожую, но все-таки несколько другую тему — управление несколькими PHP процессами.
Читать дальше →
Total votes 62: ↑46 and ↓16+30
Comments53

Как распознать кракозябры?

Reading time1 min
Views425K
В комментариях к предыдущему посту про иероглифы сказали, что хорошо бы иметь такую же блок-схему для кракозябр.

Итак, вуаля!


За источник информации была взята статья из вики. В блок-схеме «UTF-16 → CP 866» означает, что исходная кодировка была «UTF-16», а распозналась она как «CP 866».

Как всегда — кликабельно. Исходник в .docx: здесь.
Total votes 429: ↑418 and ↓11+407
Comments64

Дайджест интересных новостей и материалов из мира айти за последнюю неделю №13 (30 июня — 6 июля 2012)

Reading time4 min
Views17K
Предлагаем вашему вниманию очередную подборку с ссылками на новости, интересные материалы и полезные ресурсы.

Читать дальше →
Total votes 39: ↑33 and ↓6+27
Comments7

Плагин, конвертирующий стили фотошопа в код css

Reading time1 min
Views39K
Неужели у кого-то было время этим запариться!

css3ps.com

Работает как вебсервис, от того время ожидания результата работы 30 секунд.

1) Качаем плагин под нужную версию фотошопа, открываем через windows->extensions->css3ps;
2) рисуем шейп, накладываем стили, отправляем на сервер через расширение;
3) ждем 30 секунд, смотрим на результат.

Естественно, сервис разбирает не все, что вы натворили в стилях.
Обратите внимание, что шейп нужно рисовать аккуратно.



Все работает) Фантастика.
Total votes 68: ↑63 and ↓5+58
Comments28

Продвижение в интернете – сферический конь в вакууме или почему оно не работает

Reading time7 min
Views43K
imageТак получилось, что я с переменным успехом занимаюсь продвижением в интернете вот уже без малого 5 лет. Я не считаю себя достаточно квалифицированным или достаточно опытным специалистом, чтобы мне было чем поделиться с уважаемыми коллегами по цеху. На эту тему уже написано множество статей и книг и с каждым годом их становится все больше. Это, конечно, замечательно, но в большинстве материалов на тему продвижения в интернете мне не нравится одно известное допущение.

Прелюдия


Все они описывают ситуации в общем случае или как в известной шутке про сферического коня в вакууме, в то время как на деле все выходит боком совсем иначе. Под катом я попробую просто перечислить, чем интернет-маркетинг на практике отличается от этой «идеальной модели», которая так легко и непринужденно рисуется в нашем воображении.

Игра называется «найди десять отличий». Наше воображение мы назовем «Сферический конь в вакууме», а суровую действительность обозначим вопросом «Почему оно не работает?». А оно, как вы уже, наверное, догадались, не работает в 90% случаев. А это значит ровно то, что 90% времени, потраченного нами на образование и самообразование, потрачено впустую.
Читать дальше →
Total votes 103: ↑92 and ↓11+81
Comments48

Information

Rating
Does not participate
Location
Люберцы, Москва и Московская обл., Россия
Works in
Date of birth
Registered
Activity