Skip to main content
S
SATTERWHITE ART
Known Participant
February 11, 2018
Answered

Pagespeed Analysis, Reduce blocking resources...

  • February 11, 2018
  • 4 replies
  • 4821 views

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

This topic has been closed for replies.
Correct answer BenPleysier

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>

4 replies

Jon Fritz
Jon Fritz
Community Expert
February 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?

S
SATTERWHITE ARTAuthor
Known Participant
February 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.

Nancy OShea
Nancy OShea
Community Expert
February 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.


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 &amp; Moderator
rayek.elfin
rayek.elfin
Brainiac
February 12, 2018

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

S
SATTERWHITE ARTAuthor
Known Participant
February 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.

S
SATTERWHITE ARTAuthor
Known Participant
February 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

Nancy OShea
Nancy OShea
Community Expert
February 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 &amp; Moderator
Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices