Как стать автором
Обновить
23.5
Карма
0
Рейтинг
Нарек Мкртчян @Gunger

Руководитель

Про резиновую верстку

Разработка веб-сайтов
Навеяно этим.

Для тех, кто, возможно, не знает как сделать так, чтоб всё было хорошо.
Сайт должен тянуться только до определённой величины, и сужаться тоже только до некоторого значения. Я обычно беру 1500 и 980 пикселей соответственно.

Как сделать? min-width и min-height.

#site {
  margin: 0 auto; /*это чтоб центрировать контент при превышении max-width*/
  min-width: 980px;
  max-width: 1500px;
}


Но ведь IE их не поодерживает. А expression слишком нагружает браузер… Спокойно, други! Я выведу вас к свету из тьмы!
Пишем далее.



А в ie.js помещаем

window.attachEvent('onload', mkwidth);
window.attachEvent('onresize', mkwidth);

var minwidth = document.getElementById("site").currentStyle['min-width'].replace('px', '');
var maxwidth = document.getElementById("site").currentStyle['max-width'].replace('px', '');
function mkwidth(){
    document.getElementById("site").style.width = document.documentElement.clientWidth < minwidth ? minwidth+"px" : (document.documentElement.clientWidth > maxwidth ? maxwidth+"px" : "100%");
};


В чём особенная вкусность приведённого метода? А в том, что минимальное и максимальное значение нужно задавать только в одном месте, ну и вообще.

Пользуйтесь, короче, на здоровье!
Всего голосов 130: ↑123 и ↓7 +116
Просмотры27.9K
Комментарии 139

Множественные числа

PHP
Довольно часто на сайтах встречаются нелепые словесные конструкции, которыми программист обезличено хотел показать какой либо количественный параметр, например:

на сайте 22 человек ( а должно быть 22 человека )
1 комментариев ( понятно, что расчёт шёл на 10+ комментариев, но это не выход )

Читать дальше →
Всего голосов 44: ↑39 и ↓5 +34
Просмотры2.6K
Комментарии 92

Практический JS: оптимизируем CSS expressions

Клиентская оптимизация
Перевод
Примечание: ниже находится перевод статьи «CSS Expression Optimization», в которой автор немного освещает использование и проблематику динамических свойств в CSS (aka CSS expressions). Также автор предлагает способ их оптимизации (исполнение один-единственный раз вместо постоянного выполнения). Далее приведены несколько тезисов с ClientSide'2007 по заявленной тематике. Мои комментарии даны курсивом.

CSS expressions были впервые представлены в Internet Explorer 5.0, который позволял назначать JavaScript-выражение в качестве CSS-свойства. Например, следующий код позволит разместить элемент в зависимости от того, какого размера окно браузера.

#myDiv {
   position:   absolute;
   width:      100px;
   height:     100px;
   left:       expression(document.body.offsetWidth  - 110 + "px");
   top:        expression(document.body.offsetHeight - 110 + "px");
   background: red;
}


Не самый лучший способ решения поставленной задачи, но в качестве примера его достаточно.

читать дальше на webo.in →
Всего голосов 40: ↑30 и ↓10 +20
Просмотры870
Комментарии 26

Сделаем это по-быстрому – habrahabr за пару часов

Drupal
habradrupal
В последнее время на drupal.ru и habrahabr.ru частенько проскакивают темы вроде: «Делаю социальную сеть – бюджет пара сотен! Помогите сделать хабрастартап!» Отечественные аналитики связывают эту тенденцию с тем, что кризис на ипотечном рынке США тянет вниз за собой рынок в целом, что заставляет игроков на бирже вкладывать в высоколиквидные и надежные активы. Традиционно прибежищем инвесторов в смутные времена является золото, медь да стартапы на просторах бывшего СССР.

Как быть, если денег и других ресурсов пока нет, а вот почувстовать себя Денискиным или Андреевым хочется уже сегодня? Попробуем исполнить соцзаказ и попытаемся по-быстрому сделать сайт напоминающий хабр.
Читать дальше →
Всего голосов 109: ↑103 и ↓6 +97
Просмотры4.2K
Комментарии 140

CSS Sprites: все, что вы знали, но боялись спросить

Клиентская оптимизация
Сейчас уже много где написано и упомянуто про технику CSS sprites (aka CSS Image Maps). Я не буду открывать Америку и рассказывать о ней дотошно еще раз, а просто хочу привести несколько примеров и полезных ссылок. И пару советов из собственной практики.

Сама техника заключается в том, что мы создаем комбинированное изображение, из которого затем «вырезаем» с помощью свойств background-position нужный нам в данном случае кусок. На текущем уровне поддержки браузерами (я полагаю, что 99,9%) оно является просто must-have для любого уважающего себя интернет-ресурса (ибо позволяет сократить число запросов к серверу, отделить поведение от представления, возложить труд по анимации на CSS-движок браузера, а не на JS-движок, т.е. это будет работать даже с выключенными скриптами, и много-много прочих «вкусностей»). Но обо всем по порядку. Поехали.

читать дальше на webo.in →
Всего голосов 95: ↑92 и ↓3 +89
Просмотры5.7K
Комментарии 57

Blitz Templates

Разработка веб-сайтов


Blitz Templates — быстрый и удобный шаблонизатор для крупных интернет-проектов, разрабатываемых на php. На первых порах может быть не совсем очевидно, зачем нужен Blitz для php, в то время, когда этот язык, по сути дела, и есть шаблонизатор, только весьма навороченный.

Читать дальше →
Всего голосов 32: ↑29 и ↓3 +26
Просмотры3.6K
Комментарии 164

Практический CSS: рецепт успеха

CSS
Перевод
Ниже располагается перевод заметки CSS — A Recipe for Success, в которой рассматривается создание средствами HTML/CSS в браузере некоторого образца меню. В статье освещены довольно интересные случаи, и подробно описано их решение.

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

Рисунок 1. Стандартное меню
Рисунок 1

Хотя, на первый взгляд, внешне не представляется сложностей, чтобы повторить это с помощью HTML, однако, все не так просто, и можно наткнуться на достаточное количество подводных камней. Но обо всем по порядку!

Читать дальше →
Всего голосов 75: ↑70 и ↓5 +65
Просмотры11.4K
Комментарии 49

mysqldump в csv формате

MySQL
Значится так — есть задача вытянуть данные из таблицы mysql в простенький csv файлик, дабы его открыть быстренько в excel. Зачем белым людям нужна такая магия — мне никогда не понять, но раз заказчик попросил, то я сделал. Итак, отдаёмся во власть консоли и пишем:
mysqldump -u [USER_NAME] -p "--where=[WHERE]" "--fields-terminated-by=," "--tab=./" [DB_NAME] [TABLE] > [TABLE].txt

Вот и вся любовь (на выходе получим два файла — один с SQL и второй с CSV)

p.s. директория в которой выполняется эта команда должна быть открыта для записи, иначе оно ругаться будет ;)
Всего голосов 28: ↑20 и ↓8 +12
Просмотры9.2K
Комментарии 18

Ryan Singer: 10 советов по дизайну форм регистрации

Интерфейсы
Ryan Singer, дизайнер небезызвестной 37 Signals на конференции Future of Web Design дал 10 советов по дизайну форм регистрации. Надо сказать, что советы эти вполне естественны и настолько очевидны, что возникает вопрос — «а зачем вообще это проговораивать? это же и так понятно!». Но — как только начинаешь проходить регистрацию в каком-нибудь новом стартапе понимаешь, что очевидность эта видна не всем.
Читать дальше →
Всего голосов 40: ↑39 и ↓1 +38
Просмотры1.7K
Комментарии 38

Сайт, автомобиль — никакой разницы!
Простые ответы на 7 популярных вопросов по сайтостроительству.

Разработка веб-сайтов
Я работаю в компании занимающейся разработкой сайтов. Порой бывает очень сложно объяснить что, почему и сколько. Самый простой и быстрый путь найти общий язык с потенциальным заказчиком — это перевести все на простые и понятные большинству аналогии. Я в этих целях обычно использую автомобиль.
Читать дальше →
Всего голосов 66: ↑59 и ↓7 +52
Просмотры822
Комментарии 53

Устранение мигания фоновых картинок в IE6

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

Для устранения мигания нужно подключить к веб-странице небольшой код на JavaScript:
var m = document.uniqueID
&& document.compatMode
&& !window.XMLHttpRequest
&& document.execCommand;

try{
     if(!!m)
      {
         m("BackgroundImageCache", false, true)
      }
   }
   catch(oh){};
Всего голосов 35: ↑33 и ↓2 +31
Просмотры1.3K
Комментарии 50

Отключаем нежелательные HTML-элементы с помощью CSS

CSS
Часто, когда мы сдаем проект клиенту, мы теряем контроль над HTML-кодом. Иногда клиент использует CMS (Системы Управления Контентом), которые дают ему полный контроль над теми или иными частями HTML-кода. Иногда клиент просто использует наши темплейты для вывода своего кода в документ.
В большинстве случаев довольно тяжело проинформировать клиента о том, как использовать темплейты или CMS, которые вы ему предоставляете, а иногда просто неприемлемо толкать пламенные речи о семантической верстке и веб-стандартах. Клиент может/будет использовать «старую, добрую разметку», ту, которую он знает, просто потому что она работает и выглядит так как он привык. Скорее всего в ней будут присутствовать нежелательные (deprecated) тэги и атрибуты, такие как bgcolor, align и «вечный» font. Эта статья о том, как блокировать нежелательные HTML-тэги с помощью CSS, тем самым аккуратно направляя клиента в правильном направлении.
Читать дальше →
Всего голосов 41: ↑38 и ↓3 +35
Просмотры7.7K
Комментарии 38

Легкий способ борьбы с ленью

GTD
UPD: Легкий способ борьбы с ленью, версия 2.0 (оптимизированная)


(название статьи взято по аналогии с книгами Аллена Карра, но статью написал не он, а я).:)

Я хочу рассказать о своем способе борьбы с ленью. Чтобы его применять, не нужна сила воли, не нужен особый склад ума, обладание энтузиазмом, отсутствие депрессии, шило в заднице, курсы НЛП и монастырь Шао-линя. Достаточно лишь совершить действия, на которые способен даже самый ленивый человек на свете.
Читать дальше →
Всего голосов 134: ↑130 и ↓4 +126
Просмотры1
Комментарии 257

Кропотливая оптимизация PHP-приложений (рассматриваю PHP5, но большинство справедливо и для 4-й ветки)

Разработка веб-сайтов

Когда во сне снится «ой а если сервера не хватит...»


Для начала, Доброй Ночи. Пишу что-то полезное вроде впервые (если не считать разного рода полу-тестов в моём блоге). Человек я допытливый до жути, неожиданно в голову пришло, что могу помочь сэкономить кому-то много времени ;).


танцуем с бубном
Всего голосов 99: ↑95 и ↓4 +91
Просмотры8.3K
Комментарии 147

Делаем закругленные уголки с помощью псевдоэлементов: before и: after

CSS
Внимание! Это все устарело, но публикацию не удаляю, чтобы все знали как мы мучались в 2007 году из-за IE6 :-)

Задача: сделать врезку с закругленными уголками с минимумом html-кода.

Читать дальше →
Всего голосов 62: ↑58 и ↓4 +54
Просмотры2.4K
Комментарии 147

Псевдокласс: first-letter

CSS


Уже довольно давно использую псевдокласс :first-letter для назначения двух фоновых изображений для одного элемента. Самое интересное что :first-letter, один из немногих псевдоклассов, которые работают в 6-ом Интернет Эксплорере. Но есть одна маленькая хитрость, которую нужно знать.

К делу. Как сказано выше, HTML элемент у нас один. Пусть это будет заголовок первого уровня.
Читать дальше →
Всего голосов 67: ↑67 и ↓0 +67
Просмотры6.8K
Комментарии 105

jQuery для JavaScript-программистов

Разработка веб-сайтов
Перевод
Примечание: ниже расположен перевод статьи «jQuery for JavaScript programmers», в которой автор высказывает свое мнение об этой библиотеке, ориентируясь, в первую очередь, на продвинутых программистов, и приводит несколько десятков примеров ее использования.

Когда jQuery увидела свет в январе 2006, я подумал: «очередная красивая игрушка». Выбор CSS-селекторов в качестве базиса было, конечно, изящной идеей (подробнее о ней в моей заметке getElementsBySelector), но использование цепочек преобразований выглядело немного замысловато, и сама библиотека, по-видимому, не покрывала всех возможных случаев. Я расценивал тогда jQuery только как временное и проходящее решение.

Только несколько месяцев спустя понял я, насколько же ошибался по отношению к ней. jQuery является просто произведением инженерного искусства. Она умело покрывает достаточно широкой диапазон повседневных функций и предоставляет при этом удобный API для расширений, с помощью которых можно добавить любую другую функциональность. Абстрактность в ней заложена на уровне ядра — речь идет о выборе DOM-элементов — и она извлекает из него максимум пользы. И что важнее всего, использование этой библиотеки подразумевает следование хорошему стилю в программировании и хорошо сочетается с другими частями JavaScript-кода.

Большинство современных обзоров jQuery делают упор на дизайнеров и неопытных разработчиков. Я попытаюсь объяснить, почему она также нужна и опытным программистам.

Читать дальше →
Всего голосов 47: ↑46 и ↓1 +45
Просмотры65.8K
Комментарии 121

Мелкая доработка облака тегов

Habr
Предлагается в тегах, содержащих пробелы, при выводе в облако (возможно, не только в облако) заменять оные на &nbsp; во избежание вот такого:
Перенос тега в облаке Хабра

Upd: или, что ещё лучше, добавить в CSS (спасибо alkeeper):
.tagsblock a {
white-space: nowrap;
}
Всего голосов 25: ↑22 и ↓3 +19
Просмотры407
Комментарии 23

How to become a ZCE

PHP
Наверное многие из вас сдавали тесты на таких ресурсах как Retratech или Specialist. А вы задумывались зачем? Чтобы отразить результат в своем резюме? Чтобы оценить свой уровень? Подобные ресурсы не предложат вам ничего, кроме некачественных вопросов и сомнительных достижений. Их цель — получение прибыли на печати ничего не стоящих в профессиональной среде сертификатов. Чтобы получить результат вам нужно
Читать дальше →
Всего голосов 33: ↑30 и ↓3 +27
Просмотры9.3K
Комментарии 89

Информация

В рейтинге
5,840-й
Откуда
Москва и Московская обл., Россия
Работает в
Дата рождения
Зарегистрирован
Активность