Archive

You are currently browsing the archives for the Web category.

Июн

22

Календарь событий Plans

By masster

plans

Недавно мне понадобился календарь в виде органайзера, который бы умел экспортировать события в формат iCal. В принципе несложно написать такой виджет самостоятельно, но сначала я попробовал найти готовое блюдо в сети. Поиск привел меня к календарю Plans, который, как оказалось, многое умеет и не уступает платным скриптам. Написан на Perl, легко инсталлируется, хорошо документирован. Единственное, что вызвало недоумение, так это смесь самих данных (событий) и параметров их визуализации в одном xml файле.

Апр

26

Рисуем на экране - почувствуйте себя художником!

By masster

Чего только нет в Сети! Сегодня мы станем с вами художниками!

Пикассо (Picasso)

picasso

Итак, начнем с Пикассо. На сайте www.mrpicassohead.com с помощью заготовок для овала лица,  носа, глаз и т.п., нарисованных в стиле Пикассо, вы можете создавать свои собственные картины. Вы можете даже подписать их, опубликовать на сайте. Гавное, что ваши картины будут действительно нарисованы в стиле великого мастера!

Сёра (Seurat)

Этот сайт позволит вам стать пуантилистом и начать творить в стиле Сёра. Для рисования понадобится загрузить плагин Adobe Shockwave и инсталлировать его. Рисовать точками довольно утомительно, можно рисовать серией точек, для сделайте двойной щелчок мышью и начинайте рисовать, предварительно выбрав цвет и размер кисти.

seurat

Ван Гог (Van Gogh)

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

vangogh

Матисс (Matisse)

На сайте Художественного музея в Балтиморе есть замечательная ссылка - Matisse for Kids (Матисс для детей). Пройдя по этой ссылке, вы окунаетесь в мир Анри Матисса. Отвечайте на вопросы и собирайте портфолио. А в конце этого виртуального тура вам предложат из предметов с картин Матисса создать собственное произведение, которое даже можно распечатать на принтере.

matisse

Джексон Поллак (Jackson Pollack)

Заходите на сайт JacksonPollock.org и рисуйте каплями! Здорово развивает фанатазию!

pollack

Bomomo.com

bomomo
Это поистине фантастичная программа - огромное множество кистей и стилей позволяет создавать весьма профессиональные рисунки!

Апр

20

SEO оптимизация: как Google индексирует страницы (часть 1)

By masster

Чтобы продвинуть сайт в верхние позиции в Google, хорошо бы знать, как Google индексирует ваши веб-страницы. Мы не будем сейчас говорить о PageRank, а рассмотрим саму индексацию.
Итак, индексация под микроскопом.

Для чего нужны индексы

Каждое слово, которое вы набираете в строке поиска, содержится в сотнях, а то и в миллионах документах, - это зависит от популярности самого слова. Если бы не индексация, то даже на самых современных серверах на работу по отбору документов, в которых это слово встречается, ушли бы часы работы. Поэтому главной задачей индексации, или построения индексов, является увеличение скорости поиска. Чтобы понять принцип индексации, проведем аналогию с библиотекой. Итак, вы пришли в библиотеку, и вам надо найти нужную книгу. Если перебирать все книги подряд, книга за книгой, на это уйдет очень много времени. Другой вариант - обратитьcя к картотеке (к индексу) - буквально за минуты вы найдете нужную книгу, ее расположение на полке.

Как Google строит индекс

Когда бот Google ползает по вашему сайту, он каждой странице, на которую попадает, присваивает уникальный номер (ID). В аналогии с библиотекой - это шифр книги. Этот индекс передается специальной программе, которая строит список слов и связывает каждое слово с этим уникальным номером. Предположим, слово “рекламная” встречается на страницах 12, 31, 56, 57, 92, 134. Слово “акция” встречается на страницах 6, 31, 43, 92, 289. Теперь если ввести в строке поиска “рекламная акция”, то это сочетание будет встречаться в документах 31 и 92.

Стоп-слова

Боты индексируют не все слова - часть слов, не несущих терминологическую нагрузку, вообще не индексируются. Вот часть стоп-слов (на английском), которые не попадают в индексы - i, a, about, an,
and, are, as, at, be, by, for, from, how, in, is, it, of, on, or, that, the, this,
to, was, what, when, where, who, will, with. Если вы пишете пост, то в ссылке на этот пост надо избегать стоп-слов. Для WordPress существует даже специальный плагин.

Основной (Main Index) и дополнительные (Supplemental Index) индексы

Вот уже несколько лет Google держит два индекса - Основной (Main Index) и дополнительные (Supplemental Index). В дополнительный индекс попадают не все слова с сайта, что дает экономию средств, поскольку при числе страниц более миллиарда работать с полным индексом было бы слишком затратно. Дополнительный индекс дает некий компромисс между скоростью поиска и качеством (релевантностью). Естественно, надо стремиться, чтобы как можно большее число ваших страниц находилось в главном индексе. С помощью специального калькулятора, который выдает процент страниц в дополнительном индексе по отношению к общему числу проиндексированных страниц, вы можете посчитать это процент для вашего сайта.
Если вы хотите посмотреть, какие страницы вообще проиндексированы в Google, наберите в строке поиска:

site:yourdomain.ru

Если вы хотите посмотреть, какие страницы находятся главном индексе, наберите в строке поиска:

site:yourdomain.ru -inallurl:yourdomain.ru

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

Апр

20

Лучшие плагины jQuery для работы с формами (часть 2)

By masster

AlphaNumeric

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

$('.sample_calss').alphanumeric();

Здесь подразумевается, что стиль CSS поля ввода относится к классу sample_class:

Теперь пользователь не сможет ввести в этом поле текст <script>

ToggleVal

jQuery toggleval
Назначение этого очень полезногоплагина - очищать поле ввода, задаваемое по умолчанию ( например, “Введите дату…”), при получении фокуса этим полем (например, при щелчке мышью, когла в поле ввода появляется курсор)
Кроме того, он умеет распознавать лэйблы (label) и использовать текст, заключенный между ними, в качестве текста в поле ввода. Если после получения фокуса стиль поля ввода должен меняться - то это тоже легко настраивается.

Input Verfication

jquery verificatopn
Этот плагин помогает наладить проверку данных, которые вводит пользователь
Скачать

Мар

26

Фотогалерея на jQuery - просто великолепно!

By masster

Этот сайт (http://www.lisapram.com/) испанской художницы Lisa Pram поразил меня не только отточенным дизайном, безукоризненной версткой, но и великолепной a la Flash функциональностью. И все это - благодаря jQuery.

http://www.lisapram.com/

http://www.lisapram.com/

Кто еще сомневается, стоит использовать для разработки RIA (Rich Internet Applications) jQuery, после просмотра этого сайта, думаю, все же примет решение именно в пользу jQuery. Удивительно гармонично реализована метафора баркода, который плавно раскрывает изображения из фотогалереи. Интересно сделаны фильтры, отбирающие изображения из категорий: Professional, Experimental , Advertising и Editorial и формирующие на лету динамический баркод. Короче, неслаждайтесь, изучайте исходник, этот сайт - лучшая иллюстрация возможностей jQuery!

Мар

9

Бесплатные иконки для пешеходов (Free icons for walkers)

By masster

Мимо этой витрины  пешеходам трудно пройти - действительно, многие наборы иконок заслуживают чести красоваться в музее иконок, если такой когда нибудь будет создан. Главное - внимательно смотрите лицензионное соглашение на сайтах авторов. В Windows 7 теперь иконки будут на подставке - так, видимо, будет удобнее с ними работать. Короче, принимайте!


Very cool icons from different sites. Most of them are free.


Helix icons


Helix icons

Pioneer Camp

Pioneer Camp

Wifun Icons

Wifun Icons

Massive Media Icons

Massive Media Icons

Baggy Icon Set

baggy-icon-set

Read more »