accelerated mobile pages complance in new core

soaringeagle
@soaringeagle
9 years ago
3,304 posts
i just noticed google will now give preferential listings to amp pages
amp pages have to conform to certain guidelines and markup, and be served from cache

i realize this may not work for every page
but considering the high percentage of trafifc thats mobile, and rising every day, that preferential treatment by google, simply for having amp compatible pages would be like spending 50 grand on seo to get that same trafic boost

https://support.google.com/webmasters/answer/6340290
this has all the basics for amp
and i think it would require having an alternate amp page .
i mean the ability toi serve standard or amp

perhaps, the best solution would be on mobile to have it default to amp with a switch to full mobile version option and a popup confirmation saying "full mobile version may load slower on slow networks, but proivide a fresher, richer user experience"
something to that effect

this would be a very welcome addition. even if it required a seperate module purchase in order to generate the additional amp pages.

(and since it was my brilliant idea can i get a discount haha i have blown entirely too much money lately)

ideally however, since i spend so much on a high end server it would be great if the amp pages could still serve adsense ads with minimal impact and maximal caching

i have not looked too deeply into whats involved
but basicly there needs to be certain markup identifying it as an amp page, and have minimal "peices"
so it might have to exclude some features like sort by rating and only serve 1 gallery view with all images as 1 css sprite
stuff like that


i know how incredibly hard your working on all the new beta stuff
i just noticed this today so i think its rather new development
if so .. beatting the competition to the punch as they say would be a great way to attract more people to jr if it was 1 of the 1st social platforms to get it implemented
having many many jr sites getting top mobile listings would be a huge plus for us, and for you




--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities

updated by @soaringeagle: 04/29/16 02:06:21PM
brian
@brian
9 years ago
10,149 posts
AMP would all be template related - there's nothing the core needs to do.


--
Brian Johnson
Founder and Lead Developer - Jamroom
https://www.jamroom.net
soaringeagle
@soaringeagle
9 years ago
3,304 posts
ok can you clear this up for me then, would it require site redesign

i thought that the core could offer to serve either a standard view, with all the images, and styling and dynamic content intact, or, serve a stripped down amp version of the same page

if i am wrong, how do i implement this in the templates, and is it possible to reserve the same look feel and user experience


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
soaringeagle
@soaringeagle
9 years ago
3,304 posts
according to this
https://www.ampproject.org/docs/reference/spec.html
it appears to me that it would require an additional page be created, with
<html ⚡> or <html amp>
my keyboard doesnt have that lightening bolt so, not sure how thats done except copy paste
in addition it has to have a conical url linking to the original version of the page

so yea, it is definately not as simple as template changes
in addition it requires special loading parameters
images above the fold inlined, ads only loading when the user will actualy see them, certain tags need to be stripped
some javascripts would need to be stripped
it would have to have a link perhaps in the menu to the accelerated version of the site

luckily css and all thats acceptible, however how things are loaded to minuimize requests to decrease the time before things are accessible, to resize the images to the viewport, and specify sizes in a way that how everything should be displayed can be calculated before rendering begins

i can make an attempt at making my site amp compliant
but it really appears that they expect seperate amp compliant pages from the rest of the site


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
michael
@michael
9 years ago
7,791 posts
You're doing stuff none of us have attempted, so unfortunately, that makes you the expert. :)

I don't have that lightening bolt on my keyboard either, so if it was me, id copy it and use ctrl+paste when I need to use it.
soaringeagle
@soaringeagle
9 years ago
3,304 posts
well the point is that you can use amp instead of the lightening bolt
but the router.php should be able to serve an amp version or standard version of the page
one that's somewhat stripped down and optimized, and designed to be served from cache (i think google cache not server cache but I'm not certain)
the page has to have embeds and forms and such stripped out of it
but should have a load full version link (and vice versa on the full version should have a load accelerated link to make it discoverable)

it i think would be just a mater f an if/then
if mobile and not logged in, then add amp code, remove non compliant code

but your the experts

maybe someone can make an amp module?


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
brian
@brian
9 years ago
10,149 posts
There's no need to make a module - just bring in your "amp" header with an if/else:

{if jrCore_is_mobile_device()}
    {jrCore_include template="amp_meta.tpl"}
{else}
    {jrCore_include template="meta.tpl"}
{/if}

Note that it appears based on the amp documentation that Google will cache this stuff for you, so be aware of that that your changes may not be visible right away.

Using the small "lighting bolt" emoji is about the dumbest thing I have seen in a long time lol.


--
Brian Johnson
Founder and Lead Developer - Jamroom
https://www.jamroom.net
soaringeagle
@soaringeagle
9 years ago
3,304 posts
ok that makes sense, but there is more to it then that
once the amp meta is used, you also have to disable certain elements

like
{if jrCore_is_mobile_device()}
dissalow elements embed, form, etc etc
i forget the whole list
and, it should have a way to switch to the full non Amp..or
perhaps the best way is a note saying "you are viewing a accelerated mobile page, for the full featured page, please login'

then the meta (and tag disabler) would have, if device is mobile and user not logged in
else if device is mobile and user logged in


i agree the lightning bolts stupid
maybe its a mac thing? i dunno

but if you can help me figure this all out and perfect it i think it should be pinned as a user tip

or you know what would be a great idea???
a featured user tips list
or even just a list of posts larked as user tips


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
douglas
@douglas
9 years ago
2,800 posts
With the way Google changes how pages/links are ranked constantly, this sounds a bit overkill to me. Just my 2cents though. ;)


--

Douglas Hackney
Jamroom Team - Designer/Developer/Support
FAQ-Docs-Help Videos
soaringeagle
@soaringeagle
9 years ago
3,304 posts
no, not at all, read up on it, from here on out pages optimized to load extra fast in mobile devices this way will get preferential treatment in all mobile searches
this could mean a huge diference in ranking
if a page moves from page 5 to 1 that's huge
if all your pages do, that's massive

the entire wbs moving towards mobile 1st
mobiles are slower, metered, and have a cost per page
more and more effort will go into lowering the cost per page and increasing the speed o mobile devices to improve user experience and more and more pages that adhere to these guidelines will get prefered treatment

in fact, i just read several reviews of amp
they say performance increases range from 15-85%
and .. not only are amp pages receiving preferred treatment, in the near future those that do not use it will be penalized

already non mobile friendly pages are penalized

id say its not overkill but crucial
seems that most anylists agree


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
soaringeagle
@soaringeagle
9 years ago
3,304 posts
ok, i am willing to attempt this on my network, as a test, however i will need a lil code advice to give it compliance.

i know how to load the custom amp meta,
and how i will load a custom amp head that will have the additional note you are viewing the accelerated mobile page, to view the full page content please log in

but how exactly will i go about disabling the disallowed tags

wait...could it be as simple as a amp stylesheet that sets all disallowed elements to display none?

i desperately need the extra traffic since my servers so damn expenive


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
soaringeagle
@soaringeagle
9 years ago
3,304 posts
i think i figured it all out, but need to know all templates that call the header.tpl

cause i need a amp header and amp meta

also, amp pages need all the css has to be in a amp-css within the head, no external stylesheets (except to fonts)

so if i am to combine all the stylesheets, into 1 wht orders best cause you cant use !important either
wich i use in site.css since i do 99% of all my styling in there so that will go last with all the importants stripped


i'll figure most of it out just need to find every include header
and using windows search serch within contents don't seem to work on tpl files


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
soaringeagle
@soaringeagle
9 years ago
3,304 posts
i am 1/3 of the way done when i ran into a situation that i cannot figure out

it is required to have a link making it discoverable

from the documentation
Linking pages with

In order to solve this problem, we add information about the AMP page to the non-AMP page and vice versa, in the form of tags in the .

Add the following to the non-AMP page:



And this to the AMP page



What if I only have one page?

If you only have one page, and that page is an AMP page, you must still add the canonical link to it, which will then simply point to itself:



how exactly do i ensure the proper urls are built when each module builds it with diferent smarty codes

is there a json way to get the page url
for the non amp page use https as if logged in and on amp page use just http
but otherwise have it create a smarty variable like {$thisurl}

see this is where i am thinking its not simply going to be a matter of just editing templates

if someone can help me solve this issue, i will have a completed user tip tomorrow
i only have to edit the 1/2 dozen pages that call the header template and create a amp header template

i just don't get how I'm supposed to handle this linking thing


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
michael
@michael
9 years ago
7,791 posts
soaringeagle:....i think i figured it all out, but need to know all templates that call the header.tpl

cause i need a amp header and amp meta...

If you just use header.tpl then you don't need to know which places call it. The places that call it will call it, then you can do your "if/else" inside there. That would save having to look and change each location that called it.
soaringeagle
@soaringeagle
9 years ago
3,304 posts
i foiund a way to find them all, but i need 2 header templtes 1 that is amp header 1 that is not

its not truly essential, but is preferred as i want a message saying that it is an amp page, and they should login for the most up to date page

i posted a separate post about the linking problem since it was sort of a separate subject


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
SteveX
SteveX
@ultrajam
9 years ago
2,584 posts
It all sounds a little bit confused. On the one hand Google say that they will give a penalty weighting to pages which don't validate, and they say they will give a penalty to pages which are not amp (which cannot validate).

Will the penalty for having a page which won't validate be smaller or larger than the penalty for having a non-amp valid page? Highly amusing ;)


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
soaringeagle
@soaringeagle
9 years ago
3,304 posts
probably the same
amp pages will get a boost, non amp pages wether you just neglect to make them compliant, or they fail validation will get a penalty

it only applies to mobile searches not standard searches

but there are many times that i look at my real time stats and 100% is mobile or tablet
so it is really really important to gain that edge


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities
SteveX
SteveX
@ultrajam
9 years ago
2,584 posts
Amp pages all fail validation. Give it a try.


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
soaringeagle
@soaringeagle
9 years ago
3,304 posts
what reasons is it giving you for failing


--
soaringeagle
head dreadhead at dreadlocks site
glider pilot student and member/volunteer coordinator with freedoms wings international soaring for people with disabilities

Tags