Recherche avancée
Autres articles (30)
-
Websites made with MediaSPIP
2 mai 2011, parThis page lists some websites based on MediaSPIP.
-
Keeping control of your media in your hands
13 avril 2011, parThe vocabulary used on this site and around MediaSPIP in general, aims to avoid reference to Web 2.0 and the companies that profit from media-sharing.
While using MediaSPIP, you are invited to avoid using words like "Brand", "Cloud" and "Market".
MediaSPIP is designed to facilitate the sharing of creative media online, while allowing authors to retain complete control of their work.
MediaSPIP aims to be accessible to as many people as possible and development is based on expanding the (...) -
Creating farms of unique websites
13 avril 2011, parMediaSPIP platforms can be installed as a farm, with a single "core" hosted on a dedicated server and used by multiple websites.
This allows (among other things) : implementation costs to be shared between several different projects / individuals rapid deployment of multiple unique sites creation of groups of like-minded sites, making it possible to browse media in a more controlled and selective environment than the major "open" (...)
Sur d’autres sites (4707)
-
Top 4 CRO Tools to Boost Your Conversion Rates in 2024
31 octobre 2023, par ErinAre you tired of watching potential customers leave your website without converting ? You’ve spent countless hours creating an engaging website, but those high bounce rates keep haunting you.
The good news ? The solution lies in the transformative power of Conversion Rate Optimisation (CRO) tools. In this guide, we’ll dive deep into the world of CRO tools. We will equip you with strategies to turn those bounces into conversions.
Why are conversion rate optimisation tools so crucial ?
CRO tools can be assets in digital marketing, playing a pivotal role in enhancing online businesses’ performance. CRO tools empower businesses to improve website conversion rates by analysing user behaviour. You can then leverage this user data to optimise web elements.
Improving website conversion rates is paramount because it increases revenue and customer satisfaction. A study by VentureBeat revealed an average return on investment (ROI) of 223% thanks to CRO tools.
173 marketers out of the surveyed group reported returns exceeding 1,000%. Both of these data points highlight the impact CRO tools can have.
Coupled with CRO tools, certain testing tools and web analytics tools play a crucial role. They offer insight into user behaviour patterns, enabling businesses to choose effective strategies. By understanding what resonates with users, these tools help inform data-driven decisions. This allows businesses to refine online strategies and enhance the customer experience.
CRO tools enhance user experiences and ensure business sustainability. Integrating these tools is crucial for staying ahead. CRO and web analytics work together to optimise digital presence.
Real-world examples of CRO tools in action
In this section, we’ll explore real case studies showcasing CRO tools in action. See how businesses enhance conversion rates, user experiences, and online performance. These studies reveal the practical impact of data-driven decisions and user-focused strategies.
Case study : How Matomo’s Form Analytics helped Concrete CMS 3x leads
Concrete CMS, is a content management system provider that helps users build and manage websites. They used Matomo’s Form Analytics to uncover that users were getting stuck at the address input stage of the onboarding process. Using these insights to make adjustments to their onboarding form, Concrete CMS was able to achieve 3 times the amount of leads in just a few days.
Read the full Concrete CMS case study.
Best analytics tools for enhancing conversion rate optimisation in 2023
Jump to the comparison table to see an overview of each tool.
1. Matomo
Matomo stands out as an all-encompassing tool that seamlessly combines traditional web analytics features (like pageviews and bounce rates) with advanced behavioural analytics capabilities, providing a full spectrum of insights for effective CRO.
Key features
- Heatmaps and Session Recordings :
These features empower businesses to see their websites through the eyes of their visitors. By visually mapping user engagement and observing individual sessions, businesses can make informed decisions, enhance user experience and ultimately increase conversions. These tools are invaluable assets for businesses aiming to create user-friendly websites.
- Form Analytics :
Matomo’s Form Analytics offers comprehensive tracking of user interactions within forms. This includes covering input fields, dropdowns, buttons and submissions. Businesses can create custom conversion funnels and pinpoint form abandonment reasons.
- Users Flow :
Matomo’s Users Flow feature tracks visitor paths, drop-offs and successful routes, helping businesses optimise their websites. This insight informs decisions, enhances user experience, and boosts conversion rates.
- Surveys plugin :
The Matomo Surveys plugin allows businesses to gather direct feedback from users. This feature enhances understanding by capturing user opinions, adding another layer to the analytical depth Matomo offers.
- A/B testing :
The platform allows you to conduct A/B tests to compare different versions of web pages. This helps determine which performs better in conversions. By conducting experiments and analysing the results within Matomo, businesses can iteratively refine their content and design elements.
- Funnels :
Matomo’s Funnels feature empower businesses to visualise, analyse and optimise their conversion paths. By identifying drop-off points, tailoring user experiences and conducting A/B tests within the funnel, businesses can make data-driven decisions that significantly boost conversions and enhance the overall user journey on their websites.
Pros
- Starting at $19 per month, Matomo is an affordable CRO solution.
- Matomo guarantees accurate data, eliminating the need to fill gaps with artificial intelligence (AI) or machine learning.
- Matomo’s open-source framework ensures enhanced security, privacy, customisation, community support and long-term reliability.
Cons
- The On-Premise (self-hosted) version is free, with additional charges for advanced features.
- Managing Matomo On-Premise requires servers and technical know-how.
Try Matomo for Free
Get the web insights you need, without compromising data accuracy.
2. Google Analytics
Google Analytics provides businesses and website owners valuable insights into their online audience. It tracks website traffic, user interactions and analyses conversion data to enhance the user experience.
While Google Analytics may not provide the extensive CRO-specific features found in other tools on this list, it can still serve as a valuable resource for basic analysis and optimisation of conversion rates.
Key features
- Comprehensive Data Tracking :
Google Analytics meticulously tracks website traffic, user behaviour and conversion rates. These insights form the foundation for CRO efforts. Businesses can identify patterns, user bottlenecks and high-performing areas.
- Real-Time Reporting :
Access to real-time data is invaluable for CRO efforts. Monitor current website activity, user interactions, and campaign performance as they unfold. This immediate feedback empowers businesses to make instant adjustments, optimising web elements and content for maximum conversions.
- User flow analysis
Visualise and understand how visitors navigate through your website. It provides insights into the paths users take as they move from one page to another, helping you identify the most common routes and potential drop-off points in the user journey.
- Event-based tracking :
GA4’s event-based reporting offers greater flexibility and accuracy in data collection. By tracking various interactions, including video views and checkout processes, businesses can gather more precise insights into user behaviour.
- Funnels :
GA4 offers multistep funnels, path analysis, custom metrics that integrate with audience segments. These user behaviour insights help businesses to tailor their websites, marketing campaigns and user experiences.
Pros
- Flexible audience management across products, regions or brands allow businesses to analyse data from multiple source properties.
- Google Analytics integrates with other Google services and third-party platforms. This enables a comprehensive view of online activities.
- Free to use, although enterprises may need to switch to the paid version to accommodate higher data volumes.
Cons
- Google Analytics raises privacy concerns, primarily due to its tracking capabilities and the extensive data it collects.
- Limitations imposed by thresholding can significantly hinder efforts to enhance user experience and boost conversions effectively.
- Property and sampling limits exist. This creates problems when you’re dealing with extensive datasets or high-traffic websites.
- The interface is difficult to navigate and configure, resulting in a steep learning curve.
3. Contentsquare
Contentsquare is a web analytics and CRO platform. It stands out for its in-depth behavioural analytics. Contentsquare offers detailed data on how users interact with websites and mobile applications.
Key features
- Heatmaps and Session Replays :
Users can visualise website interactions through heatmaps, highlighting popular areas and drop-offs. Session replay features enable the playback of user sessions. These provide in-depth insights into individual user experiences.
- Conversion Funnel Analysis :
Contentsquare tracks users through conversion funnels, identifying where users drop off during conversion. This helps in optimising the user journey and increasing conversion rates.
- Segmentation and Personalisation :
Businesses can segment their audience based on various criteria. Segments help create personalised experiences, tailoring content and offers to specific user groups.
- Integration Capabilities :
Contentsquare integrates with various third-party tools and platforms, enhancing its functionality and allowing businesses to leverage their existing tech stack.
Pros
- Comprehensive support and resources.
- User-friendly interface.
- Personalisation capabilities.
Cons
- High price point.
- Steep learning curve.
4. Hotjar
Hotjar is a robust tool designed to unravel user behaviour intricacies. With its array of features including visual heatmaps, session recordings and surveys, it goes beyond just identifying popular areas and drop-offs.
Hotjar provides direct feedback and offers an intuitive interface, enabling seamless experience optimisation.
Key features
- Heatmaps :
Hotjar provides visual heatmaps that display user interactions on your website. Heatmaps show where users click, scroll, and how far they read. This feature helps identify popular areas and points of abandonment.
- Session Recordings :
Hotjar allows you to record user sessions and watch real interactions on your site. This insight is invaluable for understanding user behaviour and identifying usability issues.
- Surveys and Feedback :
Hotjar offers on-site surveys and feedback forms that can get triggered based on user behaviour. These tools help collect qualitative data from real users, providing valuable insights.
- Recruitment Tool :
Hotjar’s recruitment tool lets you recruit participants from your website for user testing. This feature streamlines the process of finding participants for usability studies.
- Funnel and Form Analysis :
Hotjar enables the tracking of user journeys through funnels. It provides insights into where users drop off during the conversion process. It also offers form analysis to optimise form completion rates.
- User Polls :
You can create customisable polls to engage with visitors. Gather specific feedback on your website, products, or services.
Pros
- Starting at $32 per month, Hotjar is a cost-effective solution for most businesses.
- Hotjar provides a user-friendly interface that is easy for the majority of users to pick up quickly.
Cons
- Does not provide traditional web analytics and requires combining with another tool, potentially creating a less streamlined and cohesive user experience, which can complicate conversion rate optimization efforts.
- Hotjar’s limited integrations can hinder its ability to seamlessly work with other essential tools and platforms, potentially further complicating CRO.
Comparison Table
Please note : We aim to keep this table accurate and up to date. However, if you see any inaccuracies or outdated information, please email us at marketing@matomo.org
To make comparing these tools even easier, we’ve put together a table for you to compare features and price points :
Conclusion
CRO tools and web analytics are essential for online success. Businesses thrive by investing wisely, understanding user behaviour and using targeted strategies. The key : generate traffic and convert it into leads and customers. The right tools and strategies lead to remarkable conversions and online success. Each click, each interaction, becomes an opportunity to create an engaging user journey. This careful orchestration of data and insight separates thriving businesses from the rest.
Are you ready to embark on a journey toward improved conversions and enhanced user experiences ? Matomo offers analytics solutions meticulously designed to complement your CRO strategy. Take the next step in your CRO journey. Start your 21-day free trial today—no credit card required.
Try Matomo for Free
21 day free trial. No credit card required.
- Heatmaps and Session Recordings :
-
Revision 33563 : spanish language file. May be we should use Salvatore, right ?
7 décembre 2009, par gaitan@… — Logspanish language file. May be we should use Salvatore, right ?
-
Node.js readable maximize throughput/performance for compute intense readable - Writable doesn't pull data fast enough
31 décembre 2022, par flohallGeneral setup


I developed an application using AWS Lambda node.js 14.
I use a custom
ReadableimplementationFrameCreationStreamthat uses node-canvas to draw images, svgs and more on a canvas. This result is then extracted as a raw image buffer in BGRA. A single image buffer contains 1920 * 1080 * 4 Bytes = 8294400 Bytes 8 MB.
This is then piped tostdinof achild_processrunningffmpeg.
ThehighWaterMarkof myReadableinobjectMode:trueis set to 25 so that the internal buffer can use up to 8 MB * 25 = 200 MB.

All this works fine and also doesn't contain too much RAM. But I noticed after some time, that the performance is not ideally.


Performance not optimal


I have an example input that generates a video of 315 frames. If I set
highWaterMarkto a value above 25 the performance increases to the point, when I set to a value of 315 or above.

For some reason
ffmpegdoesn't start to pull any data untilhighWaterMarkis reached. Obviously thats not what I want.ffmpegshould always consume data if minimum 1 frame is cached in theReadableand if it has finished processing the frame before. And theReadableshould produce more frames as longhighWaterMarkisn't reached or the last frame has been reached. So ideally theReadableand theWriteableare busy all the time.

I found another way to improve the speed. If I add a timeout in the
_read()method of theReadableafter let's say every tenth frame for 100 ms. Then theffmpeg-Writablewill use this timeout to write some frames toffmpeg.

It seems like frames aren't passed to
ffmpegduring frame creation because some node.js main thread is busy ?

The fastest result I have if I increase
highWaterMarkabove the amount of frames - which doesn't work for longer videos as this would make the AWS Lambda RAM explode. And this makes the whole streaming idea useless. Using timeouts always gives me stomach pain. Also depending on the execution on different environments a good fitting timeout might differ. Any ideas ?

FrameCreationStream


import canvas from 'canvas';
import {Readable} from 'stream';
import {IMAGE_STREAM_BUFFER_SIZE, PerformanceUtil, RenderingLibraryError, VideoRendererInput} from 'vm-rendering-backend-commons';
import {AnimationAssets, BufferType, DrawingService, FullAnimationData} from 'vm-rendering-library';

/**
 * This is a proper back pressure compatible implementation of readable for a having a stream to read single frames from.
 * Whenever read() is called a new frame is created and added to the stream.
 * read() will be called internally until options.highWaterMark has been reached.
 * then calling read will be paused until one frame is read from the stream.
 */
export class FrameCreationStream extends Readable {

 drawingService: DrawingService;
 endFrameIndex: number;
 currentFrameIndex: number = 0;
 startFrameIndex: number;
 frameTimer: [number, number];
 readTimer: [number, number];
 fullAnimationData: FullAnimationData;

 constructor(animationAssets: AnimationAssets, fullAnimationData: FullAnimationData, videoRenderingInput: VideoRendererInput, frameTimer: [number, number]) {
 super({highWaterMark: IMAGE_STREAM_BUFFER_SIZE, objectMode: true});

 this.frameTimer = frameTimer;
 this.readTimer = PerformanceUtil.startTimer();

 this.fullAnimationData = fullAnimationData;

 this.startFrameIndex = Math.floor(videoRenderingInput.startFrameId);
 this.currentFrameIndex = this.startFrameIndex;
 this.endFrameIndex = Math.floor(videoRenderingInput.endFrameId);

 this.drawingService = new DrawingService(animationAssets, fullAnimationData, videoRenderingInput, canvas);
 console.time("read");
 }

 /**
 * this method is only overwritten for debugging
 * @param size
 */
 read(size?: number): string | Buffer {

 console.log("read("+size+")");
 const buffer = super.read(size);
 console.log(buffer);
 console.log(buffer?.length);
 if(buffer) {
 console.timeLog("read");
 }
 return buffer;
 }

 // _read() will be called when the stream wants to pull more data in.
 // _read() will be called again after each call to this.push(dataChunk) once the stream is ready to accept more data. https://nodejs.org/api/stream.html#readable_readsize
 // this way it is ensured, that even though this.createImageBuffer() is async, only one frame is created at a time and the order is kept
 _read(): void {
 // as frame numbers are consecutive and unique, we have to draw each frame number (also the first and the last one)
 if (this.currentFrameIndex <= this.endFrameIndex) {
 PerformanceUtil.logTimer(this.readTimer, 'WAIT -> READ\t');
 this.createImageBuffer()
 .then(buffer => this.optionalTimeout(buffer))
 // push means adding a buffered raw frame to the stream
 .then((buffer: Buffer) => {
 this.readTimer = PerformanceUtil.startTimer();
 // the following two frame numbers start with 1 as first value
 const processedFrameNumberOfScene = 1 + this.currentFrameIndex - this.startFrameIndex;
 const totalFrameNumberOfScene = 1 + this.endFrameIndex - this.startFrameIndex;
 // the overall frameId or frameIndex starts with frameId 0
 const processedFrameIndex = this.currentFrameIndex;
 this.currentFrameIndex++;
 this.push(buffer); // nothing besides logging should happen after calling this.push(buffer)
 console.log(processedFrameNumberOfScene + ' of ' + totalFrameNumberOfScene + ' processed - full video frameId: ' + processedFrameIndex + ' - buffered frames: ' + this.readableLength);
 })
 .catch(err => {
 // errors will be finally handled, when subscribing to frameCreation stream in ffmpeg service
 // this log is just generated for tracing errors and if for some reason the handling in ffmpeg service doesn't work
 console.log("createImageBuffer: ", err);
 this.emit("error", err);
 });
 } else {
 // push(null) makes clear that this stream has ended
 this.push(null);
 PerformanceUtil.logTimer(this.frameTimer, 'FRAME_STREAM');
 }
 }

 private optionalTimeout(buffer: Buffer): Promise<buffer> {
 if(this.currentFrameIndex % 10 === 0) {
 return new Promise(resolve => setTimeout(() => resolve(buffer), 140));
 }
 return Promise.resolve(buffer);
 }

 // prevent memory leaks - without this lambda memory will increase with every call
 _destroy(): void {
 this.drawingService.destroyStage();
 }

 /**
 * This creates a raw pixel buffer that contains a single frame of the video drawn by the rendering library
 *
 */
 public async createImageBuffer(): Promise<buffer> {

 const drawTimer = PerformanceUtil.startTimer();
 try {
 await this.drawingService.drawForFrame(this.currentFrameIndex);
 } catch (err: any) {
 throw new RenderingLibraryError(err);
 }

 PerformanceUtil.logTimer(drawTimer, 'DRAW -> FRAME\t');

 const bufferTimer = PerformanceUtil.startTimer();
 // Creates a raw pixel buffer, containing simple binary data
 // the exact same information (BGRA/screen ratio) has to be provided to ffmpeg, because ffmpeg cannot detect format for raw input
 const buffer = await this.drawingService.toBuffer(BufferType.RAW);
 PerformanceUtil.logTimer(bufferTimer, 'CANVAS -> BUFFER');

 return buffer;
 }
}
</buffer></buffer>

FfmpegService


import {ChildProcess, execFile} from 'child_process';
import {Readable} from 'stream';
import {FPS, StageSize} from 'vm-rendering-library';
import {
 FfmpegError,
 LOCAL_MERGE_VIDEOS_TEXT_FILE, LOCAL_SOUND_FILE_PATH,
 LOCAL_VIDEO_FILE_PATH,
 LOCAL_VIDEO_SOUNDLESS_MERGE_FILE_PATH
} from "vm-rendering-backend-commons";

/**
 * This class bundles all ffmpeg usages for rendering one scene.
 * FFmpeg is a console program which can transcode nearly all types of sounds, images and videos from one to another.
 */
export class FfmpegService {

 ffmpegPath: string = null;


 constructor(ffmpegPath: string) {
 this.ffmpegPath = ffmpegPath;
 }

 /**
 * Convert a stream of raw images into an .mp4 video using the command line program ffmpeg.
 *
 * @param inputStream an input stream containing images in raw format BGRA
 * @param stageSize the size of a single frame in pixels (minimum is 2*2)
 * @param outputPath the filepath to write the resulting video to
 */
 public imageToVideo(inputStream: Readable, stageSize: StageSize, outputPath: string): Promise<void> {
 const args: string[] = [
 '-f',
 'rawvideo',
 '-r',
 `${FPS}`,
 '-pix_fmt',
 'bgra',
 '-s',
 `${stageSize.width}x${stageSize.height}`,
 '-i',
 // input "-" means input will be passed via pipe (streamed)
 '-',
 // codec that also QuickTime player can understand
 '-vcodec',
 'libx264',
 '-pix_fmt',
 'yuv420p',
 /*
 * "-movflags faststart":
 * metadata at beginning of file
 * needs more RAM
 * file will be broken, if not finished properly
 * higher application compatibility
 * better for browser streaming
 */
 '-movflags',
 'faststart',
 // "-preset ultrafast", //use this to speed up compression, but quality/compression ratio gets worse
 // don't overwrite an existing file here,
 // but delete file in the beginning of execution index.ts
 // (this is better for local testing believe me)
 outputPath
 ];

 return this.execFfmpegPromise(args, inputStream);
 }

 private execFfmpegPromise(args: string[], inputStream?: Readable): Promise<void> {
 const ffmpegServiceSelf = this;
 return new Promise(function (resolve, reject) {
 const executionProcess: ChildProcess = execFile(ffmpegServiceSelf.ffmpegPath, args, (err) => {
 if (err) {
 reject(new FfmpegError(err));
 } else {
 console.log('ffmpeg finished');
 resolve();
 }
 });
 if (inputStream) {
 // it's important to listen on errors of input stream before piping it into the write stream
 // if we don't do this here, we get an unhandled promise exception for every issue in the input stream
 inputStream.on("error", err => {
 reject(err);
 });
 // don't reject promise here as the error will also be thrown inside execFile and will contain more debugging info
 // this log is just generated for tracing errors and if for some reason the handling in execFile doesn't work
 inputStream.pipe(executionProcess.stdin).on("error", err => console.log("pipe stream: " , err));
 }
 });
 }
}
</void></void>

Syndiquer tout le site
