btw, we used font squirrel to repackage open sans to use on our CDN vs loading from Google, and used minified CSS to load the regular, true bold, and true italic versions of fonts, along with the varied font formats for Windows, Mac, iPad, etc.

Brain numbing to do, but worth it if you’re nuts about using custom fonts and speed, and compatibility with stupid IE9/10. Not sure if IE11 has the same issue or not (not rendering italic or true bold Google fonts properly).

I thought Radu or Marius said someplace that better font selection was one of the action items on their custom admin panel, since the current setup is hampered just a little bit by the built-in WP panel they have built options into.

But yes, having option to use web safe fonts would be an excellent option to see in an upcoming version.

Of course always good to remember that Google kind of gives some false positives on
1) fonts
2) adsense
3) recaptcha
4) google+ buttons

they find errors in their own code being loaded on the page; such as image dimensions on ad units missing, CSS for font styles loading off their CDN, recaptcha images needing “more optimization” etc.

A good “goal” for Page Speed right now, based on industry think, is
target desktop = 90 or higher
mobile = 80 or higher

anything below 75 mobile and below 85 desktop would be considered “poor”
but the world won’t crash into the sun if you have a heavily loaded page getting 79 mobile and 89 desktop for the forseeable future, as that is still above the average for 90% of the web.

Just fyi on web fonts …
since the fonts are being loaded from Google’s CDN, there isn’t really any way to “optimize” Google’s loading of those fonts in the way some of you may think – how can the theme optimize something living on Google’s CDN ?. Although “technically” one might remove the &ver=3.71. for some very minor compliance in moving away from that kind of versioning data in WP.

How we did it on our static main business site (not running WP except for news and blog areas, but it’s the same concept in how you might “super optimize” YOUR setup), was we downloaded the equiv fonts (Open Sans family), created style sheet, uploaded both CSS and fonts to our own CDN (S3/CloudFront), setup CORS rules, and now load the fonts off of Amazon’s cloud where we could set expiration times of one year, and compress, etc. In our case we did it both to control all the font parameters for PageSpeed and also the whacky bug in IE for not loading the true italic version of fonts off Google’s CDN without manually inserting calls to all font versions one at a time for IE which results in loading 8 font families per page). Using a custom style sheet to load all the fonts, we load just ONE file for the reg/reg italic, bold/bold italic and solve two issues with Open Sans.

For “most” people you need to setup your compression, and time to live (expiration headers) on YOUR end of things before anything else – that is not a function of the theme. Google how to do that, or contact your hosting provider. Then move on to the other stuff. As GZAM pointed out, and as I have previously, the compression and expiration headers alone account for about 20 points or more in Google Page Speed.

Fonts are a tricky bit, where any “designer” fonts, slow down page regardless, as they have to be loaded from somewhere. For those looking for “fastest speed” once everything else is done, you might have to NOT use custom fonts at all, and sub out Trebuchet MS for the menus, and something like Georgia or Arial/Helvetica for the body text.

Spending the $2 a month for Amazon’s CDN (or similar) is one way to speed up your fonts, vs loading them from Google directly, but that is something you need to try, modify, test, modify, test. For example, we use Font Awesome, and we tested loading that off the cloudflare hosted version vs our CDN on Amazon – Amazon was faster so we load that from there.

Not sure if any of that helps. It is a process, not a one click thing to optimize a page for ‘speed’ — there is NO “one click” solution out there due to complexity of servers, content, and everything being loaded on the page.

For example on optimization — if you want faster speed, what about image compression level using built in functions of wordpress? Did you know you can use a plugin or function to increase the compression level of the thumbnails appearing on the pages? Smaller files there make page load faster even before server side gzp/deflate. These are the kinds of things you need to research if trying to optimize your site for fasted load times.

For example, you could set the compression of images to something like 60% or even 50% in your child theme functions.php … will only change level on new images uploaded unless you use the regenerate thumbnails plugin or similar.

add_filter( 'jpeg_quality', create_function( '', 'return 50;' ) );

I’m not sure what Radu has the quality set to by default, but increasing the compression even 10% from the default improves speed.

Additional ref:

switch ( $mime_type ) {
 case ‘image/jpeg’:
return imagejpeg( $image, $filename, apply_filters( ‘jpeg_quality’, 90, ‘edit_image’ ) );
case ‘image/png’:
return imagepng( $image, $filename );
 case ‘image/gif’:
return imagegif( $image, $filename );
 default:
 return false;
 }

Google’s webpagetest.org actually recommends quality level 50 for web images.

We are shooting for “60” at the moment (60/100 compression is not percentage of compression, btw).

• This reply was modified 12 years by simchris.
• This reply was modified 12 years by simchris.
• This reply was modified 12 years by simchris.

If not theme related; feel free to delete this thread. ;-0

Hi, Radu
and so, I now say “d’oh” (per Homer Simpson).
That page should definitely be a sticky under a new topic
General Support: Page Speed (locked from posts by others perhaps?)

Otherwise you’re going to keep getting posts from folks over and over on this topic, primarily from non-developers, but also from folks just wanting the basic “tips.”

I think the async option in the 2.1 will help with ads, and also the option to use web safe fonts (e.g., Georgia, Arial/Helvetica, Trebuchet for body fonts) would help too.

Keep up the great work 🙂

RADU:
v2.1 — BRAVO!!! This update has the last items on my “action list” of things we needed for the base usage beyond tricky whirling dervishes and bouncing balls. Awesome, as we say here in Southern California 😉

It would be awesome when Radu and co. has time to share an outline of what was done to achieve that score. I totally agree! 🙂

• This reply was modified 12 years by simchris.

Note the TagDiv demo does *not* have Google Ads running. This impacts the PageSpeed rating in positive way. Any site running Google Ads will get about a 5-8 point hit which is a “false positive” on error.

We do need “async” mode ads, though, as a priority.

Reminder:
test your PAGE SPEED without certain plugins which “wreck” page speed rating

1) we added the Addthis plugin for social media, which generates errors on pagespeed but doesn’t actually slow things down notably;

2) page speed will *always* be slow with Google Ads running, as their own ad system generates many of the errors. GTMetrix gives more accurate score as it ignores the “false positives” of Google penalizes their own ad modules (!)

Test your page without any social media plugins or advertising.

You will NEVER get 96+ with ads running on page, or any plugin which phones home or pings all the social media sites to generate “number of shares.”

Our “96” Google Page Speed rating was without the ads running or the new addthis plugin running right now.

I shared the htaccess info that you should be using on your site for expiration headers.

vidapropria

Hi! Not sure if this weill help you or not, but note I previously shared how to do the htaccess .. remember it’s not the function of the “theme” to teach you how to optimize your website, you need to go research how to optimize your site, hosting account, optimize your images in Photoshop or similar prior to upload, etc.

Buying a race car doesn’t teach you how to drive — it can go 150 MPH/KPH but you have to take the wheel.

There are numerous resources on the net to learn how to set-up your web server account for gzip, expiration headers, optimize your images prior to uploading to your site, editing your htaccess file for WordPress, limiting use of resource hogging plugins unless absolutely necessary, etc., using W3cache with the minimal settings recommended in this forum from Radu/Marius (( QUOTE: w3 total cache use only the ‘full page cache.’ ))

You can see some info I shared here that might be helpful to optimizing YOUR site:
https://forum.tagdiv.com/topic/what-is-your-googlespeed-value/

Our site using Newspaper has “96” speed without using a cache plugin or CDN (yet). We followed “best practices” for managing a WP theme and proper server setup.

If you run a speed test on YOUR site (PageSpeed or GTMetrix, etc), then follow the changes you can make first, that is a huge step in optimizing YOUR site.

Radu/Marius … feel free to borrow from my posts to create a “sticky” on
“TIPS FOR PAGE SPEED OPTIMIZATION” or similar. 🙂

• This reply was modified 12 years by simchris.

Anything in /wp-admin/ is part of the core WP install

usually *all* theme files and demo content will go in

/wp-content/themes/newspaper/
/wp-content/themes/newspaper-child/ (or similar)
/wp-content/plugins/nameofplug/

anything in your root folders are part of the base WP install, not the theme
/wp-admin/
/wp-includes/

(e.g., /home/freestu/public_html/wp-includes/ )

Hi, PhilDbz
we like the addthis plugin since you can customize how you want it to look, specify the buttons you want always on, etc. In our case over the past many years, we had more trouble with sharethis than addthis, but it’s personal preference kind of like disqus vs livefyre etc (we’re moving to “no comments” on some sites due to nonstop forum spam).

On our main business site we hand code that into the layout then load the addthis stuff via async.

Addthis seems to work well when checking for pagespeed, too, although all those things throw up the usual js/css “warnings” …

anyway point was, addthis does allow you to have the buttons with the likes/numbers. I went without those as it slows down page to go get that data for the visitor, who generally could care less how many other people have liked something on FB.

Radu
site works fine. Some parts of world have been blocked due to massive hack attempts, port scanning, forum spam, and we have dedicated server running CSF and portflood protection, etc. Sadly, being in the U.S. and running various news portals, our servers are common targets for attacks from China, Russia, Eukraine, Arab states, Columbia, Viet Nam, North Korea, Argentina, etc. We’ve had to take a higher level of “autoblock” for some ISPs due to massive system abuse which the ISPs won’t address and just let it go on. If you want to email me from my account, I can check your IP (don’t post your IP here obviously) to see if it’s on the block list (which ideally we’d like you to see what we’re doing with your theme!). As you know often if we get 20 attacks from one range, we block that entire range, but might block a friend along with the foe. A DDoS was knocking out our SMTP and FTP last month, hence higher sensitivity on the firewall.

🙂 Chris

97/100 is awesome speed for a WP theme. 🙂

Almost impossible to get 99/100.
I’ve done with site using .shtml, CDN, dedicated server, and not using WP.

Radu and co rocks!

Best bet is to delete all the files and then replace all content from a backup; or remove everything and do a CLEAN install of WP. Generally you never install “demo” content over a live site — as demo content with WP is intended for blank sites to fill in content for development and will “usually” break an existing site/content since it’s dumping in content which is essentially “placeholder” material for you to edit as a starting point as needed, so hopefully if you’re just starting out, then you start from scratch with whatever theme you want to use.

Not sure that helped. I was here looking up something else. I’m not part of the support team.

One trick is simply remove the content from the location you uploaded it to … then switch back to one of WP’s default themes like twenty twelve. Turn off all the plugins that came with Newspaper. If your site doesn’t work with the normal WP theme, then you probably need to do complete clean install. (It’s happened to me … learning experience.)

Thanks ! 🙂

I know you have a *lot* of feature requests and all that. This was one of the old baseline things, hence the poke.

BTW, what I did for now was to simply comment it out in the theme, then use the AddThis plugin to put below posts. Works perfectly while Radu is doing evolutionary stuff. We needed a couple more sharing options, so this is how it looks:

will try to put URL as code, as I’m *NOT* trying to promote pages here (!)

http://ga-ga.com/1228/likely-happened-royalties-sugar-man/

This is a built-in function of WordPress
http://codex.wordpress.org/Embeds

SoundCloud Tracks

and,
http://en.support.wordpress.com/audio/soundcloud-audio-player/

I’m using 700×406 which I think is what is in the documentation.

Additionally, I use the WP-Optimize plugin to regularly optimize my WP dbase. Cutting 800kb out of your dbase once a week, or after a large number of posts/pages, also speeds up your system overhead.

Typically, we post several stories, then do backup of WP dbase for safekeeping, then run WP optimize to clean house of all the temp files, overhead, etc.

Much like SEO, “Page Speed” is a program and not a plugin. It requires research, implementation and support ticket with your hosting provider, or if you have a VPS or full dedicated box, they don’t turn anything on for you by default — you have to tell them what you need to make it go. We had to test our server cache settings as the first time they were too broad, and we dialed that back (you don’t want to have your home page cached for a week, obviously, but images can be cached for a month or year, for example as they don’t change).

Enabling gzip or similar compression on web server is mandatory, and this is good for 20+ points on Page Speed (SERIOUSLY!). What this does is compress the files sent to the web browser which the web browser decompresses on the fly (modern PCs and Macs are mini supercomputers after all); so instantly almost everything sent from the page to the browser is cut by 50-80% — THAT speeds up the page immensely.

THE TAKEAWAY:
1) web server compression MUST be enabled and setup — this is good for 20+ points on Google Page Speed !
2) proper expiration headers must be served for static content like local hosted fonts, favicon, apple icons, images — this also impacts page speed as it tells browsers like Chrome and Google’s caching server not to keep loading content over and over again.
3) images must be properly optimized before upload to your blog/publication — don’t upload a 50kb file if a 25kb file will do —
4) avoid bad behavior plugins such as those which load additional style sheets not needed, or loading too many ad units (10 ad units on a page will slow it down!)
5) consider using a caching plugin like W3C which can fix things like combining CSS, moving JS to footer

TEST, modify, review, TEST, review, adjust.

Obviously Radu, Marius and co need to setup a FAQs/knowledgebase page for all their themes on this topic or folks will keep posting again and again asking why their WP page doesn’t get 99. The theme is part of the picture, not the only item in the picture.

Sharing all of this as this topic has been the #1 thing I’ve been working on with our other sites, including our main business site which I have up to 99 PageSpeed and 96 YSLOW, using a CDN on top of our own dedicated server, but NOT using WordPress. It’s a complex subject, but Radu and co have done a freaky good job in making this theme work with all the other pieces — and I bought about 10 other themes before this one — and they all sucked, as we say here in the states.

Peace and hope all of that helped somebody 🙂

Just as an fyi, for an example our magazine site under redevelopment for Jan 1 relaunch; here is a test article page (my article), which has a Google Page Speed of 96; with no caching plugins or anything beyond the web server properly configured, images properly compressed, and not using any “bad behavior” WP plugins that adversely impact the DB calls or phone out to other systems needlessly.

http://ga-ga.com/1204/beginning-adventure-space-time-reveals-roots-doctor/

We have not yet implemented tagdiv’s cache beta, nor using W3cache, or have it connected to our CDN (yet). So, “96” is pretty awesome.

See GTMetrix speed/performance check:
http://gtmetrix.com/reports/ga-ga.com/y8YUj6GI

Be aware YSLOW penalizes heavily for not using a CDN — so anybody looking for high YSLOW scores needs to use something like W3Cache or similar.

For those who expect the THEME to manage your page speed, you must remember you need to have both your hosting properly setup for caching, headers, and other elements, *and* you must have your domain setup properly.

For example we add this to our .htaccess file in addition to having proper expire headers and caching setup on the server:

AddType text/javascript .js

<IfModule mod_rewrite.c>
ExpiresActive On

# Favicon (cannot be renamed)
  ExpiresByType image/x-icon              "access plus 1 week"

# Media: images, video, audio
  ExpiresByType audio/ogg                 "access plus 1 month"
  ExpiresByType image/gif                 "access plus 1 month"
  ExpiresByType image/jpeg                "access plus 1 month"
  ExpiresByType image/png                 "access plus 1 month"
  ExpiresByType video/mp4                 "access plus 1 month"
  ExpiresByType video/ogg                 "access plus 1 month"
  ExpiresByType video/webm                "access plus 1 month"

# CSS and JavaScript
  ExpiresByType application/x-javascript    "access plus 1 week"
  ExpiresByType text/css                  "access plus 1 week"
  ExpiresByType text/javascript		  "access plus 1 week"

# Webfonts
  ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
  ExpiresByType application/x-font-ttf    "access plus 1 month"
  ExpiresByType application/x-font-woff   "access plus 1 month"
  ExpiresByType font/opentype             "access plus 1 month"
  ExpiresByType image/svg+xml             "access plus 1 month"

</IfModule>

Hi,
note you have to set a “featured” image for each post for any thumbnails to work, since the theme uses the builtin thumbnail options of WP.

For my setup I have it as
1) customizer > posts > don’t show featured images
2) on each post I place image in story, and then bottom right post page choose the image I want on indexes as ‘featured’
3) I then used regenerate thumbnails with the “make image featured” option

Your mileage may vary. Be sure that your wp images folder is writable. I had that happen once where no image would even upload due to the server owning the folder — and in another case using the month folders didn’t work either, so I never use those anymore out of habit.

Not sure if that helped at all. Was just checking in to see any bugs in the new update before I applied it, and saw your post.

🙂 Chris

Score for my site is 96 without using any cache plugin … you may need to check your hosting setup as this impacts the speed as much as the theme.

• This reply was modified 12 years by simchris.

HI, Jambr
you don’t set a color choice; there are several versions built-in to the sprites sets; meaning there are sprite sets for solid, reverse, color … you select that in the drop down choice for the tagdiv/social WIDGET loaded from widgets on left side, dragged to the sidebar for top right and/or footer (one for each); once in sidebar, like any widget, you can configure it to both add the links for the icons, and choose an icon “set” (1-4), each “set” is a different format … (see top right of my test page: ga-ga.com and I’m using

[tagdiv]social icons >> sidebar/top right(social)
icon style = “3” which gives me the lightgrey on black.
icon size 16px

So, all you have to do is choose “icon style” 3.

NOTE this only applies to choosing social media icons for the top right of the bar across very tip top of page, not icons in the menu bar below the logo area.

Also, obviously you have to actually put in the URL to your social media landing page/account for the icon to appear top right from the widget.

Hope that helps!

• This reply was modified 12 years by simchris.

I think one of the options in the drop down is for white … although maybe it’s a “very light grey” … there should be a default, then 2-3 additional options when setting in the widgets. I have mine set to white/grey on top, and then full color at bottom with logo area in footer.