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
-
Google Search Console Block
Am new to SEO. My clients site was completed using Yoast premium and then used Google search console to initiate the crawl. Initially setup an http:// property and all seemed good. Then i removed that under search console an created an https:// did the render and it appears google has put a block and placed their own robots.txt file which basically has rendered the site useless. Feedback most appreciated.
Web Design | | BoostMyBiz0 -
Best Practices for Leveraging Long Tail Content & Gated Content
Our B2B site has a lot of of long form content (e.g., transcriptions from presentations and webinars). We'd like to leverage the long tail SEO traffic driven to these pages and convert those visitors to leads. Essentially, we'd like Google to index all this lengthy, keyword-rich content AND we'd like to put up a read gate that requires users to register before viewing the full article. This is a B2B site, and the goal is to generate leads. Some considerations and questions: How much of the content to share before requiring registration? Ask too soon and it's a terrible user experience, give too much away and our business objectives are not met. Design-wise, what are good ways to do this? I notice Moz uses a "teaser" to block Mozinar content, and I've seen modals and blur bars on other sites. Any gotchas that Google doesn't like that we should be aware of? Trying to avoid anything that might seem like cloaking. Is it better to split the content across several pages (split a 10K word doc across 10 URLs and include a read gate on each) or keep to one page? Thank you!
Web Design | | Allie_Williams0 -
Is having copy above the fold still beneficial for SEO
Many sites nowadays are approaching a section based approach with copy further down the page. Is it still valid to keep copy above the fold now for SEO. Will it impact on SEO if you have to scroll down the page?
Web Design | | vortexuk0 -
Is this CSS solution to faceted navigation a problem for SEO?
Hi guys. Take a look at the navigation on this page from our DEV site: http://wwwdev.ccisolutions.com/StoreFront/category/handheld-microphones While the CSS "trick" implemented by our IT Director does allow a visitor to sort products based on more than one criteria, my gut instinct says this is very bad for SEO. Here are the immediate issues I see: The URL doesn't change as the filter criteria changes. At the very least this is a lost opportunity for ranking on longer tail terms. I also think it could make us vulnerable to a Panda penalty because many of the combinations produce zero results, so returning a page without content, under the original URL. This could not only create hundreds of pages with no content, there would be duplicates of those zero content pages as well. Usability - The "Sort by" option in the drop down (upper right of the page) doesn't work in conjunction with the left Nav filters. In other words if you filter down to 5 items and then try to arrange them by price high to low, the "Sort" will take precedence, remove the filter and serve up a result that is all products in that category sorted high to low (and the filter options completely disapper), AND the URL changes to this: http://wwwdev.ccisolutions.com/StoreFront/category/IAFDispatcher regardless of what sort was chosen...(this is a whole separate problem, I realize and not specifically what I'm trying to address here). Aside from these two big problems, are there any other issues you see that arise out of trying to use CSS to create product filters in this way? I am trying to build a case for why I believe it should not be implemented this way. Conversely, if you see this as a possible implementation that could work if tweaked a bit, and advice you are willing to share would be greatly appreciated. Thanks! Thank you to Travis for pointing out the the link wasn't accessible. For anyone willing to take a closer look we can unblock the URL based on your IP address. If you'd be kind enough to send me your IP via private message I can have my IT director unblock it so you can view the page. Thanks!
Web Design | | danatanseo0 -
ECWID How to fix Duplicate page content and external link issue
I am working on a site that has a HUGE number of duplicate pages due to ECWID ecommerce platform. The site is built with Joomla! How can I rectify this situation? The pages also show up as "external " links on crawls... Is it the ECWID platform? I have never worked on a site that uses this. Here is an example of a page with the issue (there are 6280 issues) URL: http://www.metroboltmi.com/shop-spare-parts?Itemid=218&option=com_rokecwid&view=ecwid&ecwid_category_id=3560081
Web Design | | Atlanta-SMO0 -
URL parameters causing duplicate content errors
My ISP implemented product reviews. In doing so, each page has a possible parameter string of ?wr=1. I am not receiving duplicate page content and duplicate page title errors for all my product URLs. The report shows the base URL and the base URL?wr=1. My ISP says that the search engines won't have a problem with the parameters and a check of Google Webmaster Tools for my site says I don't have any errors and recommends against configuring URL parameters. How can I get SEOmoz to stop reporting these errors?
Web Design | | NiftySon1 -
Content position on page
I am in a limo service industry where people are not looking for great content or product description, all they want is a nice Lincoln Town car and a competitive price. Because I need to get more pictures in front of my customers rather than more content I am not sure if by not having the content high up in the page will affect my rankings. We are transitioning to a new template where we have more control over the layout of the website but because of the slider that we have on the homepage the content needs to go further down. We could insert some content in each of the slides but the page would start looking too "busy". We want the customers to see very clearly what we offer. They see the picture, click for more info and book the service. How important still is to have your keywords in the first hundred words on a certain webpage? Can we get away with having the content read by search engines after 3 - 4 slides and their description (about 20 words total) ?
Web Design | | echo10 -
Best way to handle related content links in a sidebar?
My site contains tens of thousands of articles, studies, multimedia files, biographies, etc. To assist users with finding content that might be related to the page they're on, I use a side bar with 'also of interest' links to other, similar content on my site. This is, of course, pretty standard practice. Search engines -- Google in particular -- index these pages and then include the text in the sidebar links in search results. So, for example, on a given page I may have 20 links to related content, and the text in those links might be, 'A story about subject ABC.' When I search for 'A story about subject ABC,' Google returns not only the page titled (and containing the content) 'A story about subject ABC.' but also every page that links to it and happens to have that link text in the sidebar. What is the proper way to handle this kind of thing?
Web Design | | smorrison0