When I work with my marketing team, I know we have the same goal: to give our site users the best possible experience. As a developer, I'm not usually responsible for creating content, but I keep in mind some key indicators and concepts that will help the marketing team and me achieve our goals. Here are some basic concepts on which web developers focus when creating web pages and what they mean to you as a marketer.
The first significant painting and the time of interactivity
The first meaningful painting and the time spent in interactivity are particularly useful indicators for determining the performance of your web page. Essentially, the shorter these times, the faster your users can access and engage with your page content. Although your web team makes a lot of effort to ensure that the first significant painting and interaction time occur as quickly as possible – using CDNs, modulating the code so that it only loads What's Needed Marketers can engage designers or design their content based on these metrics.
Let's go a little further.
The first significant painting (FMP) is the first time that your web browser displays content on the page that is useful to the end user. Let's say you have a website about the different types of ducks and on your home page, you want to present a "Duck of the Month" as the hero of the homepage, or rather the main content above the fold. The FMP is the point at which the user can first see the image of your "duck of the month" as well as any title or text attached to the image.
Time to Interactive (TTI) is closely related to the FMP and will come after the FMP. Using the previous example, let's say that our hero "Duck of the Month" also has the ability to play duck quack when it's clicked, and you can swipe from left to right for more. ; images. TTI is the time it takes for these features to be available on the page for the user, or when the page or application becomes useful.
As a buyer, what can you do to ensure that the time required to reach the FMP and the TTI is as short as possible? Many things!
Make sure your best content is always above the fold
Although this may seem obvious, it helps exponentially if the content or interactivity you want to get from the site is above the bar. Essentially, developers can use techniques such as " lazy loading, " to ensure that code / images / features are only loaded after a user performs an action that requires it. code / images / page or by clicking a button. To ensure you get the fastest FMP and TTI times, you want to put your most valuable content and features at the center of your business.
Do not drive the page is not the best practice
The bright side of Web 2.0 is that we can get resources from other sources just by pressing a button, or … click on a mouse. However, loading too many external elements or using too many styles, fonts, and images to load from other locations can slow down your image. page. Instead, try using internal resources or providing the files you need to your developers to reduce load times.
Using Web Optimized Images to Suit Your Situation
Basically, this boils down to this: JPEG files are good for smaller images and times when you do not need your images to be perfect. For example, they make good thumbnails, background images (according to), icons, and so on. PNG images are perfect for absolutely perfect images and larger images on your site. etc. In addition, many image editing applications, such as Photoshop, typically have the ability to optimize images for the Web. Since loading resources can take up most of the loading time of your page, you need to make sure that you reduce the file size as much as possible, which usually means that JPEG files will not affect your user experience .
Bounce rate and exit rate
Bounce and exit rates are key marketing indicators for your site, because they essentially indicate how users interact with your pages, how quickly they exit and where they opt out. Your development team can also use these metrics to determine if the site has specific issues.
For example, high bounce rates could indicate long load times. When we talk about how fast the page loads, we're talking about a page load of up to two seconds and a goal of less than half a second. Thus, pages that are loading longer may see users abandoning the site before the page is loaded, which increases your bounce rates.
Exit rates may be more indicative of a page functionality problem or a subsequent layout in your funnel. For example, a user goes through some of your great content, and when submitting the form to access that sweet content, if the form expires, or does not submit, or takes a long time to submit, they will leave frustrated.
Since these indicators are typically used by your marketing team, GA or SEO specialist you can attract the attention of your development team on these indicators so that they can analyze them. particular pages better. They might see something that looks ok on the surface but that could subtly affect the user experience. Or they may notice that this particular feature looks good and brilliant on Google Chrome, but is a nightmare on Safari! Be that as it may, do not be afraid to bring these statistics and investigate to your team.
Your front-end developers know that responsive design is essential. As a buyer, it is probably also one of your biggest concerns. We want to be able to communicate with our users anywhere, anytime and on any device. The implementation of responsive design is often placed on the shoulders of the front-end developer, but it can not do it alone. Often, what looks good on a desktop or what works well on a laptop, is not going to be what looks and works well on someone's phone or tablet.
Make sure your drawings are "mobile at first"
This is no longer an instruction for anyone who designs the layout of your web page, but you can also consider it when creating content. Essentially, any mobile device size design must be in place before tablet and desktop designs can be considered.
The reasons are quite simple:
There is less space on a smaller screen.
A touch screen has different features than a mouse
Often, phones may not be connected to Wi-Fi, so your FMP and TTI times become even more important.
Make sure you consider all your designs and all your mobile needs, and then work from there. By considering the case of mobile use first, we frees ourselves to add to the desktop experience instead of limiting that same experience for mobile devices. This allows us to create more and limit less when creating the website.
Scale up the content
Part of your content is not necessarily sized to be mobile. Look at this picture of the distribution of LOST:
interact best with your customers and your development team knows how to best create a platform for that content to reach them. By making sure that you are using the correct asset types and reactively thinking, you can help your web team reduce load times and engage your users faster. You can also help them find places to improve your site by sharing the important indicators for you. When you and your team of developers work together to make incremental or large-scale changes to your website, you ensure that the users who visit your site get the best experience possible.
Do you use tactics in your marketing team to help you work more coherently with web development? I would love the discussion to continue in the comments!