Brand websites under scrutiny: PSA Peugeot Citroën

There are almost as many website approaches as there are manufacturers; regardless of the creativity used, the objectives are different for generalist, premium and luxury brands. However, there are a number of common characteristics and features that make it possible to homogenize the mix. On the one hand there is the agility of the site, on the other hand the offer of information, and finally the configurator, which requires a separate article.

We begin with the PSA Group, which for the purposes of this study can be considered a medium-sized group: two generalist brands (Citroën and Peugeot) and one premium brand (DS).


The PSA Group's web in data

This section evaluates data that give an idea of the agility of the site, obtained using simulation tools that do not depend on the IT platform used. Some absolute values are not relevant and should be taken as a mere reference; the figures will be different to a greater or lesser extent for each user and device used to view the website, both desktop and mobile.

The simulation considers data from the first visit to the respective websites, with a standard 10 Mb DSL connection, under the following conditions:

  • Desktop: Chrome browser
  • Apple: iOS version 9, the default browser and an iPhone 5C handset
  • Android: Nexus 7 terminal with Chrome browser

The results obtained are as follows:

Citroën Desktop iOS Android
Page weight (KB) 2.939 2.100 2.810
Load time first byte (s) 2,225 2,376 4,536
Start of page render (s) 8,143 8,200 9,671
Total load time (s) 18,717 16,632 22,431
Complexity level 194 112 143


Peugeot Desktop iOS Android
Page weight (KB) 3.463 1.114 3.157
Load time first byte (s) 0,542 1,296 0,945
Start of page rendering (s) 3,414 6,283 5,011
Total load time (s) 19,997 14,256 37,990
Complexity level 324 197 325

DS Desktop iOS Android
Page weight (KB) 6.305 5.072 6.139
Load time first byte (s) 1,062 1,681 1,199
Start of page render (s) 4,721 4,345 5,711
Total load time (s) 37,233 31,793 38,118
Complexity level 78 50 78
  • Page weight: download size (Kilobyte). The higher the number, the higher the data consumption
  • First byte load time: Interval between the request made and the first response from the server.
  • Beginning of page rendering: time interval between request and on-screen representation of the Web elements.
  • Total load time: interval between first request and complete download of the page, including elements that are loaded in the background and are not visible at first instance
  • Complexity level: measured by the number of elements on the page (texts, images, animations, etc.)

Quantitative results

  • Although Citroën's page is the lightest in terms of size, it seems to load more slowly because of the time we have the "blank screen" (from the time we send the request to the server until we see the first screen loaded).
  • In terms of speed of response, Peugeot takes the lead despite being the most complex. The first screen is very fast
  • The DS website is the most data-hungry, despite having the fewest elements. This is due to the images, whose weight is: 87.4% desktop, 89.3% iOS and 87.6% in Android.

Beyond the simulation and using my usual work equipment (PC with Linux, Tablet with Android 4.2 and smartphone with Android 5.0, all three with Firefox browser), the real experience is very similar to the results of the tables: the Citroën page has been the slowest during the hours that I have experimented with it (it may be a specific server problem, a consequence of the extra weight of the commercial promotion these days, or a structural defect of the site). Peugeot's website has proved to be the most agile and driveds.es has the best compromise between content and performance.


PSA Group websites: qualitative analysis

The three PSA Group websites are all in Spanish and have been designed to adapt to different screen sizes, both desktop and mobile.

Citroën

Citroën's website is currently heavily marked by a commercial promotion, which shows in rapid automatic sequence the brand's passenger cars and commercial vehicles, the equivalent DS promotion and that of the 100% electric C-ZERO model. As the colours linked to each of these groups are different, the result is somewhat clashing and not very aesthetically pleasing.

At the top of the website we find, on the left, the "home" button and the name of the page. To its right a small secondary menu where there are controls to access information related to the official network in Spain of the brand. To the right of this element is the Citroën logo. Immediately below the secondary menu is the main menu, where some items give access to other submenus. The first detail that jumps to the eye when it is able to avoid the hypnotic effect of the slideshow, is the insistence on different promotions, to the point of being duplicated.

Under the slideshow there is a third menu, this time graphic with horizontal scrolling, which insists on various promotions, from those already seen to tires. The element of this menu that gives access to the appointment request is the most hidden. As if they were few, there is a fourth menu, this time vertical, which gives access to the configurator and other commercial elements. On the first load of the page is displayed in the form of a horizontal band warning about cookies, which without being discreet, is not as annoying as in other cases that we will see.


As you browse the page, you discover that the really interesting content is hidden under so many noisy promotions: Citroën Assistance, Point of Sale Search, FAQ, Blog, social networks and others no less interesting, of course, in other menus! Even more hidden is the customer service telephone number and even more hidden is the legal information (yes, in another menu), which is just as rambling and unwieldy as on most large websites (Data processing, Data protection, Legal notice and Cookies).

The information on the different models is correct, with a qualitative rather than quantitative approach. It is accompanied by images of varying sizes (from medium to large), and sometimes video is also integrated (hosted on the company's YouTube channel). As for the images, there are both studio photographs of good size and quality (without reference to other objects), as well as others of the various models integrated into an environment. The ones integrated in the galleries stand out for their quality.

Below is a table summarising the features of the official Citroën Spain website.

www.citroen.es
Responsive design (adapted to mobiles) Yes
In Spanish Yes
General accessibility to information Bad
Access to models Good
Access to manuals Bad
Dealer access Via search engine
Legal information Hidden
Rescue sheets (*) Yes
Extra contents Story
Newsletter Yes
Blog Yes
Job offers No
Sport information Yes
Image quality Good
Image size Good
3D View Yes
Internal search engine Regular
Social network integration Regular
Multimedia download No
Other downloads Data sheets and accessory catalogues
Shop (merchandising) No
Promotional treatment Very aggressive
Corporate information No
(*) Standardized files with information from the
vehicle

The general perception of Citroën Spain's website is one of chaotic organization, lack of coherence and a very aggressive commercial approach, which can be annoying, with some aspects of a flea market. The aspiration to sell is legitimate, but when it is done with class the result can be better. Nor is it pleasant the amount of controls that open in another instance of the browser; in a few minutes you can have the screen full of tabs. It can't be said that the information is incomplete, but it's not very intuitive, if not cumbersome, to access certain sections. All of the above is about the desktop version, on a mobile device it's even worse.

Peugeot

The Peugeot Spain website is a good example of how different two brothers can be. It has in common with the previous website some of the main items in the general menu, the sales network and how to access it. It also has a "slideshow" -less aggressive- and more than one menu. This is where the similarities end, because the big difference in favour of the Peugeot Spain website is the coherence of the page in terms of graphics, as well as the rational layout of all its elements.

In the desktop version everything is at a glance: general menu, immediate access to the different models, additional information in an aesthetic graphic menu, legal information at a glance, integration with social networks discreet but visible, and other content gathered under the item: "Useful links", grouped appropriately and visually well highlighted. The Peugeot website may be more or less attractive depending on the taste of each user, but there is no doubt that, as a tool, it is well thought out.

As an example of how much care has been taken in the design and layout of content, there is the "legal notice" section. It contains the same rambling and almost lawyer-friendly terms as almost any other related site, but it is well organised, aesthetically pleasing and rationally laid out, allowing individual aspects to be found precisely.

The mobile version of Peugeot.co.uk is not as comprehensive, but the spirit of coherent and well-done work continues; it is pleasant and intuitive to navigate the site even withsmall-screen smartphones.

Let's take a look at a summary of the features of the official Peugeot Spain website.

www.peugeot.es
Responsive design (adapted to mobiles) Yes
In Spanish Yes
General accessibility to information Excellent
Access to models Excellent
Access to manuals No
Dealer Access By search engine and postcode
Legal information Visible and well organized
Rescue sheets (*) No
Extra contents No
Newsletter Yes
Blog No, although it has a news service
Job offers No
Sports information Yes
Quality of images Good
Image size Regular
3D View No
Internal search engine No
Social network integration Good
Multimedia download No
Other downloads Accessories catalogues
Shop (merchandising) No
Promotion processing Rational
Corporate information No
(*) Standardized data sheets with information on the
vehicle

DS

The latest member of the PSA family is the premium brand DS, which has its own website, although it can be accessed directly or indirectly from the Citroën site (at least in terms of promotions). On the DS Automobiles site, dark, almost black tones prevail. In some images, especially the first one that appears in the automatic pass, the idea that black is associated with luxury is taken to such an extreme that the result is similar to watching two ninjas fighting in an unlit tunnel over an ounce of chocolate: detail is lost amidst all the darkness. The mobile implementation suffers from the same.

Aside from the choice of colour, the DS website is simple, with a basic menu that allows direct access to its meagre range. The design of the site suffers from a certain incoherence between black sections like the night and others of snowy white. It gives the impression of being unfinished (and if it is, it lacks more than a boil). In addition to direct access to the models, it offers interesting content in the small three-item sub-menu: "inside", "connect" and "services".

The advertising claim "We'll call you for free", in the form of a banner that can be hidden, has the behavior of a naughty child. It's fine if it appears when the page loads, but if the user chooses to hide it, it doesn't have to reappear every time we jump between menus. If it's a programming bug, the father of the code gets a slap on the wrist. If it's the marketing department's idea: you're a pain in the ass! Either we're premium or we're not; so much free calling lowers the brand's image.

As the site doesn't give much more of itself, here's the summary table of features:

www.dsautomóviles.es
Responsive design (adapted to mobiles) Yes
In Spanish Yes
General accessibility to information Well
Access to models Excellent
Access to manuals No
Dealer Access Regular
Legal information Hidden
Rescue sheets (*) No
Extra Contents Yes, History
Newsletter Yes
Blog No
Job offers No
Sport information No
Image quality Good
Image size Fine
3D View No
Internal search engine Yes
Social network integration Scarce
Multimedia download No
Other downloads No
Shop (merchandising) No
Promotion processing Discreet
Corporate information No
(*) Standardized data sheets with information on the
vehicle

Conclusions of the qualitative analysis

Strictly speaking in terms of web design, organisation and as a tool for the user, the Peugeot España website is far superior to its sisters. Citroën's site is more comprehensive in terms of content. Both the Citroën and DS sites suffer from a strong commercial bias, which is excessive in the case of Citroën and inadequate in the case of the premium brand.

As for corporate information, the same applies in these three cases as in other groups: there is a specific portal for this purpose. The PSA Group has an international website, in English and French, with information on corporate social responsibility, financial information, share price, etc. There is also a Spanish site, centred around the PSA factory in Villaverde (Madrid), and another dedicated to the Vigo site. Both Spanish sites provide information mainly about the plants, but there is a lack of information which is only available on the international portal.



Add a comment from Brand websites under scrutiny: PSA Peugeot Citroën
Comment sent successfully! We will review it in the next few hours.