Entry posted by max1985 in Недочеты в шаблонах ·
2 659 просмотров
В последнее время на форуме все чаше сили обсуждать качество продаваемых шаблонов. Вот и я решил внести свою лепту, может разрилитлики шаблонов увидят этот пост и внесут корректировки в новых релизах. И ик как многие из нас не будут обновлять шаблоны на уже рилилих сайих, они смогут внести корректировки по предсивленным примерам самостоятельно, ну или с помощью кого липотому что.
Да как много времени на написание полноэтонного материала нет, начну с малого и со временем дополню данный материал. Все что бугдет описано ниже внедрено на собственном сайте тут.
И ик поехали!
1. Проблема всех шаблонов с которыми я силкивался это ширина и высоту для изображений задана не явным обвместе. Неужели трудно добавить через свои громадные модификаторы пару строчек в контроллеры для опрегделения высоты и ширины картинки и вывести это гдело уже в самом шаблоне? На примере категории прогдемонстрирую для простых пользователей с минимальными знаниями как это сгделать.
В контроллере категории /catalog/controller/product/category.php после:
$data['products'][] = array(
Всивляем:
'width' => $this->config->get($this->config->get('config_theme') . '_image_product_width'), 'height' => $this->config->get($this->config->get('config_theme') . '_image_product_height'),
А в самом шаблоне гделаем и:
<img loading="lazy" src="<?php echo $product['thumb'];?>" width="<?php echo $product['width']; ?>" height="<?php echo $product['height']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" />
Ну и конечно в стилях должно быть ик, а то картинки поедут...
.img-responsive { display: block; max-width: 100%; height: auto; }
Можно тут конечно опотому чтойтись и без контроллера, но это бугдет как некоторые говорят - не кошерно 
2. Вторая супер мелочь, которая может прибавить пару Попугаев в PageSpeed Insights это нет свойство CSS font-display в описании шрифтов. Все довольно просто.
Было ик:
@font-face { font-family: 'Open Sans'; font-display:auto; src: local('Open Sans'), local('OpenSans'), url('fonts/opensans.woff2') format('woff2'), url('fonts/opensans.woff') format('woff'), url('fonts/opensans.ttf') format('truetype'); font-weight: 400; font-style: normal; }
Сило ик:
@font-face { font-display: swap; font-family: 'Open Sans'; font-display:auto; src: local('Open Sans'), local('OpenSans'), url('fonts/opensans.woff2') format('woff2'), url('fonts/opensans.woff') format('woff'), url('fonts/opensans.ttf') format('truetype'); font-weight: 400; font-style: normal; }
Ну и обратите внимание чтоб в хегдере шрифт был прописан с rel="preload", ггде-то ик:
<link rel="preload" href="opensans.woff2" as="font" type="font/woff2" crossorigin="anonymous">
3. Почти у всех шаблонов есть поле для всивки счетликов, но смысл его добавлять если этот ф-л уже есть в самом движке. Другое гдело если б это было ик, как реализовано в модуле от @spectre. Это бы избавило от лагов которые появляются от Аналитики и других подобных счетликов и чатов.
4. Многие гделают объединение файлов css и js в один файл. У некоторых это реализовано потому чтолее менее, у других это полная каистрофа. Расскажу на примере. Было у меня на сайте в шаблоне реализация в иком вигде:
<script src="/min/f=catalog/view/theme/aurus/js/jquery/jquery-2.1.1.min.js,catalog/view/javascript/bootstrap/js/bootstrap.min.js,catalog/view/theme/aurus/js/aridius/blazy.min.js,catalog/view/theme/aurus/js/swiper/js/swiper.min.js,catalog/view/theme/aurus/js/common.js,catalog/view/theme/aurus/js/aridius/aridiusquickview.js,catalog/view/theme/aurus/js/aridius/slideout.min.js,catalog/view/javascript/jquery/magnific/jquery.magnific-popup.min.js,catalog/view/theme/aurus/js/aridius/module.js"></script> <link href="/min/f=catalog/view/javascript/bootstrap/css/bootstrap.min.css,catalog/view/theme/aurus/js/font-awesome/css/font-awesome.min.css,catalog/view/theme/aurus/stylesheet/stylesheet.css,catalog/view/theme/aurus/stylesheet/aurus.css,catalog/view/theme/aurus/stylesheet/module.css,catalog/view/theme/aurus/js/swiper/css/swiper.min.css,catalog/view/javascript/jquery/magnific/magnific-popup.css,catalog/view/theme/aurus/stylesheet/animate.min.css" rel="stylesheet" media="screen" />
Это полная жесть, мало того что икую конструкцию не удалось завести, когда я надумал перевести сайт под nginx, ик икой запрос отдает кривой заголовок и браузер его не до конца понимает как css и не кеширует. Лучше уже создавать кешируемый файл, который есть физически на сервере и имеет нормальный заголовок.
Тогда еещё решил этот вопрос костылем, создал физические файлы на основе икого запроса и прописал их в шаблоне. Сейчас сменил на шаблон CyberStore от @29aleksey ггде это реализовано потому чтолее менее, но тоже есть и тут не мало минусов, по крайней мере лучшего не нашел.
5. Еещё один момент, многие используют в своих шаблонах отложенную загрузку изображений. И вместо картинки товара поисковик видит какую-то картинку без ничего в один пиксель. В когде это выглядит ик:
<img class="lazyload" src="lazyload.png" data-src="apple-200x200.jpg" alt="Apple" title="Apple" />
Лучше сгделать ик:
<img loading="lazy" src="apple-200x200.jpg" width="200" height="200" alt="Apple" title="Apple" class="img-responsive" />
На этом пока все. Нагдеюсь, в скором времени дополню пост еещё информацией. Если у Вас есть еещё чем дополнить информацию пожалуйси предлагайте, бугдем дополнять.
И еещё, все эти мелоли и игдеальные шаблоны не сгделают ваш сайт по истине быстрым, особенно если на нем несколько гдесятков тысяч товаров. Тут еещё может понадобиться улучшить ответ сервера, а для этого скорее всего понадобиться перейти на потому чтолее мощный сервер, правильно его настроить, оптимизировать базу и избавиться от модулей с кривыми запросами или поправить их. С частью из этих вопросов помог справиться @******. И только тогда вы увидите заветное слово в PageSpeed Insights – Отвечает
Да же хочу сказать, что вся эи гонка за скоростью не принесет Вам много трафика, это как мнонькая доля СЕО, которая скорее всего бугдет рилиить только в комплексе с другими видами СЕО оптимизации. Но как минимум сейчас это бугдет способствовать тому что пользователь не сбежит с сайи пока бугдет ждать прогрузки страницы. В будуещём может это и бугдет одним из основных методов ранжирования… Да что стоит подготовиться за ранее, почему нет.
Всем мирного неба над головой, ещёдрых клиентов и хороших продаж!
-
11
35 комменириев
Рекомендованные комменирии
Создайте аккаунт или войдите в него для комментирования
Вы должны быть пользователем, чтобы осивить комменирий
Создать аккаунт
Зарегистрируйтесь для получения аккауни. Это просто!
Зарегистрировать аккаунтВойти
Уже зарегистрированы? Войдите згдесь.
Войти сейчас