UNIXHOME http://unixhome.org.ua ru mail@unixhome.org.ua (http://unixhome.org.ua) mail@unixhome.org.ua (http://unixhome.org.ua) http://unixhome.org.ua http://unixhome.org.ua Как оценить задачу до начала разработки сайта http://unixhome.org.ua/blog/webdev/430.html http://unixhome.org.ua/blog/webdev/430.html Diesel Fri, 11 Mar 2011 16:39:51 +0300 видение проекта видение коммуникация постановка задач Организация и оптимизация стилей http://unixhome.org.ua/blog/webdev/420.html http://unixhome.org.ua/blog/webdev/420.html Diesel Tue, 01 Mar 2011 16:10:44 +0300 css структура стилей клиентская оптимизация Разработка с помощью jsFiddle.net http://unixhome.org.ua/blog/webdev/410.html http://unixhome.org.ua/blog/webdev/410.html android mootools, и в официальном Forge в качестве демо к одному из плагинов была ссылка на инструмент – jsFiddle.net. Недолго просидев за этим очень полезным инструментом я пришел к выводу, что надо написать обзор данного сайта и донести его до масс.

jsFiddle.net – это инновационный инструмент, работающий со следующими языками: HTML, CSS и JavaScript прямо в браузере. Создал этот инструмент Piotr Zalewa и продумал интерфейс Oskar Krawczyk. Самое главное отличие в Fiddle, что он позволяет видеть результат не перезагружая страницу, а просто взглянуть на окно с заголовком Result.
Читать дальше]]>
Thu, 03 Feb 2011 10:09:45 +0300 jsFiddle.net разработка HTML CSS JavaScript mootools
Поиск лиц на картинке с помощью JavaScript и Canvas http://unixhome.org.ua/blog/webdev/392.html http://unixhome.org.ua/blog/webdev/392.html Diesel Tue, 18 Jan 2011 12:44:11 +0300 JavaScript Canvas поиск лиц алгоритм Liu Liu CSS3 сейчас — анимация, прозрачность и многое другое http://unixhome.org.ua/blog/webdev/390.html http://unixhome.org.ua/blog/webdev/390.html Diesel Первая статья — CSS Transitions), хотелось бы рассказать об анимации средствами CSS3, а конкретно — @keyframe и animate. Так же, в статье мы затронем свойства opacity и цветовую модельrgba(), кроссбраузерное использование border-radius, box-shadow и градиентов.


Читать дальше]]>
Thu, 13 Jan 2011 23:42:14 +0300 css3 css3pie animate keyframes opacity rgba
Быстрый способ протестировать сайт в разных десктопных браузерах http://unixhome.org.ua/blog/webdev/388.html http://unixhome.org.ua/blog/webdev/388.html Diesel Всё больше достойных поводов находится у веб-разработчиков для того, чтобы отказаться от полнокровной поддержки IE6 в создаваемых проектах.

Кто-то обеспечивает малой кровью graceful degradation, ну а кто-то радикально прощается со старыми браузерами, чуть ли не нарочно приправляя сайт современными технологиями и показывая в браузерах-старичках заглушку с предложением срочно обновиться.

Однако, всем категориям веб-разработчиков полезно равно как и их клиентам полезно иметь не обременяющие средства для кроссбраузерного тестирования.

Самый надёжный способ — поднять несколько виртуальных машин, где всё можно будет досконально протестировать (в том числе потаскать границу окна, поскроллить и уж тем более посмотреть, как работает JS, если он имеется). Но ведь часто требуется просто взглянуть на сайт и понять, всё ли с ним в порядке в целом. Либо предоставить такую возможность заказчику.

Классикой жанра для решения поставленной задачи является веб-сервис:
Читать дальше]]>
Thu, 13 Jan 2011 11:56:24 +0300 кроссбраузерное тестирование верстка
CSS3 сейчас — transition http://unixhome.org.ua/blog/webdev/386.html http://unixhome.org.ua/blog/webdev/386.html Diesel В этом цикле мне хотелось бы рассмотреть такие свойства CSS3, как transition, animate, opacity и модель rgba().

Использование CSS3

Часто можно услышать от многих веб-дизайнеров слова «Я уже не могу дождаться, когда же можно будет использовать CSS3...». А между тем, использовать его можно уже сегодня. Да, использование CSS3 для критичных моментов сайта сейчас невозможно. Но использовать его для добавления мелких, некритичных для проекта деталей вполне реально, можно и нужно.
Читать дальше]]>
Tue, 11 Jan 2011 19:38:04 +0300 transition css3
Текст из картинки http://unixhome.org.ua/blog/webdev/374.html http://unixhome.org.ua/blog/webdev/374.html android
Вкратце


Демо 1 | Демо 2.

Читать дальше]]>
Sun, 26 Dec 2010 16:05:12 +0300 jquery текст из фото pictotxt js текст из картинки
Эффект размытия текста с text-shadow http://unixhome.org.ua/blog/webdev/361.html http://unixhome.org.ua/blog/webdev/361.html shell презентацией возможностей HTML5 и CSS3.


Суть идеи

В CSS3, как известно, появилась возможность задавать цвет в формате rgba. Последнее число — альфа-канал, с помощью которого можно указывать прозрачность.
Также есть возможность задать тень у текста при помощи свойства text-shadow.

Если цвет текста сделать прозрачным, то тень всё равно отображается. А если тень с нулевыми смещениями и радиусом размытия, то визуально это будет обычный текст.
Читать дальше]]>
Fri, 17 Dec 2010 14:27:59 +0300 CSS3 эффект размытия text-shadow
Как устроить DoS атаку на сервер баз данных одной строчкой http://unixhome.org.ua/blog/webdev/359.html http://unixhome.org.ua/blog/webdev/359.html Diesel
Ситуацию осложняло то, что в релиз попали изменения порядка сотни разных php-файлов и просмотреть весь список изменений было очень трудоёмко. tcpdump помог выяснить что трафик вырос до сервера баз данных PostgreSQL. Круг сужался.
Читать дальше]]>
Fri, 17 Dec 2010 12:27:01 +0300 php dos трафик postgresql pg_field_type pg_field_type_oid
Capistrano и php http://unixhome.org.ua/blog/webdev/352.html http://unixhome.org.ua/blog/webdev/352.html shell Всем привет. Сегодня я хотел бы ещё раз поговорить о замечательном deploy-ере Capistrano.

Напомню, что Capistrano — это Open Source-ный инструмент для выполнения скриптов на нескольких серверах, который в основном используется для web приложений. Он позволяет автоматизировать процесс развертывания новой версии на одном или нескольких web серверах и включает поддержку таких задач, как например изменение базы данных.

Capistrano написан на Ruby и является «модулем» (или компонентном, не знаю как лучше) фреймворка Ruby on Rails.
Данный топик по большей части является переводом туториала со страницы проекта на github-е с некоторыми дополнениями, изменениями и сокращениями специфичными для php (или для «не RoR»). Здесь не будут рассматриваться вопросы работы с несколькими серверами и базой данных, это всего лишь небольшое пособие для начинающих.

Итак, допустим на нашем локальном компьютере в паке /path/deploy/from находится приложение написанное на языке php. У этого приложения есть git репозиторий находящийся по адресу example.net/project.git с актуальным кодом. Также у нас есть хостинг по адресу example.com с ssh доступом и папкой /path/deploy/to куда мы собираемся залить наши файлы. Мы не хотим постоянно возиться с ftp клиентом и решили потратить несколько часов для того, чтобы разобраться в деплойере capistrano. Давайте приступим.


Читать дальше]]>
Wed, 15 Dec 2010 15:18:45 +0300 Capistrano php git deploy
76 новых материалов на русском http://unixhome.org.ua/blog/webdev/341.html http://unixhome.org.ua/blog/webdev/341.html Diesel

Недавно был снова обновлен центр по Internet Explorer на MSDN. Были добавлены 76 статей и книг, посвященных следующим темам:



Читать дальше]]>
Sat, 11 Dec 2010 02:02:32 +0300 microsoft браузеры html5 css3 dhtml javascript jquery dom производительность
Пишем простое приложение на jQuery Mobile http://unixhome.org.ua/blog/webdev/339.html http://unixhome.org.ua/blog/webdev/339.html Diesel
Итак, сначала подключим фреймворк и стили.
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
<script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>


Теперь примемся за страницы. Тут стоить отметить схожесть jQuery Mobile и jQTouch — все приложение это одна html страницы, на которой отмеченные особым образом div`ы являются «страницами» приложения. Базовый вид такой «страницы приложения» имеет вид:
<div data-role="page"> 
	<div data-role="header">...</div> 
	<div data-role="content">...</div> 
	<div data-role="footer">...</div> 
</div> 


Читать дальше]]>
Fri, 10 Dec 2010 09:04:39 +0300 jqtouch sencha touch jquery jquery mobile web-разработка
Кроссбраузерный text-overflow http://unixhome.org.ua/blog/webdev/310.html http://unixhome.org.ua/blog/webdev/310.html Diesel style.css

.habr span
{
    display:block;
    overflow:hidden;
    white-space:nowrap;
    width:100%;
    -moz-binding:url("ellipsisxul.xml#ellipsis");
    text-overflow:ellipsis;
    -o-text-overflow:ellipsis;
}


Читать дальше]]>
Sun, 14 Nov 2010 22:13:29 +0300 CSS верстка text-overflow web-разработка Firefox Opera Safari кроссбраузерность css3 overflow
Используем видео как фон сайта. Разбираемся в youtube api. Плеер Chromeless http://unixhome.org.ua/blog/webdev/294.html http://unixhome.org.ua/blog/webdev/294.html Diesel
Живой пример | Скачать архив

Использовать мы будем специальный плеер ютуба «Chromeless Player». Он отличается тем, что полностью контролируется с помощью JavaScript и не имеет визуального оформления. Примеры можно найти на Google PlayGround.

Итак, создадим файл index.html, script.js и style.css.

Читать дальше]]>
Mon, 01 Nov 2010 13:01:24 +0300 Html&Css JavaScript&Jq
Развертывание локального Perl-репозитория CPAN http://unixhome.org.ua/blog/webdev/226.html http://unixhome.org.ua/blog/webdev/226.html android
Устанавливаем модуль CPAN::Mini:

# perl -MCPAN -e "install CPAN::Mini"


или для Debian/Ubuntu:

sudo apt-get install libcpan-mini-perl


или для Fedora/RHEL/CentOS:

sudo yum install libcpan-mini-perl


Если все зависимости удовлетворяют модулю, то установка пройдет без проблем.

На следующей стадии загружаем копию репозитория на сменный носитель
(загружается около 1 Гб данных):

Читать дальше]]>
Tue, 14 Sep 2010 16:16:14 +0400 perl module cpan Инструкция репозиторий