Don’t bring down the Internet with bloated video headers.

WordPress Mobile Speed

Updated: April 2019

There are no affiliate links on PagePipe.

Don’t bring down the Internet with bloated video headers. We offer some lightweight ideas- and a free optimized web graphics for branding the WordPress Twenty-seventeen-theme home page.

Save the Internet from slow and destructive Zombie design. Our Promise: You will improve first-time user perception of branding and page speed.

If you cram the Front-page Content Sections with generic stock photography then … surprise! Your Twenty-seventeen Home page is now ridiculously heavy. Outrageous even on a desktop! You can avoid these new theme pitfalls and also take advantage of some great speed opportunities.

Video headers are specially created for branding your Twenty-seventeen theme home page. It takes knowledge, skill, and patience to find – or build – non-bloated visual elements. The hunt for orchestrated, featured images is a huge time sink. We save you time and frustration.

1What’s an “atmospheric” video header? They’re decorative elements – like header images, but with motion. They play automatically, loop by default, and don’t have sound. They work best when paired with a static image for mobile fallback. Motion video is a short, looping background video without controls – except for a pause button which you can easily make more transparent.

Regarding the Twenty-seventeen theme video header, it’s either locally hosted mp4 and mov files or external, hot-linked YouTube videos. But we recommend self-hosting your motion header in the media library and not using video hosted on YouTube. The experience is much better this way. Try it. You’ll see.

2Doesn’t video ruin page speed? Twenty-seventeen theme lazy loads the header video only on desktop computers – and no load at all on mobile devices. Then just the static fall-back image is displayed. Lazy loading means the theme defers video loading until last for user perception of speed. Bandwidth is still consumed. This occurs only on the front page for viewports at least 900 pixels wide and 500 pixels tall. As a safeguard, the maximum video file size is also capped at 8MB. The theme customizer validates that local videos have a supported format, proper file size, or that external video links are to YouTube. The WordPress development team strongly encourages using smaller files. Why? Visitors won’t spend time on big, long videos. It’s a waste of resources. Hefty videos gobble bandwidth. Video hurts performance. And, duh, it causes a Web Apocalypse destroying Internet usability.

Even with an 8M theme cap for video file size, its inclusion on the site’s front page with standard, shared hosting can easily result in your site slowing down. This is due to bandwidth overages or excessive data transfers. Video files put undue strain on both the host and the visitor.

It’s not easy preparing a video that looks good, is lightweight, and loops well. It requires special knowledge to deal with the complexities of meeting a file-size limit so small. That’s what we can do for you.

3How much does your our SpeedHeader demo cost? It’s free! You get a super-fast loading, 16-second video motion header, a fall-back header image for mobile, one optimized JPEG feature-image photograph, and four other color-coordinated, large, home-page featured images that are lightweight GIF files. All visuals are harmonized to work together. Keep reading.

4Why GIF instead of PNG format for featured images? WordPress imposes automated resizing to the PNGs when they are used as feature images. They bloat up to 3-times heavier in weight. That makes them load slower. For unknown reasons, GIFs don’t get the same treatment. WordPress doesn’t touch them. They stay light.

5Are there conditions where I don’t need your demo SpeedHeader? Most site owners have found these graphic accessories a lifesaver. It keeps your website focused, mobile-friendly – and the perception and reality of fast page-loads. Our header will keep your site lean – and simultaneously save the web from certain doom.

6Can I use these free visual assets on more than one site? Help yourself. We don’t charge usage fees. But please don’t resell or giveaway our creative work. Cousin Guido doesn’t like that. Save your kneecaps.

7Does your SpeedHeader help my SEO? Lighter page weight doesn’t improve search engine ranking or visibility. Testing shows that speed affects ranking less than 1 percent. But fast pages do reduce bounce rate, improve engagement, and rescue your user experience. That is equally as valuable as improved SEO. Plus the added sense of being a good, responsible web citizen.

So, do SpeedHeaders hurt my SEO? WordPress video headers do not affect page rank or time to get listed on Google. There is no downside for SEO. And that’s without any SEO plugin help. Good SEO practices are inherent in WordPress.

Headers affect User Experience (UX). That is how people feel when they are using your website. Motion headers fall in the realm of mood. Stock 16-second video tends to be around 3 to 5M in file size – and cost about $19. These double or triple the average 2.3M page weight currently on the web. Slow speed causes user frustration. This degeneration ultimately leads to the Web Apocalypse.

Heavy video slows down the Internet. This causes poor user experience – even with lazy loading. Poor UX is the real downside – not SEO – and it’s why we created SpeedHeader. Our motion header loads fast.

TIP: We use a rocket GIF animation as PagePipe’s header image. It weighs about 300k. Much less than video and it plays on mobile this way, too. Load your animated GIF as one of the static header images. You can also rotate header images randomly in the customizer with each page change. Nice trick.

Intense E-motion – freebie header for Twenty-seventeen theme!


Steve Teare
performance engineer

Mobile WordPress Speed – without coding!

Coming Soon to PagePipe readers.

Other Related Resources

If you’re new here, start with our best primer speed articles.

If you’re ready to give your WordPress site wings, here are powerful tools to speed up your site.

Learn how the most popular plugins and ideas waste your time – and hurt web speed. Includes important tips for mobile speed without coding.

Build with Empathy