Why Drag and Drop is not a Panacea in Web Development

Drag and Drop in Website DesignThis article is relevant to other content management systems (CMSs) but specifically references tools and terminology used with WordPress.

Levels of Drag and Drop Tools in Web Development

  • Website Structure (Page Layouts) and Special Tools (widgets, sliders, etc.)—Drag and Drop Layout
  • Composition (Page Layout after web development is complete)

When Drag and Drop Tools are Great for Web Development

Drag and drop tools to create your own theme and page layouts are perfectly fine and reasonable IF the tools themselves are well designed. Well designed tools have these features:

  • Are not bloated with unrelated functions
  • Avoid conflicts with other plugins, javascript, jquery and WordPress core files
  • Do not compromise speed on the front end of the website
  • Allow modification of layouts at a future date
  • Are designed to be responsive

Risks of Drag and Drop Tools in Web Development

Appearance vs. Strategic Layout

A risk that is inherent in using a drag and drop is using it only for appearance and forgetting strategic layout. I say “strategic layout” because layout is very important for Usability as well as for SEO. Usability affects SEO and search engines look at layout and hierarchy to determine what a website is about. Often, many theme builders who sell themes aggregator websites, base the home page of a website almost entirely on widgets. The problem with this is that widgets are not considered “main content” by search engines. So a page full of widgets suggests that nothing on the page is important because they are all “asides.”

Lost Content when Switching Themes or Exporting Content

One of the features of WordPress is that you can easily change themes (templates). But with increasing use of drag and drop themes it is easy to lose content that is not within a post, page or custom post type. This can be minimized by choosing drag and drop elements carefully.

If you are switching from one CMS to another you will definitely lose information placed in “drag and drop modules” that don’t translate as “content.”

Over-reliance on Drag and Drop features in Page Layout

Even when developing the layout of a page it is overkill to “draw” each section of the page as if it were a graphic design program. The worst place to do this is in the body of a page where everything can be edited in the WordPress visual and text editor. Examples include adding images and columns. Images are easily handled with built-in tools in the WordPress editor. Columns are a bit more tricky but a good developer will set up CSS so they can simply be added as DIVs with classes like: col1of3, col2of3, col3of3 and a clearing DIV at the end. The CSS will be written so that the columns are automatically responsive (of course!)

Over-reliance on Drag and Drop features in Page Composition (using Drag and Drop as a Crutch)

This is where the amateurs show their true colors. When I was asked to work on someone’s website I once saw a photo gallery created using a “page builder” that had 10 rows of 4 columns each and each “block” had an image in it. This is something a person with basic knowledge of WordPress could have done using the built in WordPress gallery tool and a fast loading lightbox plugin like “simple colorbox.” Imagine adding 40 elements one at a time taking 30 minutes when you could just add a single gallery in a few seconds!

Tips for Using Drag and Drop tools Wisely

If it is a drag and drop theme you are considering, find reviews comparing it with other drag and drop themes.

Before using a drag and drop plugin for a website ask yourself: Does it do anything that you really need? If so…

  1. Backup your entire installation and database
  2. Verify that the plugin create responsive content
  3. Test the plugin with a new test page to see what happens if you disable the plugin – is the code still there? If not I recommend choosing one that doesn’t encrypt or remove the content created using that plugin.

Final Thoughts

I can completely understand using a drag and drop theme to create responsive layouts. I have used Headway Theme since 2010. It is widely promoted as “no coding required” and “drag and drop” but it is extremely powerful if you are willing to go beyond the drag and drop features and learn some coding as well as CSS.

Editors Note: Headway Theme abandoned its clients in 2016 and Blox Theme was created as a fork of Headway.

Another thing you should ask yourself if you want to use a Drag and Drop plugin to work on content, ask yourself: Do I want to learn more about web development? If Yes, then learn some HTML and CSS. If no, then use the list above to test the plugins.

If you need help with WordPress or WordPress Training ask us for a consultation!

Frank Gomez

Frank Gomez is the owner of Empowered Marketing, LLC: Providing Website Development, Web Design and Graphic Design since 1997. Originally named Frank's Designs in Seattle, the descriptor Empowered Marketing was added in 2008 when he moved to Sarasota. In Sarasota, Frank developed his skills in InDesign, Adobe Illustrator and Photoshop as well as incorporating WordPress to build compelling, fast loading websites.

Sign Up for the Empowered Marketing™ Newslettter

Get marketing news, tips and helpful computer advice.
  • This field is for validation purposes and should be left unchanged.