The Significance of the pageBuzz Drag & Drop Editor

For the average user understanding html tables is just not something that most people can grasp. To me, after 15 years of building pages it does no seem complicated, but I am sure when I started it was not as easy to understand.

We created a tutorial back in 2004 on how to use tables in html pages and it was just something we could never really get people to understand. Consequently, when they built pages, they had trouble getting text next to images or really getting a page formatted at all.

Of course, they could still get the information in place, but they could net get it to look the way they wanted it.

But when we added the Drag and Drop Editor that all changed.

Webmasters using offline programs had the ability to create div's and drag them around the page, but nobody had created an online CMS that would allow that type of page editing until we created the online drag and drop editor at pageBuzz.

This was really the next evolution in online content management systems and changed what our customers could do with their pages, not because they could not do it before, but because they did not understand how.

We took what was a very complex system and simplified it into some very basic functions.

Add a DIV
DIV Border
DIV Background
DIV Spacing / Padding

For those of you that don't know what a DIV is, that is just short for DIVISION or an area in the page.

The idea of adding a text area or a division in a page dates back to the earliest forms of desktop publishing even before windows existed and people became more familiar with computers. But that concept was never part of HTML so building pages was not anything like desktop publishing.

With the addition of CSS browsers could now use coordinates and measurements to place objects in pages rather than using tables.

The one big advantage of tables is that they were possible to manage using text editors and were simple to understand.

But setting the number of pixels for exact element in the page from a common point was not something that anyone would be able to do accurately without a drag and drop interface where elements could be dragged into the exact location for placement.

The limitations of browsers kept Drag & Drop from being part of online sitebuilders because it was just not possible to create an interface where you could drag elements and build pages.

But as HTML, CSS and Browsers become more useful we were able to create new tools and new features that had never been done before.

We created the first pageBuzz Drag & Drop Webpage Editor with very basic features

Add A DIV

One click to add a division which can either be a text div or an image div. Image divs contain one image, while text divs can contain images, html, text, links and any elements of a webpage.

The division can be resized by dragging the lower right corner and changing the size of the area to allow different shapes as well as areas.

DIV Border

The division can also have a border controlled by a simple slider. When the division is selected, moving the slider will change the width of the border around the division.

Additionally, the border color can be changed using the color selector.

This allows for a border around any area of the page.

We also added border type, so the border can be dotted, dashed or solid for multiple looks.

But not everyone wants a border to be on all 4 sides of an object, so we allow for right, left, bottom or top borders only.

This all comes together to make a great tools for controlling the border around a division.

DIV Background

Beyond the border of the division we added in a background tool as well. This allows different background colors in the division which even further the possibilities of design.

Having a text area with a unique color on the page is now as simple as 2 clicks, one to add the area one to change the color, a third click if you want to add a border.

All of this makes editing pages a snap.

DIV Spacing

The last feature we needed was a way to move text and images away from the border so the background color could be seen. Of course using css makes this easy, but again, we have to do it with clickable tools.

By selecting the division, you can also move a spacing slider to add spacing or padding between the border and the elements inside the div.

Now of course for professional webmasters, this is nothing new, but for the average non website builder, this is the best thing since sliced bread.

We brought the most used elements of website design into one simple interface that anyone could use.

Now you don't have to have Abobe Dreamweaver to add text over an image or lay 2 images in an overlapping manner. Now anyone that can click and drag things on a page can do the same things as a professional webmaster.

Drag & Drop Limitations

Of course like everything else that is simple you have limitations. But the new more advanced drag and drop editor is in the works and should be available in 2014.

The new drag and drop will have a very similar look but will allow rollover techniques and hidden divs triggered by rollover events.

Now that the basic drag and drop editor has been around for some time we have learned what other elements users are looking for and will incorporate those in DRAG & DROP 2.0.

Our goal is to keep it simple, but allow for more elements without overwhelming most users.

We will never take down or replace the basic drag and drop editor as it is quickly becoming the foundation of all our customers pages. The new editor will be offered for users that have mastered the basic tools and want to go a little further with their designs.

Personal Note

On a more personal note, one of the greatest things about pageBuzz is that it has let me do what I love to do, create programs and software. I can spend hundreds of hours building new tools and have thousands of people using them as soon as I put them up.

For me as a developer it has been a rewarding experience and for the users a great experience.

Users are never behind, they always get new tools before anyone else has them, before anyone else thinks of the and they get to stay on top with their websites.

We have basically pushed the webmaster out of websites and empowered thousands of business owners to take control of their own website.

I get to do what I love to do and I have great people who appreciate what I do for them.

That is what we will never be a static system with stale tools and features. Our system evolves daily as the Internet changes so does pageBuzz and our Drag & Drop editor is the perfect example of how that is true.