Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

Pagespeed Analysis, Reduce blocking resources...

Participant ,
Feb 11, 2018 Feb 11, 2018

Reduce blocking resources

(L)Optimize the order of styles and scripts

The following external CSS files were included after an external JavaScript file in http://satgraphics.com/. To ensure CSS files are downloaded in parallel, always include external CSS before external JavaScript.

https://maxcdn.bootstrapcdn.com/…/bootstrap.min.css

http://satgraphics.com/css/bootstrap-custom.css

I then repositioned the “bootstrap-custom.css” before the “bootstrap.min.css” and ran PageSpeed again.

Continued to receive the error, although I had made the change, which is reflected on the second report, as follows:

The following external CSS files were included after an external JavaScript file in http://satgraphics.com/. To ensure CSS files are downloaded in parallel, always include external CSS before external JavaScript.

http://satgraphics.com/css/bootstrap-custom.css

https://maxcdn.bootstrapcdn.com/.../bootstrap.min.css

4.6K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Feb 12, 2018 Feb 12, 2018

Move the following to the bottom of your document just above the closing BODY-tag

<script async src="https://www.googletagmanager.com/gtag/js?id=UA-112286733-1"></script>

<script>

  window.dataLayer = window.dataLayer || [];

  function gtag(){dataLayer.push(arguments);}

  gtag('js', new Date());

  gtag('config', 'UA-112286733-1');

</script>

Translate
Community Expert ,
Feb 11, 2018 Feb 11, 2018

Just so you understand, getting a perfect score on Page Speed is impossible.  You would need to remove or defer loading all unnecessary CSS & JavaScript references until the landing page has fully loaded.  For most sites, that's not possible unless you have a separate plain vanilla landing page.

Nancy O'Shea— Product User, Community Expert & Moderator
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 11, 2018 Feb 11, 2018

Thanks Nancy,

I was getting close to accepting that I was not going to get them all. In this case, almost all will suffice.

Again,

Thank You

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Mentor ,
Feb 11, 2018 Feb 11, 2018

According to gtmetrix your images would benefit from better optimization. Use a good jpg optimization utility.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018

rayek.elfin,

I'm aware and in process to that end. As I'm using images sized from a previous site, I wasn't sure of which I would use and which I would discard, saving that decision for the final phase. And, since the site is image heavy it will be time consuming and mind numbing, but I'm out of excuses to procrastinate.

Thanks for your input.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 12, 2018 Feb 12, 2018

Maybe I'm missing something here, but the error appears to be telling you to move both of the .css files mentioned to a position in the code before a <script> tag containing a link to a .js file.

Have you done that, or have you only reordered your two .css files as described?

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018

Joh Fritz II,

I did only as I described. I reordered the "bootstrap-custom.css" appear before"bootstrap/3.3.7/css/bootstrap.min.css".

The only script that appears above those (named PageSpeed erro links) is that of "googletagmanager". To best of my knowledge, that GTA script is in proper position.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 12, 2018 Feb 12, 2018

Move the following to the bottom of your document just above the closing BODY-tag

<script async src="https://www.googletagmanager.com/gtag/js?id=UA-112286733-1"></script>

<script>

  window.dataLayer = window.dataLayer || [];

  function gtag(){dataLayer.push(arguments);}

  gtag('js', new Date());

  gtag('config', 'UA-112286733-1');

</script>

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018

Right on the money, Ben Pleysier,

When I first installed GA, I researched the insertion point, and distinctly remembered the instruction was to insert following the <head> tag. Obviously my mistake.

That led me to switch the order of the css as a "just try it" call, as the initial report did not mention the GA script by name, but did the .css links. Guessing would be the key word here.

Reorder of all completed and tested, with good results.  I'd certainly give you a correct, but that has already been done.

Thank You.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018

Uh Oh, ...Panic alert!

On completion  of suggestions, first analysis came back okay, so I reordered all pages same (template pages) and came back with the following console error on index page:

Access to Script at 'https://maxcdn.bootstrapcdn.com/boots%3Etrap/3.3.7/js/bootstrap.min.js' from origin 'http://satgraphics.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://satgraphics.com' is therefore not allowed access. The response had HTTP status code 403.

I checked a couple of other deeper pages, and they seem okay. I pulled up a backup index page, uploaded as it was prior to changing position of GA and out of place css, but still received the above error.

This is WAY over my head.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 12, 2018 Feb 12, 2018

Replace your links to Bootstrap & jQuery with these that contain integrity checks.

<!--Bootstrap 3 CSS-->

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!--latest jQuery 3-->

<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>

<!--Bootstrap 3 JS-->

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

Nancy O'Shea— Product User, Community Expert & Moderator
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018

Nancy,

I did and uploaded... Still getting same error.

I'm even further confused as the original links to Bootstrap & jQuery with these that contain integrity checks were provide by you earlier in year and worked perfectly well.

Although careful to implement other moderators suggestions, that is the only change I made to site today.

Would you like me to start another thread which will allow me to mark "Correct" future actions?

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018

Nancy,

I did a refresh on both local and external servers, and I "think" that solved the problem. I hope.

Apologies for wasting your time, and hope I don't have to revisit this again.

Thank You.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 12, 2018 Feb 12, 2018
When I first installed GA, I researched the insertion point, and distinctly remembered the instruction was to insert following the <head> tag. Obviously my mistake.

Google's instruction is to place the script as high as possible. The reason for this is so that when the page is opened and closed before the page is fully rendered, this can still be registered as a visitor. The downside is that it takes so much longer before the page is rendered.

By placing the script at the end, after the page is rendered, you will miss out on those that have left beforehand. Big deal.

Actually, I have left GA for what it is, a tracking machine for Google sort of like Big Brother is watching. No doubt Google will make eager use of the info that you are collecting for them.

I now use a humble stats counter offered by Plesk as part of my hosting package as per https://bunchoblokes.org/plesk-stat/webstat/ which works silently in the background without affecting performance.

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018
LATEST

Makes perfect sense, even to me.

I used StatCounter for many years, and avoided Google for the same reasons you espoused. But over time I became more engrossed in learning how to do  for myself in the world of code, immersed in the learning just for the sake of learning, and understand at a base level that that game has ended. Google, FaceBook, et al, have won.

At my age, they can't get much out of me. I just chuckle at the thought of how many now complain that the sky is falling on the privacy issue, without realizing it has already been lost. As with every generation, if it's what you are used to it will be "the good old days."

Life is good when one can fall asleep at night without worry about what tomorrow will bring. If your feet hit the floor in the morning, all is good.

All is good...

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018

This is what, at times, can lead to confusion as to what really is ‘best practice”.

After resolution of my query “Pagespeed Analysis, Reduce blocking resources…”

I had stated in the thread that I thought I had properly positioned Google Analytics code according to my initial search for guideace.

==============================================

I did find the page on which I relied, as follows:

https://support.google.com/analytics/answer/1008080?hl=en

“Copy and paste the gtag.js tracking code snippet to each web page you want to track. Add the tracking code snippet right after the opening <head> tag on each page.”

===============================================

Query correctly answered by Ben Pleysier, and moved script to just before </body> which corrected error.

For those of us who don’t have all of this already filed in the recesses of our minds, we rely on research to further our understanding.

Unfortunately, if there is a right answer out there, there will be many more that are wrong… or, not applicable.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 12, 2018 Feb 12, 2018

If you use GA tracking code hosted on Google, you will not pass Page Speed Insights no matter where you put it in your document.   And the workarounds are idictoic. 

PageSpeed Insights 99/100 because of Google Analytics - How can I cache GA? - Stack Overflow

Nancy O'Shea— Product User, Community Expert & Moderator
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018

Just reading all that contorts the mind into a triple twist pretzel. I hereby shed my "Don Quixote" personna, and will no more tilt at windmills.

Thanks Nancy

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 12, 2018 Feb 12, 2018

Re-ording your .css files won't affect that error and could negatively impact your design and layout by moving re-write css above the css it's supposed to re-write.

Try doing what Ben suggests, which would place your css before your javascript as suggested in the error fix.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 12, 2018 Feb 12, 2018

I have reset to the correct .css order, followed Ben's suggestion.

Thanks for your time.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines