Responsive дизайн vs. Mobile template

[ataman79]

Здравейте, пускам тази тема тук, защото мисля, че прако се отнася до скоростта на сайта, а от там и указва влияние на Google.

Знам каква е разликата между responsive и mobile template на сайт. Но по-скоро ми се иска да чуя и вашите мнения.
Имам напоследък следния случай. Кллиентският сайт е responsive, но при responsive версията, няма нужда да се показват всички модули (slideshow, picture gallery и т.н.) , а е по-добре да се акцентира върху основните неща при мобилна версия (все пак потребителите да не скролират като луди).
Знам много добре, как да скрия съответните модули или да им разместя позицията при responsive дизайн, НО по този начин аз не спирам модулите да се зареждат, а просто не ги визуализирам, т.е. ако модулите са тежки, то responsive сайта на мобилно устройство си остава със същата скорост. А аз искам да увелича скоростта на зареждане при мобилните устройства. Тука вече според мен идва варианта за Mobile template. При него се указват кои модули да фигурират и кои не.
Според мен mobile template в случаите, в които искаме да изключим дадени модули с цел увеличаване на скоростта на сайта, е по-удачно.
НО какво ползвате вие за превключване към Mobile шаблон, имате ли някакви предпочитани скриптове за Mobile Detect и може ли да ги споделите?

@Еди, мисля, че ти ползваш MobileJoomla. Така ли е? Пълната версия ли ползваш или безплатната?

Ще се радвам и други да споделят своя опит с Mobile Detect и също така искам да разбера дали и вие мислите като мен
Благодаря предварително !

[Уеб дизайн Seo]

Качил съм MobileJoomla по принуда, защото 3dwebdesign.org не е обновяван много отдавна. Причината са добавките за Джумла които все още се продават, иначе отдавна да съм затрил целия сайт и да съм го направил наново. Компонента ни за продажба на добавките за Джумла е много къстъм, в него вложихме доста труд и засега не мога да се откажа от него, затова още кретам с този стар дизайн и MobileJoomla.

Мислил съм да направя и респонсив дизайн на съществуващия, но реших че няма смисъл - просто дизайна си е доста остарял и е необходим напълно нов.

Не ти препоръчвам да се отказваш от някои модули при responsive дизайн. Това което си счел че е ВАЖНО за десктоп версията на сайта, би било добре да се вижда и от мобилните потребители. В противен случай винаги ще загубиш нещо. Препоръките на Гугъл от последните 2 месеца са същите - John Mueller от Google официално съобщи, че е най-добре да имаме в мобилната версия същото съдържание както и в десктоп версията.

Mobile template няма смисъл изобщо да го мислиш - остаряла алтернатива е. Адаптивен дизайн е правиното решение. Ако ти се струва, че сайта ти става тежък, мисли за някакъв начин да олекотиш тези модули. Най-добре напиши и кои точно са те, пусни линка тук, като ти помогнат със съвет 2-3 човека ще видиш, че е имало и други решения

[ataman79]

Mobile template няма смисъл изобщо да го мислиш - остаряла алтернатива е. Адаптивен дизайн е правиното решение. Ако ти се струва, че сайта ти става тежък, мисли за някакъв начин да олекотиш тези модули. Най-добре напиши и кои точно са те, пусни линка тук, като ти помогнат със съвет 2-3 човека ще видиш, че е имало и други решения

За мен варианта да си остана с responsive дизайна е най-лесно. Като пример мога да дам няколко модула, които за мен са излишни при мобилната версия. Единият е слайд шоу на картинки, които презентират новите заглавия ..., Под него има друг модул с 6 таба, който презентира различни раздели от сайта.... има модул с лога на партньори (който за мен е излишно да фигурира в mobile, отделни модули с картинки, които са хубаво направени и водят до вътрешни статии..... които пак ми се струват излишни при mobile.... и чак под тях е същинската част на сайта с продуктите - най-нови, и т.н.
Искаше ми се тези модула да ги направя hidden, защото има да скролираш доста докато стигнеш до продуктите ....
А и тези два модула ми се виждат тежки, първо дизайнера не оптимизира винаги снимките (които в слайда са поне 5-6  с големи резолюции), второ модула с табовете зарежда картинките от K2, т.е. както К2 ги оразмери и съответно там също се трупа доста image материал, който трябва да се оптимизира.
Модула за слайд е: Unite Revolution Slider 2   , за за табовете е използван RokSprocket Module, а и много товари и facebook box-a според мен
Като цяло Desktop версията си е много хубава, но при mobile, ми се струват излишни някои от модулите
Ще пробвам да обновя до последни версии готовите модули, но Google Page Speed не спира постоянно да нотифицира за големината на картинките. А и тези модули тип слайд, си носят след себе си доста js и css...
Затова се замислих  за правене на изцяло mobile template и с mobile detect да ги превключвам.

[Уеб дизайн Seo]

facebook box-a не товари изобщо, стига да си сложил правилния код на правилното място (скрипта зарежда асинхронно). А за слайдшоуто.... я по-добре първо прочети това (една от презентациите ми на тема: Тенденции в разработката на онлайн магазини) и после да говорим за слайдшоута: https://3dwebdesign.org/ecommerce-development-trends.pdf

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

П.С. И пусни накрая линк към сайта да го видя.

[Георги Георгиев]

На Гавик респонзиве темплейтите си имат клас да напишеш в модулите -nomobile, notablet което предполагам не ги зарежда въобще, предполагам и на другите фирми темплейтите си имат същото.

Ти със собствени хватки ли ги скриваш излишните модули или със специално предназначени за целта за твоя темплейт от производителя ?

[Nikitov]

Потвърдавам написаното от Георги и искам да допълня, че на Гавик модулите извеждащи съдържание от К2 си имат функция за преоразмеряване на снимките и качество на снимките, като по този начин може да се оптимизират файловите рамери, които се зарежда.
-------
Ха, НАЗДРАВЕ!

[ataman79]

На Гавик респонзиве темплейтите си имат клас да напишеш в модулите -nomobile, notablet което предполагам не ги зарежда въобще, предполагам и на другите фирми темплейтите си имат същото.
Ти със собствени хватки ли ги скриваш излишните модули или със специално предназначени за целта за твоя темплейт от производителя ?

За шаблоните на Gavick знам. Аз не правя никакви мои хватки по различни от Gavick и всички останали. Използвам си стандартен CSS.
Просто си правя мой CSS клас, който после си го прилагам към даден модул (ако преди това някой от разработчиците е направил такъв клас, разбира се че ще си ползвам него), напр.:

Код: [Маркирай кода]

.phone {
display: none;
}
Може и да се ползва visibility: hidden;

Разликата между двете е , че при display: none; мястото, което е заемал елемента се скрива също, т.е. не се визуализира, докато при visibility: hidden; , мястото, което е заемал елемента си остава, просто не се визуализира елемента.

При двата случая обаче кода се зарежда (нищо , че не се визуализира). Ако ползвам друг шаблон, в който вече съм махнал позициите, тогава ок, но точно това дискутираме с Еди, според който е добре да си ползвам всчико, което го има при Desktop версията, само да го пооптимизирам.

[Уеб дизайн Seo]

PageSpeed Insights показва доста лоши стойности. Първо трябва да си компресираш картинките - започваш с хоум пейдж и продължаваш с всяка важна за теб страница. Имаш предвид, че с нищо не можеш да ги компресираш толкова много колкото ще ги смачка PageSpeed Insights, така че ползваш картинките от него.

След това пак ползваш от PageSpeed Insights минимизираните CSS и скриптове и заместваш оригиналните с тях. Дори само това дотук ще ти вдигне индекса на бързодействие от 44 на 75-80. Само от картинките дава че можеш да спестиш 1 МБ - а това е много.

П.С. Задължително направи и редирект защото и на ввв и без, сайта ти зарежда едно и също, а също по възможност добави и SSL сертификат - безплатния lets encrypt върши чудесна работа. След това редиректваш към https. Ако имаш трудности с редиректите и мигрирането към https, пиши ми на мейла и ще ти отредактирам htaccess файла.

След това вероятно няма изобщо да мислиш за повече олекотяване. Ако не най-бързия сайт, сайта ти ще стане поне по-бърз от 70% от сайтовете, тоест ще си над златната среда. А и класирането на всички страници ще се покачи. Може би не с много, но е осезаемо във времето.

[ataman79]

@Еди, да смятам да ги взема от insight-a картинките и CSS-a.
Какво имаш предвид да компресирам картинките. Всички картинки ги Save-вам с Photoshop като Save for Web на 60% quality. Имаш ли друго предложение?

Току що направих редиректа от non-www към www. Избрах www тък като така е индексиран в google. Както и редиректа на Index.php към домейна
Точно този сертификат ще ползвам - аз даже съм го пуснал на демо на същия сайта (като поддомейн, забранен за индексиране, просто за тест). Мисля, че съм направил всичко ок по редиректа към https. Чакам само картбланш да го направя на главния домейн. Мерси, ако имам проблеми ще те питам.

Съгласявам се с теб Еди, няма да правя Mobile template, и като оптимизирам ще споделя резултата