Baobab Websuite is a combination of plugins, API services, cloud hosting infrastructure focussed and tailored towards Wordpress sites. Our objective was to provide tools that helped published improve their sites performance around page load, image rendering, video streaming, search results, sharing of content, metering of content. We believe that a Wordpress environment can be managed, integrated with, optimised and designed in a scalable and high performing manner.

1. Wordpress Enterprise
Progressive
Web App

2. 1. Baobab Websuite is a combination of plugins, API services, cloud hosting infrastructure focussed and
tailored towards Wordpress sites.
2. Our objective was to provide tools that helped published improve their sites performance around page load,
image rendering, video streaming, search results, sharing of content, metering of content.
3. We believe that a Wordpress environment can be managed, integrated with, optimised and designed in a
scalable and high performing manner.
“With the Baobab WebSuite plugins publisher’s can consolidate and
centrally manage and share digital assets and content securely and
effectively, as well as be rest assured that site performance and UX is of a
high standard”.

3. Enterprise grade WordPress Plugin set
Baobab WebSuite consists of a number of plugins or content rendering
services that easily complement existing web properties to ensure improved
performance, navigational expertise, monetisation and editorial capabilities.
AWS Cloud User
Authentication
Cloud search WP plugin &
security
Management
Content ordering /
decryption​
Video Streaming
Google
Analytics
DFP ad embed
and tagging
Payment
gateway plugin
Social sharingTagging Galleries

4. Progressive Web App Solutions
PWA (Progressive Web Apps) solutions have incredible benefits, making it
easy to delight your users, grow engagement and increase conversions.
Here is a checklist of what makes up a PWA solution and also looks to the
value proposition in choosing to implement such a web app architecture.
Safe Progressive Responsive Connectivity
InstallableRe-enageableDiscoverableApp-like

5. Enterprise Cloud Hosting Facility
Once a Wordpress site is part of Baobab WebSuite platform the ability to provide scalable, high
performance and redundant cloud infrastructure is possible.
DevOps, Staging, Production environments and complimenting cloud based services are configured
to ensure media assets are stored and retrieved in optimised manner

6. WebSuite PWA: PWA Technology:
To provide a mobile app like experience on the web for mobile users.
This can be achieved using the PWA bundle of web technologies and a
rich Javascript frontend. The Publisher’s Toolbox team have architected
a white label PWA framework compliant with a number of CMS platforms
(eg: WordPress) that can be themed with a number of varying templates.
The Baobab WebSuite PWA solution alongside other Baobab plugins and
service layers that brings compliance and standards to the WordPress
environment.
GOALS
1. Create a native mobile like user experience.
2. Achieve fastest loading times possible, measured on TTR (Time
to render) & TTI (Time to interaction)
3. Comply with SEO best practises.
4. Easy and useful social sharing.
5. Dynamic ad placement.
6. App stickiness - keeping user engaged and coming back for
more.
Progressive web apps are an enhancement of existing web technology. As
such, they do not require separate bundling or distribution. Publication of a
progressive web app is as it would be for any other web page. As of May 2018,
progressive web apps are supported by Chrome, Mozilla Firefox, Safari and
Edge.
1. Progressive - Work for every user, regardless of browser choice
because they’re built with progressive enhancement as a core tenet.
2. Responsive - Fit any form factor: desktop, mobile, tablet, or forms yet to
emerge.
3. Connectivity independent - Service workers allow work offline, or on
low quality networks.
4. App-like - Feel like an app to the user with app-style interactions and
navigation.
5. Fresh - Always up-to-date thanks to the service worker update process.
6. Safe - Served via HTTPS to prevent snooping and ensure content
hasn’t been tampered with.
7. Discoverable - Are identifiable as “applications” thanks to W3C
manifests and service worker registration scope allowing search
engines to find them.
8. Re-engageable - Make re-engagement easy through features like push
notifications.
9. Installable - Allow users to “keep” apps they find most useful on their
home screen without the hassle of an app store.
10. Linkable - Easily shared via a URL and do not require complex
installation.

7. “With the WebSuite plugins publisher’s can consolidate
and centrally manage and share digital assets and web
content securely and effectively.”
Progressive Web App Accessibility
Best PracticesPerformance

8. PWA Characteristics: DFP Adverts:
In keeping with the goals set out we have aimed to implement all
characteristics of a PWA.
1. No site redirection - site urls are preserved ensuring SEO best
practises.
2. Fast loading time - keeping within the 1 seconds
recommendation.
3. Responsive design - Best UX over different form factors.
4. Infinite scrolling - Keep the user engaged with an uninterrupted
reading experience.
5. Mobile App like UX - swiping between content.
6. Easy Social sharing.
7. DFP ad integration - ad placement configuration.
8. SEO and Accessibility optimised.
9. Installable on mobile devices increasing stickiness and reducing
bounce rates.
10. Google Tag Manager integration with offline capabilities.
WebSuite PWA currently utilises Google DoubleClick. The ads placement can
be configured via a theme file - to display on the following views:
● Home page - in between article cards per section (250x300,
250x600, 320x50)
● Section pages - in between article cards (250x300, 250x600,
320x50)
● Article pages - footer slot (250x300, 320x50)
The ability to have in article body ads is an upcoming feature, which will be
able to be configured as follows, per section:
● Min number of paragraphs / divs before first ad slot displayed
● Min number of paragraphs between ads slots
● Number of paragraphs before next ad slot after embedded media /
social elements
● Include ad slots yes / no
The following ad sizes will be supported in the article body: 250x300,
250x600, 320x50.

9. PWA Analytics:
PWA vs. Wordpress
Responsive:
We use Google Tag Manager for analytics. When online the
analytics behave as expected. As per the PWA characteristics the
app should be able to viewed offline. This offline behaviour can
make reporting accurate analytics a bit tricky in terms of page
views and the actual session data. It is often seen that page tracks
are either over or under reported. Another common issue is an
increase in bounce rate as the analytics session id gets lost on
sketchy networks. To get around these issues we have
implemented offline tracking in the service workers. We are busy
gathering data to support our theories. Only Google Analytics is
currently supported offline
The web is evolving with the goal of providing a better UX to content
consumers. A PWA is basically a responsive website / web app
applying these new technologies and ensuring that they are quick to
load and quick to interact with. As described before a developer can
choose to implement all or a subset of the PWA characteristics.
With each implementation of a PWA characteristic comes a benefit. We
feel that there is the case that the total PWA implementation is more
than the sum of it parts. This is why feel that the full PWA
implementation is a better longer term solution.
The following scores come from the responsive Wordpress website. It
must also be noted that UX still feels like a website and not an App.

10. 1. In the 2000s there was a migration of native desktop apps to the web. With the mobile
web taking over we feel that the same migration will take place with native mobile
apps. Our Wordpress PWA solutions are catering for full adoption across all the major
browsers with native APIs being exposed all the time.
2. Google is backing the PWA migration and showed their support by updating their
signals in their algorithms to favour website / webapps that provide their users good UX
and Fast download times. By utilizing and adhering to the PWA characteristics you
comply with google signalling.
3. PWA implementations have also seen a certain stickiness as the UX generally tends to
be better users tend to stick and around and come back.
PWA Conclusion:

11. Websites we host -

12. Websites we host

13. Websites we host -

14. Websites we host -

15. Baobab Websuite