paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel.
Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
Marketing people put a lot of faith in “cool images”, hoping to elevate the website's performance. However, it's important to know that images rarely have a significant impact on the overall effectiveness of a landing page.
Besides, let's confront another reality within the realm of biotechnology field: how many "cool images" related to drug discovery have you seen on Shutterstock? And if photographs fail to deliver the desired outcomes, what alternatives do you have in Life Sciences? A structure of an amino acid? Not sexy.
One of the mistakes arising from overreliance on "cool images" is the disregard for the language used on the page. When it comes to conversion, the clarity of the content outweighs the impressiveness of the page design.
In this article, I will provide you with a step-by-step guide to crafting an effective landing page for your biotech & life sciences startup based on design principles and behavioral tactics to meet your marketing goals. The focus will be on creating content that optimizes conversion rates instead of designing striking visuals.
The next few sections are theoretical. If you're not particularly interested in debunking the myth that images have less impact on conversion, feel free to skip ahead to a detailed guide of creating a landing page.
Let’s set some ground rules first: landing pages technically aren’t home pages. A biotech landing page design is slightly different from a biotech homepage design
The home page is aspirational. It serves as the forefront of your startup brand and a primary navigation hub, guiding viewers to other pages for a deeper grasp of your venture.
A landing page, however, is more technical and action-focused. It is a page (or a tiny hub of sites) that exists solely to persuade your target audience to take a specific action such as:
If we compare a website to a department store, a home page is a beautiful map showing where each store is located. A landing page is a store in the annex where you buy a pair of jeans. You review what’s available on the map, but you go to the store to perform an action.
And nothing about images. Images on these pages take a supportive role and complement the text. What really matters is understanding your viewer’s intent and clarifying what kind of action you want them to take at the end.
Well-converting landing pages offer precise explanations of your invention, catering to both human readers and search engines. These pages prioritize clarity over witty sales copy. A lack of comprehension can significantly hinder your conversion rate. Thus, landing page design benefits from human language, not scientific jargon. Even if your audience comes from Life Sciences, what truly matters is their willingness to engage. And what truly makes a difference is the first impression aka the hero section.
Let’s start with the hero section. The hero section is the pivotal top part of the page before the fold, visible once the page is loaded. It's where the viewer decides if the information is relevant to them. Should it resonate, they delve deeper into exploration.
Landing pages act as a brief introduction to your biotech product, sort of like a person you meet at the conference that makes a good impression on you. Quick comprehension and just enough information will make your audience want to explore the solution further. What helps with comprehension and information hierarchy? Appropriate language. People speak the language of benefits and wins faster than the language of technology and Life Sciences. So to convert visitors into leads, I suggest you change scientific content into everyday language for a positive user experience.
For that, you need to know:
This is your opening header, your first impression moment - addressing the problem. Its impact determines your page's success. Connect with your audience through a problem. If the header falters, the entire page can go to trash. And when you nail the header, write a descriptive paragraph about how your startup solves this problem to make the page SEO-friendly.
“Text is the most powerful, useful, effective communication technology ever, period. […] Text can convey ideas with a precisely controlled level of ambiguity and precision, implied context and elaborated content, unmatched by anything else. […] Text is the most socially useful communication technology. It can be indexed and searched efficiently, even by hand,” - an interesting article from 2014 on the power of text, "always bet on text”.
A call-to-action is usually a button or a link used in marketing efforts that prompts the visitors to take an action such as:
A clear CTA makes it easy for the prospects to perform the action as they know exactly what to do. This will work as a nudge. So don’t be clever, be straightforward with it.
One landing page includes only one CTA. Period.
You can have as many buttons per page as you wish. You can even vary the text of the button between “Get started” and “Start your trial”, but they should all lead to the same outcome. Since these pages are great for testing, having one CTA per test also reduces variables and makes tests easier.
Finally, let’s talk about one of the most overlooked aspect of a successful page - getting traffic to it. A page must be exposed to many people to resonate with the right people. Therefore, to optimize your page's performance, you must guide people toward it.
“The average landing page only converts somewhere between 2 and 5 out of every 100 visitors,” - Adobe article “What Is a Landing Page in Digital Marketing?”.
The thing about these pages is that they are often “disconnected” from the rest of the website. Sometimes marketing teams use them to do one-off campaigns or estimate interest. With that comes the challenge of discovering the page. You can solve it by:
“Distribution across channels should not be an afterthought. Instead, you must create your content with a distribution mechanism in mind… The goal with effective distribution: a clear set of inputs that lead to expected outputs that become more efficient with scale,” - Steph Smith on the importance of content distribution in her ebook “Doing Content Right”.
As a demonstration, I’m going to create a landing page for Andson Biotech. This biotech company develops biosensor and analytics platform to speed up the mass spec analysis for cell-based therapies. Andson has figured out a more straightforward way to detect and measure critical biomarkers and cut the whole process from weeks to minutes.
This page has been done as a creative exercise for pure fun. Given my lack of familiarity with Andson Biotech, there might be discrepancies and errors in the content due to my assumptions and perceptions. Nevertheless, it gets the point across.
In the case of Andson, “Start your pilot” looks promising. Based on the little blurb about “Pilot Partnership” on their pages, I assume they would like to attract some pharmas, Life Sciences companies and biotechs to:
Therefore, the purpose of our page would be to attract as many participants as possible. I want the viewers to fill out and submit a form so Andson Biotech can contact them later for a discovery call.
From now on all my buttons, independently from the text inside them, will lead to this form.
Unlike a biotech homepage design, a landing page can have a simpler nav bar. Why? Because the home page navigates to different pages while the page is hyper-focused on performing the action. Thus, you want to “prevent” people from leaving the page.
Our nav bar consists of a logo, a button “Start your pilot”, and a one-liner (sort of a “why choose our company”). I would suggest sticking the nav bar (meaning, it won’t disappear on the scroll) so visitors always have the option to perform the action immediately.
This biotech company uses blue and white as its main colors, but I saw some greens in the graphs. The contrast between the blue text and the green button wasn’t ideal. Through Khroma, an AI tool to generate color palettes, I found a more vibrant minty green color for my buttons and further highlights.
Address a problem you are solving in the headline. Then briefly tell your viewers (potential users) how you solve it in the paragraph below while highlighting the key points. This will allow people to scan the content faster.
Above the headline add a small subtitle where you name your product or your product’s category. Use those subtitles throughout the page to label each section.
Below the section, I added three clickable titles as navigation for a better user experience.
Structure the text to the left in the following way:
In the right column, write a brief step-by-step guide on how the product works. Maintain the formula:
benefit for the header + features that deliver the benefit for the paragraph
Use bullet points for these features for readers’ convenience.
In the stripe below, name 3-4 key advantages that clients will gain from adopting your technology. Add a check-mark icon to each benefit for assurance.
Since this section is more about the action rather than the offer description, I’m using the same mint green color as the buttons to create a mental association.
Considering this is a pilot project, it is a good practice to set expectations: include a list of requirements and outline the timeline.
The header can be straightforward:
Add what sectors you are targeting in the paragraph to enhance SEO. This section will be a good place to repeat the action button, leading to the form or a pop-up, in case your viewers are ready to convert.
If for any reason disclosing the steps of the process isn't an option, this section also presents an opportune space for social proof. Incorporate logos of businesses you're collaborating with or showcase success statistics.
Address 3-4 most popular questions asked by your customers, partners, and investors. I used a dummy copy as this is customer-oriented and I have no data on it.
Wrap up all your pages with a CTA banner with a button, leading to the form above or a pop-up. Use imperative verbs in the header to nudge your viewers into taking action.
As a rule, you want to maintain left alignment for all text. However, consider altering the alignment at the page's bottom for the CTA to make it more noticeable and conclusive.
Contradictorily, just as you want to limit distractions, your viewers should still have at least one chance to search for more information if needed. This is why we provide it at the end.
You can also try placing the same form in the final CTA. Although it may seem repetitive, I've seen positive responses as it coincides with viewers’ heightened persuasion and readiness to commit.
And not a single image was exploited during its production. I made a test version on Webflow here. Now, go to Twitter, LinkedIn, Facebook - wherever your audience is - and launch campaigns. While SEO secures long-term benefits such as online presence, short-term traffic direction is necessary for immediate page results. If you possess an email list, reach out to your contacts for added impact.
What is a landing page in digital marketing?. Adobe Experience Cloud Blog, 2023
graydon2 always bet on text. 2014
Smith, Steph Doing Content Right.
Midjrouney - AI image generator
genei - AI-powered summarisation and research tool
iollo - at-home metabolomics test for healthy lifespan extension
Andson Biotech - Next Gen Biosensor and Analytics Platform
Khroma - AI color tool for designers
