Блог ПРОФЕССОРА

Плагин «XML Sitemap Pro» - настройте ваш sitemap.xml!

Sun, 18 Mar 2012 13:15:54 +0600

Всем веб-мастерам известно, что оценка «Качественный сайт», которую ставят вашему детищу поисковые системы, складывается из множества факторов. Один из таких факторов - количество ошибок индексации сайта поисковой системой. Есть ли у Яндекса/Гугла проблемы с индексацией вашего сайта можно узнать с помощью соответствующих сервисов этих систем. Именно с помощью сервиса Яндекс.Вебмастер я увидел, что Яндекс пытается индексировать кучу "несуществующих" страниц недавно разработанного сайта, а именно, были обращения к страницам меток, юзеров, служебных категорий и служебным страницам. "Несуществующие" они потому, что в шаблоне даже не было сделано обработчика для них или же потому, что на сайте не должно было быть ссылок на эти страницы (как правило, такие страницы нужны для служебных целей или для тестирования контекстной рекламы и нет желания скармливать их поисковым роботам).

Когда я увидел, что творится такое - был «малость» удивлён. Главным вопросом было - где Яндекс нашёл ссылки на страницы типа «/tag/» , страницы типа «/author/» и ещё нескольких страниц в slug «/page/»? В шаблоне сайта-визитке нет обработчика страниц меток. Да, метки заполняются «про запас», но выводить их в большой мир никто не собирался! Также со страницами авторов-юзеров. Если у вас обычный сайт-блог на слегка кастомизированном дефолтном шаблоне, то конечно вам все эти страницы нужны в индексе Яндекса. Но у меня был другой случай (мне не нужны лишние страницы в индексе поисковых систем) и поэтому надо было как-то это безобразие прекращать.

Источник дезинформации поисковиков был найден на первом же шаге - это sitemap.xml, который генерировался стандартным maxsite-овским плагином «XML Sitemap». Плагин простой, как автомат Калашникова. Погуглив, нашёл, что не я один хочу иметь страницу опций настройки этого плагина. Надо? Сделаем! Точнее уже сделал. Вот так выглядит страница настройки:

Как вы можете видеть, кроме широкого спектра настроек указания какие страницы не включать в sitemap.xml, ещё добавил опцию «Приоритеты и частота обновления». С её помощью можно задать отличные от задаваемых движком по-умолчанию параметры повторного обращения поисковых роботов к различным группам страниц.

Считаю, что не стоит все блоги грести под одну гребёнку - вдруг будут созданы более активно обновляемые ресурсы и зачем они должны сами себе наступать на горло?

Пример результата работы плагина можно увидеть здесь. Убедитесь сами, что ничего лишнего в файле нет.

Заключение

В общем, вся эта красота теперь трудится на благо моих сайтов. Если вы хотите, чтобы и у вас в домена сайтах всё с sitemap.xml было на «5+», то вам обязательно нужно улучшить стандартный плагин генерации sitemap.xml до описанного выше функционала. У вас есть два варианта сделать это с моей помощью:

Перечислите 500 рублей на Вебмани или Яндекс.Деньги кошелёк (актуальные платежные реквизиты можно найти здесь). Укажите в примечании к платежу, что «деньги за модернизацию XML Sitemap» и ОБЯЗАТЕЛЬНО(!) ваш E-mail, куда прислать архив с модернизированным кодом плагина. Желательно продублировать информацию о платеже на мой E-mail vimruler@yandex.ru с указанием от кого и где искать платёж.
Предложите ваши бартерные условия! Меня постоянно интересуют вечные индексируемые поисковиками ссылки на мой блог с качественных сайтов/блогов. Но, думаю, возможны и другие варианты. Связаться со мной для обсуждения вариантов можно, например, через контактную страницу.

Обсудить

Хак: jQuery тюнинг админ-страницы «Информация» в MaxSite CMS

Tue, 07 Feb 2012 10:06:20 +0600

Как вы считаете, насколько полезны сведения, которые выводятся в админ-панели MaxSite CMS на странице «Информация»? Напомню, там выводятся блок ссылок на разные страницы о движке, версия движка, две кнопки («проверить последнюю версию» и «сбросить кэш») и, при наличии, закладки плагина «Админ-анонс». Вы часто переходите из админки на официальный сайт движка? Ваши клиенты тоже каждый свой рабочий день начинают с открытия форума MaxSite CMS через админку своего сайта? Лично у меня для этих целей есть закладки браузера, а у клиентов и без движка хватает дел. Но ссылки выводятся каждый раз. Занимают полезное место. Именно с мысли «занимают полезное место» я пришёл к тому, чем я хочу с вами поделиться в этом посте.

Какая информация нужна на странице «Информация»?

Итак, если стандартные ссылки я считаю бесполезными, то что же тогда является, по-моему, полезным? Мой минимальный набор полезных ссылок, которые я устанавливаю всем клиентам по-умолчанию, выглядит так:

Мониторинг посещений сайта через сервис «Яндекс.Метрика»

Панель «Яндекс.Вебмастер»

Сервис «Инструменты для веб-мастеров» от Google.com

Управление счётчиком RSS-подписчиков на сервисе Google Feedburner

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

Не знаю как вам, а на мой вкус, самое интересное/важное место на странице занято тем, на что, в лучшем случае, обратят внимание один раз (в самом начале работы). Я имею в виду блок со стандартными ссылками. Это место великолепно подходит для вывода своей информации, но в движке пока нет стандартных средств для этого. То, что получается в результате работы плагина «Админ-анонс» выглядит, конечно, лучше, чем ничего, но всё равно только очень отдалённо напоминает желаемое. А если не пользоваться встроенной в движок статистикой, то система табов (на одном из табов выводится наш блок ссылок и другая необходимая информация) заметно перегружает страницу бесполезными элементами интерфейса. На мой взгляд, страница «Информация» должна выглядеть хотя бы так:

Нравится? Хотите знать, как я этого добился? Рассказываю по порядку.

jQuery-код для изменения страницы «Информация»

Страница принимает такой вид после работы следующего кода, который нужно разместить в поле «Текст на стартовой странице» плагина «Админ-анонс»:

<script type="text/javascript"><!--
    $(".admin-content .r br:lt(2)").hide();
    $(".admin-content .r ul:eq(0)").hide();
    $(".admin-content .r #tabs-widget-fragment-0 .info")
        .insertBefore(".admin-content .r p:first");
    $(".admin-content #tabs-widget").hide();
// --></script>
[h2]Полезные ссылки: [/h2]
[list]
[*]Мониторинг посещений сайта через сервис 
«[url=http://metrika.yandex.ru/]Яндекс.Метрика[/url]»
[*]Панель «[url=http://webmaster.yandex.ru/]Яндекс.Вебмастер[/url]»
[*]Сервис «[url=https://www.google.com/webmasters/tools/home?hl=ru]Инструменты 
для веб-мастеров[/url]» от Google.com
[*]Сервис управления комментариями 
[url=http://cackle.ru/site/809/comments]Cackle.ru[/url]
[*]Управление счётчиком RSS-подписчиков на сервисе 
[url=http://feedburner.google.com/gfb/#overview]Google Feedburner[/url]
[/list]
<!-- Здесь код счётчиков -->

Из листинга видно, что код написан с использованием jQuery. Эта библиотека подключается по-умолчанию на страницах админки и позволяет лихо (на CSS, тоже можно было бы многое из описываемого достичь, но насколько гибкое решение бы получилось?) манипулировать содержимым страниц, так что вопрос выбора средства достижения цели не стоял в принципе.

Что именно делает скрипт? В первой строчке скрываются два первых BR внутри блока с классом .r, который вложен в блок с классом .admin-content. При этом, отмечу, остальные блоки BR, если они будут присутствовать на странице, останутся нетронутыми. Во второй строке происходить скрытие первого UL списка.

Самое интересное происходит в третьей строке. В ней происходит манипуляция с DOM страницы. Всё содержимое блока с классом .info (который вложен в блок с id равным tabs-widget-fragment-0) вставляется с переносом перед первым параграфом, который вложен в блок с классом .r. Чтобы было понятно, почему именно так и о чём идёт речь, можно заглянуть в html-код страницы. На момент написания статьи нужный фрагмент кода после отработки скрипта выглядел так:

На картинке отчётливо видно, какие блоки были скрыты и куда переместился блок с полезными ссылками. Думаю, теперь также стало понятно, что четвертая строка скрипта скрывает блок с табами. Если вы пользуетесь страницами со статистикой, то последнюю строчку кода вам лучше убрать (иначе потеряете доступ к нужной информации) и вместо неё написать такой код:

    $(".admin-content #tabs-widget ul#tabs-menu li:eq(1)")
        .addClass("ui-tabs-selected");
    $(".admin-content #tabs-widget ul#tabs-menu li:first")
        .hide();

Этот код скрывает первый пустой (после наших предыдущих манипуляций) таб с заголовком «Админ-анонс» и делает активным следующий таб, который имеет заголовок «Статистика».

Ссылку на скачивание исходного кода не даю, ибо он и так весь на ладони.

Постовой в рамках проходящей акции по обмену ссылками сегодня принадлежит сайту MoscowStroi.com, который предлагает услуги строительства и ремонта загородных домов в Подмосковье и СПб. Помимо непосредственной рекламы строительных услуг, на сайте предлагается купить уже готовые загородные дома.

Обсудить

Три GreaseMonkey/Scriptish jQuery-userscript-а для облегчения веб-серфинга

Sun, 05 Feb 2012 17:29:54 +0600

Так уж вышло, что браузерные юзерскрипты я долгое время игнорировал, хотя постоянно натыкался на их упоминание. Думаю, что на меня «пагубно» подействовало впечатление, которое сложилось после прочтения первого упоминания. В тот момент я почему-то сделал для себя вывод, что GreaseMonkey (а именно это средство расширения браузера Firefox считается «основателем» юзерскрипт-движения) используется в основном для автоматизации заполнения форм. Заполнять кучи веб-форм мне тогда не нужно было и я отложил изучение GreaseMonkey в долгий ящик. А зря. Но, как говорится, мир не без добрых людей. В конце прошлого года ко мне обратились с просьбой помочь решить одну небольшую задачу. Суть задачи сводилась к тому, что на одном интранет-сайте была страница со списком товарных позиций, а параметры товара скрывались под «спойлером» (это такая специальная кнопка «свернуть-развернуть»). Человек хотел, чтобы я сделал что-нибудь, после чего спойлерные кнопки автоматически нажимались и происходило разворачивание всей информации по товарным позициям открытой страницы. Так как человек уже намучился с проблемой и даже успел поискать решение самостоятельно, то он мне сразу предложил попробовать решать с помощью GreaseMonkey. Я достаточно быстро разобрался с необходимыми средствами и понял, что GreaseMonkey/Scriptish/Trixie можно использовать не только для заполнения форм, но и в куче других ситуаций. Далее, за несколько минут был написан скрипт, который избавил человека от многолетней муки. А я, чтобы закрепить знания и успех в использовании userscripts, тут же разобрался с несколькими своими давними «веб-занозами». В общем, в продолжении материала предлагаю ознакомиться с тремя скриптами, которые облегчают посещение сайтов habrahabr.ru, offtop.ru и oko-planet.su.

Userscript автоматической авторизации на habrahabr.ru

Не знаю как у других людей, но у меня habrahabr.ru выбрасывает из авторизованной сессии примерно раз в неделю (точнее не приглядывался). Ничего особенного в этом нет, пока не возникает желания добавить статью в свои избранные или проголосовать за статью/комментарий. Обычно приходится переходить на страницу авторизации, вводить пароль/капчу, возвращаться на нужную страницу и обновлять её, чтобы вступила в силу авторизация. Решил я эту проблему таким скриптом:

// ==UserScript==
// @id             habrahabr.ru@scriptish
// @name           habrahabr_auth
// @version        1.0
// @namespace      habrahabr
// @author         vimruler
// @description    auto autorization on habrahabr.ru
// @require        http://code.jquery.com/jquery.min.js
// @include        http://habrahabr.ru/*
// @run-at         document-end
// ==/UserScript==
$(function(){
    var user = GM_getValue("user", "");
    var pass = GM_getValue("pass", "");
    if((user == "") || (pass == "")){
        var user = pass = "";
        while ((user == "") || (pass == "")) {
            alert("Пожалуйста, введите не пустые значения 'логин' and 'пароль'");
            user = prompt("Логин");
            pass = prompt("Пароль");
        }
        GM_setValue("user", user);
        GM_setValue("pass", pass);
    }
    if($("div.userpanel > a.login").length > 0 && confirm('Авторизовать?')) {
        $.ajax({
            type: "POST",
            url: "/ajax/auth/",
            data:   "login=" + 
                    user + 
                    "&password=" + 
                    pass + 
                    "&act=login&redirect_url=http://habrahabr.ru/",
            success: function(msg){
                window.location.reload(true);
            },
            error:function(msg){
                if(confirm('Ошибка. Перебросить на страницу авторизации?')) 
                    window.location = 'http://habrahabr.ru/login/';
            }
        });
    }
});

Логика работы скрипта такая: На пером шаге проводится проверка на наличие данных о логине и пароле. Если данных нет, то пользователю показывается диалоговое окно для ввода логина и пароля и затем они сохраняются в браузере с помощью функций GM API. На следующем шаге происходит проверка наличия характерных для разлогиненного юзера блоков. Если такие есть, то задаётся вопрос о проведении авторизации. Если пользователь утвердительно ответил на этот вопрос, то выполняется авторизационный AJAX-запрос. Пусть вас не смущает, что параметру запроса redirect_url задаётся значение 'http://habrahabr.ru/' - просто нужно соблюсти наличие параметра, но редиректа на эту страницу происходить не будет. Если AJAX-запрос пришёл успешно, то происходит перезагрузка текущей страницы. В случае ошибки пользователю задаётся вопрос о переходе на страницу авторизации. Всё.

Осталось только пояснить содержание некоторых строчек секции метаданных юзерскрипа:

@require - подключаем сжатый вариант jQuery. Использование jQuery значительно облегчает написание userscript-ов. Чтобы не заботиться об актуальности библиотеки подключаем с официального сайта библиотеки.
@include - настраивается фильтр страниц, на которых будет происходить срабатывание скрипта. В данном случае скрипт будет срабатывать на всех страницах сайта.
@run-at - в какой момент запускать скрипт? В данном случае - после того как вся страница будет сформирована.

Скачать userscript habrahabrruscriptish.user.js.zip ¹
ZIP (872 б).

Userscript авторизации на форумах Offtop.ru

Не знаю кто ещё посещает этот внешне очень устаревший сайт, лично я изредка заглядывал раньше в эту ветку форума «Сатсанг». Чтобы увидеть новые сообщения с момента последнего посещения форума нужно быть авторизованным. Авторизация слетает через несколько часов с момента посещения. Каждый раз вбивать логин и пароль - утомляет. Даже простое нажатие клавиши Enter (или мышкой кнопки "Войти") в случае, когда Firefox заботливо подставляет сохранённые данные - утомляет. Теперь решение этой проблемы выглядит так:

// ==UserScript==
// @id             offtop.ru@scriptish
// @name           offtopru_auth
// @version        1.0
// @namespace      offtopru
// @author         vimruler
// @description    auto autorization on offtop.ru/satsang/
// @require        http://code.jquery.com/jquery.min.js
// @include        http://offtop.ru/satsang/*
// @run-at         document-end
// ==/UserScript==
$(function(){
    var user = GM_getValue("user", "");
    var pass = GM_getValue("pass", "");
    if((user == "") || (pass == "")){
        var user = pass = "";
        while ((user == "") || (pass == "")) {
            alert("Please enter nonempty user and password");
            user = prompt("Login");
            pass = prompt("Password");
        }
        GM_setValue("user", user);
        GM_setValue("pass", pass);
    }
    $("input[name=login]").val(user);
    $("input[name=pass]").val(pass);
    $("form:has(input:password)").append(
        "<input name=submit_auth type=hidden valuek>");
    $("form:has(input:password)").submit();
});

Всё примерно так же, как в скрипте для habrahabr.ru, только нет AJAX-запроса - идёт обычный сабмит формы.

Скачать userscript offtopruscriptish.user.js.zip ⁰
ZIP (625 б).

Юзерскрипт для вырезания рекламы на сайте oko-planet.su

Сайт «Око планеты» я посещал в моменты моего интереса к получения неофициальных новостей о происходящем на Земле. Сейчас интерес пропал, но оставалась горечь поражения от неудачи в борьбе с рекламным блоком, который администрация сайта размещала после статей и при этом они умудрялись периодически менять рекламодателя после чего старые Adblock-фильтры переставали работать. Я обрёл своё счастье после написания следующего скрипта:

// ==UserScript==
// @id             oko-planet.su@scriptish
// @name           oko-planet_adblock
// @version        1.0
// @namespace      oko-planet
// @author         vimruler
// @description    hide advertise 
// @require        http://code.jquery.com/jquery.min.js
// @include        http://oko-planet.su/*.html
// @run-at         document-end
// ==/UserScript==
$(function(){
    $("div#dle-content > table > tbody > tr > td > 
                         table > tbody > tr > td > 
                         table > tbody > tr > td.news > 
                         table").hide();
    $("body > table > tbody > tr > td > table > tbody > tr > td > iframe").hide();
});

В этом скрипте видна вся мощь возможностей селекторов jQuery. Суть скрипта - скрывается весь блок, в котором размещается реклама на странице. Пусть владельцы сайта резвятся с перебором рекламодателей без меня. Как получить адрес блока для скрытия? С помощью Firebug! Вот скриншот как был получен селектор-адрес одного из наиболее «труднодоступных» блоков для нужд приведённого выше скрипта:

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

Скачать userscript oko-planetsuscriptish.user.js.zip ⁰
ZIP (458 б).

Заключение

В заключении хотел бы сказать, что для исполнения скриптов я использую Firefox-плагин Scriptish. И хотя в нём есть довольно странные особенности поведения, но на мой личный вкус в нём их меньше, чем в GreaseMonkey, да и удобнее редактировать и управлять скриптами. А проводники мы будем делать из дерева.

Постовой в рамках проходящей акции по обмену ссылками сегодня принадлежит сайту OfficesConcept.com, который занимается продажей офисной мебели для руководителя и персонала в Москве и Санкт-Петербурге. Помимо непосредственной рекламы различной офисной мебели, на сайте также предлагают купить стандартные или мобильные офисные перегородки.

Обсудить

Оживляем сайт jQuery-анимацией в шапке сайта. Мой опыт

Sat, 04 Feb 2012 20:24:22 +0600

Согласитесь, что если на сайте есть гармоничные «двигающиеся» элементы, то сайт выглядит немного более живым и тем самым - более привлекательным. Я считаю, что у любого сайта должна быть визуальная «изюминка». Пусть небольшая, но должна быть. Ещё лучше, если эта «изюминка» будет вызывать «Вау!-эффект» у посетителей. Ну, или должна привлекать и задерживать на себе взгляд серфера. В этой публикации я хочу рассказать о своей работе над «изюминкой» сайта компании «АББ-ЩИТ» и поделиться программным кодом реализации анимации. Суть «изюминки» вы можете видеть уже сейчас на следующей картинке:

Шапка сайта в таком виде появилась случайно. Первоначально я задумывал и предлагал клиенту использовать в шапке галерею изображений с эффектом аккордеона. Из всей массы перебранных jQuery-эффектов этот, на мой взгляд, подходил больше всего. Однако директор компании проявил творческий подход и принял решение разместить в шапке сайта в качестве основы - красивую фотографию города. Без «непонятного аккордеона».

Фото нашлось и купилось относительно быстро. Однако далее встала в полный рост проблема реализации блока ссылок на страницы основных услуг компании. В основное меню, по понятным причинам (мало места), втиснуть ссылки было нельзя. Выпадающее меню (при наведении мышки на пункт «Услуги» основного горизонтального меню должно появляться-выпадать дополнительное вертикальное меню) заказчик посчитал неприемлемым в виду «малозаметности». В то время, как на услугах хотелось бы акцентировать внимание посетителя.

И вот глядя то на аккордеон, то на фото города, мне пришла мысль попробовать разбить фото города на пять частей и сделать каждую часть ссылкой. Плюс к этому, логичным показалось выводить над фото название услуги, соответствующее фрагменту фотографии. В таком виде была заказана вёрстка html-шаблона. Верстальщик предложил реализовать требуемой с помощью тэгов <map> и <area>. Для карты получился примерно следующий CSS+jQuery+html-код:

<style>
.header_right {
    position:relative; 
    float:right; 
    width:693px; 
    padding:0 7px 7px 0;
    text-align:center; 
    font-weight:bold; 
    font-size:12px; 
    color:#fff;
}
.header-text {height:21px; line-height:18px;}
img.layer {position:absolute; right:7px;}
</style>
<script type="text/javascript">
$(document).ready(function() {
    $(".imglink").mousemove(function() {
            $('.services_name').text($(this).attr('alt'));
    });
});
</script>
<div class="header_right">
 <div class="header-text">читать подробнее об услугах:<span class="services_name"></span></div>
 <img src="/images/layer.png" class="layer" width="689" height="249" usemap="#shapes">
 <map name="shapes">
  <area shape="rect" coords="0,0,135,248" href="/page/1.html"
        alt="пультовая охрана">
  <area shape="rect" coords="139,0,270,248" href="/page/2.html" 
        alt="физическая охрана стационарных объектов">
  <area shape="rect" coords="275,0,413,248" href="/page/3.html" 
        alt="личная охрана">
  <area shape="rect" coords="418,0,551,248" href="/page/4.html" 
        alt="сопровождение грузов">
  <area shape="rect" coords="556,0,688,248" href="/page/5.html" 
        alt="охрана мероприятий">
 </map>
 <img src="/images/city.jpg" class="img-header" width="689" height="249"  alt="">
</div>

Здесь приведён не весь код, а только значимая часть для иллюстрации идеи. Думаю, что этого фрагмента кода вполне достаточно для понимания задумки. Пожалуй, только следует пояснить присутствие файла 'layer.png'. Эта картинка реализовывала визуальное разбиение фотографии города на 5 частей с помощью наложения узеньких полосок. Если слова не проясняют ситуацию, то просто взгляните на сами картинки:

Второй файл 'layer-2.png' был нужен для обхода «особенности» отображения прозрачных картинок в IE6.

Такой вариант реализации «изюминки», которая бы привлекала внимание, работал. Но мучила мысль, что «этого мало». Поэтому была проведена длинная череда экспериментов с различным сочетанием эффектов, которые прошиты в библиотеке jQuery. Ничего толкового не получилось - выяснилось, что на карту (<map> ) не применимы большинство эффектов. За всю веб-мастерскую жизнья с html-картами я практически не работал и поэтому не знал о такой особенности, а следовательно - пришлось проделать такой длинный путь. В конце концов, я принял решение поступить менее технологичным, но зато гарантированно рабочим методом (а скорее всего вообще единственно возможным) - разрезать картинку на отдельные кусочки и попробовать прикладывать эффекты уже к ним, в поиске наиболее интересного сочетания.

Так появился следующий html-код и картинки:

<script type="text/javascript">
$(document).ready(function() {
    $(".tbl-header").fadeswitcher({});
});
</script>
<div class="header_right">
 <div class="header-text"><span class="services_name"></span></div>
  <table border=0 cellspacing=0 cellpadding=0 width=689 class="tbl-header">
   <tr>
    <td><a href="/page/pult"><img src="/uploads/header_photos/block1.png" 
         alt="пультовая охрана" class="imglink"></a>
    <td><img src="/uploads/header_photos/line1.png" alt="line1">
    <td><a href="/page/buildprotect"><img src="/uploads/header_photos/block2.png" 
         alt="физическая охрана стационарных объектов" class="imglink"></a>
    <td><img src="/uploads/header_photos/line2.png" alt="line2">
    <td><a href="/page/bodyguard"><img src="/uploads/header_photos/block3.png" 
         alt="личная охрана" class="imglink"></a>
    <td><img src="/uploads/header_photos/line3.png" alt="line3">
    <td><a href="/page/cargoescort"><img src="/uploads/header_photos/block4.png" 
         alt="сопровождение грузов" class="imglink"></a>
    <td><img src="/uploads/header_photos/line4.png" alt="line4">
    <td><a href="/page/eventprotect"><img src="/uploads/header_photos/block5.png" 
         alt="охрана мероприятий" class="imglink"></a>
   </tr>
  </table>
</div>

Из приведённого html-кода видно, что основной функционал, который реализует визуальный эффект, был вынесен в jQuery плагин fadeswitcher:

(function($){
$.fn.fadeswitcher = function(options){
 return this.each(function(){
  options = $.extend({
    name :   'fadeswitcher',
    imgclass :  '.imglink',
    altcopy :  true,
    altcopyclass : '.services_name',
    speed:   500,
    times:   2, // сколько раз мигать
    timeout:  3000,
    autorun:  true
   },options);
  var $this = $(this), 
   current = -1, 
   intervalID = 0,
   altto = $(options.altcopyclass),
   pics = $(options.imgclass),
   count = pics.length - 1,
   run = false,
   methods = {
    init: function(){
     pics.stop(true,true).show();// делаем всех видимыми
      
     $this.bind('mousemove.fadeswitcher',function(){
      methods.stop();
     });
      
     $this.bind('mouseleave.fadeswitcher',function(){
      methods.start();
     });
     pics.bind('mouseleave.fadeswitcher',function(){
      altto.text('');
     });
     pics.bind('mousemove',function(){
      var txt = $(this).attr('alt');
      $(options.altcopyclass).text( txt );
     });
     if(options.autorun) methods.start();
    },
    start: function(){
     intervalID = setInterval(function(){methods.next();},options.timeout);    
     run = true;
    },
    stop: function(){
     if(run){ 
      altto.text('');
      clearInterval(intervalID);
     }
     pics.show();
     run = false;
    },
    next: function(){
     altto.text('');
     current++;
     if(current >= count) current = -1;
     altto.text( pics.eq(current).attr('alt') );
     pics.eq(current).show("pulsate", {times: options.times}, options.speed);
    }
   };
  methods.init();
 });
};
})(jQuery);

Исходный код jQuery-плагина доступен для скачивания:

Скачать код jQuery-плагина «попеременного затухания элементов шапки сайта» ⁵
ZIP (1,04 Кб).

Суть работы плагина сводится к циклическому последовательному переходу от одного фрагмента фотографии к другому. При переходе на следующий фрагмент происходит изменение подписи над фотографией на соответствующую текущему фрагменту. Также к текущему фрагменту применяется эффект визуального затухания с последующим обратным проявлением - pulsate (jQuery). Цикл прерывается, если курсор мышки оказался в области фотографии. Возобновляется цикл при выходе мышиного курсора за пределы области с фотографией. Фрагменты собираются в единую фотографию с помощью таблицы (table). Можно было сделать с помощью div. Но после эпикфейла с map почему-то потянуло использовать проверенные годами приёмы верстки.

Демонстрацию работы данного кода можно увидеть на сайте компании АББ-ЩИТ. Код достаточно очевидный и думаю, что сейчас нет смысла ещё более детально разбирать логику его работы - программисты и так разберутся. Если же у вас всё же возникнут вопросы, то смело задавайте их в комментариях - отвечу (по мере сил и свободного времени). Очень интересуют идеи и предложения по улучшению алгоритма реализации визуального эффекта. Не каждый день занимаюсь разработкой визуальных эффектов на jQuery и поэтому мог что-то упустить или не знать какого-нибудь трюка. Также буду благодарен, если в комментариях вы выскажете своё общее мнение об описанном варианте решения проблемы привлечения внимания к важным элементам сайта.

Постовой в рамках проходящей акции по обмену ссылками сегодня принадлежит сайту AutoTulz.com, который занимается продажей шин и дисков для автомобилей. Помимо непосредственной рекламы различных шин и дисков, на сайте ксеноновые лампы (фары) и парктроники с установкой.

Обсудить

Как привлечь внимание к форме быстрого контакта?

Wed, 01 Feb 2012 21:52:11 +0600

Изучая сайты-визитки компаний никогда не обращал внимания на формы типа «Мы вам перезвоним, только оставьте свои данные». Вроде как незачем было. Но вот на одном сайте смогли-таки привлечь моё разборчивое внимание простым, но очень действенным эффектом - затемнением всего пространства страницы, за исключением самой контактной формы при случайном наведении курсора мышки на форму. При этом получается эдакий визуальный акцент на форме. Похоже у нас на подсознательном уровне есть модель поведения, когда мы инстинктивно ориентируемся в темноте на хоть маленький, но источник света. Так и здесь получается - всё погасло и нам нужно рассмотреть «откуда свет?» В общем, мне этот эффект настолько понравился, что я его тут же применил в своей работе над сайтом фирмы «АББ-ЩИТ». Если вам интересно, то пройдите на сайт компании, посмотрите этот эффект в действии. Форма расположена в сайдбаре и имеет заголовок «Заявка на услугу». А потом можно будет перейти к моему описанию как такой эффект воспроизвести у вас на сайте.

Как оказалось, реализуется такой эффект с помощью использования специальных CSS стилей и небольшого кода на JavaScript. Давайте договоримся, что наша контактная форма расположена в специальном DIV блоке с прописанным атрибутом id (пусть id='request-content') и есть глобальный блок-контейнер с id='request'. Выносить заголовок (caption) формы за пределы этого блока или же оставлять «внутри» - дело ваше. Просто учтите при вёрстке. А я, для наглядности, вынес за пределы формы. Итак, Предположим у вас есть контактная форма, которая в html выглядит так:

<div id="request">
    <h2>Заявка</h2>
    <hr>
    <div class="request-content" id="request-content">
        <form action="" method="POST" class="request-form">
            <p class="input-text">
                <label for="contact_name">Контактное лицо:</label>
                <input type="text" class="text" id="contact_name" name="contact_name" value="">
            </p>
            <p class="input-text">
                <label for="phone_number">Ваш телефон:</label>
                <input type="text" class="text" id="phone_number" name="phone_number" value="">
            </p>
            <p>
                <input type="submit" class="submit" value="Отправить заявку">
            </p>
        </form>
    </div>
    <hr>
    <h3>Мы с вами свяжемся!</h3>
</div>

Теперь нам нужно прописать стили оформления. Впоследствии вы сможете настроить их под себя, экспериментируя со свойствами фона области формы и background-ом. В качестве основы берём такие стили:

<style>
.request-content {
    position: relative;
    z-index: 100;
    padding:10px 6px 1px;
    width: 294px;
    background: none repeat scroll 0 0 #ccffcc;
}
.request-content_hover {
    background: none repeat scroll 0 0 #ffeeee;
    width: 294px;
    padding:10px 6px 1px;
    position: relative;
    z-index: 100;
}
#fade {
    background: none repeat scroll 0 0 #000000;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 50;
}
</style>

Класс .request-content отвечает за внешний вид блока в состоянии «покоя». Класс .request-content_hover описывает внешний вид в момент активности эффекта. Класс с уникальным идентификатором #fade описывает оформления блока, который будет использоваться для создания эффекта затенения страницы. Приведённый код для случая, когда стили прописываются в секции head (т.е. должен быть внедрен в код страницы с помощью пары '<style></style>'). Вы же можете вынести эти классы в ваш общий файл стилей (например, в 'style.css').

Заключительный и основной элемент реализации эффекта - код на JavaScript. Для облегчения задачи и уменьшения самой программы проще реализовать нужный функционал с помощью библиотеки jQuery (не забываем, что в этом случае вам нужно убедиться, что на странице подключается эта библиотека). Код действительно получается более наглядным и простым для понимания. Вот он:

<script type="text/javascript">
    var last_hover = false;
    $(document).ready(function() {
        $('#request-content').hover(
        function(){
            if (last_hover !== true) {
                if ($("#fade").length)
                    $("#fade").remove();
                $("#request").append('<div id="fade" ></div>');
                $("div#fade").fadeTo(0, 0).fadeTo('fast', 0.6);
                $("div#request-content").removeClass('request-content').addClass('request-content_hover');
                last_hover = true;
            }
        },
        function(){
            $("#fade").fadeTo('fast', 0, function() {$(this).remove();});
            $("div#request-content").removeClass('request-content_hover').addClass('request-content');
            if ($("#fade").length)
                $("#fade").remove();
            last_hover = false;
        });    
    });
</script>

Немного поясню. Во-первых, определяется глобальная булевая переменная, которая отвечает за хранение текущего состояния формы. Далее мы видим, что на событие готовности страницы (см. конструкцию '$(document).ready') навешивается функция, в которой уже происходит связывание события попадания мышки на блок ('hover') с блоком, который имеет id='request-content'. При этом обработчику события "попадания на блок мышки" передаётся две функции, которые в конечном итоге и реализуют нужные действия при "попадании" и при "покидании" блока. Думаю, что дальше программисты и сами разберутся как кастомизировать этот код, а «непрограммисты» могут обратиться ко мне за помощью сюда. Тем, кому нужен полный исходный код эффекта, вот ссылка на скачивание:

Скачать код эффекта «Затемнение вокруг контактной формы» ⁶
HTML (2,4 Кб).

Буду благодарен, если в комментариях вы расскажете о других интересных способах привлечения внимания к форме быстрого контакта. Хотя бы покажите сайт, где вы его увидели и тогда, возможно, я опишу, как его реализовать у вас на сайте. Заранее спасибо!

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

Обсудить

Про синхронизацию MaxSiteCMS-сайтов на локальной машине и сервере

Mon, 30 Jan 2012 22:45:40 +0600

В файле install-ru.txt, который идёт в поставке с MaxSite CMS, есть подробные инструкции по установки движка «с нуля» и инструкции по обновлению движка с предыдущей версии. Благодаря им я уже много раз успешно поставил и/или обновил движок сайтов. Однако, в моей практике есть ситуация, которая не описана в мануале, но которая встречается даже чаще, чем указанные ситуации. Я имею ввиду ситуацию, когда сайт создан и уже давно «работает в продакшене» на сервере и возникла производственная необходимость синхронизировать состояние скриптов на машине разработчика с файлами на сервере.

С сервера на локальную машину

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

На локальной машине у меня стоит система Windows 7 (+ Denwer). На сервере стандартно-комфортная конфигурация FreeBSD+Apache+MySQL+Php. Поэтому задача немного упрощается, ибо, как минимум, нет необходимости на локальной машине отслеживать права доступа на файлы скрипта и заботиться о настройках Php и Apache. Поэтому план действий по переносу сайта с сервера на машину разработчика выглядит так:

Делаем резервную копию базы данных с помощью Dumper. При стандартном комплекте движка нужно обратиться по адресу 'http://имя_вашего_сайта/dumper/dumper.php' (при условии, что Dumper у вас настроен и имя папки вы не меняли). На своих проектах я использую следующее поколение Dumper - Sypex Dumper 2.0.9. Поэтому обращение идёт по адресу 'http://имя_вашего_сайта/sxd/' (далее буду писать только для станадартной версии Dumper, а для 2.0.9 всё то же самое - только имя папки меняется соответственно).
Скачиваем по FTP папку с сайтом на локальный компьютер. За всё время работы у меня пока не прижились специальные программы FTP-клиенты - я пользуюсь по старинке FTP-клиентом FAR Manager-а. Обычно я копирую серверные файлы в папку 'S:\home\локальное_имя_сайта\www_serv'.
Настраиваем коннект к базе данных. Нахожу файл 'S:\home\локальное_имя_сайта\www_serv\application\config\database.php' и правлю настройки подключения к базе данных:
Мой стандартный вариант для локального компьютера:
```
$db['default']['hostname'] = 'localhost';
$db['default']['username'] = 'root';
$db['default']['password'] = '';
$db['default']['database'] = 'имя_сайта_db';
```
Эта операция обычно проводится только при первой синхронизации. При повторных синхронизациях можно не править настройки заново, а просто заменить серверный файл настроек на локальный файл. Я делаю так:
- переименовываю 'S:\home\локальное_имя_сайта\www_serv\application\config\database.php' в 'S:\home\локальное_имя_сайта\www_serv\application\config\database.php-serv'
- переименовываю 'S:\home\локальное_имя_сайта\www_serv\application\config\database.php-local' в 'S:\home\локальное_имя_сайта\www_serv\application\config\database.php'
Заменяем локальную версию файлов на скачанную с сервера. Т.е. нам нужно отправить в архив локальную версию сайта и поставить вместо неё работать версию сайта, которую только что скачали с сервера. Обычно я проделываю эту операцию следующим образом:
- переименовываю папку 'S:\home\локальное_имя_сайта\www\' в 'S:\home\локальное_имя_сайта\www_текущая_дата\'
- переименовываю папку 'S:\home\локальное_имя_сайта\www_serv\' в 'S:\home\локальное_имя_сайта\www\'
Контролируем файл '.htaccess'. В некоторых случаях конфигурация сервера на хостинге может потребовать каких-то особенных настроек в файле '.htaccess' (под nginx нужно уточнять) и это надо учитывать. Обычно будет достаточно иметь две версии этого файла - для сервера и локальной машины. Поэтому, если вы столкнулись с такой необходимостью, переименуйте текущий файл (помним, что он только что скачан с сервера) из 'S:\home\локальное_имя_сайта\www\.htaccess' в 'S:\home\локальное_имя_сайта\www\.htaccess-serv'. Теперь скопируем из только что созданной архивной папки файл с настройками для локальной машины 'S:\home\локальное_имя_сайта\www_текущая_дата\.htaccess' в файл 'S:\home\локальное_имя_сайта\www\.htaccess'. Если вы уже не первый раз проходите весь процесс, то файл с локальными настройками у вас уже должен быть и поэтому можно не копировать из архива, а просто:
- переименовываем 'S:\home\локальное_имя_сайта\www\.htaccess' в 'S:\home\локальное_имя_сайта\www\.htaccess-serv'
- переименовываем 'S:\home\локальное_имя_сайта\www\.htaccess-local' в 'S:\home\локальное_имя_сайта\www\.htaccess'
Обновляем локальную базу из серверного бэкапа с помощью Dumper. При использовании Dumper 1.0.8 нужно обратиться по адресу 'http://локальное_имя_сайта/dumper/dumper.php'. При использовании Dumper 2.0.9 обращение идёт по адресу 'http://локальное_имя_сайта/sxd/'.
Проверяю работу сайта обращаясь в браузере по адресу 'http://локальное_имя_сайта/'. Сайт должен нормально открыться. Если возникает ошибка, то ищу причину в соответствии с ней.
Сбрасываем кэш системы. Заходим в админку сайта 'http://локальное_имя_сайта/admin/' и нажимаем кнопку «Сбросить кэш системы». Делаем эту операцию для того, чтобы нам не мешал в разработке накопленный сервером кэш сайта.
Приступаем к работе на локальной машине.

С локальной машины на сервер

Разработка закончена и пора выкладывать новую версию сайта на сервер. Теперь важно определиться с тем, что именно вы будете заливать на сервер. Если изменения коснулись только каких-то отдельных файлов плагинов, стилей, шаблона, то вся операция сводится к закачиванию по FTP изменившихся файлов на сервер с заменой (при необходимости) старых версий файлов. Это самый простой случай. Далее я опишу алгоритм действий в самом сложном случае - когда при работе на локальной машине был произведён апгрейд движка до более свежей версии и со времени последнего создания локальной копии серверной версии сайта менеджеры сайта успели опубликовать несколько постов, закачать несколько фотографий в папку '/uploads/' и изменить значения некоторых настроек шаблона сайта. А вы: добавили несколько важных опций в настройки шаблона, создали виджеты и пару ушек, в которых используются php-код. Итак, алгоритм действий такой:

Переводим работающий на сервере сайт в режим «На обслуживании». Проще всего это сделать с помощью плагина Maintenance. В нём ещё нет (сейчас версия плагина 1.1) возможности ограничения работы с админкой пользователям группы users пока сайт на обслуживании и поэтому нужно предупредить редакторов сайта, что в данный момент с сайтом работать нельзя. Иначе могут возникнуть лишние сложности с обновлением или потеряются данные клиента (если обновляете клиентский сайт).
Переносим сделанные контент-менеджерами и/или комментаторами изменения с сервера на локальную машину. Если изменений не было и вы в этом уверены, то этот этап можно пропустить. Иначе делаем повторный бэкап базы данных сервера с помощью Dumper ('http://имя_вашего_сайта/dumper/dumper.php'). Скачиваем с сервера получившийся файл ('ftp://имя_вашего_сайта/dumper/backup/имя_сайта_db_текущая-дата_текущее-время.sql.gz') и размещаем его в локальной папке 'S:\home\локальное_имя_сайта\www\dumper\backup\'. Делаем бэкап базы данных локальной версии сайта ('http://локальное_имя_сайта/dumper/dumper.php').

ВАЖНО! Если при работе на локальной машине вы задавали какие-то важные и сложные (например, php/html/css-код в настройках ушек/виджетов/плагинов или многострочные опции главного меню сайта) настройки, то перед следующим действием рекомендую открыть текстовый редактор и скопировать в него эти самые куски кода из настроек. Это нужно для того, чтобы быстрее и легче было восстановить значения.

Теперь с помощью Dumper восстанавливаем в базе данных на локальной машине данные, которые перед этим скачали с сервера. Делаем это там же в 'http://локальное_имя_сайта/dumper/dumper.php' с файлом 'http://локальное_имя_сайта/dumper/backup/имя_сайта_db_текущая-дата_текущее-время.sql.gz' (точнее Dumper должен вам предложить на выбор несколько файлов 'имя_сайта_db_текущая-дата_текущее-время.sql.gz', среди которых вам нужно будет выбрать самый свежий по дате-времени).

Когда с базой данных разобрались, пора переходить к файлам серверной папки '/uploads/'. Переименовываем локальную папку 'S:\home\локальное_имя_сайта\www\uploads\' в 'S:\home\локальное_имя_сайта\www\uploads-old\'. По FTP скачиваем полностью содержимое папки сервера 'ftp://имя_вашего_сайта/uploads/' в локальную папку 'S:\home\локальное_имя_сайта\www\uploads\'. Теперь папку 'S:\home\локальное_имя_сайта\www\uploads-old\' можно удалить или переместить в папку с архивами сайта (например, в 'S:\home\локальное_имя_сайта\backups\текущая-дата\uploads-old\').

В заключении этой фазы нужно зайти в админ-панель локальной версии сайта ('http://локальное_имя_сайта/admin/') и пройтись по страницам настроек шаблона, виджетов, ушек и т.п. с целью внесения в базу данных настроек, которые не содержались в предыдущей версии сайта. При необходимости, нужно пользоваться скопированными в текстовый редактор кусками кода (о них говорилось в сноске "ВАЖНО"). После завершения этого этапа можно считать, что на вашей локальной машине находится самая последняя, самая полная, самая рабочая версия сайта. Откройте в браузере 'http://локальное_имя_сайта/' и убедитесь («гуляя» по сайту), что все доработки и нововведения отображаются и работают нормально.
Делаем резервную копию локальной базы данных с помощью Dumper. Для этого открываем 'http://локальное_имя_сайта/dumper/dumper.php'.
Настраиваем параметры подключения к базе данных на сервере. Для этого производим «обратное переименование»:
- переименовываем 'S:\home\локальное_имя_сайта\www\application\config\database.php' в 'S:\home\локальное_имя_сайта\www\application\config\database.php-local'
- переименовываем 'S:\home\локальное_имя_сайта\www\application\config\database.php-serv' в 'S:\home\локальное_имя_сайта\www\application\config\database.php'
Копируем файлы сайта на сервер. Пользуясь FTP-клиентом копируем содержимое папки 'S:\home\локальное_имя_сайта\www\' на сервер в папку 'ftp://имя_вашего_сайта/'. При необходимости подтверждаем замену файлов. Если вы опасаетесь что-либо нарушить и хотели бы иметь возможность «откатить» обновление сайта к предыдущей версии, то можно сперва содержимое папки 'ftp://имя_вашего_сайта/' переместить в любую удобную для вас папку, например, можно перенести в папку 'ftp://имя_вашего_сайта/old/', предварительно создав её (и не перемещая её «саму в себя»). Однако нужно помнить, что сразу после перемещения всех файлов в другую папку перестанет работать сообщение «Сайт на обслуживании» (которое выдаёт плагин Maintenance). На малопосещаемых сайтах это не критично, а на выскопосещаемых ресурсах лучше подобрать утреннее время, когда на сайт приходит минимум посетителей или же совсем отказаться от этого варианта обновления.
Проверяем/устанавливаем права на файлы и папки. После копирования файлов на сервер нужно проверить и при необходимости установить права доступа на некоторые файлы и папки:
- папке 'ftp://имя_вашего_сайта/application/cache/' и всем её подпапкам права CHMOD 777 (разрешение на запись);
- файлу 'ftp://имя_вашего_сайта/sitemap.xml' права CHMOD 666 (разрешение на запись);
- папке 'ftp://имя_вашего_сайта/uploads/' и подпапкам '_mso_float', '_mso_i' и 'mini' права CHMOD 777 (разрешение на запись);
- папке 'ftp://имя_вашего_сайта/dumper/backup/' права CHMOD 777 (разрешение на запись) или же папке 'ftp://имя_вашего_сайта/sxd/backup/' права CHMOD 777 и файлам 'ftp://имя_вашего_сайта/sxd/cfg.php' и 'ftp://имя_вашего_сайта/sxd/ses.php' CHMOD 666 (в случае, если Dumper
  
  2.0.9)
Контролируем файл '.htaccess'. Если вы делали как указано выше, то контроль сводится к «рокировке»:
- переименовываем 'ftp://имя_вашего_сайта/.htaccess' в 'ftp://имя_вашего_сайта/.htaccess-local'
- переименовываем 'ftp://имя_вашего_сайта/.htaccess-serv' в 'ftp://имя_вашего_сайта/.htaccess'
Обновляем серверную базу данных из локального бэкапа с помощью Dumper. При использовании Dumper 1.0.8 нужно обратиться по адресу 'http://имя_вашего_сайта/dumper/dumper.php'. При использовании Dumper 2.0.9 обращение идёт по адресу 'http://имя_вашего_сайта/sxd/'.
Сбрасываем кэш системы. Заходим в админку сайта 'http://имя_вашего_сайта/admin/' и нажимаем кнопку «Сбросить кэш системы».
Проверяем состояние плагина Maintenance. Если плагин включен, то переводим его в нерабочее состояние.
Проверяем работу сайта обращаясь в браузере по адресу 'http://имя_вашего_сайта/'. Сайт должен нормально открыться. Если возникает ошибка, то ищем причину в соответствии с выданным описанием или с помощью изучения логов веб-сервера.
Приступаем к работе с сайтом. И не забудьте уведомить контент-менеджеров о том, что сайт доступен для их работы.

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

В материале не отображен более технологичный способ обновления на оcнове технологий типа SVN. Сделано это по той причине, что SVN в большинстве конфигураций тратит больше ресурсов, чем приносит пользы. Мои слова не повод для начала холивара, ибо SVN мне нравится и по возможности я его использую, но не вижу смысла навязывать технологию людям, которые очень редко ей пользуются (я имею в виду случаи, когда разрабатывается и обслуживается куча относительно мелких сайтов-блогов). Возможно в будущем появится материал об использовании SVN при обслуживании сайтов на MaxSite CMS.

Постовой в рамках проходящей акции по обмену ссылками сегодня принадлежит сайту PhotoMagis.com, который занимается продажей цифровых фотоаппаратов из магазинов в Москве, в Санкт-Петербурге и в Екатеринбурге. Помимо непосредственной рекламы фотоаппаратов и аксессуаров, на сайте опубликованы ознакомительные статьи на тему выбора фототехники.

Обсудить

Насколько успешный вы человек? Маленький тест для самопроверки

Sat, 28 Jan 2012 18:30:13 +0600

Сталкивались ли вы с ситуацией, когда не можете объяснить что происходит вокруг вас и неясно что делать дальше? А может было всё иначе и, наоборот, вы замечали ситуации, когда вам всё понятно и ясно что делать, но вам противно «всё это» видеть (или даже участвовать в происходящем), что становится грустно, уныло и тоскливо на душе? Думаю, что человеку, который ответил «Да» хотя бы на один из заданных вопросов знакомо чувство «неуспешности». Далее я предлагаю простой тест (один вопрос), который позволяет понять причину возникновения такого некомфортного чувства.

Скоро (19 февраля 2012 года) в Россию приезжает Робин Шарма - знаменитый (ага, почему-то когда слышу это слово про неизвестного мне человека, то так и хочется схохмить «в узких кругах» ) эксперт по мотивации, лидерству и развитию личности. По этому случаю в Рунете началась PR-движуха его семинара и книг. Ну и конечно в сети стали появляться фрагменты его трудов. На один из таких цитатников я наткнулся и решил тоже процитировать наиболее подходящее высказывание Шарма (так правильно или нужно говорить «Шармы»?) для того, чтобы вам была понятна «теоретическая база» последующего за цитатой теста. Итак, цитата:

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

В целом, Робин высказался настолько простым языком, что не понять и не согласится с его словами довольно трудно. Однако, мой опыт подсказывает мне, что вся сложность как раз в том, как именно люди себе объясняют услышанное (или увиденное и т.п.). Обычно этот «механизм объяснения» называется мировоззрением. Вот и получается из слов Робина, что чем более «сложные ситуации» с помощью своего мировоззрения человек сможет объяснить себе и при этом не упасть в уныние или агрессию к Миру, тем более успешным будет человек на Земле.

Думаю, что вам известно, что мысленное представление ситуации само по себе не вызывает реализации мысли в реальном мире (иначе «мир превратился бы в сказку»). Тогда я предлагаю вам провести небольшой эксперимент, в результате которого вы сможете понять насколько близко вы приблизились к успешным людям по вашему ответу на вопрос: «Смогли ли вы извлечь положительный опыт из ситуации и тем более развить свой характер или же позитивных объяснений найти не удалось?» Итак, предлагаю вам ситуацию:

2000 лет у вас большой семейный бизнес, который имеет представительства во всех более-менее крупных населённых пунктах Земли. Ваша семья плотно занимает первые 1000 строк рейтинга богачей Forbs. Ваши родственники руководят всеми крупными странами на планете. Все люди Земли так или иначе зависят от вас и надеются на вас. И вот перед вами встаёт вопрос: а почему я до сих пор клюю на интригующе-привлекательные заголовки в каких-то непонятных блогах? Почему я сижу перед экраном монитора и читаю сайт неизвестного мне ПРОФЕССОРА?

Надеюсь вы поняли мою иронию. От всего сердца желаю вам успехов на вашем пути к первым строчкам Forbs

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

Photo by zaraki.kenpachi

Обсудить