Moz Q&A is closed.
After more than 13 years, and tens of thousands of questions, Moz Q&A closed on 12th December 2024. Whilst we’re not completely removing the content - many posts will still be possible to view - we have locked both new posts and new replies. More details here.
Fixing Render Blocking Javascript and CSS in the Above-the-fold content
-
We don't have a responsive design site yet, and our mobile site is built through Dudamobile. I know it's not the best, but I'm trying to do whatever we can until we get around to redesigning it. Is there anything I can do about the following Page Speed Insight errors or are they just a function of using Dudamobile?
Eliminate render-blocking JavaScript and CSS in above-the-fold content
Your page has 3 blocking script resources and 5 blocking CSS resources. This causes a delay in rendering your page.None of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.Remove render-blocking JavaScript:
- http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js
- http://mobile.dudamobile.com/…ckage.min.js?version=2015-04-02T13:36:04
- http://mobile.dudamobile.com/…pts/blogs.js?version=2015-04-02T13:36:04
Optimize CSS Delivery of the following:
- http://fonts.googleapis.com/…:400|Great+Vibes|Signika:400,300,600,700
- http://mobile.dudamobile.com/…ont-pack.css?version=2015-04-02T13:36:04
- http://mobile.dudamobile.com/…kage.min.css?version=2015-04-02T13:36:04
- http://irp-cdn.multiscreensite.com/kempruge/files/kempruge_0.min.css?v=6
- http://irp-cdn.multiscreensite.com/…mpruge/files/kempruge_home_0.min.css?v=6
Thanks for any tips,
Ruben
-
Thanks for this; I will implement the practices on my Cybergeak Blog Really Thankful to the engineers
-
Thanks, Thomas!
-
there is not a very easy way to modify HTML on WordPress because it is all based on PHP. Unless you can change the PHP code via by FTP or many other methods including plug-ins it takes a developer.
I know a person who could fix this for you very easily there contact information is in the URL under contact. There are also some plug-ins that will eliminate this
https://wordpress.org/plugins/async-js-and-css/screenshots/
the best methods in my opinion are done by a developer or sometimes a plug-in
http://www.feedthebot.com/mobile/
http://www.feedthebot.com/pagespeed/critical-render-path.html
I will be right back and answer your other questions
Tom
-
Use this to make a critical render path
http://www.feedthebot.com/pagespeed/critical-render-path.html
with
http://www.feedthebot.com/tools/css/ (for CSS)
this for JS
http://javascript-minifier.com/
If you add this it will fix this as well
https://developers.google.com/speed/pagespeed/module/filter-js-minify
-
Actually, I have a quick follow up. In my wp-admin in the editor section, I only see CSS and PHP files. Then, on the ftp, I see a public_html folder, but that folder has a ton of different files in it...none of which end in html. Any suggestions on where this html file might live?
Thanks,
Ruben
-
I will take a look at it. Yes, I do need to do it on our Wordpress site as well, but fortunately, Page Speed Insights doesn't think our desktop version is as abysmal as our mobile one. But, it does still show up as something that should be fixed.
Thanks for the reference material!
- Ruben
-
you will also need to find your Cardinal path and simply combine JavaScript and CSS as well as prioritize content that is above the fold. By doing so this will help you to create one JS file ( possibly more if it is impossible to combine for whatever reason)
See more here
http://www.feedthebot.com/pagespeed/prioritize-visible-content.html
https://developers.google.com/speed/docs/insights/BlockingJS
If WordPress
http://www.wpcub.com/eliminate-render-blocking-javascript-and-css-in-above-the-fold-content/
I really hope this helps,
Tom
-
Hi Ruben,
Here is a tutorial on how to fix that issue. If I could explain it better than this I would however I feel this does a fantastic job if you're doing this on WordPress let me know and I will tell you how to fix it on there is well.
Here's the resource
http://www.feedthebot.com/pagespeed/render-blocking.html
http://www.feedthebot.com/pagespeed/defer-loading-javascript.html
The below code is what Google recommends. This code should be placed in your HTML just before the tag (near the bottom of your HTML file). I highlighted the name of the external JS file.
sincerely,
Thomas
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
Does changing content and design of the website gonna affect my all the backlinks i have made till now
i have been working on my link profile for a month now, after learning about 5 step moz methodology i have decided that i would like to change all of the content of my site and taylor it to what my customers need, am i gonna loose all the domain authority if make changes? if it gonna affect, hows that gonna come out
Web Design | | calvinkj0 -
Does too much inline CSS impact SEO rankings
Hello, Does implementing a lot of inline CSS have a negative impact on SEO rankings? I imagine it could affect page speed, but any other issues I might run in to?
Web Design | | STP_SEO1 -
Block parent folder in robot.txt, but not children
Example: I want to block this URL (which shows up in Webmaster Tools as an error): http://www.siteurl.com/news/events-calendar/usa But not this: http://www.siteurl.com/news/events-calendar/usa/event-name
Web Design | | Zuken0 -
Can anyone recommend a tool that will identify unused and duplicate CSS across an entire site?
Hi all, So far I have found this one: http://unused-css.com/ It looks like it identifies unused, but perhaps not duplicates? It also has a 5,000 page limit and our site is 8,000+ pages....so we really need something that can handle a site larger than their limit. I do have Screaming Frog. Is there a way to use Screaming Frog to locate unused and duplicate CSS? Any recommendations and/or tips would be great. I am also aware of the Firefix extensions, but to my knowledge they will only do one page at a time? Thanks!
Web Design | | danatanseo0 -
Is it cloaking/hiding text if textual content is no longer accessible for mobile visitors on responsive webpages?
My company is implementing a responsive design for our website to better serve our mobile customers. However, when I reviewed the wireframes of the work our development company is doing, it became clear to me that, for many of our pages, large parts of the textual content on the page, and most of our sidebar links, would no longer be accessible to a visitor using a mobile device. The content will still be indexable, but hidden from users using media queries. There would be no access point for a user to view much of the content on the page that's making it rank. This is not my understanding of best practices around responsive design. My interpretation of Google's guidelines on responsive design is that all of the content is served to both users and search engines, but displayed in a more accessible way to a user depending on their mobile device. For example, Wikipedia pages have introductory content, but hide most of the detailed info in tabs. All of the information is still there and accessible to a user...but you don't have to scroll through as much to get to what you want. To me, what our development company is proposing fits the definition of cloaking and/or hiding text and links - we'd be making available different content to search engines than users, and it seems to me that there's considerable risk to their interpretation of responsive design. I'm wondering what other people in the Moz community think about this - and whether anyone out there has any experience to share about inaccessable content on responsive webpages, and the SEO impact of this. Thank you!
Web Design | | mmewdell0 -
Accordion Fold Ups Bad For Google
http://fandicoach.com/products Right now I have these accordion things on the website. Are they bad for google in terms of being an SEO best practice? I want to avoid doing anything black hat. Thanks!
Web Design | | OOMDODigital0 -
CSS vs Javascript vs JQuery drop down navigation
For a user / seo perspective, what is the best way to code a drop down menu nav bar? Is it best to use css, javascript or a scripting library like jquery? I am thinking about overall best practice that will not have a negative impact on serps. I am also thinking about what will work best on all types of devices i.e. desk tops, lap tops, smart phones and tablets. What are the Pro's & Cons of Using CSS for Drop Down Menus. What are the Pro's & cons of using Javascript for drop down menus. And the same question for jquery. Thank you all in advance for your ideas.
Web Design | | bronxpad0 -
IP block in Google
Our office has a number of people performing analysis and research on keyword positions, volume, competition etc. We have 1 external static IP address. We installed the static IP so we can filter out our visits in Google Analytics. However by 10 AM we get impssible CAPTCHA's or even get blocked in Google. Do you have any experience with such an issue? Any solutions you can recommend? Any help would be appreciated! SXI5A.png
Web Design | | Partouter0