The Art and Science of Creating Simple Websites

very good
key review info
application features
  • Create modern websites with a few clicks
  • (3 more, see all...)

Creating truly attention-grabbing websites is not always a breeze. Even if you need to create only a snap presentation for your product or design a basic website for making your online friends aware of your hobby, you still need to pay attention to some details.

And if you are not such a huge fan of technical details, or you do not particularly like to spend your time with writing endless lines of code, than you should probably consider using an WYSIWYG editor for such tasks.There is nothing to be ashamed of if you decide to use such a knows-how-to-do-everything tool, on the contrary.

In my opinion, there are more important things to take care of when you decide to bring something on the web, than to simply publishing a functional piece of code. And here are some examples: how to present images in an eye-catching manner, how to build usable and attractive navigation, how to design forms that are both stylish and functional, how to create tables that are both beautiful and effective, etc. In a nutshell, when creating a website you should be primarily concerned in how to find the right balance between an informative and a nice-looking page.

So, programming isn’t everything, when you want to build a good website. Usability, design and balance should also be taken into consideration. For this reason, there have been created HTML editors like WebsitePainter: they can spare your time by bringing in already built combo boxes, text forms, and all sorts of Flash or Web 2.0 elements that you will probably need for creating any basic website.

As a result, WebsitePainter gives you the freedom to focus rather on design than on programming.

The Looks

Before you actually start building your own website you will be requested to choose a template. Regardless of the template you have decided to use for building your website, you will see the following elements in the WebsitePainter’s main window: a left side bar, including a list with all the documents that have already been included in the current project, a central area where you will have the option to add and edit the website’s basic visual elements and a right sidebar where you will see  a list with all  the predefined elements that can be dragged and dropped in the central area.

The area that you will probably use the most will be, of course, the central area. Here you have all the basic elements that you could possibly wish for when it comes to designing a simple webpage.

Here is, in brief, a list of the elements that can be seen at a glance, in this area: on the top of the main dialog you have a bar with common controls as, for instance, an arrow button that opens a small pop-up with options for changing an element’s position on the current page, buttons for inserting a link, for aligning the text or for changing the indentation, plus the font’s face or size, and finally a button that, when clicked, will pop-up the Color Wheel; right under this bar with basic controls you will have a horizontal menu with a separate tab for every page included in your website.

Furthermore, on the bottom side of the left sidebar you can see the Properties window. Its role is to display details about any selected element in the central area. Considering this, let us analyze a bit the elements included in the right sidebar Basically, here you can find the elements that can be easily used to populate the central area, by using simple actions like drag and drop.

To be more exact, when you want to insert something in the main area, you can choose one of the following pre-defined elements: Text, Image, Web 2.0 Shape, Gradient Shape, Transparent Shape, Named Anchor, Image Slideshow, Layout container, Flash, Java Applet, Web Form, Button, Text Edit Field, Check Box, JavaScript Code, HTML Code, PHP Code or iFrame.

When you are done with the editing and you want to save the final result or just a draft of your work, you  can make use of the buttons bar, placed right above the three previously presented areas. This bar includes, besides the classical New, Open File and Save buttons, other buttons for the most frequently used actions as, for instance, Undo, Redo, Add Page, Options, Publish to local disk or Preview.

Finally, the main menu is clutter-free and it offers you all the above mentioned options grouped in seven tabs: File, Edit, View, Insert, Publish, Window and, of course, Help.

The tabs provide all the standard options with the following exceptions: in the File tab you can find a Save to Template and a Publish option while in the Insert tab you have quick links to the elements that can be added in the main area.

The Works

With WebsitePainter creating a new, user-friendly and totally functional webpage becomes kid’s play. All you have to do is to choose the most appropriate template for the work you have to do and to edit it accordingly. Here is a list with all the templates that you can choose from: Empty Page, Company Bright, Company  Business, Sidebar Black, Company Modern, Pink Cats, Nature Slideshow, Simple Newsletter, Green Frog, Houses Background, and Brown Stretched.

The good news is that, no matter what type of template you choose to use you will not have to write the code behind most of the elements included in the website. But let us take a simple example to see how it actually works. For this purpose I would like to consider the Company Bright template as a starting point.

The first thing I would like to do, after opening the template, would be to change the text displayed by default in the text areas included in the home page. For this, all I have to do is to manually type the text that I consider relevant for my business, and to eventually change the background colors.

I can do that by simply selecting the text area that I want to modify and by clicking on the FillColor cell in the Properties area. This action will determine the opening of a Colors pop-up, from where I will have the possibility to choose with the mouse the color that dresses up the best the respective selected text field.

But before you become too excited about the colors craziness, let me explain you why I chose to start with a parrot-like website and with a gallery-like homepage: simply because I wanted to use it for educational reasons.

I truly consider that the first thing that you have to learn when you decide to build a webpage is  how to play with text and colors. Later on you will probably want to discover how you can add more complicated elements but, for the moment, playing with colors and fonts is just the thing that you need to do.

This little detail being cleared, let us go on.  Now I want to add a bunch of small text areas, to fill them with different pieces of text and to color them as crazy as possible. For better exemplifying the roles of the elements provided in the right sidebar I would also like to add a drop-down box, some images, different buttons, as well as some Java applets and some Web forms.

I will add this elements in a totally random and chaotic way, as I simply want to fill the homepage with examples but, as you can imagine, from the readability and the  navigational point of view it is not advisable to use all of them on a single page. As a general rule, when designing a real webpage you only have to add the elements that you consider truly relevant for visually presenting the text. Please remember that users like simplicity, so do not let yourself fooled by the multitude of options you can choose from.

Again, your main goal should be to include all the necessary elements for ensuring good navigation (as scroll bars, vertical or horizontal menus, etc.) or for presenting the content in an as user-friendly as possible manner. With this goal in mind you can play as much as you want with the properties of any new added element: name, position, size, type, border, label, background color, etc. When you feel you became pretty much of an expert in playing with colors, fonts and basic controls, you can start playing with the advanced options. In this phase WebsitePainter will let you include HTML, JavaScript and PHP pieces of code in your webpages.

And you do not have to write the code by yourself. In my example I will simply copy and paste the code I am interested in from another website or from a file saved on my disk. For this last action I use the options in the File menu tab or the contextual menu. And since we got to the contextual menus, it is worth mentioning that the WebsitePainter ‘s  right click menu also offers you options as:  Cut, Copy, Paste, Delete, Move to Front, Move to Back, Move Forward, Move Back, or Show Object Outlines. Furthermore, for jumping from the Documents Explorer area to the Properties or the Toolset sidebar you can use the View menu tab.

When you are done with editing a page you can preview it (by hitting the button on the top of the editing page), save it as a template for later use or directly publish it by using the File or the Publish tabs. The Options line in the Publish menu allows you to determine the language automatically and to specify the directory you want to use for inserting images in your website.

In conclusion, if you take your time to learn how you can properly juggle with the elements provided by the WebsitePainter’s right sidebar,  you can build nice-looking and completely functional websites within minutes.     


The Good

The application is extremely light and easy to use. It does  provide you a bunch of useful templates to start with. If you want to build more complicated things you can always combine more elements on one single page or create new, exquisite and intricate designs, upon your boss requests or your own imagination. The most commonly used  web forms and navigational elements that you have probably seen on other websites, are just one click away. All you have to do is to drag and drop them in the main window of the application. Than you can smoothly customize them upon your wish and publish them directly on the Internet as the WebsitePainter’s publishing options are quite straightforward.

The Bad

WebsitePainter is not an application for professionals. It is user-friendly but, if it were to be impartial, it is just a simple WYSIWYG editor with basic options. For very comprehensive websites, that have to support and get connected with various databases or to dynamically load many elements, you can not rely exclusively on the WebsitePainter’s features. Is not that its features are not well-defined and useful but they are simply not sufficient when it comes to developing more sophisticated websites.

So, if you want to earn money with your website and, you probably want to include some e-commerce related elements in the webpages or you are highly concerned about the security of your data transfers you should definitely consider completing the features offered by WebsitePainter with the ones provided by other similar or complementary applications.  

The Truth

WebsitePainter allows you to create simple websites quickly and easily, without requiring any in-depth programming knowledge. The templates can offer you good ideas of how a decent website should look like but you can customize them as much as you want or, on the contrary, you can create everything from scratch.

From my point of view, I consider that, since WebsitePainter offers you some very nice-looking basic elements, as buttons, check boxes, drop-down lists, combo boxes, etc. and they are all so easy to drag and drop in your website’s pages, there is no need to try reinventing the wheel and to try writing the code behind those elements by yourself.

This is probably the reason why you have decided to use a WYSIWYG editor in the first place, right? To let it do the monkey’s work, so that you can focus on more important things as design, readability, consistency or user-friendliness.

In conclusion, for creating a simple website or an online presentation, with 1, 2, 3 or more pages in no time, WebsitePainter could be of great help. Also, for beginners or for users interested more in passing the message than on technical details WebsitePainter can definitely do a great job.

Here are some snapshots of the application in action:

Review image
Review image
Review image
Review image
Review image
Review image
Review image
Review image
Review image
Review image

user interface 3
features 4
ease of use 4
pricing / value 3


final rating 4
Editor's review
very good
 
NEXT REVIEW: Periodic Table