Задачка на засыпку любителям криптографии

Тут одну капчу очень хотелось взломать. А очень вот почему. На ихсервере был скрипт, который эту капчу генерировал, причем она генерировалась от GET запроса и однозначно! Запрос состоит из 16 символов, а капча из 4 цыфр. Видим некую закономерность! Причем в запросе участвуют символы 16-ричной системы счисления!

Я загадку в итоге разгадал. Теперь, если кому-то будет интересно, предлагаю ее разгадать Вам =) В итоге выложу полное решение, а пока выложу достаточное количество примеров для разбора:

Запрос Значение
2A742DB02203FFF3 0468
2A742DB3230FF8F0 0774
2B742CB4270FFEF3 1034
2A752CB12C0EFBF1 1585
2B702FB12608FEF1 2523
2A752FBC260CF8F7 2827
2B732EB0250CFAF0 3417
2B762EB0270BFAF0 3430
2A7629B52D0DF8F7 4196
2A7129B52D02F9F0 4199
2A7628BC220AFAF9 5861
2B742BB5250BF8F4 6110
2A702AB42D0DFEF5 7096
2A7025B42203FAF4 8068
297324BD2D03FBF9 9998

Решение на самом деле очень даже простое =)

[Проза.ру] Странные авторы)

Этот сервис меня уже очень давно интересует, во многом из-за того, что я хотел быть писателем и даже пытался писать. Сейчас, на трезвый взгляд я конечно вижу, что из меня много толку не выйдет в этом «бизнесе», но сервер я изучать не забросил.

Его в 2000 году запустил малоизвестный Дмитрий Кравчук, автор Стихи.ру и еще нескольких серверов. Замечательная идея, никаких конкурентов, можно особо не стараться. Спартанский интерфейс за 11 лет ничуть не изменился. Никакого оформелния рассказов, никаких выравниваний, тегов и жуткий шрифт. В общем что-либо большее, чем стихи читать довольно трудно и напряжно. Этим в принципе и объясняется большая посещаемость Стихи.ру (аж в 5 раз!).

Авторы тоже оригинальностью не отличаются. В сутки выкладываются пара тысяч произведений, большая часть из которых сплошной кал. Более старые писаки любят гнобить остальных в рецензиях. Остальные же придерживаются макета «Лесть»+»Уважение от бла бла бла». Кто пишет на этом сайте, тот поймет о чем я.

Главное, что народу нравится и у них есть куча посещений в сутки! Но! Вот есть интересная вещица. Я написал скрипт, чтобы сграбить ники авторов, которые заходят на сайт. На сайте имеется раздел «Авторы онлайн» и он достаточно неплохо работает. Но судя по результатам работы скрипта, который запускается каждые 5 минут, за последний 4 суток на сайт зашло всего 500 уникальных авторов, а статистика Ливинэта показыват, что на сайте бывает около 25 тыщ уникальных посетителей в сутки!

 

Странно это вот еще почему. Есть статистика о прочтении Ваших произведений и в ней очень редко оказываются люди не зарегистрированные на сервере… Ну да ладно, оставим эту загадку не решенной.

Как многие уже знают, я писал скрипт, который просто от Вашего имени просматривал чужие произведения и те авторы заходили в ответку, чтобы просмотреть произведение или спам, в зависимости от Ваших наклонностей. Эффект вышел не самый крутой, но вышел! Я получал в сутки по 20-30 уников ничего не делая. Со стихов и того меньше, хоть и публикуется там более 8000 произведений и посещают его около 1500 уникальных авторов. Я решил на этом не останавливаться и написать скрипт, который пишет рецензии на произведения от Вашего имени. Выкладывать я его пока не буду, надо еще потестить и улучшить.

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

Дойпыб день, СтаниславаМарт!
Шикарно написчно,рОчень уравится! Твораеских В-м нспехов 
С уважением, Сра так,
5de1510c55603e0e3d3258258a68197c

В конце хешка для обмана робота. В общем, чтобы Вы ответили чудаку ,который на Ваше произведение написал бы подобную ересь? Наверное наши мнения все же солидарны, но эти люди действительно талантливы, вот несколько примеров:

Это я все написал одной и той же))

Приве,, Тан ножесникова,
Беаподобно Каписано! Сильно нравится! Творческих Вам успехов,
С уeалениемтяСпартск 
bdf626a110955abfb423в028455e050a

Спартак! добрый день! Спасибо за внимание!!!))))

Добры, день!нТмня Колесникова,
Изуивтельно изложеноу Оче ь нравмтся! Творческих Вам !спехои!
С уважениеай Спартак,
cda3749345101d4f1f4982d8aa2d38c3

Спартак! добрый день!!! Спасибо, что заходите ко мне!!!

П6ивет. Таня Колесников .
Изумите,ьно отмечено. Очень нравутсял ТворческихрВамауспехвв 
С иоажением, Спартак 
ca9a0c3b7724b17 b4849a6b20345be8

Спартак, здравствуйте! Даже не ожидала получить столько
писем!!! Спасибо!!!

Неужели она тоже робот? =)


Потом еще много подобных ответов, но очень порадовал вот этот =)

Здравствуите. Игерь МаСтыненко!
Отлйчноотмечоно. рильнв нравится. Твор5еских Вам успехоо, 
С уважением, Спартак 
38чeca79255e4b0e2910f30b6cd34910

От чего столько негатива, Спартак?


Очень терпеливый мужик из Омска =)

Добрый вечер! риктоа ПеВ пёлкин!
зИумитевьно отмечено. Оче2ь нравится,еТлорческих Вам успехов.
С уважением, Спартрк!
98cf3da4386000ea0ddeb0aн6097698f

Здравствуйте! Дорогой Спартак!
Благодарю Вас за очень приятную рецензию!
С уважением, Виктор Перепёлкин из Омска

Люблю я эту публику. Они очень терпеливые! Вот выпущу скрипт для спама и придется им терпеть еще больше!

Перемешивание одномерного массива JavaScript

Создавая различные скрипты, на различные нужду, я постоянно сталкивался с проблемой рандомизации различного контента. Благо еще с первых курсов университета написал для себя общий алгоритм перемешивания. Во многих языках программирования уже есть функции перемешивания массивов, кроме JavaScript.

Что же, для себя я обнаружил два пути решения проблемы. Это собственная функция и прототип. Рассмотрю оба решения:

Прототип

Решение оказалось простым и мне его подсказал знакомый программист, работающий с JS.

[sourcecode language=»javascript»]
Array.prototype.shuffle = function() {
return this.sort(function() {
return 0.5 — Math.random();
});
};
[/sourcecode]

Мы просто вызываем метод sort с callback функцией возвращающей случайное число! и казалось бы, что этого вполне достаточно, но т.к. мне однажды понадобился чистый рандом, этот метод себя не оправдал.

Что я подразумеваю под чистым рандомом? Ну это как в идеальной теории вероятности вероятность каждого элемента выпасть равна 1 / на количество элементов.

Первые же тесты в разных браузерах себя не оправдали.

[sourcecode language=»javascript»]
Array.prototype.shuffle = function() {
return this.sort(function() {
return 0.5 — Math.random();
});
};

var N = 10000, a = [], i;
for (i = 0; i < 10; i++) { a[i] = 0; } for (i = 0; i < N; i++) { a[[0, 1, 2, 3, 4, 5, 6, 7, 8, 9].shuffle()[0]]++; } alert(a); [/sourcecode]

Тест:

Вот, что выдавали браузеры:

Браузер Массив Квадратичное отклонение (σ)
Chrome 2918 2873 1843 1111 611 351 161 75 40 17 1092.24
Opera 2850 2776 1432 258 234 938 906 458 76 72 996.09
Firefox 1881 1827 1267 718 647 585 392 213 1237 1233 548.38
IE 521 937 795 1321 1021 1129 884 1227 1085 1080 217.75

Естественно эти результаты далеки от того, что мне нужно было и я решил написать свой простенькую функцию:

Функция

[sourcecode language=»javascript»]
shuffle = function(o){
for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[—i], o[i] = o[j], o[j] = x);
return o;
}
[/sourcecode]

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

[sourcecode language=»javascript»]
shuffle = function(o){
for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[—i], o[i] = o[j], o[j] = x);
return o;
}

var N = 10000, a = [], i;
for (i = 0; i < 10; i++) { a[i] = 0; } for (i = 0; i < N; i++) { a[shuffle([0, 1, 2, 3, 4, 5, 6, 7, 8, 9])[0]]++; } alert(a); [/sourcecode]

Тест:

Результаты были превосходные!

Браузер Массив Квадратичное отклонение (σ)
Chrome 994 948 982 1021 1033 1029 978 1013 1011 991  25.08
Opera 1032 1020 1038 951 986 933 1007 997 1021 1015 32.68
Firefox 973 1027 1029 1031 1017 999 967 1011 982 964 25.26
IE 967 1003 1010 974 979 1027 980 1032 1047 981 26.53

Как видите разброс во всех браузерах небольшой и почти одинаковый! Советую пользоваться именно этим алгоритмом.

Насколько я помню, нам рассказывали о нескольких алгоритмах перемешивания массивов, если Вы владеете таковыми, то прошу делиться =)

Полезные комбинации с клавишей [Win] в Windows 7

Клавиша [Win] впервые появилась в 1994 году в клавиатуре Microsoft Natural Keyboard и с тех пор используется практически во всех моделях компьютерных клавиатур. Тем не менее, большинство пользователей до сих пор не реализует в полной мере возможности, которые предлагает этот удобный инструмент. Многие, конечно, открывают с помощью [Win] меню «Пуск» (Start), а в сочетании с [Tab] используют фирменную клавишу для переключения между приложениями во вращающемся интерфейсе Windows Flip 3D, но этим дело и ограничивается.

Между тем, клавиша [Win] способна выполнять в Windows 7 массу других полезных функций для экономии времени — достаточно лишь запомнить несколько простых клавишных комбинаций. В этой статье я перечислю свои любимые способы использования [Win].

[Win]+[R]

С тех пор, как разработчики Microsoft убрали команду «Выполнить» (Run) из меню «Пуск» в Windows Vista, чтобы освободить место для других ярлыков, пользователи активно настаивают на ее возвращении. В Vista для этого можно воспользоваться Редактором локальной групповой политики (Local Group Policy Editor), включив опцию «Добавить команду выполнить в меню «Пуск»» (Add the Run command to the Start Menu). В Windows 7 достаточно поставить флажок «Команда «Выполнить»» (Run command) в диалоговом окне «Настройка меню «Пуск»» (Customize Start Menu).

Но зачем вообще возвращать команду «Выполнить» в меню «Пуск», где она только зря занимает место, если вместо этого можно воспользоваться клавишной комбинацией [Win]+[R]? Попробуйте — сразу почувствуете, как это удобно.

Чтобы всегда пользоваться этой клавишной комбинацией, вообще удалите команду «Выполнить» из меню «Пуск» — тогда вам волей-неволей придется вызывать ее с помощью [Win]+[R]. Первое время придется прикладывать определенные усилия, чтобы привыкнуть, но со временем вы вообще забудете про то, что команда «Выполнить» когда-то была в меню «Пуск».


[Win]+[E]

Одной из первых клавишных комбинаций с [Win], которую я запомнил, была комбинация [Win]+[E], которая используется для открытия папки «Компьютер» (Computer) в Проводнике (Windows Explorer). Однако привыкнуть к ней мне было нелегко — вместо этого я пользовался ссылками в меню «Пуск» или вообще строкой поиска. К тому же, Проводник можно вызвать и с панели задач Windows 7.

Усилием воли я заставил себя полностью переключиться на использование [Win]+[E] вместо ярлыков и ссылок, но то и дело вновь возвращался к привычным способам запуска. Тогда, чтобы приучить себя к этой полезной клавишной комбинации, я удалил кнопку Проводника с панели задач и включил опцию «Не отображать этот элемент» (Don’t Display This Item) для ссылок «Компьютер» и «Документы» (Documents) в диалоговом окне «Настройка меню «Пуск»» (рис. A).


[Win]+[G]

Гаджеты часто перекрываются окнами приложений. Решить эту проблему можно с помощью клавишной комбинации [Win]+[G], которая выводит все гаджеты на передний план поверх открытых окон. Чтобы снова скрыть гаджеты, достаточно щелкнуть в любом месте окна.


[Win]+[пробел]

В то время как [Win]+[G] выводит гаджеты на передний план, клавишная комбинация [Win]+[пробел] наоборот активирует функцию Aero Peek, которая делает все окна прозрачными, позволяя увидеть скрытые за ними гаджеты (рис. C).


[Win]+[Break]

Проще всего мне было запомнить клавишную комбинацию [Win]+[Break] для вызова окна «Система» (System) — наверное потому, что ни для чего другого я клавишу [Break] не использую.


[Win]+[L]

Эту клавишную комбинацию я часто использую на работе, чтобы скрыть конфиденциальные данные от любопытных глаз. Вставая из-за стола, я всякий раз блокирую экран клавишами [Win]+[L], так что войти в систему можно только с использованием пароля. Привыкнуть к этой комбинации было очень легко — она простая и действует моментально.


[Win]+[1-9] и [0]

[Win] в сочетании с цифровыми клавишами позволяет запускать или разворачивать окна уже запущенных приложений на панели задач. Первому после кнопки «Пуск» значку соответствует клавиша [1], второму — [2] и так далее. Если приложение прикреплено к панели задач, но не запущено, его можно запустить соответствующей клавишной комбинацией. Если приложение уже работает, [Win] в сочетании с соответствующей цифровой клавишей вызовет окно программы на первый план.

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


[Win]+[стрелки]

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

Я очень часто использую эти комбинации, т.к. у меня два экрана, соответственно мышкой можно прикрепить окно только к двум сторонам, а таким методом к 4!


А что думаете вы?

Пользуетесь ли вы клавишными комбинациями с [Win]? Собираетесь ли вы использовать описанные в этой статье способы для быстрого привыкания к ним? Поделитесь своим мнением в комментариях!

Фото на память с интернет друзьями! (v1.2)

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

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

Большая просьба, вместо спасибо, оставляйте комментарии, подписывайтесь на обновления и рассказывайте друзьям по социальным кнопкам в конце статьи.

История версий:

(1.0) 16 июня 2011

  • Возможность запустить скрипт только один раз
  • Выдача общего коллажа из фотографий 50*50

(1.15) 18 июня 2011

  • Фотография собственника 100*100 в заглавии страницы
  • Возможность повторного запуска скрипта
  • Статистика в конце страницы
  • Рандомный порядок вывода друзей
  • Исправлена ошибка пустого места (глюк ВКонтакте)

(1.2) 23 июня 2011

  • Оптимизирован код, теперь все работает быстрее
  • Новое оформление фотографии!

Хабраэффект или как я за 4 дня получил 1500 посетителей

Совсем недавно я опубликовал пост, как я получил менее, чем за месяц, абсолютно бесплатно 150 посетителей в сутки и тут же поставил перед собой цель получить 300 в сутки. Идей было много и я начал потихонечку их реализовывать.

Одну из них, я опубликовал вчера вечером. Я захотел собрать рейтинговый список блогов, чтобы читатели запросто могли найти интересный им материал, но до этого пока еще далеко. Самое интересное произошло днем.

Я переводил статью с английского и решил просто посмотреть, сколько у меня посетителей на ЛИ. Время было всего 11 часов дня, а посетителей было больше 300! Я долго смотрел на эту цифру и не мог ничего понять. Откуда? Неужели много людей понажимали на социальные кнопочки и ко мне привалили их друзья? Ответ крылся в статистике.

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

На главной странице Хабра, ничего не было. Нашел ссылку в исходном коде страничке в посте Владимира Юнева, создателя соцсети для разработчиков proggr.ru. В этом посте около 50 ссылок и по моей перешло около 1000 человек! Хабраэффект выдержан. Хотя я немного боялся за свой сайт, что он не выдержит, но хостер не подвел.

Конечно опытный вебмастер запросто скажет, что на следующий день последует разочарование, ведь большая часть людей, попавшие на блог по ссылке, пробудет только в одной статье и не более. В принципе это логично, хоть сейчас у меня почти на 100 посетителей больше, чем вчера в это же время, но это остатки людей, которые вчера не прочли пост на Хабре. Подобное уже случилось с roem.ru, после публикаций на нем постов Дурова, что увеличило посещаемость ресурса в 20 раз, но потом все вернулось на старую колею.

Главное вынести правильный вывод! А он логичен и был описан в прошлом посте. Пишите уникальный контент! Я очень долго лазал по буржунету в поисках сайтов на HTML5 и вот результат! Я прекрасно понимаю, что писать очень трудно и если не писать, то Вы потеряете тех немногих читателей, что есть у Вас, но все же куда лучше творить, что-то свое!

А знаете почему в рунете читатели блогов, сами блоггеры и их не так много? Потому что нет интересных для общей массы тем в блогах. Блоггеры своим СЕО заполнили блогосферу процентов на 80. Вот и остается людям читать немногословный твиттер. Пишите уникальный контент и люди к Вам потянуться!

Каждый блоггер мечтает увидеть вот такую линии посетителей, устремленную в небо...

Как я эверест покорял или 150 уников в сутки за месяц

Я создал этот блог, как поддомен Ассориума еще в конце января 2011 г., но не вел его. Решил посмотреть на что способен движок WordPress. Потом сессия, учеба, работа итого я накатал всего 4 статьи и забыл про блог. Февраль-март я создавал сайт для веб-студии и параллельно изучал новые методы программирования. И вот наступил апрель и меня торкнуло, я вспомнил про свой блог.

Выяснилось, что как только я перестал им заниматься, у меня произошел сбой и тема сбросилась, сбросился и счетчик LI… Так что пульс больше не бился.

Вот я и решил поставить перед собой цель, заставить пульс взлететь хотя бы выше 100 уников в сутки за месяц. На самом деле это очень важно иметь цель, без этого ничего сделать не получается, трудно думать.

Шаг 1. Преображение блога

Одна статья и 10 дней трудов над изучением WP  и изменением темы. Довольно трудно разбираться было поначалу, но потом оказалось, что WP довольно прост и дело пошло быстрее. Добавил кнопочки «Поделиться» от различных соцсетей, добавил плагинов и менял тему, как только мог. Долго провозился с шапкой, у меня у всех проектов одна и та же шапка, она задается скриптом и если навести на название сайта, то выплывет список с остальными сайтами. У WP было очень много собственных стилей, поэтому пришлось попотеть. В итоге все заработало

Шаг 2. Наполнение контентом

Ну это вполне логично. никто  не станет заходить в пустой блог. Правда один вопрос стоял, а что же все таки публиковать? Опыт пока еще не богатый, поэтому публиковал, что мог. Это были в основном посты по дизайну, взятые из-за бугра. Некоторые были и моими собственными.

Простая публикация дает тоже не очень много толку. Кто знает, что где-то в 3 км от него происходит? Поэтому я размещал информацию в соцсетях. Так начали прибывать люди.

Шаг 3. СоцСети блоггеров

Прошлые старания принесли плоды, но этого было мало! Уже середина апреля, а посетителей бывает не больше 40 в сутки. Долгий серф интернета и гугл помогли мне найти очень неплохие соцсети, с немалым количеством посетителей в сутки! Так прорвалась платина! Списочек можно увидеть тут. После добавления анонсов на эти сайты, посетителей становилось все больше и иногда доходило до 70. Но этого все равно было мало.

Шаг 4. Пересмотр дизайна и помощь

На свой день рождения я уехал за город и блог упал с пропасть на 3 дня. После я понял, что нужно что-то новенькое. Вот и решил поспрашивать друзей о дизайне. Многим нравилось, но некоторые высказали свои замечания. 2 суток на верстку, куча мелких, но полезных изменений. Продолжил обновлять плагины и виджеты. Даже создал свой, но потом нашел вариант попроще.

Также пришла идея найти помощника. Человека, которому есть, что писать, но негде. Даже деньги предлагал, но идея была провальна в корне. Все думали, что раз уж блог мой, то и их статьи тоже будут моими. Это уже не так важно. Дело в человеческой психологии. Надеюсь еще найдуться люди, которые захотят вести интересные рубрики здесь.

Но вот смена дизайна пошла на пользу!

Шаг 5. Смена преобладающей темы и конкурсы

Самым главным оказалось выдержать нужную тему. Как только я начал постить статьи и программировании и СЕО, полоска в LI пошла вверх и переплюнула барьер в 100 посетителей. Причем судя по статистике, чаще заходили на те статьи, которые я написал сам! Ну это тоже довольно логично.

Лидерами просмотров стали все статьи рубрики СЕО

Идея конкурсов возникла давно, только вот проводить их было еще рано. А теперь, когда в блоге больше 30 записей, конкурсы приманивают довольно много людей! Так что я теперь несколько раз в месяц буду проводить конкурсы с призами!

Итоги

  • Цели добился и не потратил ни копейки и поставил новую 300 уников в сутки, как добьюсь, расскажу как сделал!

Выводы

  • Никогда не занимайтесь очень долгим копипастом. Ни поисковики, ни люди этого не любят! Но без него не обойтись, он помогает создать иллюзию, что сайт чем-то наполнен.
  • Если бюджет небольшой, то придется попотеть над блогом. Необходимо хотябы 1-2 поста в сутки писать. необходимо раскидывать спам и регестрировать блог в каталогах и сайтах, кидать анонсы.
  • Дружелюбный дизайн, желательно чтобы всего было по минимуму! Не надо накидывать кучу виджетов сразу, людям необходимо привыкнуть к сайту.
  • Конкурсы. Это лучший способ привлечь внимание, так что продавайте велосипед и раздавайте подарки!

Ну и напоследок посетители за месяц. Видно, что за последнюю неделю я получил больше половины траффика.

До 100 уников в блог в сутки!

Очень сложно начинающему блогу получить уникальных посетителей. Трудно в океане сайтов интернета выделиться и показать, кто ты есть на самом деле! Вот и передо мной встала такая же дилемма… Пока я не натолкнулся на несколько сайтов, где можно представлять анонсы своих постов. И хлынул народ на мой блог, которому еще даже месяц не исполнился. В лучшие дни посетителей переваливало за 100.  Вот список социальных сетей для блоггеров по снижению эффективности:

  • webice.ru – делит 1-2 место по эффективности с Блоггерс, обязательно наличие картинки к посту (можно взять на Яндекс.Картинках или обработать скриншот, хотя бы в программе вроде IrfanView (я даже может ее как-нибудь опишу, что за зверь такой)), время на публикацию анонса — до 1 минуты, если есть готовая картинка; до 5 минут, если нужно найти картинку или обработать свою (необходим инвайт! пишите в комментах, указывая настоящий e-mail, вышлю Вам инвайт);
  • bloggers.su — изначально, не особо посещаемая социалка . Но зато сейчас с нее может быть несколько десятков переходов легко, если интересно написать анонс; можно добавлять картинки к анонсам, но не обязательно; время на добавление анонса — 10 секунд при готовом тексте анонса;
  • grabr.ru — высокопосещаемая социалка, первый анонс проходит модерацию, далее — все аппрувится автоматом, может принести хороший траффик на интересные статьи;
  • socialled.ru — продвинутая социальная сеть от Сообщества Блоггеров «Доминиканское SEO», ссылки открыты для индексации, регистрация только по инвайтам (к сожалению пока с инвайтами проблема, но как только все решиться, я обновлю этот пост и Вы сможете получить инвайт в комментах);
  • community-seo.ru — на главную попасть сложно — выводятся только популярные анонсы, остальные живут в Добавленных, время добавления анонса до 30 секунд за счет нескольких отдельных шагов, можно добавить картинку. Для новых участников — ограничение по числу анонсов в сутки (от 1).
  • webdigg.ru — просто и со вкусом, максимум 10 секунд на добавление анонса, попадающего сразу на Главную, всего 3 поля нужно заполнить, картинкой ставится скриншот блога — автоматом. Можно добавлять без регистрации.
  • seomaster.name – симпатичная социалка с быстрой отправкой (можно без предпросмотра), 15 секунд на анонс, попадающий на Главную;
  • dsocial.ru — еще одна социальная сеть от Сообщества Блоггеров Доминиканское SEO, имеется постмодерация (после публикации — админами) — допускаются только уникальные анонсы, но в этом и главный плюс — от таких анонсов польза и автору и социалке! Ссылки открыты для индексации поисковиками!
  • progg.ru — неплохая социалка с посещаемостью в пару сотен уников в сутки, имеет важный плюс — ссылки с анонсов прямые и открытые для индексации!
  • webfairy.ru – социалка для анонса обзоров софта, всяких фишек дизайнерских и такого прочего (Цитата: «Этот сайт — коллекция кратких материалов, описывающих необходимые и полезные для веб мастера инструменты и полезные ему сервисы»); на Главной показываются только популярные анонсы, остальные — по ссылке Все материалы; время на добавление анонса — 20-30 секунд (и то — первое время, пока не разберешься с расположением кнопок, потом — быстрее);

Также я получил много посетителей при помощи маленького скрипта, который написал сам. Чтобы просмотреть, как получить еще до 50 посетителей не тратя времени, Вам необходимо зарегистрироваться в моем блоге и перейти в статью http://blog.assorium.ru/archives/307

Скоро напишу статью, как привлечь большое количество посетителей с социальных сетей.

HTML5 CANVAS [1.Основы]

Соответственно как и обещал, накатал статейку, собранную многими умами российских программистов. Так, что если Вы уже знакомы с этим тегом и каким прибором его едят, то наверняка увидите знакомые коды. Но после долгих раздумий и собственного опыта, я понял, что это хорошие примеры для начала исследования, что же такое CANVAS.

Если верить англо-русскому словарю, то можно узнать что canvas переводится как холст, а если верить википедии, то можно узнать что тег canvas, это элемент HTML 5, который предназначен для создания растрового изображения при помощи JavaScript. Тому как создать простейшее растровое изображение и будет посвящен моя небольшая статья. Прежде чем начинать пробовать свои силы в этом не легком деле рекомендуется уже иметь базовые знания о том что такое HTML и с чем едят JavaScript.

Предварительная настройка холста

У нашего подопытного тега есть всего два атрибута — height и width, высота и ширина соответственно, по умолчанию размер холста 150х300 пикселей.
Стоит отметить что canvas создает область фиксированного размера содержимым которого управляют контексты.
Элементарный пример:

[sourcecode language=»javascript» htmlscript=»true»]
<html>
<head>
<title>canvasExample</title>
</head>
<body>
<canvas height=’320′ width=’480′ id=’example’>Обновите браузер</canvas>
<script>
var example = document.getElementById("example");
var ctx = example.getContext(‘2d’);
ctx.fillRect(0, 0, example.width, example.height);
</script>
</body>
</html>
[/sourcecode]

Если сохранить эти несчастные 13 строк в файл и открыть его браузером, то можно будет увидеть область с чёрным прямоугольником, так вот это и есть тот самый холст, на котором нарисован прямоугольник размеры которого равны размерам canvas’а.

Обновите браузер

Прямоугольники

Самой элементарной фигурой которую можно рисовать является прямоугольник. Предусмотрено три функции для отрисовки прямоугольников.
strokeRect(x, y, ширина, высота) : Рисует прямоугольник
fillRect(x, y, ширина, высота) : Рисует закрашенный прямоугольник
clearRect(x, y, ширина, высота) : Очищает область на холсте размер с прямоугольник заданного размера

[sourcecode language=»javascript» htmlscript=»true»]
<html>
<head>
<title>rectExample</title>
</head>
<body>
<canvas id=’example’>Обновите браузер</canvas>
<script>
var example = document.getElementById("example");
var ctx = example.getContext(‘2d’);
example.width = 640;
example.height = 480;
ctx.strokeRect(15, 15, 266, 266);
ctx.strokeRect(18, 18, 260, 260);
ctx.fillRect(20, 20, 256, 256);
for (i=0; i<8; i+=2)
for (j=0; j<8; j+=2) {
ctx.clearRect(20+i*32, 20+j*32, 32, 32);
ctx.clearRect(20+(i+1)*32, 20+(j+1)*32, 32, 32);
}
</script>
</body>
</html>
[/sourcecode]

А теперь краткий построчный разбор:
в строках 10 и 11 мы изменили размер холста — чтоб бы задуманное нами изображение полностью отобразилось,
в строках 12 и 13 мы нарисовали два не закрашенных прямоугольника которые будут символизировать своеобразную рамку нашей «шахматной доски»,
в строке 14 отрисовываем закрашенный прямоугольник размеры которого бы позволил вместить в себе 64 квадрата с шириной стороны 32 пикселя,
в строках с 15 по 19 у нас работает два цикла которые очищают на чёрном прямоугольнике квадратные области в таком порядке что бы в итоге полученное изображение было похоже на шахматную доску
Обновите браузер

Линии и дуги

Рисование фигур составленных из линий выполняется последовательно в несколько шагов:
beginPath()
closePath()
stroke()
fill()

beginPath используется что бы «начать» серию действий описывающих отрисовку фигуры. Каждый новый вызов этого метода сбрасывает все действия предыдущего и начинает «рисовать» занова.
closePath является не обязательным действием и по сути оно пытается завершить рисование проведя линию от текущей позиции к позиции с которой начали рисовать.
Завершающий шаг это вызовом метода stroke или fill. Собственно первый обводит фигуру линиями, а второй заливает фигуру сплошным цветом.
Те кто когда-то на школьных 486х в былые годы рисовал в бейсике домик, забор и деревце по задумке учителя тот сразу поймёт часть ниже. Итак, существуют такие методы как,
moveTo(x, y) : перемещает "курсор" в позицию x, y и делает её текущей
lineTo(x, y) : ведёт линию из текущей позиции в указанную, и делает в последствии указанную текущей
arc(x, y, radius, startAngle, endAngle, anticlockwise) рисование дуги, где x и y центр окружности, далее начальный и конечный угол, последний параметр указывает направление

[sourcecode language="javascript" htmlscript="true"]
<html>
<head>
<title>pathExample</title>
</head>
<body>
<canvas id='example'>Обновите браузер</canvas>
<script>
var example = document.getElementById("example");
var ctx = example.getContext('2d');
example.height = 480;
example.width = 640;
ctx.beginPath();
ctx.arc(80, 100, 56, 3/4*Math.PI, 1/4*Math.PI, true);
ctx.fill();
ctx.moveTo(40, 140);
ctx.lineTo(20, 40);
ctx.lineTo(60, 100);
ctx.lineTo(80, 20);
ctx.lineTo(100, 100);
ctx.lineTo(140, 40);
ctx.lineTo(120, 140);
ctx.stroke();
</script>
</body>
</html>
[/sourcecode]
В строке 14 заливается цветом дуга, в строке 22 обводится контур нашей короны.

Обновите браузер

Кривые Бернштейна-Безье

Что такое кривые Безье я думаю лучше объяснит Википедия.
Нам доступно две функции, для построения кубической кривой Бизье и квадратичной, соотвестствено:
quadraticCurveTo(Px, Py, x, y)
bezierCurveTo(P1x, P1y, P2x, P2y, x, y)

x и y это точки в которые необходимо перейти, а координаты P(Px, Py) в квадратичной кривой это дополнительные точки которые используются для построения кривой. В кубическо кривой соответственно две дополнительные точки.

[sourcecode language="javascript" htmlscript="true"]
<html>
<head>
<title>curveExample</title>
</head>
<body>
<canvas id='example'>Обновите браузер</canvas>
<script>
var example = document.getElementById("example");
var ctx = example.getContext('2d');
example.height = 480;
example.width = 640;
ctx.beginPath();
ctx.moveTo(10, 15);
ctx.bezierCurveTo(75, 55, 175, 20, 250, 15);
ctx.moveTo(10, 15);
ctx.quadraticCurveTo(100, 100, 250, 15);
ctx.stroke();
</script>
</body>
</html>
[/sourcecode]

Обновите браузер

Добавим цвета

Что бы наше изображение было не только двух цветов, а любого цвета предусмотрено, два свойства
fillStyle = color : определяет цвет заливки
strokeStyle = color : цвет линий цвет задается точно так же как и css, на примере все четыре способа задания цвета

цвет задается точно так же как и css, на примере все четыре способа задания цвета
// все четыре строки задают оранжевый цвет заливки
ctx.fillStyle = "orange";
ctx.fillStyle = "#FFA500";
ctx.fillStyle = "rgb(255,165,0)";
ctx.fillStyle = "rgba(255,165,0,1)"

аналогично задаётся и цвет для линий.

Возьмём пример с шахматной доской и добавим в него немного цвета:

[sourcecode language="javascript" htmlscript="true"]
<html>
<head>
<title>rectExample</title>
</head>
<body>
<canvas id='example'>Обновите браузер</canvas>
<script>
var example = document.getElementById("example");
var ctx = example.getContext('2d');
example.width = 640;
example.height = 480;
ctx.strokeStyle = '#B70A02'; // меняем цвет рамки
ctx.strokeRect(15, 15, 266, 266);
ctx.strokeRect(18, 18, 260, 260);
ctx.fillStyle = '#AF5200'; // меняем цвет клеток
ctx.fillRect(20, 20, 256, 256);
for (i=0; i<8; i+=2)
for (j=0; j<8; j+=2) {
ctx.clearRect(20+i*32, 20+j*32, 32, 32);
ctx.clearRect(20+(i+1)*32, 20+(j+1)*32, 32, 32);
}
</script>
</body>
</html>
[/sourcecode]

Обновите браузер

Вот впринципе и все основы, которые я нашел в просторах интернета. Они довольно простые, для тех кто знаком с JavaScript. В следующих статьях я рассмотрю обработку изображений и еще несколько интересных штук! Оставайтесь на связи!

JQuery. Основы. 1 урок

Сайт фреймворка

Почему бы не начать изучение клиентского языка программирования с основ JavaScript? Да! Действительно! Но, есть одно но. Расписывать то, что расписано уже по всем просторам интернета…

Я думаю ,что проще всего начать не с основ языка, а с одного очень известного фреймворка, которым пользуются многие крупные компании, такие как Google, Wikipedia итд.

Для чего нужен клиентский язык? Для обработки html страницы! У JS есть полный набор функций и методов для работы на логическом уровне, но также у JS есть способы обратиться к элементам DOM (Document Object Model). Т.е. мы запросто можем обратиться например к скрытому элементу

и сделать его видимым! Но, к сожалению, делать это при помощи только JS очень долго. А еще каждый браузер распознает команды по разному и получается, что для нормальных (Mozila, Opera, Chrome) надо писать один код, а для черезчур выпендрежных (IE) другой, чтобы выполнить одну и туже задачу!

И тут к нам на помощь спешит JQuery! Чудо фреймворк, он кроссбраузерный! Что значит нам не страшен вредный IE, а также безумно прост! Настолько, что даже программирование как таковое не надо знать, для простейших задач!

Итак, начнем!

Для начала его надо подключить в теге вашей страницы!

[sourcecode language=»html»]



Первый урок


[/sourcecode]

Теперь можно вносить изменения в DOM посредством JavaScript+JQuery в несколько раз проще! Сейчас будет немного магии и я все объясню! Напишем пару строк в

[sourcecode language=»html»]




[/sourcecode]

Теперь у нас на страничке есть кнопка и блок на слов, но он пуст. И вот! Настал момент для выхода JavaScript на сцену! Эту небольшую магию мы вставим сразу же после открытия блока

[sourcecode language=»javascript»]
$(document).ready(function() {
$(‘#push_me’).click(function(){
$(‘#blabla’).hide().html(‘Привет мир!!!’).fadeIn(‘slow’)
})
})
[/sourcecode]

Разберем код по кусочкам!

1) $(document).ready(function() { })

Практически все ваши JS скрипты будут начинаться с этих строк! Они значат, что анонимная функция записанная после метода ready будет выполнена, как вся страница будет загружена. Это очень важно! А важно потому, что мы будем апперировать со страницей и если скрипт загрузится раньше, чем страница, то он просто в свои указатели запишет, что этих элементов нет и ничего не произойдет!

Важно! Не забывайте закрывать все скобки и кавычки!

2) $(‘#push_me’).click(function(){})

Все, что стоит в начале это синтаксис, который предлагает JQuery. Он безумно удобен для тех, кто знаком с CSS, и он полностью поддерживает все способы селектинга как и в CSS. В данном случае селектинг ведется по всем элементам с id=»push_me». Все, что стоит за скобками $() есть методы, это могут быть методы и функции JS и в основном JQuery. В данном случае мы просто на все элементы с данным id вешаем обработчик клика. Т.е., как только кто-нибудь кликнет по нашей кнопке, будет выполнена анонимная функция

3) $(‘#blabla’).hide().html(‘Привет мир!!!’).fadeIn(‘slow’)

Знакомый селектинг по id! Теперь мы прячем этот элемент функцией hide(), записываем в него функцией html() сообщение «Привет мир!!!» и медленно выводим его на экран фукцией fadeIn(‘slow’), которая принимает аргумент скорости, выраженный словесно либо в цифрах (долисекундах)

Вот результат наших стараний и полный код!

[sourcecode language=»javascript»]



Первый урок





[/sourcecode]