Кнопки социальных сетей

Кнопки социальных сетей для сайта — что это такое, для чего нужны на сайте и как их установить?

Кнопки социальных сетей нужно ставить так, как описано на этой странице: с помощью скрипта от сервиса Share42.com, а не с помощью плагина или иным образом.

Кнопки социальных сетей — это своеобразные минибаннеры, по нажатию на которые посетители сайта или получают возможность написать в социальных сетях заметку о странице, или — поставить так называемый Лайк, то есть отметить, что страница понравилась.

Есть несколько способов разместить на сайте кнопки социальных сетей:

1) Использование одного из множества плагинов, легко доступных всем, кто использует WordPress. Одним из лучших считается Ya.Share. Это, пожалуй, самый лёгкий и доступный способ.

2) Использование кода, созданного при Вашем участии на специализированном сервисе: например, на сайте pluso.ru фирмы PLUSO. Попробовал и вынужден был отказаться из-за того, что появляется неоправданно много обращений к внешним серверам. Попробовал ещё раз и проанализировал информацию на всех четырёх экранах и рекомендации PingDom, после чего от кнопок PLUSO отказался окончательно и бесповоротно!

Эти кнопки не рекомендую даже пробовать, чтобы не тратить зря время. Значения показателей после установки 10-ти кнопок от PLUSO приведены в таблице. 11-я кнопка выводила на сайт PLUSO, где можно сформировать свой набор красивых кнопок и получить код. Ни за что не следует клевать на эту красивую приманку!

3) Получение кодов кнопок в тех социальных сетях, где Вы зарегистрированы, с последующей индивидуальной установкой. Слишком много мороки!

4) Анализ кодов понравившихся наборов кнопок. Например, хороший набор кнопок увидел на сайте Demos.su. Удалось понять, как созданы и размещены кнопки на сайте. Для этого нужно лишь кликнуть правой кнопкой мыши по набору кнопок, выбрать Исследовать элемент и изучить код в открывшемся окне. Кроме того, можно просмотреть код всей страницы в Валидаторе.

5) Изучение проблемы кнопок в Интернете и следование приемлемым рекомендациям знатоков. Требует множества вдумчивых экспериментов и много возни по следованию рекомендациям.

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

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

Вот таблица сравнительных испытаний с помощью сервиса PingDom:

№ пп Показатель Сервиса Главная страница ep-z.ru Плагин WP Ya.Share Кнопки PLUSO 12-ть  кнопок  share42 Лучший набор  кнопок
1 Perf. grade 78/100 74/100 78/100 76/100
2 Requests 8 9 29 35
3 Load time 496ms 502ms 542ms 826ms
4 Page size 62.5kB 42.1kB 108.9kB 241kB
5 Faster than 97% 97% 96% 92%
6 Size текста 7.1kB 7.1kB 7.1kB 10,3kB
7 Size картинки 38.7kB 4.1kB 37.9kB 16,8kB
8 Size прочего 16.7kB 30.9kB 63,1kB 213,9kB
9 Добавлено 14.2kB 46.4kB 197,2kB
10 PageSpeed Для компьютеров 96 92 93 93
11 Валидатор 0 ош-к 0 ош-к 0.123s. 0 ош-к 0.231s. 0 ош-к 0,238s. ош-к

Сравнение значений показателей в 3-й и 4-й колонках убивает желание дальше заполнять таблицу: плагин столь хорош, что нет никакого смысла тратить время на ещё три колонки. Только из принципа и для самоуспокоения продолжу их заполнение.

Плагин проверил: сделал заметки в 8-ми социальных сетях, лишь в двух пришлось вводить логины и пароли — то ли Firefox их забыл, то ли меня там забыли. В настройках плагина добавил ещё две кнопки. Теперь есть три невидимые, но работающие кнопки. К тому же нет выпадающего меню. Надо бы удалить и заново установить плагин — займусь этим на днях. Проделал это — не помогло.

Показания в пункте 10-ть считаю доказательством того, что Google не любит Яндекс. Когда-то шли переговоры о покупке Яндекса, но по возвращении с переговоров в Москву Илья Сегалович сказал замечательную фразу типа «Давайте попробуем сами»,  и этим на переговорах был поставлен жирный крест! Google теряет сотни миллионов долларов ежегодно, так как в Рунете предпочитают Яндекс.

Установка кнопок от PLUSO в футере прошла без проблем, кнопки крупные и красивые, они более удачно заполняют экран по ширине.  Мне не нравятся 29-ть запросов в пункте 2, и с этим не следует смиряться. Значение в пункте 9 объяснимо большими размерами кнопок.

Надо будет на несколько дней включить этот набор, и лишь потом принимать решение. Должен признать, что моё отношение к кнопкам PLUSO после заполнения колонки в таблице изменилось в лучшую сторону, но всё же 26.03.14 окончательно удалил этот набор кнопок, чтобы прекратить лишние обращения к каким-то странным сайтам. Например, к сайту advombat.ru, который перенаправляет на другой сайт, а тот хвалится, что собирает миллионы cookie ежесуточно… Оно нам надо поощрять такую гнусную деятельность?!

Лучшим способом установки кнопок считаю использование скрипта, который сформирует сервис share42.com с Вашим участием. О существовании кнопок  share42 впервые узнал на demos.su, обратив внимание на красивые и достаточно крупные кнопки. Ночью сформировал набор кнопок, скачал скрипт и инструкцию, но был вынужден отложить установку кнопок из-за ранней утренней поездки с женой.

Чтобы кнопки появились в конце каждой страницы, нужно выполнить такие действия:

1. На хостинге войти в каталог public_html и создать подкаталог share42 с двумя файлами путём распаковки zip-файла, скачанного с сайта share42.com

2. В самом начале файла comments.php поместить такие строчки:

<!— Кнопки share42 соц.сетей над Комментариями —>
<div data-url=»http://Имя_сайта/public_html/»
data-title=»<?php the_title() ?>»
data-image=»http://Имя_сайта/share42/image.jpg»
data-path=»http://Имя_сайта/share42/» data-zero-counter=»1″>
</div>
<script type=»text/javascript» src=»http://ep-z.ru/share42/share42.js»>
</script>
<!—  END —>

Можете попытаться найти более удачное место, чтобы убедиться в конечном итоге, что кнопки социальных сетей должны находиться именно тут.

Можете поэкспериментировать с вертикальным рядом кнопок, но я не стану   использовать его по двум причинам: 1) такие кнопки слишком мозолят глаза и отвлекают внимание; 2) недалёк тот день, когда больше половины посетителей будет приходить со смартфонов и планшетов, поэтому место слева лучше не отдавать кнопкам: замучаетесь сделать так, чтобы они корректно отображались на мобильных гаджетах, и к тому же сдвинете страницу вправо, украв пиксели у страницы своего сайта: сия овчинка выделки не стоит.

Не удивляйтесь тому, что кнопки не отображаются на главной странице сайта: она ж Вам не single (простая), а Главная!

По рекомендации PageSpeed файл icons.png сжал без потери качества. Согласно информации сервиса PingDom, share42 добавляет всего лишь два запроса длиной 2.0 и 15.4 килобайта.

7-ю колонку пока что оставляю пустой — она зарезервирована для испытаний удачного набора кнопок, если такой найдётся.

28.04.2014 на одном уважаемом мной сайте наткнулся на красивый набор кнопок от uptolike  Из принципа скачал набор кнопок и установил. PingDom показал 29-ть дополнительных запросов! Сразу же удалил кнопки от uptolike — не стал даже смотреть кнопки на сайте и анализировать запросы, чтобы не тратить зря время.

24-го ноября 2015-го года после очередного приглашения обновил кнопки share42:

сформировал набор из 14-ти кнопок (к сожалению, не нашёл кнопку сети ВКругуДрузей),

закачал файл share42.zip на свой ноутбук,

создал на ноутбуке папку share42,

скопировал в неё два файла из share42.zip,

затем перенёс их в папку share42 на хостинге, заменив старые два файла.

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

И не забывайте, пожалуйста, нажимать на кнопки социальных сетей, которые расположены под текстом каждой страницы сайта.
Кнопки социальных сетейПродолжение тут…

Deviz_17

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Проверка комментариев включена. Прежде чем Ваши комментарии будут опубликованы пройдет какое-то время.