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
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
-
Multiple sites using same text - how to avoid Google duplicate content penalty?
Hi Mozers, my client located in Colorado is opening a similar (but not identical) clinic in California. Will Google penalize the new California site if we use text from our website that features his Colorado office? He runs the clinic in CO and will be a partner of the clinic in CA, so the CA clinic has his "permission" to use his original text. Eventually he hopes to go national, with multiple sites utilizing essentially the same text. Will Google penalize the new CA site for plagiarism and/or duplicate content? Or is there a way to tell Google, "hey Google, this new clinic is not ripping off my text"?
Web Design | | CalamityJane770 -
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 -
Content Migration & cost of moving pages
Hope you are all having a great day! I am wondering if anyone would be able to provide general feedback. I work for a medium size company in Chicago. Currently our site is static html and we are seeking to migrate to Wordpress. After speaking with a number of website companies and receiving proposals, I am trying to understand if there is an approximate going rate or range for moving content from static html to a CMS like Wordpress? i.e. a cost per page? We don't have any dynamic content. Most of our pages are text and images. The site itself, including the blog is around 220 pages. Thanks in advance for any insight or resources!
Web Design | | SEOSponge0 -
Should I Use An Animated Javascript Responsive Site
Hi, hope someone might be able to help me with this. I am setting my son up with a website for his small painting and decorating company. However, I am a wordpress stalwart and he has seen a theme which is a javascript animated responsive theme from template monster. Its not my choice just he is adamant that he wants it. However, I am slightly concerned that Google cannot index as well with these kind of sites as they would with a standard HTML site. I would be grateful if someone could confirm if they can be indexed etc. The content appears in what I can only describe as lightboxes. Thanks
Web Design | | denismilton0 -
Traffic flow going through homepage, /default.aspx, and /index.htm - How do I fix this?
In the Google Analytics visitor flow section, most of my traffic is starting off on the homepage, but a significant portion somehow is being directed to /default.aspx, as well as a minor fraction at /index.htm - see the attached image for what this looks like. My questions are, why is this happening, is it negatively affecting the site, and should I just fix it through a filter in Analytics or consult IT? Navigating to the /default.aspx page in the address bar simply returns a blank screen. Any idea of what's going on here? The logo in the top left corner of the site directs to /index.htm, so I think I have that issue solved, but /default.aspx is definitely stumping me. The server currently runs on Apache, though I don't know if it always did. My standard method of simply Googling the problem didn't give me any definitive answers, so any help would be greatly appreciated. Q12QqpC.jpg
Web Design | | BD690 -
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 -
Penalized by duplicate content?
Hello, I am in a very weird position. I am managing a website(EMD) which a part of it dynamically creates pages. The former webmaster who create this system though that this would help with SEO but I dought! The thing is that now the site has about 1500 pages which must look duplicate but are they really duplicate? Each page has a unique URL but the content is pretty much the same: one image and a different title with 5-8 words. There is more: All these pages are not accessible by the users but only for the crawlers!!! This URL machine is a part of a php - made photo gallery which i never understood the sense of it! The site overall is not performing very well in SERP, especially after Penguin, but judging by the link profile, the Domain authority, construction (ok besides that crazy photo gallery) and content, it never reached the position it should have in the past. The majority of these mysterious pages - and mostly their images - are cached by Google and some of them are in top places to some SERP - the ones that match the small title on page - but the numbers are poor, 10 - 15 clicks per month. Are these pages considered as duplicated, although they are cached, and is it safe for the site just to remove 1500 at once? The seomoz tools have pointed some of them as dups but the majority not! Can these pages impact the image of the whole site in search engines?( drop in Google and has disappeared from Yahoo and Bing!) Do I also have to tell Google about the removal? I have not seen anything like it before so any comment would be helpful! Thank you!
Web Design | | Tz_Seo0 -
CSS styling help needed
I'm hoping that to someone experienced this is a quick fix, but it may be a pain and a rat's nest of code. Five or so years ago, I designed my brother's website at https://www.argentdata.com/index.html. I built it off of the Mollio theme (http://www.mollio.org/), and used templates in Dreamweaver, so it's not in a CMS. It's not a work of art, and there are some issues with it, but it's served him fairly well. Longer-term it needs a redesign, but right now I'm asking about just one aspect of the existing design. There are two parts to the site - the plain HTML site, and the osCommerce store that's under the purchase tab. If you go to http://www.argentdata.com/catalog/ you'll see that the osCommerce store is full width, while the navigation header copied over from the main site is 1200 pixels wide and centered. If you're on a wide monitor, it looks weird. What he'd like to do: Make the main site align to the left, both the content and navigation, and make the navigation left aligned for the osCommerce portion. He figures this is the easier way to do things, rather than try to muck with osCommerce CSS (that also has some merged CSS from the Mollio theme) and get it to center. Does anyone have a fairly simple solution that can make the navigation bar look good on osCommerce? Either the above of making everything left aligned, or some other solution simple we haven't thought of? Thanks!
Web Design | | KeriMorgret0