.
26 Июнь 2015

Оптимизация изображений optipng

Итак, как следствие предыдущего поста — задача оптимизации png изображений (в моём случае).
Всё действо будем делать прямо на сервере, в моём случае под управлением centos.
1. Ставим optipng — yum install optipng
2. Пишем небольшой скрипт, перебирающий все картинки и запускающий optipng с максимальным сжатием
for i in `find -name '*.png'`; do
optipng -o7 $i
done

3. Запускаем его 🙂

вуаля — картинки оптимизированы

но есть одно небольшое (а может и большое) НО! — Гугл анализатор предлагает ещё изменить размер изображений!

Смотрим код — по факту в тегах либо css у многих изображений заданы параметры отображения width либо height — то есть изображения выводятся уменьшенными, а загружаются то целиком!
Соответственно — смысла в таком действии нет никакого, нужно уменьшать!
Но тут, к сожалению, как автоматизировать сей процесс я не придумал 🙁

рубрики: SEO, Администрирование, Полезности, Сайтостроение | Комментарии (1)

26 Июнь 2015

Инструмент web разработчика PageSpeed Insights

Открыл для себя PageSpeed Insights
Анализ страницы — рекомендации разработчику.
Полезная ИМХО штуковина!
Отдельно спасибо AVK за анализ интернет аптеки на форуме sbup.com

Нужно будет список подобных полезных инструментов составить и на отдельную страничку закрепить (задачка на будущее т.к. пока маловато будет).

рубрики: Сайтостроение | Комментарии (0)

18 Июнь 2015

Новый шаблон для РУ фармы

Да простят меня создатели интернет аптек серии novosibirsk.vip-apteka.org, но больно мне понравился их шаблон.
Решил я взять его на свой новый магазин за основу, адаптировав на движек партнерки Доктор Дик (на мой взгляд самая интересная по ру-фарме, ещё бы побольше курьеров по крупным городам — было бы супер).
Собственно, сегодня закончил первый вариант, готовый для показа.
Вот чего получилось -> novosibirsk.men-aptekar.ru
Более «аляписто» вышло, чем в оригинале — но ИМХО не переборщил … хотя конечно «на вкус и цвет …»

Мне как создателю, пока всё нравится — поэтому буду рад объективной критике!

Далее будет задачка поинтереснее — это поисковое продвижение по препаратам, и с учётом не любви Яндекса к линк-биржам тут нужно сильно позадуматься…
Региональная выдача довольно разношерстная (смотрел Новосибирск), тут и novosibirsk.vip-apteka.org с довольно скромным количеством бэков (да и не сказал бы, что очень качественных), и chudonovosibirsk.ru который вообще непонятно как двигается внешними факторами, и «старички» типа виагра-нск.рф с довольно приличным багажем в виде бэков …

рубрики: Партнерские програмы, Сайтостроение | Комментарии (0)

18 Март 2015

HTTPS для домена. Настраиваем подключение SSL сертификата в NGINX.

Новая задачка — клиент подключает на свой сайт Яндекс.Кассу, а там очень настойчиво рекомендуют для взаимодействия использовать шифрованный протокол https.
Ранее с https я лично не сталкивался (вернее сталкивался но только сугубо в роли пользователя)…
Собственно, живём в замечательную эру веб-технологий — нарыл пару отличных статеек (ссылки внизу).
Если в 2х словах — настраиваем nginx на 443 порт и на этом вроде бы всё — на https запрос сайт отвечает, динамику отдаёт, но нет!
При использовании сгенерированного собственноручно сертификата в разных браузерах получаем ругательные ошибки на соединение:

Mozilla Firefox «Это соединение является недоверенным»
1111

google chrome «ошибка нарушения конфиденциальности»
222

яндекс браузер «Сертификат сайта не является доверенным»,
333

opera «ошибочный сертификат»
444

Internet Exploret ЭОшибка в сертификате безопасности этого веб-узла.»
555

Ответ прост — всем им не понравился мой сертификат, и правильно, ведь я его сам и сделал.
Чтобы подобных предупреждений не было — сертификат нужно приобрести в авторизованных сертификационных центрах. Для шифрования и простой проверки домена (Domain Validation, DV) достаточно базового уровня — и такой сертификат можно получить бесплатно в StartSSL.

P.S.
Плюсом добавлю, что Гугл заявлял о том, что в скором времени защищённость соединения будет положительно учитываться в ранжиновании сайтов для поисковой выдачи.

На этом всё, подробнее в исходных статьях:
1. SSL (https) в Nginx — настраиваем NGINX
2. SSL сертификат для сайта — для чего он нужен и где его взять — тут введение о сертификатах
3. Получаем бесплатный SSL сертификат — тут подробнее о получении бесплатного сертификата

Тузла для проверки SSL сертификата сайта, на примере mega-moda.ru

рубрики: Администрирование, Сайтостроение, Справочник | 2 комментария

16 Декабрь 2014

FireBug сеть — анализ скорости загрузки страницы

Продолжаю мучать интернет магазин корейских обоев.
Сейчас решил посмотреть сайт с точки зрения Запрос-Ответ, скорости отдачи контента и в целом как страничка принимается браузером.

Для этой цели я использовал расширение для браузера FireBug — закладка «Сеть» (см.рис).

site-speed

Сразу же обнаружил косячёк — какого то хрена морда дёргает детальные изображения товара, что конечно же сильно притормаживает отдачу страницы в целом!
Рекомендую!

Тяжесть страницы давали все компоненты размещённые на морде.
В данном шаблоне интернет магазина используется MORE_PHOTOS как дополнительные фотки, и у меня там лежат детальные — для возможности просмотра в увеличенном виде.
Эти же детальные используются для вывода дополнительных (вторых) фоток для превьюшки (имхо по идее нужно новое поле делать и пихать туда умешьшенные).
Вырубить эту возможность в настройках компонент не получилось — пришлось «рубить» на живую.
Копирнул все шаблоны и там заменил дополнительные картинки на превью.
(по специфике моего товара мне дополнительные картинки не требуются).

Сраничка стала открываться В РАЗЫ быстрее!!!

Ту же процедуру придётся применить ко всем шаблонам выводящим списком 🙁

рубрики: Полезности, Программирование, Сайтостроение | Комментарии (0)

3 Декабрь 2014

Кликабельный JQuery слайдер для вертикальных изображений

Пост абсолютно не информативный, а даже наоборот — просьба о помощи 🙂

Собственно, ИЩУ кликабельный! JQuery слайдер для вертикальных изображений!

Слайдеров куча, но 99% под горизонтально ориентированные картинки, а та малая часть, что мне подошла — некликабельны 🙁

Слайдер подбирается для морды сайта «Корейские обои для стен«.

В данные момент поставил более менее подходящий для вертикальных картинок — но он не кликабелен 🙁

Исходник слайдера тут

Думал ещё такой слайдер поставить — но он тоже некликабелен 🙁

рубрики: Javascript - JQuery, Полезности, Сайтостроение | Комментарии (0)

20 Ноябрь 2013

Javascript — передача параметра в модальное окно fancybox

Вроде элементарное ТЗ — а промучался полдня.
При клике на «купить» — должно появляться модальное окно «Товар добавлен в корзину» «продолжить покупки» «оформить заказ»
В качестве модального окошка решено использовать скриптик JancyBox — и центрируется и затемняет, в общем всё устраивает!
кроме одного НО! — при нажатии на «купить» товар сначала должен «упасть» в корзину, т.е. нужно вызвать соответствующую функцию с передачей в качестве параметра ID товара

Buy 1111
Buy 2222
$(".modal").fancybox({
	'onStart': function() { 
    	      var id = $(this).attr('rel');
              alert(id);     
           }
});

Так не пашет! — даёт «undefined»

Как вариант — повесить сначала click — в нём сделать нужный вызов, а потом открыть окно имитацией клика
$(«#id2»).trigger(‘click’);

    $("#id1").click(function() {     
    	var id = $(this).attr('rel');
    	$("#inline1").html(id);
	$("#id2").trigger('click');
    });

Но почему-то в таком варианте модальное окно выводится сначала вверх потом только центрируется. Облом!

Гуглим далее — нашел свою обработку Тайтла с помощью собственной фукнции вешаемой параметром TitleFormat
Внутри которой дёрнуть rel можно следующим образом $(currentArray[currentIndex]).attr(‘rel’)

Т.е. вместо задания тайтла я получу ID и вызову нужную мне функцию.

На этом «мудрёном» варианте и остановлюсь — через задний проход конечно, но работает 🙂

P.S.
С вопросом по решению проблемы я создал 3 поста на форумах
phpclub.ru
javascript.ru/forum/
forum.searchengines.ru

На первом ноль реакции, на втором попытались помочь — но безуспешно
На javascript.ru/forum — 200 % попадание в цель!
На основе моего вопроса был создан готовый рабочий пример! В личке вебмастер ответил на мой вопрос — откуда именно инфа с указанием прямых ссылок на нужный мне пример в мануале!

Собственно, как обычно
Рони ответил в ПМ — за что ему ещё раз огромное спасибо!

Как обычно — всё гениальное просто — «Meditate on documentation!»

Дока тут http://fancyapps.com/fancybox/
Пример с передачей ID тут http://jsfiddle.net/Se8Yu/

рубрики: Javascript, Полезности, Программирование, Сайтостроение | Комментарии (0)

2 Сентябрь 2013

vipmaster.net — перспективный SEO форум

Итак, прошу любить и жаловать VIPMaster — Форум ВебМастера и SEO оптимизатора.
Молодой, перспективный SEO форум. Приятный интерфейс со всеми удобными «фенечками» на движке IP.Board
Помимо прямого направления поисковой оптимизации, довольно плотно обсуждаются темы сайтостроения (Web-программирования,Услуги вебмастера), конвертации траяфика (электронная коммерция), коммерция(купля/продажа) и другие не менее интересные темы.
Не буду скрывать, что статья рекламная — и даже наоборот сделаю на этом акцент! Т.к. это говорит о том, что форумом занимаются, форум продвигают и вкладывают в него средства, а это уже залог успеха!
По сути, по настоящему живых SEO форумов не так много, и надеюсь vipmaster.net достигнет высот уровня searchengines.ru!
Форум модерируемый — никакого левого «шлака» нет — всё чётко, по полочкам.
В итоге — рекомендую и даже больше — призываю поддержать ребят на старте!

P.S.
Сам уже зарегался и думаю стану постоянным посетителем.

рубрики: SEO, Администрирование, Вёрстка, Программирование, Реклама, Сайтостроение | Комментарии (1)

5 Июнь 2013

JQuery — мультиселект и cлайдер бегунок

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

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

1. jQuery Dropdown CheckList — TESTING — собственно, готовое решение множественного выбора с различными демонстрационными примерами (мне например сильно пригодилась опция ‘firstItemChecksAll’
2. По слайдеру это вообще стандартное решение на JQuery — заходим на jQuery UI чекаем Slider — скачиваем, настраиваем. Посмотреть различные готовые варианты можно там же.

Пост больше «закладочный» для себя — поэтому без подробностей (на указанных ресурсах всё подробно) — будут подводные камни в реализации — добавлю.
Ну и как закончу фильтр — скину линк для критики.

рубрики: Вёрстка, Полезности, Программирование, Сайтостроение | Комментарии (1)

22 Март 2013

Как выбрать правильную CMS — поучительная история

Обратившись в веб-студию для создания сайта, стоит очень внимательно отнестись к выбору CMS (система управления сайтом).
Так на днях столкнулся с очень интересной и поучительной ситуацией!
Итак, ко мне обратился заказчик с просьбой «навести порядок» в интернет-проекте.
Став разбираться я обнаружил, что проект реализован на самописной CMS к которой разработчики ни коем образом доступ не предоставляют.
Находясь в лёгком шоке я запросил доступ к сайту — ftp, ssh на что так же был получен отказ!
Ну конечно же на просьбу предоставления полного бэкапа сайта для переноса на другой хостинг мне дали понять, что CMS мне не предоставят
(как вы уже поняли — хостинг так же предоставлялся разработчиками под их проекты фактически без какого либо доступа)
Хорошо, хоть доменное имя заказчик догадался оформить на себя …

В общем, пока не поздно — решили бежать от таких разработчиков — движек перекинем на Битрикс.

Напоследок, несколько смешных цитат разработчиков:

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

Во-как! оказывается на клиент-серверных CMS «ядро кода, не подлежит переносу на другую аппаратную платформу.»
Жесть!

Алексей вечер добрый,
это просто клиент-серверное приложение, ядро разработки не передается, клиент подключатся
к серверным разработкам, стоимость проекта входит: фирменный дизайн, наполнение сайта, вертска и стоимость
подключение к сервисам, которые созданы и принадлежат компании на основе авторских прав.
В договоре, изначально было это прописано.

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

Оказывается «Это нормальная практика» 🙂 !!! Ребята отжигают не по-детски!
«В договоре, изначально было это прописано.»

А вот это уже реально серъёзно!
Так, что господа и дамы — чтобы не оказаться на месте клиента в подобной неприятной ситуации — ВНИМАТЕЛЬНО читайте договора!
А то получается — вроде как, сайт Ваш — только вот привязаны Вы к разработчику намертво! и никаких доступов у вас нет!
Если пропал разработчик — хана вашему проекту!
Вот и сидите себе спокойно на бочке с порохом!
А если серъёзно — нужно СРОЧНО забирать всё что предоставят, делать полную выгрузку сайта (например wget-ом) и переносить проект на надёжную, хорошо зарекомендовавшую себя и желательно открытую CMS, вроде Битрикса.

рубрики: CMS, Размышления, Сайтостроение | 5 комментариев

Яндекс.Метрика