Does the fresh 2018 web site embody best practice digital marketing?
This week Europe’s premier digital marketing event Digital Marketing Exposition & Conference (DMEXCO) gets underway in Cologne. Forward thinking attendees searching for exhibitors or planning their conference schedule are likely to start with the dmexco.com web site. DMEXCO’s organisers claim the website delivers a "a web-enabled and clear CI [Common Interface] that works equally well on all platforms."
The DMEXCO web site should be a shining example of best practice in digital marketing. It is not. Exhibitors are poorly served, and attendees left frustrated.
Using screen shots and examples I briefly record my initial impressions as an attendee visiting dmexco.com on both desktop and mobile before articulating why this is a business problem and hypothesising how such web sites can still be delivered more than 8 years after Ethan Marcotte coined the phrase "Responsive Web Design" and Google advocated "Mobile First".
After initial load of the home page the background starts to alternate every 3 seconds between vivid red and blue making identification of navigation elements hard and the general first impression somewhat distracting.
Scrolling down the page results in the "Get your Tickets Now!" window floating over the content but without any visual clues that it is in fact a floating element and is obscuring other elements.
Using the magnifying glass icon to search for an exhibitor reveals a white bar at the top of the page to enter the search term. The search box is lost against a sea of white but appears sufficiently close to the icon to be noticeable.
Entering an exhibitor name results in a screen split into quarters with the exhibitor result appearing in the bottom right quarter which was the last area to attract my attention. Typically search results appear more prominently than the metrics, particularly when the total number of results is so small.
When selecting the exhibitor a general map of the Halls appears but the hall and stand number have disappeared and are replaced with the general company contact details, so you end up flicking back and forth between pages in order to establish the exhibitors’ location.
So far, I’ve been considering DMEXCO event preparation requirements sitting at my super-fast internet connected desktop with a big screen. Perhaps this isn’t a very common use case and the web site is designed primarily of the small screen form factor of a smartphone?
Starting with a Google search the following animated gif shows the initial experience arriving at the home page.
The page takes some time to appear and suffers from the same alternating red/blue issue as the desktop although less severe due to the smaller screen size.
Performing the same site search results in the following flow to the company information page.
- Initial search page as shown in previous video.
- Performing the same site search resulted in a text box that is now a lot clearer as it’s contrasted against the red and blue background.
- The search results don’t appear on the screen that follows.
- A further swipe down is needed to reveal the results...
- ...well almost. The scroll feature rapidly obscures the exhibitor name. Selecting "Read More" results in the following page.
- Over four screens of total emptiness need to be navigated through before any useful information about the company or products appears.
Had I been giving more consideration to the differences between the Expo and the Conference I might have started my search at the Expo page rather than the site search.
- The exposition home page with search for exhibitors clearly labeled.
- Something has clearly gone wrong with the layout but it’s clear where the text box is.
- The results are off the screen in favour of the search results metric. The metrics show there is more information available than via the equivalent site search.
- Swiping down starts to reveal the summaries with the exhibitor page prioritised.
Back to Desktop
The same search process on Desktop produces more accessible results with all the content and filters readily visible.
My specific requirement was to research an exhibitor to find the stand location and some company background. To this end the web site was frustrating on mobile, but better on desktop when a secondary search method was used to find more relevant information.
To test my observations, I asked several colleagues to do the same. All started their search at the site search and most ended up on the tickets page when attempting to dismiss the floating tickets element on a mobile.
Web Site Purpose
DMEXCO have shared details about the redesigned web site under the stories section (Guidance System / Common Interface). The web site has been primarily designed as a publishing platform for articles and is enjoying success when measured by visit duration, returning visitors and social media. As such many of the visitors are likely to avoid the home page and site search, arriving directly at the story or conference session.
Show me the Money
Circa €4 million of revenue is generated from attendees.
In contrast at least €28 million of revenue (87%) comes from exhibitors, ignoring other revenue sources from exhibitors such as sponsoring events or advertising.
Surely the primary purpose of the web site is to enable the exhibitors to be discovered easily by the attendees who provide the rest? Unlike a publisher’s website there is no programmatic advertising to generate revenue. A revenue-focused design process would have ensured the primary stakeholders' requirements were fulfilled.
Too many Platforms
Close inspection shows some of the pages are served from the domain dmexco.com and others from service.dmexco.com. It is likely that the designers have been constrained by multiple databases, CRM systems or other IT platform components. Using a single unified system will always reduce this technical complexity and result in an integrated experience. Perhaps constraints such as time or developer availability prevented this from being achieved.
Where multiple platforms must be used, a master platform that indexes content to ensure the initial search experience appears in one place is a good idea. The designers may have been familiar with the red / blue / circle / square common interface but the initial visitor won’t be.
Responsive Web Design (RWD)
Creating a single design that works well on both desktop and mobile is hard, and usually results in undesirable compromises for both. I doubt many web designers will hold dmexco.com up as an example of best practice in areas other than the stories section. However, there are some simple solutions to quickly improve the experience. Here are just some;
No Mobile Video: Assuming the background video does add value on desktop and the colour change is desirable it certainly shouldn’t be impairing performance on mobile. As much of it is obscured by the content on mobile, simply removing it on the small screen would easily improve site performance.
Adaptive: Testing RWD can be hard as every minor change for one format must be checked on the rest to ensure nothing has broken. This may be why the search box on mobile doesn’t render correctly whilst it looks good on desktop.
Creating separate layouts for mobile and desktop avoids this testing complexity, reducing associated costs and delivery time whilst improving overall site performance, particularly on mobile. This technique is termed Responsive Server Side (RESS) or Adaptive Design supported by device detection solutions and is often misunderstood by web designers, but is increasingly being used by leading web businesses and publishers, such as Tencent, Seznam, Sports New Media and News24, to complement RWD.
Touch: Where a touch screen is the only navigation method available different user interface components could be given priority.
For example; when searching for exhibitors selecting the first letter of the exhibitor name to receive a list of associated exhibitors would be easier than typing the full name on a mobile and would work well when the maximum number of exhibitors returned could be navigated in just a few screen swipes. Such a user interface would be less intuitive when a mouse and keyboard are available.
Images: Images are another source of difficulty across mobile and desktop. The following image consumes 2.1mb, or 2/3rds of the total page weight.
Whilst the resolution of the image may be justified on a big screen it just slows down mobile. Optimising assets using well-known HTML5 techniques is a simple method to optimise performance without requiring Content Delivery Networks (CDNs) or other more complex technologies.
Reading the DMEXCO’s own articles about the web site suggests the primary focus is a publishing platform where readers arrive from social media. To this end the site works well with a simple black on white article format. The various articles related to the design and purpose of the site suggest this is the primary design goal for the site.
However, the primary requirement for attendees and exhibitors to meet in person is poorly served. Had the objectives for the design reflected this then more attention would have been paid to these features. Ultimately business objectives must be aligned.
Perhaps for 2019 DMEXCO.com can be modified to better serve exhibitors’ and attendees’ primary requirements, and become a demonstration of best practice multi device web implementation.