What is written in this article is general enough to guide you no matter which developer will be handling your project, but keep in mind that it is mainly dedicated to Codelius customers and that depending on the processes set up by your provider, requests may vary π
The checklist
Here's a quick summary to help you see things more clearly. Feel free to refer to the rest of the article for details β¨
- The model
- Typefaces
- Images in the right format
- Legal documents
- The final .aux domain name(s)
Nice to have
- The final texts
- Internal and external links
- Your pages' meta titles and descriptions
- Favicon & Webclip
- Google Analytics login
The must-haves
The final model
Either the link if you use Figma, with "viewer" rights at least, or the XD sources if you use Adobe
Typefaces
- If you have the
Ideally, a "variable" file type would make the site load faster, but if not, you can share the files for the different weights you've used π€
Note that the fewer different files there are on your site, the faster it will load π
Webflow has been handling font variables very well since 2023, with one or more π€© properties.
- If you use Adobe Font
We'll need an API token with the right typography π
Remember to add all the necessary weights, as well as italic versions if necessary.
The images
Please note that the size limit for an image on Webflow is 4MB, and that's already a lot for an image on the web.
Plan all your site's images and visuals in the smallest possible size, and below the above-mentioned limit to ensure final quality.
Our advice
- Images in headers
... so the first sections of your site should be as light as possible to ensure good loading speed.
It is also important to optimize those on the page, but since they will arrive later, they are less critical.
- Using SVG
For all possible elements, it's best to use SVG :
Here are the main reasons
- It's a vector format, offering very high quality at any size.
- This is a text format, so it's much easier to load than an image.
- It avoids duplicating an image in several colors for different effects, like hovering for example, by allowing it to be modified with CSS (that's our job π ).
- Using WebP
This is the new generation format, and you'll see a nice message from Google in your loading audits if you don't use it.
It's worth noting that Webflow allows compression + conversion to WebP directly from its backoffice, so you don't really need to do this yourself. However, on certain sites where visuals are a priority, transmitting images directly to your developer in WebP avoids a loss of quality because you control it π
Legal documents
These documents can be integrated into the site as text (recommended) or as a downloadable, searchable PDF.
Cookies & Privacy
The privacy policy is mandatory on all sites that collect data (at least those visited by European users).
For a site built on Webflow, here are the details of the host (one of the details to enter in your document)
Webflow, headquartered at 398 11th Street, 2nd Floor San Francisco, CA 94103, USA.
Phone number: +1 415-964-0555
Terms of use
Mandatory on all sites too, they allow your visitors to know who you are so they can contact you π
CGV & CGU
These two documents serve to protect you and your customers if you sell services or make online services available to them (training platforms, for example, or any other software involving use without going through you).
The "nice to have
These are little things that we set up for you during development if (and only if) you share them with us before you start π The reason is quite simple: it takes less than a second to do at the same time as creating a page, for example, but going over it again afterwards can take a long time (because of loading times in the Webflow backoffice, for example).
Final texts
If you don't have your texts at the start of development, we'll put in "lorem ipsum", which you can change between steps 1 and 4 of publication π But the best thing is to have them directly so we can integrate them for you π€
Links
If your site has external links to other sites, please share them directly with us so that we can integrate them π
The same goes for internal links, between pages of the site we're going to develop, if you think they're unclear (don't worry, if you have a "contact us" button we know where to link it, but sometimes some links are less clear β¨).
Favicon & Webclip
The favicon must be a 32px square image.
The webclip must be a 256px square image.
Meta Title and Description
These are the titles and descriptions of your pages, which appear in search engines.
The title should be less than 60 characters, the description less than 250 β¨
They help search engines like Google, and your users, understand what they'll find on your page, and greatly aid SEO!
Google Analytics Tracking ID
It's a code that starts with "G" or "GT" and allows you to link your site to your Google Analytics for more or less advanced performance tracking via Google π
Please note that as soon as you integrate it, you must mention it via a cookie banner π€
β
How will publication work?
The stages
1. The first thing to do is transfer the project to your Webflow account
2. Then you'll need to take out a subscription on
3. I'll finish making a few settings on the site (add favicon, webclip, optimize files and remove "Webflow Branding", add domain name)
4. Webflow information is added to the DNS. The information is always the same from one site to the next (except for one). You'll find them at the end π
5. Send me a screenshot of the DNS if you took care of the modification on your side, so that I can check.
Note that it can take as long as you want/need between transferring the site to your Webflow account and putting it online! Just because we transfer it to you doesn't mean it will be online right away π
What we recommend you add before publication
Once the site is on your Webflow account, you will have the possibility to make changes on the site, and here is a small checklist of things that are interesting to change, especially to optimize SEO:
- Title tags on pages (if not transmitted before, otherwise we already put some by default, so not a big priority here)
- Meta descriptions (if not transmitted before)
- Alts texts on images to help their SEO
Information to be entered in the DNS zone
π I advise you to always make a screenshot of how things were before your modifications, a fortiori if there are mail services, or already a site in place on the domain
- A on @ (root, put nothing): 75.2.70.75
- A on @ (root, do not put anything): 99.83.190.102
- CNAME on www: proxy-ssl.webflow.com
- TXT on _webflow: one-time-verification= + a value that will change depending on the site, I'll send it to you the day it goes online, but you can prepare the beginning β¨