How We Built Our Site on Tilda Publishing

A few months ago we launched our new website ­- EcomGems. Before starting its building, we had been choosing among different tools. In the end we decided to stop on Tilda Publishing. Later in the process of launching the site, we faced some challenges that had to be solved. But due to creativity of our team, all the problems are behind now and we enjoy the result.

Why We Chose Tilda

So why did we decide to use Tilda? If to start from the beginning, our task was to build a website that could reflect the essence of our business. We create advanced tools for eCommerce. Our team adheres to the idea that only efficiency and functionality of the software is not enough for today. People prefer to use nice and convenient tools. That’s why our developers don’t make any decision without coordination with the designer. You know, we just didn’t dare to knock together our website using Bootstrap. Bootstrap is a framework for prototyping, but true design requires a creative focus as well. Understanding the principles of user behavior and experience in design are also important.

We decided to be honest with ourselves. All of us had little experience in designing websites. We used to create specific things like tools and widgets that should be embedded into websites. Design was a different kind of work.

If we were going to make the website from scratch, we ran the risk of changing our specialization. We just couldn’t solely concentrate on site development. Such an option is suitable for large companies that hire a special team for this purpose. But we were a 4-people startup who wanted to make a Shopify app using NodeJS and CoffeeScript. Long website building would be a serious loss of focus for us.

That’s why we considered other options. If we rejected website development from scratch using HTML, then WordPress could be a way out. We cheered up since WordPress allowed making websites of any complexity. And it didn’t need a lot of experience working with markup languages.

But it still distracted us from app building to creation and support of the tool that supposed to be minor. So we had to reject the idea with WordPress as labor-intensive. Rather laborious to scare a few lazy engineers. Moreover, it returned us to using PHP. But we refused PHP at the end of last summer.

We continued the search. As a company that uses only the latest technology, why didn’t we look for tools that had appeared not long ago?

Got Something!

During the search, we stumbled upon a new trend in creation of well-designed sites. How did it appear? Possibly after the same lengthy search, a few teams somewhere in the world realized that it was time to create new tools. Tools that helped to make awesome responsive websites without any programming skills.

We have considered only a few services, there were others that we rejected for some reasons. The sequence of the findings was the following: Blocs, Readymag and Tilda Publishing.

Blocs

At first we found Blocs. It’s a nice application that allows you to compose website pages from blocks. Exactly what you need for designer or publisher’s work. With Blocs, it’s easy to turn an idea into a finished website page. But the program has two flaws. It runs only on Apple computers, and the license is ‘tied’ to a single workplace. Acceptable, but today it is mauvais ton.

The second drawback is the deployment process. This is the moment when the created in the application website becomes a site on the Internet. This process is not shown in their promotional video, but I’ll tell how it works. Blocs generates a set of HTML files, styles, and images on the output. To get the site, you need to upload files to your hosting manually after each update of the site content.

… *uncomprehending pause*. ‘So, what’s the problem?’ you ask. This violates our harmonious idea. The content author should work with only one tool for more convenience. After clicking Post, the content should appear in front of users without any third party programs. It’s especially important when you need to quickly make changes. Once we had chosen the “simplicity for the user” concept, we decided to start from our website. The Blocs app didn’t suit us, though we liked it very much.

Readymag

We brought back to the search and found Readymag. In a nutshell, Readymag is a constructor of designer websites and online magazines. Using Readymag, designers embody their ideas without restricting their fantasy by the rules. The constructor adapts the look of the page for tablet and smartphone screens. Since Readymag is a web-service, there is no need to worry about placing the site on the Internet. After clicking Publish, the site is already there. “Wow! This is what we need! “- our team thought. So we connected Readymag to our domain and set to work.

Eeer…is it a story about Tilda Publishing, right?

Yes. We immediately found a serious flaw in Readymag. We easily connected our company domain and built the site, but it was available only via the HTTP protocol. But we needed to make it work via the HTTPS protocol, too.

Importance of the HTTPS Protocol

A brief digression about the protocol. HTTPS is a protocol of messaging between computers, it is also called SSL, or a secure connection. It’s a type of connection when the user’s computer and the site server establish a secure communication between them for transmitting information. Why might we need it?

If you use an unencrypted connection, the information exchanged between the user and the site is not in security. It’s visible to other computers that are connected to the Internet in the same local network.

It’s dangerous in the case of free Wi-Fi, such as in a café or airport. The attacker follows user’s browsing history and sees passwords, credit card details, and other personal information. HTTPS was invented to protect users from the threat. If two computers are using a secure connection, the computers around the network see only the flow of unclear characters. It doesn’t allow to know which pages a user requests at the site or the information s/he sends. Over time, support for encryption over HTTPS has become the de facto standard for websites caring about their users’ safety.

We contacted the Readymag tech support to clarify if we could add HTTPS to our site. It turned out that they hadn’t implemented this feature by that time. HTTPS worked only for sites with names * .readymag.com. We were upset by this obstacle and continued the search. At least we knew then what to look for.

Move to the Tilda Publishing

Finally, we came across Tilda Publishing. This tool operates on the principle that we have seen in Readymag. But it’s easier. Tilda editor doesn’t provide the Readymag flexibility in shaping the design of the page. Instead, Tilda Publishing editor offers more than 170 kinds of blocks that can be used for building promo pages, writing long and short reads, and even blogging. At the same time, there is work for the designer. The color and design elements can be easily changed.

As soon as we tried Tilda, we immediately fell in love with it. We refused Readymag to Tilda and redesigned the site on it. Everything went according to our plan until we connected the site domain name to the site made on Tilda.

Once again, we came across the problem of lacking the HTTPS protocol. Although we didn’t receive confidential information from visitors, use of HTTPS is today’s quality standard. And we wanted our site meet that standard.

We liked the tool that we found. We liked the way of creating content. We liked that we could always easily make changes to the site if there was a computer with Internet access at hand. We loved the result that gave Tilda. These were professionally typeset pages that adapted for any type of screen. But users couldn’t use the site via the secure protocol. Tilda developers hadn’t implemented this feature, but I thought it would be released soon. But we needed the result that day. At first glance, there was no escape.

The answer came through the technical support hint. They wrote that the editor exports the finished code that can be uploaded on the site manually. We honestly tried to make such an export. It wasn’t cool. We created content in the cloud, downloaded it to our computer, and then uploaded it to the cloud again so it became the site. The process reminded us of Blocs. How to leave the content in the cloud? The answer was next to the Export Site button. There was a mention about Tilda API, through which you can get the content. At that time, only beta-version API worked. But it worked well.

We had the following idea. We ran the application on our server. This application received information from Tilda servers automatically through the API and stored it. At user request, it gave them ready-made pages. And because the app we built was under our control, we were free to maintain the HTTP and HTTPS protocols. After content change in Tilda editor, API notified our app of it. At the same time, we updated the information on our computer.

The Final Result

We’ve got a standalone mirror app of the site created on Tilda Publishing. It works with secure connections, caches published HTML content, and uploads images and scripts on Amazon CDN servers. An unexpected advantage of this decision was the performance. Currently we use a slow machine with 1 CPU and c 1Gb RAM. It allows us to show site content with a 5–10 ms delay and keep the load of up to 1000 requests per second. This indicator is easy to increase by taking a more powerful machine for the server. We also delegate the delivery of static content to Amazon servers. They distribute it around the world and users get content with minimum delay.

P.S. EcomGems is an OpenSource project. The source code is available here: https://github.com/EcomGems/tilda-site.

Enjoy!