Or at least I tried…
Wix vs WordPress, place your bets!
True story: I wanted to play with the free versions of the Wix website builder and a WordPress builder and see the end results. I picked Colibri for the task because it lets users build everything in a single interface.
The hypothesis: creating the same portfolio page of a photography website (not intended to be pixel perfect).
Let’s see how things turned out in the Wix vs WordPress builders battle.
Template choosing – Colibri
This is how you can browse through Colibri’s templates:
Not a hard one this one, only one photography template to play with.
Template choosing – Wix
Wix scores a point here, there are tons of templates to choose from.
I didn’t want to make my life hard, so I picked out a theme with a masonry grid, to resemble the one from the Colibri template.
Wix vs WordPress builders (Colibri): the setup
For Colibri, the left-hand side menu is the “mother of all features”.
Its structure goes as follows:
- Header
- Content
- Footer
- General Settings – here you can state the global color scheme and typography for the site, so that you don’t need to take every element one by one and alter it, just the ones that need a different styling.
- Menu
- Widgets
- Security
- Performance
When you select a specific website element, in the right, the left-hand side menu will have the following items: Content, Style, and Advanced. Under advanced you have two states: normal and hover.
The submenu for “Advanced” is the same for every component. Once you get the hang of this menu, you’ll master many WordPress builders.
The left-hand size Wix menu serves a different purpose, mostly for adding new components.
What’s nice in Wix is the fact that you can edit each component while clicking on it. In the Colibri WordPress builder, you always need to work with the menu on the left-hand side.
On the other hand, I couldn’t find how I can alter in Wix the global color and typography schemes.
Typography – Colibri
I’m naming my website LemonBlues. This is a combo stuck in my mind for years…I feel that it could be the name for a jazz band, don’t you think? But it would also do the trick for a photography website.
The builder allows me to play with tons of fonts (more than the ones available in Wix), colors, animations, spacing…
Copy style, that’s a cool one! This copy-paste applies to columns as well, and any other components that need to be styled. I dug a bit and found the same feature in Wix.
Now, the thing I really really love is how Colibri deals with font sizes, we’ve got px, em, and rem. If you’re not familiar with these notions, here’s a good article on them.
Typography – Wix
For the brand name, I used the same font type, size, and color as for the Colibri built website.
This is a “nice to have”: Get Text Ideas.
Wix has an extra touch here, with these very basic SEO settings.
In Colibri, for the SEO aspects, I totally recommend the Yoast SEO or Rank Math plugins. I think this is one of WordPress’ superpowers. These plugins can supercharge everything on a website.
Layouts and grids – Colibri
In the builder, I could control the columns, rows, their width and height.
And the thing I really like is this “unlink” or “link” feature.
When an element shows up as “linked” it means that all the elements that share the same style benefit from any change. Let’s say you want to change the opacity of a text box, and the text box appears in 5 places, it will change all 5 boxes!
In my particular case, it spared me the trouble of changing 11 text boxes with their own opacity and font specs.
Layouts and grids – Wix
In Wix, you can drag components, pull their margins to the left, right, make them taller or shorter. Nice one!
In both products, you can play with borders, opacity, size, animations.
What I couldn’t figure out is how to group certain elements. And that meant trouble for me when I wanted to make the web page responsive….
Dealing with images – Colibri
When you import images in Colibri you can provide the image with an Alt attribute (useful in SEO) and also gives you the possibility to crop the image.
If you want to alter the image in terms of border, spacing, effects, there’s always the left-hand side menu, the “advanced” section.
Under the style section, there’s a feature that allows you to change the focus of the picture. I found this really helpful to center certain parts of the image. This also comes in handy on mobile devices.
Dealing with images – Wix
In Wix, you can import images from various sources (own computer, Google Drive, Dropbox, Facebook, and more).
They also have a basic photo editor:
In my particular project, the masonry grid got me in some trouble.
I found it difficult to arrange some pictures. After arranging them I wanted to make some images switch…From that moment on it was really difficult to go back to the previous state (without undo). The positioning of the images (as in first, second…) seems to be based on how high it positions itself on the website. This was tricky.
Also, it wasn’t obvious how to change the dimensions of the images…I wanted to enlarge the landscape ones.
Menu – Colibri
I wanted to align the menu for the Colibri built website with the one in Wix and get from
to
but keep the “Hire me” button.
This was an easy task. All I had was to organize my pages.
Menu: Wix
All crystal clear here, I just added a button with a “Hire me” text on it.
The feature is similar in both tools.
Other components – Colibri
If the theme you’re working on does not quite fit your vision, you can always adapt and add new components or blocks.
The blocks are already-made sections that can be added (testimonials, galleries, headers, about us page…).
The components are tiny items such as headings, images, texts, videos, buttons, icons…you get the point. You just drag and drop the content and style them as you wish.
A really cool feature is the one that allows you to save certain sections for later usage.
Other components – Wix
In Wix, you can also add various components.
They have something similar to the blocks in the WordPress builder, called “Strip”.
Contact forms – Colibri
At the end of the image gallery, I added a contact form so that people can get in touch.
I found the form inside the “Add component”.
In the advanced settings, I changed the styling of the fields and the “Send” button, and also adjusted the padding.
Contact forms – Wix
In Wix, I selected a contact form template and adjusted it to have the fields in a single column.
No trouble here.
Mobile responsiveness – Colibri
That worked out well…
For tablets and iPads I only had to adjust the number of items in a row, refocus some images, and fix some padding issues for the contact form. Et voila!
For mobile devices, I switched to a one-column view.
Mobile responsiveness – Wix
Ok….this didn’t turn out very well.
The problem came from the fact that I couldn’t group some text boxes and their background images as I mentioned earlier.
I felt like Sisif…and gave up. It was too much moving every text box, and adjusting each text (it needed smaller fonts).
Custom CSS – Colibri
For the picky ones: in Colibri, you can add your own CSS, assign classes to specific elements, and work with ids (for those more CSS-savvy).
Didn’t manage to find the same feature in Wix…
Plugins, the app market
When you want to go beyond the functionalities provided by WordPress or Wix, you will need to insert some third-party apps.
In WordPress, there are thousands of such apps, called plugins.
You wanna boost your website performance, there’s a plugin for that.
Wanna optimize the images across all your websites, there’s a plugin for that.
Social media, forms, analytics, security, blogging features, marketing…you name it, there’s a plugin for everything. Some of them are free, some paid.
The Colibri WordPress builder integrates seamlessly with some of WPmu’s most popular plugins: Forminator (contact form plugin), Defender, Hummingbird, and Smush (optimization, security, and performance tools), or Hustle (marketing tools).
In Wix, you’ve got the Apps Marketplace, which has less than 300 apps available.
The end result: Colibri WordPress website
The end result: Wix website
Wix vs WordPress Builders (Colibri): Pros and Cons
| Colibri cons | Wix cons |
|
|
| Colibri pros | Wix pros |
|
|
Wix vs WordPress Builders: Wrap Up
Blink if you’re still with me!
Let’s see.
It kinda took me the same amount of time for developing both pages.
Both tools give you a lot of control over the design.
You can start with a template, but you can fully customize everything on the inside.
Both of them have their pros and cons, as seen above.
WordPress offers full flexibility and control, while Wix might have a shorter learning curve. In terms of pricing, they’re pretty close.
Now, the question is, what do you want from your website?
[sibwp_form id=1]
Alina is a digital marketer with a passion for web design. When she's not strategizing she's doing photography, listening to podcasts on history and psychology, and playing with her 2 dogs and cat.
