Breezi Lets You Design An Amazing Website Without Writing One Line Of Code

Breezi Lets You Design An Amazing Website Without Writing One Line Of Code:
A little while ago, I told you about site-building service Sidengo. Sidengo is a dead-simple editor which lets you build a dead-simple website in minutes, and for that it’s truly awesome. In a comment on that article, reader Mohamed Alaa recommended that I try another service – Breezi. And I wasn’t sorry.
Unlike Sidengo, Breezi won’t let you build a whole website in minutes. This is not because it’s any less good, but because there are way more options to take advantage of. Breezi is a full-fledged HTML5 website editor, which lets you control every little aspect of your website, design it just the way you want it to be, and get beautiful results. But it gets even better.
Breezi is completely free for everyone who signs up before the end of April, so hurry up and try it! Breezi will remain free for you as long as you keep your account active.

Getting Started With Breezi

The very first thing you get to do with Breezi, even before creating an account, is choose your website’s layout. Don’t worry, you’re not getting married to this layout, and can change it using the flexible Breezi editor at any later time. This is just a starting point for your website.

After choosing your general layout, you’ll have to create an account before moving on to the actual editing. Here is where you choose your site’s URL, unless you plan on using your own custom domain.

That’s all there is to it. You are now ready to start designing your website.

Basic Homepage Design

When I say everything is editable with Breezi, I mean it. When you take a first look at your new website, you may be slightly overwhelmed. But don’t worry, playing around for 5 minutes will make everything much clearer. Start with a simple task: edit your page’s title.

You will notice how every different segment of the page is highlighted as you mouse over it – every one of these segments is editable in every way imaginable. Hovering over the title will pop up the app menu, which we’ll get to a bit later, but for now, click the title to perform some basic edits. Change the title to what you want it to be, change fonts, sizes, colors and the rest of the basic stuff.
You can now move over to the links on the right. After basic font and color edits, you can also add and remove links, change spacing, alignments, borders, and pretty much anything you can think of. To access the design menu, touch the small bubble as seen in the screenshot. This is true for every element on the page.

Now it’s time for a background. You can change background color or add a background image for every part of the page. Touch the bubble for the whole top segment, and play with your background until your happy with the results.

Now it’s time for some images. In my chosen layout there’s a big image right under the header, but this process is true for any layout. Click on the image to replace the grey design with an actual image.

The editor will provide the aspect ratio that’s right for your space. You can change that, of course, and also lock the aspect ratio if you don’t want to change it by accident. Click the “Replace” button to add an image from your computer or a URL, and play with the zoom until it fits perfectly inside the rectangle. You can easily add alt text to the image, and also make it into a link. When you click Save, you’ll be transported back to your page.
Want to make a slideshow? No problem. Hover over your image until the app menu shows up, and click on New Entry. You now have a slideshow. You can add as many entries as you want, and then replace each with an actual image.

In the Slideshow, you can control how long each image appears, how fast or slow the transition is and what the transition effect will be. Do this through the “Edit Settings” (wrench) button on the menu. Use this same button to change the settings for any element on your website.
There are many more things you can add to the page, but lets look at social icons, since everyone needs those. In most layouts, a social icons app will be installed by default at the bottom of the page. Using the wrench icon, you can control everything from appearance and alignment to where links will open, and, most importantly, what social buttons you will have.

Paste your social-account links in this window to have the buttons lead to your actual accounts. If you forget to change this, your buttons will point at Breezi’s social accounts. You can add almost any network you can think of, including MySpace, Reddit, Delicious and Foursquare.

Apps, Pages & Layouts

Now that you’ve got the basic design covered, lets look at the bigger picture. As I alluded to earlier, everything in Breezi works with apps. Every aspect on the page is an app, from text and images to social icons and blog posts. You can install apps and learn more about them from the bottom toolbar.

From here you can also change the entire layout of the page, which will use what you’ve already designed and try to fit it into a new layout. You can manually change sizes of elements, so these layouts are not set in stone.
This is also where you add additional pages to your site. Click the “Pages” button and choose to add a page.

You can then choose your new page’s URL, add meta keywords and description, and make it your mobile landing page. After you create the page, you will also get the option to copy elements from the home page into the new page. This means that if you’ve already designed a title bar which should appear in every page, you can copy it over instead of designing it over and over again.

Through this bottom toolbar you can also preview your page, and, of course, publish it.

General Thoughts & Comments

I haven’t even scratched the surface of Breezi’s abilities, and this post is already too long to include them all. After ~10 minutes of work, many of which were due to the slight slowness of the interface on my computer, I created this basic version of my home page.


This is without even touching more pages, blog posts, tabs, forms, and the plethora of other features offered by Breezi. Obviously, Breezi is not right for those who want to create a very basic page in 5 minutes, but will work amazingly well for those who can and want to put in an effort, but would still prefer doing so without having to actually code anything.
If you feel a bit lost while working with Breezi, there are some very nice video tutorials you can access through the “Need Help?” button on the bottom toolbar.

Breezi is still in beta, and for me this was felt especially in the somewhat unresponsive interface. I also encountered a small bug when trying to add an image, in which the Save button did not appear on my small laptop screen, but did on by bigger monitor. Despite these things, Breezi is a true steal while it’s free, and I’m sure will be worth the money when it goes out of beta and starts having premium plans.
In the meantime, hurry up and sign up while it’s free, and try one of the best website builders I’ve ever encountered. Don’t forget to share your thoughts and websites, and any other awesome website builders you know about!