Читать дальше →
Кто-то Другой @foo
Пользователь
Underscore.js — библиотека, которая так хороша, что должна быть вне закона
3 min
50KКаждый, кому приходилось писать объемные куски осмысленного кода на javascript, рано или поздно понимал, что ему многого не хватает в этом языке или просто неудобны некоторые врожденные конструкции. Для сглаживания шероховатостей применяются jQuery, Prototype, MooTools etc. Кто-то уже мало представляет себе, как можно кодить без них. Сегодня я расскажу о еще одной маааленькой библиотечке, которая делает мир javascript-программиста еще прекраснее. Речь пойдет о Underscore.js
+149
Делаем калейдоскоп на CSS+JS
9 min
5.1K
Конечно, нельзя сказать, что это действительно очень просто. И нельзя сказать, что получилось совсем всё, что хотелось. Но есть на что посмотреть, за чем приглашаю под кат.
UPD
В посте добавил улучшенный вариант от хабрачеловека hlomzik, который не работает в ИЕ, но с меньшим кол-вом кода и с более правильным поведением.
+94
Vim и кириллица: парочка приёмов
2 min
58K
Раньше для редактирования обычных русскоязычных текстов, я обычно откладывал Vim в сторонку и прибегал к помощи других редакторов. Причиной этому была парочка очень неприятных косяков:
- На каждый чих приходилось сто раз переключать раскладку, чтобы корректно ввести пару команд и вернуться обратно. Например, замена буквы-опечатки в только что написанном слове, выливалось в: switch → добраться до буквы, нажать r → switch → [нужная буква] → switch → A → [пишем дальше]. Ад!
- Штатный spell checker букву «ё» не любил и любое слово с её участием предлагал заменить на аналог через «е». А я ё люблю, меня это расстраивало.
И вот, наконец, я нашёл решение обеим проблемам. Сижу сейчас и набираю этот текст в Vim. Любопытно, что оба барьера обходятся штатными средствами, без дополнительных плагинов. Поскольку материалов на английском и на них основанных куда больше чем исконно русских, найти эту информацию мне было не просто. Поэтому хочу поделиться ей с теми кому интересно.
+93
«LibCanvas» — фреймворк для работы с Javascript Canvas, часть вторая
3 min
5.4K
Привет, Хабр! Я хочу рассказать тебе о новой библиотеке, которая помогает очень легко и изящно рисовать всякие штучки-дрючки на html5 canvas. Возможно, ты уже слышал о ней, но сейчас она пережила новое рождение. Что-ж, под катом я покажу тебе много интересненьких примеры, расскажу про нюансы работы и дам ссылку на грозу всех секретарш — почти работающий пасьянс «Косынка», созданную с помощью этой LibCanvas.
+36
Обзор свежих материалов, май-июнь 2010
7 min
1KЭтот материал продолжает серию ежемесячных обзоров свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. В прошлом месяце вышла заминка с публикацией, так что эта подборка двойная.


+46
Снова про формы: значения по умолчанию
3 min
11KjQuery дает практически безграничные возможности по обогащению пользовательского интерфейса, а самое интересное зачастую связано с элементами управления на страницах, в частности с формами.
Современные интерфейсы часто стремятся к минимализму. При изяществе дизайна, вэб-технологи стремятся к изяществу решений, принимаемых в процессе реализации. Я часто занимаюсь разработкой интерфейсов, версткой и клиентским программированием — и постоянно ищу новые решения для старых задач.
В статье речь пойдет о значениях в полях формы по умолчанию, когда название поля является его изначальным содержимым. А также об изящном решении этой задачи на практике.
Современные интерфейсы часто стремятся к минимализму. При изяществе дизайна, вэб-технологи стремятся к изяществу решений, принимаемых в процессе реализации. Я часто занимаюсь разработкой интерфейсов, версткой и клиентским программированием — и постоянно ищу новые решения для старых задач.
В статье речь пойдет о значениях в полях формы по умолчанию, когда название поля является его изначальным содержимым. А также об изящном решении этой задачи на практике.
+35
Предварительная загрузка изображений
5 min
13KТе, кто использует HTML5 Canvas знают, что картинку нельзя использовать через URL к ней. Картинку нужно сначала загрузить либо через тэг img, либо через объект Image, либо через data: url.
Чтобы не думать о загрузке каждой картинки, делают загрузку всех необходимых картинок перед отрисовкой самой сцены. В этом топике я приведу в пример свой загрузчик изображений, который использует Mootools с его механизмов для работы с классами.
Чтобы не думать о загрузке каждой картинки, делают загрузку всех необходимых картинок перед отрисовкой самой сцены. В этом топике я приведу в пример свой загрузчик изображений, который использует Mootools с его механизмов для работы с классами.
+17
Визуальный редактор на jQuery
2 min
14K
В мире визуальных редакторов есть CKeditor, есть tinyMCE — монстрообразные, не гибкие, их сложно изменять под задачи сайтов и интерфейсов. Есть небольшие, простые, они часто с ужасным дизайном, не развиваются, не поддерживаются. Как настоящий разработчик, несколько лет назад я решил написать свой редактор и в течение этого времени постоянно развивал его и упрощал. Суть редактора постепенно свелась к простым требованиям:
- он должен быть красивым и одновременно ненавязчивым, чтобы вписывался без внешних изменений почти в любой интерфейс;
- обязательно быстрым и легкий, потому что никому не нравится сидеть даже полминуты в ожидании загрузки всех кнопок и плагинов;
- гибкий для разработки, доработки и встраивания под все возможные нужды;
- с простым и понятным интерфейсом. В идеале визуальный редактор — это просто поле для ввода текстов, без лишних кнопок и функций. Просто люди пишут тексты в вебе и это все что им нужно.
+194
Кроссбраузерный box-shadow
2 min
66KЗдравствуйте, дорогие читатели. Сегодня хочу с вами поделиться чрезвычайно простым способом кроссбраузерной реализации css-свойства box-shadow. Способ настолько простой и очевидный, что я был чрезвычайно удивлен тем, что не смог найти на просторах интернета аналогичного решения (хотя я более чем уверен, что не являюсь первооткрывателем).
+33
Фундамент знаний и кирпичи навыков
4 min
5.4K Третий, и я думаю, последний пост из цикла «о карьере ИТ-специалиста». Предыдущие: 1, 2.
В предыдущих обсуждениях возникло некоторое недопонимание смысла синдрома «многорукого Шивы» и смысла «изучать вглубь». Примеры, которые я буду приводить, будут касаться системного администрирования, но, думаю, в остальных ИТ-областях ситуация аналогичная (будь то программирование, вёрстка, написание баз данных, или возня с железом).
Попробуем описать аналогию навыков и знаний, которая позволит понять, как правильно нужно учиться и для чего нужны знания, помимо навыков.
Представим себе навыки, как кирпичи. Приобретение каждого из них относительно просто и быстро (хотя может и заставить сильно материться в процессе).
Представим себе знания, как фундамент.
Можете ли вы раскидать кирпичи по пляжу? Можете.

Именно так выглядят знания начинающего эникейщика или просто компьютерного пользователя. Местами кирпичи даже накладываются друг на друга и образуется кучка в 2-3 кирпича высотой. Это опытный пользователь, который хорошо знает, как устанавливать драйвера, как чистить реестр и оптимизировать производительность.
В предыдущих обсуждениях возникло некоторое недопонимание смысла синдрома «многорукого Шивы» и смысла «изучать вглубь». Примеры, которые я буду приводить, будут касаться системного администрирования, но, думаю, в остальных ИТ-областях ситуация аналогичная (будь то программирование, вёрстка, написание баз данных, или возня с железом).
Попробуем описать аналогию навыков и знаний, которая позволит понять, как правильно нужно учиться и для чего нужны знания, помимо навыков.
Представим себе навыки, как кирпичи. Приобретение каждого из них относительно просто и быстро (хотя может и заставить сильно материться в процессе).
Представим себе знания, как фундамент.
Можете ли вы раскидать кирпичи по пляжу? Можете.

Именно так выглядят знания начинающего эникейщика или просто компьютерного пользователя. Местами кирпичи даже накладываются друг на друга и образуется кучка в 2-3 кирпича высотой. Это опытный пользователь, который хорошо знает, как устанавливать драйвера, как чистить реестр и оптимизировать производительность.
+89
debman — фронтенд для apt с синтаксисом pacman'а
1 min
1.5K
debman — фронтенд для apt'а с синтаксисом pacman'а (пакетного менеджера в Arch linux). Сейчас он поддерживает все deb-based дистрибутивы, а так же rpm-based с apt (проверено на ALT linux'е).
+23
ModularGrid — модульная сетка в браузере (и не только сетка)
1 min
10KModularGrid — это небольшая программка на javascript (около 30 КБ), которая облегчает труд HTML-верстальщика.


Основные возможности ModularGrid
- показ направляющих поверх страницы
- показ модульной сетки поверх страницы
- показ отдельно шрифтовой сетки, горизонтальной или вертикальной модульной сетки поверх страницы
- показ изображения-макета поверх страницы
- изменение размера окна браузера под указанные верстальщиком разрешения
- изменение прозрачности модульной сетки и изображения-макета
+96
Удобное заполнение расписаний с JQuery
5 min
7.2KЭта история произошла с Дмитрием Дубовицким — программистом «Бюро Пирогова».
Однажды случилось мне заниматься одним весьма интересным проектом. По ТЗ нужно было заполнить расписаниие занятий фитнес-клуба в неком XML. В принципе, ничего сложного — прочитал XML, заполнил данными таблицу на экране, но… Как же клиент будет редактировать расписание и править xml-файл? руками?
Выход прост — это можно сделать мышью!
Однажды случилось мне заниматься одним весьма интересным проектом. По ТЗ нужно было заполнить расписаниие занятий фитнес-клуба в неком XML. В принципе, ничего сложного — прочитал XML, заполнил данными таблицу на экране, но… Как же клиент будет редактировать расписание и править xml-файл? руками?
Выход прост — это можно сделать мышью!
-2
Аккорды с применением высоких технологий
14 min
1.3KЗадача заверстать аппликатуру весьма не тривиальна и от того довольно интересна. Я тоже не устоял перед искушением решить её так как считаю правильным.
Помимо стандартных требований типа кроссбраузерности, масштабираемости, печатаемости и компактности, хотелось бы добиться также и возможности просто тупо скопировать аппликатуру и вставить её, например, в текстовый документ. То есть в текстовом виде аккорд должен иметь примерно следующий вид:
O — открытая струна, X — приглушённая, остальные буквы обозначают пальцы.
Помимо стандартных требований типа кроссбраузерности, масштабираемости, печатаемости и компактности, хотелось бы добиться также и возможности просто тупо скопировать аппликатуру и вставить её, например, в текстовый документ. То есть в текстовом виде аккорд должен иметь примерно следующий вид:
Am O - - - O F - - O - R - O - M - O - - - X - - -
O — открытая струна, X — приглушённая, остальные буквы обозначают пальцы.
+26
Как качать с Rapidshare.com «free user», используя curl или wget
5 min
5.1KПоявившаяся почти год назад статья про скачивание с многими любимого кладезя почти легальной вами же забэкапленной информации Rapidshare.com вызвала одобрение у публики хабра. За последнее время рапида убрала с себя капчу, сделала не столь долгим ожидание между загрузками, в общем, всем своим видом показывает, что с ней очень приятно работать. А если это можно делать ещё и бесплатно… так почему же нет?!
+80
The Javascript Way
3 min
1.4KОчевидно, что за последние годы JavaScript превратился из «прикольного дополнения к HTML» в мощное средство для разработки веб-приложений. И превратился он в него не технологически, а идеологически. То есть он всегда был, как-бы на протяжении своего существования сильно не менялся, но почему-то стал использоваться на всю катушку сравнительно недавно. Как будто все неожиданно осознали, что веб тоже может быть интерактивным, и веб-сайты, как-бы не веб-сайты вовсе, а такие программы, со своей логикой. Эта тенденция оказала сильно и на требования к сайтам в общем.
До конца не ясно, то-ли возможности Javascript так повлияли на веб, то-ли веб сам стал требовать интерактива, и на помощь пришел JS. Я лично склоняюсь к первому варианту.
В результате этого, произошло то, что происходило уже не раз. Начали появляться полуфабрикаты для разработки интерактивных веб-сайтов, нам они известны как фреймворки.
До конца не ясно, то-ли возможности Javascript так повлияли на веб, то-ли веб сам стал требовать интерактива, и на помощь пришел JS. Я лично склоняюсь к первому варианту.
В результате этого, произошло то, что происходило уже не раз. Начали появляться полуфабрикаты для разработки интерактивных веб-сайтов, нам они известны как фреймворки.
+40
Изящное оглавление модулей CSS3
1 min
1.1KВо блоге Ajaxian сообщают, что Šime Vidas свёл в единое оглавление (причём прячущееся по желанию читателя) все модули CSS3, сколько ни есть их на сайте W3C:
![[скриншот]](https://habrastorage.org/getpro/habr/post_images/105/235/dfc/105235dfcb5e90c6345d0e4d88982804.png)
Как же красивы простые полезные вещи. А эта штука ещё и познавательна: я и понятия не имел, что в рамках CSS3 столько набросали набросков.
![[скриншот]](https://habrastorage.org/getpro/habr/post_images/105/235/dfc/105235dfcb5e90c6345d0e4d88982804.png)
Как же красивы простые полезные вещи. А эта штука ещё и познавательна: я и понятия не имел, что в рамках CSS3 столько набросали набросков.
+21
Препроцессинг CSS на клиенте
6 min
2.2KПредставьте, что вы пишете блогохостинг и хотите позволить авторам блогов менять свой дизайн. Картиночки там вставлять, цвета менять, пропорции регулировать… Представили? Если хорошо представили, то уже поняли, что без констант и формул в CSS тут не обойтись.
При блуждании по блогам не хотелось бы грузить все стили заново, что неизбежно при серверном вычислении значений, а хотелось бы грузить лишь минимальную разницу — так называемый скин.
Итого, нам нужно грузить в дополнение к данным страницы: скин с константами и стили с формулами. Только две клиентские технологии позволяют сделать это: JS и XSLT. Однако первую очень любят отключать, а вторую отключать просто нет смысла. Поэтому вынесем CSS в XSLT контейнер, а заодно и не забудем про технологию XHTML-инклудов.
При блуждании по блогам не хотелось бы грузить все стили заново, что неизбежно при серверном вычислении значений, а хотелось бы грузить лишь минимальную разницу — так называемый скин.
Итого, нам нужно грузить в дополнение к данным страницы: скин с константами и стили с формулами. Только две клиентские технологии позволяют сделать это: JS и XSLT. Однако первую очень любят отключать, а вторую отключать просто нет смысла. Поэтому вынесем CSS в XSLT контейнер, а заодно и не забудем про технологию XHTML-инклудов.
+31
Вредная верстка
9 min
75KКак определить, что сайт сверстан качественно?
Есть много статей о том, как делать хорошо, но совсем нет – о том, как делать не надо, ведь даже валидный и кроссбраузерный сайт может быть сверстан отвратительно.
Есть много статей о том, как делать хорошо, но совсем нет – о том, как делать не надо, ведь даже валидный и кроссбраузерный сайт может быть сверстан отвратительно.
Из этой статьи вы узнаете:
- О плохих приемах современной верстки;
- О том, как даже не будучи профессионалом, за 5 минут определить плохо ли сверстан сайт или нет.
+147
Information
- Rating
- Does not participate
- Location
- Москва, Москва и Московская обл., Россия
- Date of birth
- Registered
- Activity