Search Results for 'header'

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.

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.

Hi Marius/Radu,

When I switch to mobile view the header ad covers it.
The ad is a 728x90px ad that switches to a 300x250px in mobile view and it seems that the logo then gets covered by it.

Will this be part of the fix you’ll be introducing soon?

Thanks,
Ryan

Hi Radu,
Thank you for the instructions, they are helpful.

I have actually figured that one out and removed the menu.

The problem was I had a webdesigner and I selected he Newspaper template and he was supposed to put it on my established site and do a migration to a new url.

Unfortunately that guy got to busy and quit on me and I was stuck trying to do it all by myself.

I have now gotten my menu back but there is still one problem with my original theme
and the header upload in wordpress.

If I upload a new header (same size, supported format) I am getting now a message like this:

Warning: Division by zero in /home/freestu/public_html/wp-admin/custom-header.php on line 841

Warning: imagecreatetruecolor() [function.imagecreatetruecolor]: Invalid image dimensions in /home/freestu/public_html/wp-includes/media.php on line 1288

Warning: imageantialias() expects parameter 1 to be resource, boolean given in /home/freestu/public_html/wp-includes/class-wp-image-editor-gd.php on line 256

Warning: imagecopyresampled() expects parameter 1 to be resource, boolean given in /home/freestu/public_html/wp-includes/class-wp-image-editor-gd.php on line 258

Image could not be processed. Please go back and try again

I am not sure if this relates to the demo install or any of the plugins that came with thenewspaper and that I had installed.

I guess the only way to find out is to go back and restore my site from last’s backup?

Thanks

Hi Simmons,

Thanks for the reply.
Good advice about the demo install. Wish I had known that beforehand.
The site is actually established.

I figured out the menu and pages. There is just a header problem now.
But since I have a backup from last Sunday, I will try to restore.

That did it, thanks again!

I am having the same issue. Seems like it still isn’t fixed in the most recent update. Is there a way around this?

Ok, didn’t seem to make a difference. I’ve attached a screencap of my style.css file

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>

Ok, does it matter where I put this?

I put it in the text logo section and it didn’t change anything.

also, not sure if this was an issue before or after the update
the top menu is not the same in different browsers
in Chrome – everything is in one column
in safari – on of the words (in the top header) is in the column below

• This reply was modified 12 years by Marija1m1.