Last weekend, several of us at Team VIP joined the 1,500 people gathered in Nashville, TN for the annual WordPress community conference, WordCamp US. We were there to participate as attendees, but some of us also volunteered and/or led a session. Not only that, but our very own Andrea Bishop took on the huge responsibility of co-organising the whole thing.
If you’ve never been to a WordCamp US or Europe, it’s everything you’ve experienced at a more focused WordCamp, only more intense and with the added benefit of seeing an even wider representation of the WordPress community all around you. It’s thoroughly exhilarating, and exhausting, to be with so many colleagues, partners, and friends for such a concentrated period of time. Here are some of the highlights from VIP’s extended family at WordPress’ flagship event, with links to presentation decks where available.
Kickstarting the weekend were Rian Rietveld from VIP partner agency Human Made and VIP client, Digital First Media’s Jason Bahl. Rian went with a great how-to on accessibility testing, including workflow (which is accessibleon the Human Made blog) while Jason evangelised – convincingly – about GraphQL.
Of course, the big highlight of the weekend was the annual State of the Word address delivered by WordPress project lead, Matt Mullenweg.
We were excited to lean more about Tide – a collaboration between VIP partner XWP and our friends at Google. Code quality is something we’re super passionate about at VIP and so we’re delighted to see the WordPress project working on a tool to enhance quality across the ecosystem. Come and join us as we get involved!
Matt had some folks help him out with the State Of The Word this year (full video) and we were blown away by Matías Ventura’s live demo of Gutenberg – the new WordPress editor experience (more info on what’s coming in Gutenberg). We encourage you to get testing.
Security is another huge passion of ours and so we’re glad to see that the WordPress HackerOne program resulted in 52 solved security bugs, with 39 rewards for security researchers working to make WordPress more secure for everyone.
No WordCamp US would be complete without Contributor Day and members of VIP were happy to contribute, working on – amongst other things – documentation and Gutenberg.
Outside of the main conference it was great to get together with our clients, partners and friends both at our own Happy Hour and the official after party. Ahead of next year in Nashville again, the next chance to join a WordCamp of this size is probably the one in Europe in June. You can already grab one of the early bird tickets or apply to speak through mid-January. We’ll see you there!
This month’s edition of the enterprise WordPress roundup straddles a bit of December in order to cover news from WordCamp US this past weekend. We’ll start there before bringing you news and updates from our team, clients and partners and across the ecosystem.
State Of The Word 2017
An amazing WordCamp US wrapped up this past weekend. Highlights from this year’s State Of The Word (full video) included:
Technical lead Matías Ventura performing a live demo of the new WordPress editor experience, Gutenberg, showing off how it all works in the plugin today (read our VIP guide to what’s coming for enterprise users)
The target ship date for the Gutenberg editor in core (April 2018) and the areas of focus for the coming year: Gutenberg editor, Gutenberg customization, and then a Gutenberg-specific theme
Impressive stats from the Hacker One initiative, with 52 WordPress bugs resolved and 46 hackers thanked
The formal announcement of the Tide project, a series of automated tests whose mission is to raise the code quality of all plugins, with participation from XWP and Google in addition to Automattic
You’ll find more highlights as well as presentations from the sessions in our team VIP recap.
News and Releases Updates from around VIP, our clients, and our agency and technical partners.
VIP released our new Cron infrastructure, which handles your enterprise-sized task queues with ease. We shared some of our best practices for WordPress application security. And DC web agency WDG interviewed VIP Director of Strategic Partnerships Tamara Sanderson on how to evaluate a hosting and support partner.
WordPress 4.9 went out (Lobby post, announcement, release notes), bringing design drafts, scheduling, and locking to the Customizer, and much more. Security and maintenance release 4.9.1 (Lobby post) followed on at the end of November.
Big Bite released version 2 of of Macy.js, a Pinterest-style masonry layout library. Big Bite also posted a balanced view on AMP, offering pros and cons of implementing it along with some recommendations.
Media and Marketing Notes Research and perspectives on the business of media and the practice of marketing.
“How could we think more broadly about triggering a paywall or taking it down? What other mechanisms could we use besides article count?”
-Melody Kramer, writing at Poynter, offers a whole host of fresh ideas for how to rethink paywall usage.
“In a first step, the Project has released eight trust indicators that newsrooms can add to their content. This information will help readers understand more about what type of story they’re reading, who wrote it, and how the article was put together.”
-Jeff Chang, Group Product Manager for Search at Google, in an announcing the Trust Project, which is working with 75+ news organizations worldwide to come up with a set of story markers to help readers assess article credibility.
“Rather than frame the online overhaul as yet another “brand as publisher” pivot, Poggenpohl sees it more as an SEO play. After all, most visitors to BMW.com come via search engines rather than directly, he added. ”
-Seb Joseph at Digiday, referring to Jörg Poggenpohl, BMW’s head of digital marketing on the strategy behind the new content-driven bmw.com.
We are thrilled to welcome global leader in consulting, technology, and outsourcing services Capgemini to the VIP family! Agency partner Human Made led the replatforming of Capgemini’s main site from Drupal and Acquia to WordPress and VIP.
Early bird tickets and speaker application submissions are now open for WordCamp Europe, which will take place June 15-16.
In 2018, WordPress will modernize, streamline, and simplify the content creation experience with Gutenberg. It represents the biggest change to the WordPress user experience in several years. In fact, in the State Of The Word 2017 Matt Mullenweg described its enduring importance as “the editor for the next twelve years.” In this post, we hope to help VIP clients and all enterprise WordPress users understand these exciting changes, and how to best prepare your teams.
What is Gutenberg?
Gutenberg is the codename for the new WordPress publishing experience. It optimizes for direct manipulation of the visual presentation of the content, instead of through indirect means, like metaboxes. The building blocks of a Gutenberg post are, well, blocks. Blocks help simplify the many ways we build a page (shortcodes, widgets, custom HTML, media, text formatting, and embeds) into a single, searchable flow and UI umbrella. The name comes from Johannes Gutenberg, the founder of the printing press.
To get a sense of how the new editor works for yourself, there’s no substitute for downloading the current plugin in a test environment and giving it a spin. However, for a quick overview take a peek at this live demo (video) presented at last weekend’s State Of The Word:
The way the block “handles” intuitively appear when they’re needed
Simple ways to manipulate assets in a gallery
Preview custom HTML blocks inline
Cleverly using blocks to temporarily store code and content snippets
What’s important for enterprise WordPress teams to think about?
Every time the VIP team helps a publisher replatform, we receive an overwhelmingly positive response from their editorial team. The feedback is almost always: “WordPress is so easy to use.” We believe the Gutenberg editor will be no different. The new editor offers content creators a straightforward way to find, insert, and work with elements on the page. We think this experience is so compelling that editorial teams will quickly want to adopt it into their workflow.
For teams who have extensive customizations in place, upfront planning will be required for a smooth transition to Gutenberg. Fear not – VIP plans on helping clients opt-in to the new editor gradually over time. As many of you know, backwards compatibility is a core principle of WordPress, and it is no different with Gutenberg. Any content created in Gutenberg will be editable in the classic editor, and vice versa.
And beyond the modernized editorial experience itself, Gutenberg opens up lots of new possibilities. Let’s explore some that already exist, along with some that could come into play as the project rolls on:
1. Placeholders and Templates
With Gutenberg, editors can build complex story packages with various content blocks: headline, deck, pull quote, video, embed, and gallery. Placeholder blocks can easily indicate exactly what should go where and keep the editorial process moving forward.
As of Gutenberg’s 1.8 release, the project has introduced initial support for templates. This allows a developer to define a specific template for, say, an Event Post. When a user creates an Event Post, they will see a page pre-populated with blocks for Title, Image, Date, Location, Description, and other details.
2. Collaborative Editing
Today, if someone is working in a post in WordPress, the post locking feature prevents writers from overwriting each other. With Gutenberg, it’s possible to imagine locking at the block level, allowing multiple people to work on sections of a draft without interrupting each other.
The flexibility of content blocks means that there could be a block for internal notes, which could allow editors to leave comments throughout a story while editing. The notion of surfacing editorial feedback inline can be useful in other ways as well. Here’s a possibility that the Yoast team has presented, on inline SEO feedback.
3. Block and Embed Discovery
We’ve heard editors complain about the difficulty of finding shortcodes. Gutenberg allows editors to easily search for content blocks, be it a Twitter embed, a Vimeo embed, or a custom template. Not only does this make embed discovery easier, but we could imagine a future with a content block marketplace.
Developers or agencies could create content blocks for unique needs, for media like galleries, or content types like recipes. This could also facilitate better code reuse across teams within an organization.
4. A Standardized Approach to Page Building
In the coming year, Gutenberg’s project focus will shift away from the editor to site creation itself. With that transition, it will bring a standardized approach to page building to native WordPress. Over the years we’ve seen clients create page builders for section fronts or marketing pages using Field Manager, Advanced Custom Fields, or a custom-built solution. Having a well-defined approach within core could provide a framework to support a wide variety of commercial and custom solutions. This common standard could in turn make content and data more readily portable across the various page building approaches.
5. A Foundation for Personalization
With page content all composed of blocks, it’s easy to imagine how that could facilitate conditional delivery of content based on user attributes. For example, on a media site, subscribers could be served a block with a related content recommendation, whereas new visitors would see a “subscribe” call to action. On the backend, the editor interface could offer a toggle so that a site editor could preview a post as various user segments like subscribing member, new visitor, and returning visitor.
So, what’s the timeline and what will rollout look like?
Gutenberg is already available as a plugin, and is set to be integrated into WordPress 5.0 which is planned for April 2018. The Gutenberg team is currently focused on the post-editing experience, but will then expand their approach to template creation, site creation, and more.
In order to preserve publishing continuity, there is a plugin called Classic Editor that will allow teams to use the current editor as they work on transition plans. We will manage the release of WordPress 5.0 to make the process smooth and opt-in for VIP clients. However, we expect that many editorial teams will want to start experimenting and creating content in Gutenberg right away.
The VIP team is working closely with the Gutenberg team as they test and roll out the new editor. We know very well that our clients have extensive integrations with the current WordPress editor and will want a gradual transition. We are here to help answer any questions on preparing development and editorial teams for the transition.
What happens to existing content?
The current WordPress editor is not going away. Data storage will still be stored as HTML in post_content, which means nothing will change for existing content. Within Gutenberg, there will be a Classic Text block to handle any legacy content within a block of its own. Essentially, it’s the Classic Editor embedded as a block, and will aid in a smooth and carefully planned upgrade path.
How can I share feedback?
The Gutenberg Team is especially interested in feedback from VIP clients, who usually have large editorial teams and complex workflows. They would love for you to help them stress test the new builder. At WordCamp US last weekend, the team set up a special booth for in-person user testing, and will be sharing out findings from those tests. Here are three ways for you to test Gutenberg and share feedback:
Coming up tomorrow, December 7, at the BigWP meetup in London, Tammie Lister, design lead on Gutenberg, will be presenting on the project and taking questions.
This week the VIP team, along with Matías and Tammie, traveled to New York City to spend time with VIP client editorial teams. On this research trip, we gathered information about different editorial workflows, and ran usability tests with web producers. We plan on doing more of these with VIP clients, both virtually and in-person, in the next few months.
We will be communicating updates in the VIP Lobby as relates to the Gutenberg rollout as the project continues. Meanwhile, as you test the plugin and begin to assess plans for the rollout in April, feel free to reach out to your VIP support team. We’d be glad to help.
We hope to see you tomorrow and this weekend, December 1-3 at WordCamp US in Nashville or the next best thing, remote via free livestream. With so many fantastic sessions going on all weekend, we put together a guide to which ones feature folks from across the extended VIP family:
Stop by the Gutenberg usability testing booth, where Tammie Lister and other members of the Gutenberg team will take you through short tasks and a brief survey designed to gather data that will inform bug stomping and fine-tuning.
And if you can’t make it in person, you can also grab a free ticket to catch the live stream of the entire weekend’s sessions.
Our next BigWP London event is only three weeks away, and it’s going to be a pre-Christmas cracker.
Twitter’s central London office will again play host to our gathering for enterprise-level users of WordPress, and the agencies who support them, after work on Thursday 7 December.
Our London events are organised by the WordPress.com VIP team with the invaluable help of our partners at leading global WordPress development agency Human Made. We aim to hold them once every six months: but this will be our third in calendar year 2017.
We’re very excited to announce Tammie Lister, design lead on Gutenberg, as one of our speakers. Gutenberg is the project to reinvent the main WordPress editor component, using the principle of content blocks; and is due to be integrated into the next release of WordPress, version 5.0. It makes content creation beautiful and effortless; and lays the groundwork for exciting developments further down the line.
Gutenberg represents the most significant change to the core user experience in several years. It’s essential for enterprise clients and agencies to understand what is happening, and the implications for custom development, now and in the future.
Tammie will be racing back from WordCamp US, taking place just a few days earlier in Nashville, with Gutenberg certain to be a hot topic at the event. It’s your chance to hear the very latest from one of the project’s leads, and to ask her any questions you may have.
Also on the evening’s agenda:
Having been strong advocates for Drupal in recent years, global technology consultancy Capgemini recently moved their entire corporate web presence from Drupal to WordPress. Parker Ward, Capgemini’s global head of digital and content will tell the story of the move.
VIP is currently working with our agency partners Big Bite to rebuild our popular Liveblog plugin for WordPress. Jason Agnew will explain how the new version gets around the performance bottlenecks of its predecessor, using React, Redux and RxJS Observables to simplify the overall build.
Sotic are a digital agency focused exclusively on the world of sport, running sites for top-flight professional clubs, national governing bodies and international events. Over the past year, they have adopted WordPress as their platform of choice; and senior front-end developer Dan Drave will explain how they used it to power the data-rich website for the British & Irish Lions rugby tour to New Zealand this past summer.
Come straight from the office: we’ll be providing food and drinks. We expect to finish around 8pm, and will go on somewhere for a festive drink or two.
Capacity at the event is limited; so please sign up today via our page at meetup.com to guarantee your place. You will need to submit a request to join the group if you aren’t already a member: this is purely to ensure the group retains its enterprise focus.
We’re happy to announce a new Cron infrastructure for our VIP Cloud Hosting Service platform. In this post we’ll take you through why we did this, how we did it, and what problems it solves for our VIP clients.
The VIP platform provides performance, speed, and scale to the highest traffic sites. Each component and service we support plays a role in that mission. The new VIP Cron infrastructure ensures your site can schedule one-off tasks, offload intensive processing, and run repeated actions reliably, on time, and without additional developer effort. Our Cron implementation builds on the core WordPress Cron API, for maximum code portability from the WordPress ecosystem and familiarity for your engineering teams.
High Traffic Sites and Cron
The WordPress Cron system allows scheduling of asynchronous events, such as publishing a post at a future date or sending out a survey a few days after completing an order. It also facilitates running repeated tasks, such as syndicating content between sites or ingesting videos from third party video services. The core WordPress Cron system works well for many WordPress sites every day.
Traditionally, WordPress Cron is triggered by normal traffic to your WordPress site. Regular visitors trigger an AJAX request back to the server that identifies and runs pending tasks. This approach works great for many sites, as it has no additional dependencies or setup requirements. However, ease-of-use comes with a few trade-offs:
Unreliable triggers – cron is only triggered when there is traffic to your site
Shared resources – the jobs run on the same server as regular web requests, so intensive cron jobs can negatively affect site performance
Hard to scale – difficult to process many jobs in parallel, or handle very large numbers of scheduled events
VIP sites rely on Cron for mission-critical functionality that must work reliably every time. Our new Cron infrastructure is designed to ensure the reliability and scalability of cron events on every VIP site.
Smarts, Brawn, and Confidence – pick three
We’ve improved three main areas of Cron for our VIPs:
Smarter process control. By default, WordPress Cron processes events serially. This is fine for sparse queues composed of light tasks but enterprise sites often require offloading a long running task to Cron for asynchronous processing. These events function like slow moving traffic on a single lane highway. Subsequent events can be processed late due to being “stuck behind” a slow moving task. An enterprise WordPress Cron needs to be able to process offloaded tasks efficiently without impacting the regular operation of the site.
Handling giant queues. A large Cron queue can cause issues where the size of the queue exceeds the capacity of a single option and object caching. An enterprise hosting platform must handle enterprise-sized queues.
Mission-critical scheduling. Initiating an event in core WordPress Cron relies on unrelated web requests to trigger events. This dependency can cause issues with the event processing regularity and timeliness. An enterprise WordPress Cron solution must run scheduled events on time, every time.
In short, we wanted to ensure that the Cron infrastructure for each VIP site was reliable, powerful, and dedicated to that site, just like the rest of the VIP Cloud Hosting Service. We wanted resource intensive tasks to be offloaded to dedicated containers, rather than running on the same resources used to serve web requests. We wanted to ensure tasks for one site did not interfere with other tasks, or with the operation of another site.
It was also important to us that we fully supported the core WordPress Cron API, so our clients can utilize existing plugins and themes without refactoring code or learning a new API.
A Better Cron
Our Cron Control plugin (open source code) builds on the core WordPress Cron system, and is the basis for our Cron enhancements. Cron Control provides a carefully optimized SQL table for WordPress Cron events. This approach satisfies the highly concurrent querying we commonly see on VIP sites. Each named event in the queue is handled in parallel with other events, allowing a much greater event handling capacity.
Cron events on a VIP site run on dedicated containers using an “event runner” written in Golang (open source Golang runner code). Using our container-based infrastructure allows us to scale the number of containers to meet the demands of the particular site, independently of the site’s web traffic
The Cron Control event runner first spawns a batch of “event retrievers” which collect events to be run. In the case of a WordPress multisite this means spawning parallel event retrievers to collect the events for each individual subsite within the multisite. Once events are all retrieved, they are farmed out to a dedicated pool of “event workers” which execute WP CLI commands to run each event.
Busy sites may have several Cron runners in separate containers all processing the queue simultaneously. Our VIP Cron infrastructure takes particular care to orchestrate the activity of the event workers in the different containers, to avoid clashes with two workers processing the same event.
While the event runner is written in Golang, it interacts closely with WordPress through WP CLI commands provided by the Cron Control plugin. All configuration (such as enabling/disabling cron itself and parallelization limits) is via WordPress hooks in the site code, which makes controlling cron processing easy and familiar for WordPress developers.
Ensuring scheduled posts are published on time is a particular concern for many of our clients. Cron Control gives particular priority to ensuring scheduled post events are run when they are found, and that the list of scheduled posts is up to date.
Good monitoring, smooth operations
The Cron Control system is monitored by a Node.js application, itself hosted on VIP Go (yes, we host Node apps too!). The monitor uses a series of dedicated authenticated REST API endpoints on each VIP site (and each subsite on each WordPress multisite) to ensure that event queues remain within acceptable parameters, that the events within the queue are executed in a timely manner, and that execution is proceeding smoothly. If any issues are detected, the VIP team is alerted and investigates the problem.
On time, every time
Our new Cron infrastructure serves the complex and mission-critical needs of some of the most demanding enterprise applications on the web. Contact us now to find out how you can benefit from the same peace of mind and let VIP give you the freedom you to publish.
For existing clients, we have a separate VIP Lobby post where we take you through the steps to take advantage of our new VIP Cron infrastructure.
October happenings in enterprise WordPress included the Online News Association’s annual conference in DC, lots of new updates on the Gutenberg editor project, WordPress 4.9, AMP’s second birthday, and much more.
News and Releases Updates from around VIP, our clients, and our agency and technical partners.
Automattician Dan Walmsley took to the Chrome Dev Summit stage to share the exciting findings from his experiments with Das Surma. They used Progressive Web App technologies delivered via an experimental version of Jetpack to dramatically speed up site performance for simulated low-end mobile devices on slow 3G networks, the common setup for the fastest growing segment of the internet.
If you’re looking to implement Ads.txt, our new doc provides code and instructions to get you up and running.
Through October the Gutenberg editor project rounded version 1.5, which included the first step towards meta box support, and is now at 1.6. This latest release was a big one and focuses mainly on the writing experience. Keep an eye out for the Gutenberg testing table at WordCamp US in December, where you can help the project by taking part in short tests. And for a fantastic project overview, check out Matías Ventura’s Gutenberg, or The Ship of Theseus.
WordPress 4.9will be released this month (November). It’s chock full of updates to the Customizer and the Customize JS API, including the ability to draft and schedule Customizer changes, and generate a Customizer preview link. VIP clients can get a full list of changes as well as update schedule and testing notes in this Lobby post.
Designed and built by 10up, BetterNews.org is a new site launched by American Press Institute that helps newsrooms and publishing innovators embrace and accelerate digital transformations. 10up and API collaborated to architect the experience to support practical execution, engage users, and serve as a living resource for best practices.
Community engineer Jenny Wong breaks down why and howHuman Made contributes to open source.
Rob Stinson at XWP offers examples that illustrate how big teams customize their tools and workflow to unblock content creators from reliance on development resources to get things done.
Technology partner Webdam’s new Connector for Salesforce integrates marketing and sales assets into Salesforce workflow, offering access control, tracking, and easy curation to identify the right tools for each need.
Media and Marketing Notes Research and perspectives on the business of media and the practice of marketing.
“Micropayments are a middle ground for someone who reads enough content to hit the paywall but isn’t necessarily a candidate for a subscription, [he said.] “That’s the problem with the typical metered paywall.”
-Max Willens at Digiday, on how micropayments might best fit in to the publishing revenue mix.
“…while other livestreaming sites and services have passionate (sometimes niche) audiences, Facebook Live is the only place I can expect that guy I met at a conference four years ago and my grandmother to watch my video together.”
-Poynter digital tools reporter Ren LaForme, in a balanced take on the value of Facebook Live for media, along with other tool recommendations.
“The lesson here is that public statements on social media are interesting indicators of how people project themselves to others, especially for public figures, but should be complementary with other reporting and interpreted with caution.”
Welcome back to the VIP family, Us Weekly! Founded in 1977, Us Weekly is one of the largest magazines in the US with over 1,950,000 paid copies per week and site traffic of over 20 million visitors per month. VIP agency partner 10up led the migration and replatforming, which involved moving almost 88,000 articles.
There were a whole slew of WordCamps this past month, 22 worldwide in October alone. Here are a few highlights:
Gutenberg project co-lead and Automattician Tammie Lister delivered a fantastic overview of the project at WordCamp Dublin. The slides on their own provide a good grounding and debunk some common misconceptions.
From WordCamp Toronto, recap notes from Trew Knowledge run down talks on optimization and A/B testing, working with meta boxes, modern site standards, headless and “brainless” WordPress, and more.
In addition, Steph Yiu shared snippets from her conversations with colleagues at our booth and throughout the ONA conference in DC.
10up will be sponsoring Klein News Innovation Camp 2017, Nov. 4th in Philadelphia, and CEO John Eckman will be attending. This unconference, formerly known as “Barcamp News Innovation” (BCNI) brings together journalists and technologists to help create better communities and conversations on the web.
rtCamp is sponsoring the second edition of WordCamp Nashik taking place in on November 5th.
The massive Web Summit in Lisbon, Portugal is November 6-9, with 60,000+ attendees and over 1,000 speakers including Gabe Karp, 10up’s Head of Europe. Gabe will be part of a Marketing Technology panel in the Growth Summit track on Nov. 7th.
Digital Media LATAM is coming up November 14-16 in Buenos Aires, Argentina. The largest digital media conference in Latin American brings together senior leadership from the most successful global digital media companies across business, editorial, and technology topic areas.
WordCamp US will be December 1-3 in Nashville, TN. A stellar line-up of speakers includes VIP engineers Philip John and Ryan Markel, Weston Ruter from XWP, Vivek Jain from rtCamp, Jason Bahl from VIP client Digital First Media, and Nathaniel Schweinberg from Human Made.
BigWP London is back on Thursday December 7th at 6pm at Twitter HQ. Sign up at Meetup.com to be the first to know when the speaker and topic lineup is announced.
The way that people access the Internet is changing.
In 2017, global mobile web traffic exceeded desktop traffic for the first time. In the areas of fastest Internet growth we have seen a profound shift towards low-powered mobile devices on 2G and 3G networks.
This presents a challenge not just to developers and designers, but to the actual architecture of the web. The web’s request/response architecture works great for always-on low-latency networks but fails when the network is unreliable, even temporarily.
User expectations are also changing. Mobile devices now have app ecosystems and rich patterns and libraries for handling changing network conditions and integrating with on-device features like cameras, GPS, storage and payment processing – features not traditionally found in the web’s sandboxed environment.
As web developers, designers, and publishers, we have made great strides towards accommodating mobile phones through responsive design. Users are now accessing the same site in a variety of form-factors. However, what has happened as a result is that the mobile web has become drastically more demanding on devices and networks, essentially bringing the demands of the desktop to all devices.
If you’re reading this, you probably experience the web in a very different way from most Internet citizens – even on a mobile device. Most of us have high-end smartphones and LTE connections. As a result, we can often be unaware of the challenges that many people face using our sites, plugins and themes.
While we may feel a strong affection for the freedoms afforded by the web, most people have more personal goals: to run their business, to tell their stories, to connect with others in their communities and around the world – and they will gravitate to the best solution, regardless of the underlying technology. We risk these users skipping the web entirely in favour of walled gardens powered by proprietary apps.
How do we address these issues?
Progressive Web Apps are the web’s answer to these challenges. PWAs comprise a set of new (and not-so-new) web standards that provide offline support, storage, and device integration that can match native apps. Combined with the essential freedoms and efficiencies of the web, these standards represent a fundamental shift in how web content can be accessed.
In addition, by only downloading the site features someone is actually using, PWAs can be much MORE efficient than native apps!
Despite the name, PWAs aren’t just for app-like experiences. Your content-rich web site can also be a Progressive Web App. In fact you can apply these technologies in ways that help any site on any theme to load quickly, work offline, and engage users in powerful new ways.
Earlier this week I was thrilled to share the Chrome Dev Summit stage with Chrome Engineer Das Surma to talk about our recent experiments with WordPress and PWA. We added PWA capabilities to Jetpack, a free plugin that you can download on any WordPress site. Jetpack powers over 5 billion pageviews a month, and already delivers a number of useful features to WordPress.com and VIP, so it’s a great platform for adding these capabilities.
We found that a specific combination of traditional and new optimisations can improve the overall performance of web sites loaded via 3G networks by up to 10-15x . Improvements range from reduced Time To First Contentful Paint (TTFCP), smaller number of requests, reduced overall download size, and the ability to work offline. Crucially, these improvements can be applied automatically to almost any theme without additional coding.
The scores you see there on the right are generated by “Lighthouse“, Google’s incredible site auditing tool, which is included in the Chrome browser.
Here’s some details on the optimisations we have made so far, for more technical readers:
Aggressive inlining of critical assets on the first page load to improve performance with empty cache, while using the Service Worker to load common assets in the background for subsequent requests
Fast loading of cached pages while checking for fresh content in the background using the Stale While Revalidate strategy
Offline support by checking for network access and preloading critical pages when the Service Worker activates
Web Push for sending updated content to clients which can be retrieved when the browser comes online
Lazy loading of offscreen images using newer IntersectionObserver API (with polyfill fallback on IE)
So what can you do to be part of this revolution? If you are a developer, I encourage you to check out our Jetpack branch and let us know what you think. Truly, we have barely scratched the surface of what’s possible.
If you are a site owner or designer, I encourage you try out your site on 3G (or using the 3G simulator built-in to Chrome) on a low-end device and see if you are providing a good experience for the next billion internet users who will be overwhelmingly using that kind of network and device.
Check out the full video below. We begin talking about the role of Jetpack around 3m 14s.
Today the AMP (Accelerated Mobile Pages) project turns two. As part of a look back and ahead, the AMP team at Google has shared impressive data today that quantifies its positive impacts on time spent on page (2X), traffic (10% increase), and sales conversions (20% increase compared to non-AMP.) We’re proud to be a part of AMP’s unfolding story, and to continue to make it easy for WordPress users, from the individual author to the largest global media and marketing organizations, to take advantage of these powerful open source tools.
From early on we saw AMP as an important project to support because of its core focus on improving the mobile web experience for both publishers and readers, and for its commitment to the open web. We were proud to be the first platform to integrate with AMP, and continue to iterate on the plugin to make it easy for millions of sites across the WordPress ecosystem to integrate AMP with just a few clicks. Most recently, version 0.5 of the plugin, released in August 2017, brought a host of new updates, like faster rendering, improved spec-compliance, new embed handlers for Vimeo, SoundCloud, Pinterest and Playbuzz, and easier addition of amp-analytics tags.
Across Automattic (including WordPress.com and VIP) hundreds of millions of client page views per month are delivered through AMP today. Over the last two years, many of our clients and partner agencies have customized and optimized the AMP experience for their particular needs, with impressive results.
The New York Post has seen a 60%+ bump in average daily referrals coming from Google on mobile to their article pages since implementing AMP for all of those pages. VIP agency partner Alley Interactive, who handled the development, found most of what they needed in the standard plugin for WordPress, and layered in some front-end customization to closely match the look and feel of the Post’s standard pages. In the process, they even contributed code back to the core plugin to address bugs and add functionality. This approach for the Post has delivered in both experience and performance:
“One of the most exciting things for us has been the ability to make our AMP pages feel like more of an organic extension of our mobile sites rather than a highly templated offsite platform. The average user cannot tell the difference between our mobile website pages and our AMP pages which is impressive. In other words, our AMP pages retain all the key components of our mobile web pages, are a true reflection of our brands, and we’ve improved performance in the process!”
-Michael Liss, Senior Director of Product & Project Management, Digital, New York Post
Media powerhouse PMC, representing 22 brands including Variety, Deadline, and TVLine, has implemented AMP for about half of their sites. As reflects their approach to code reuse across the platform, they developed their own customized AMP plugin based on common needs for an initial set of their publications, and then rolled it out to several more shortly thereafter.
They are currently in the process of refining their approach to analytics and optimization based on iterative tests. One enhancement that has yielded strong results was when they published galleries in AMP with each slide as its own unique AMP page and URL, which both doubled page views and dramatically decreased load time.
“Our newest iteration brings the AMP reader’s experience much closer to that of our traditional responsive site. We can now deliver many of the supporting features that they have come to expect, like our familiar header and navigation, Disqus comments, and related and featured posts widgets. If you put the AMP view and mobile responsive “full” site side by side, you’ll see an incredibly similar layout and design. What’s more, this puts us on a path to take advantage of the AMP framework more and more as it continues to mature.”
We’re excited to see all of the amazing things our clients and the WordPress community as a whole are doing with AMP. For our part, we’ll continue to support the AMP experience with WordPress and extend the benefits it brings to publishers and readers alike. We want to cut an extra big slice of cake for the 400 folks who have contributed code to the project including a couple of Automatticians, and for our friends at Google for leading the charge. If you’re new to the project, consider coming out to the AMP Roadshow as it rolls through Europe and Asia in the upcoming months.
I’ve helped staff the WordPress booth at the Online News Association over the last four years. It’s my favorite conference to attend because of all the incredible people we meet: students who learned to code because of WordPress, journalists who built their first portfolios on WordPress, newsrooms that were transformed by WordPress.
Like many ONA attendees, I also built my first website on WordPress in journalism school. I worked at the Chicago Tribune as the newsroom was being transformed by blogs. And like so many of the folks I spoke with last week, in 2012 I too walked up to a WordPress booth at a conference to share my story of how WordPress had changed my life. Little did I know I’d end up joining the VIP team, helping newsrooms transition to WordPress one-by-one.
ONA is a massive conference. More than 3,000 people attended this year in Washington, D.C. I knew I’d run into lots of clients and partners, and this year, I was interested in hearing in their words how they reflect on WordPress and its role in their professional lives. So I asked them.
On the first day I saw Zach Seward, SVP of Product and Executive Editor at their gathering to promote Quackbot, their new Slack bot. Quartz’s WordPress launch was one of the early projects I worked on when I joined VIP.
“Honestly, to this day, there’s not a project or need that we haven’t been able to do with WordPress,” he said.
High-volume newsrooms love WordPress because of how easy it is for their teams to publish. This year, we co-hosted with our partners Alley Interactive and Parse.ly at the delicious Lapis restaurant in D.C.’s Adams Morgan neighborhood. This was a topic of dinner conversation at my table – how critical time to publish is in a breaking news situation, and how easily WordPress facilitates that.
At dinner I ran into Patrick Tolbert, Digital Director at KXAN-TV, who helped introduce WordPress to his newsroom.
“The reporters love WordPress. When we train, usually we run through training and immediately I get, ‘that’s it?!’” Patrick later told me. “And I’m like, ‘Yeah, that’s it! Headline, title, categorization, tags, done!’”
At the WordPress booth the next day, Emma Carew Grovum stopped by to say hi. She helped Foreign Policy move onto WordPress, and today she is the CMS product manager at The Daily Beast. She credits WordPress for teaching her about content management systems – and I asked her what she liked the most.
“That WordPress works on mobile!” she said. “I could update our homepage at Foreign Policy from my phone – I remember sitting at a red light at my car just noodling on the homepage because I could… it was probably not safe!”
I was also curious what our clients were taking back to their newsrooms after this year’s ONA. What’s next? I had to ask Juan Muñoz, Interactive Director at CNN en Español, who helped put their social and mobile storytelling teams on wheels.
“Integrating all the different tools that we use in one place,” he said, always thinking about ways to make his newsroom more efficient. “Seamless integration with APIs from things like Trello, and Slack. Simplifying and and automating the related stories, suggesting links inside of the content so that editors don’t have to search.”
“More security and more automatic security,” said Bradley Peniston, the Deputy Director at Defense One, a security publication from Atlantic Media. “It’s getting harder and harder for people to have solid, secure websites on their own… The more security can be baked into standard installs whether on my own server or WordPress.com, that’s what I’m worried about.”
At our booth, I also had the pleasure of meeting Amy Claire Nelson, an audiovisual storyteller.
“I’m working on more interactive storytelling and I’m really attracted to 360 documentary journalism and VR experiences,” she said. “I would really love some beautiful templates that would allow a person to experience the project I’m working on… I want my viewer to be present in that situation, for various degrees of immersion into the experience, whether it’s desktop, magic box, Oculus.”
More reading on ONA? The Nieman Journalism Lab has a terrific roundup.
Looking for more events? We’ll be sponsoring and participating in Digital Media North America later this week, in New York October 19-20 (full schedule). Just after Digital Media NA, WordCamp NYC is October 21-22 (tickets are still available!). Topics of interest to the enterprise include 10up CEO John Eckman’s talk on Personalization and WordPress and TinyMCE CEO Andrew Roberts’ Gutenberg update (full schedule).
Ready to get started?
Drop us a note.
No matter where you are in the planning process, we’re happy to help, and we’re actual humans here on the other side of the form. 👋 We’re here to discuss your challenges and plans, evaluate your existing resources or a potential partner, or even make some initial recommendations. And, of course, we’re here to help any time you’re in the market for some robust WordPress awesomeness.