Articles tagged as ‘Tools’

Website Builders: A Complete Guide to WYSIWYG and Drag-and-Drop Options

Drag-and-drop WYSIWYG website builders have always been a topic of mixed opinions, and strong feelings, in the web design and development industry. While WYSIWYG editors and builders have been popular for quite some time, in recent years new options have emerged and in some cases the quality of code produced has improved. With the massive numbers of users that industry leaders like Wix have been able to amass, it’s not a wise decision for most designers and developers to simply ignore WYSIWYG website builders.

If you’re a designer or developer that focuses on larger, more costly projects it is highly unlikely that your clients will decide to build their own website with a drag-and-drop editor. However, the vast majority of freelance designers and small studios work with many clients on small projects with very tight budgets. In these situations the clients may be looking at do-it-yourself options as real alternatives to hiring a designer/developer to create the site for them.

The potential of losing clients to do-it-yourself alternatives isn’t the only way that these website builders can impact designers. Some of the options are created specifically with designers in mind, with the goal of allowing designers to be able to create websites for clients in a more efficient way that will lead to better profitability for the designer. Because the quality of these options, for example Squarespace, have improved in recent years, a growing number of designers are using these drag-and-drop builders to create websites for clients rather than coding everything from scratch. With small projects and limited budgets, these options may allow a designer to turn a profit on a project that would otherwise not be worth their time.

Additionally, other website builders exist specifically to allow designers to create their own portfolio website and show off their work. These options can be great for designers that don’t code, for students who want to show their work to help land a job, and for designers who need to get a portfolio online quickly.

In this article we’ll take a detailed look at the topic of website builders. We’ll look at 13 of the leading options, along with pros and cons of using a website builder. This is not intended to be an all-inclusive list of every website builder that is available. There are literally hundreds of options out there. In this article we’ll look at some of the most popular options, and we’ll also look at some that are created and marketed more towards designers. Of these options 3 of them work with WordPress and 2 of them are specifically for creating portfolio websites.

Leading Website Builder Options:




How to Take Back Your Time & Increase Your Productivity — Plus 11 Great Productivity Tools

Did you ever finish a day of hard work and feel like you got nothing done?

Believe me, you’re not the only one. Time management is a challenge for many professionals, and web designers are no exception.

If you’re also a freelancer, how well you manage your time may also affect how much you earn. So, it’s important maximize your productivity whenever you can.

Unfortunately, we all have many demands on our time. Often, it’s the little things that slow us down the most–things we might not even think about.

Image Source: lett -/=

In this post, I’ll show you how to increase your productivity by identifying three common problems that keep us from being as productive as we should be. I’ll also share 11 productivity tools to help you get better control of your time.


50 Bootstrap Themes for Responsive Websites

Twitter’s Bootstrap framework has become incredibly popular since it was initially released in 2011. If you’re looking for a way to quickly build and deploy responsive websites, Bootstrap is a great option. While using any of the popular frameworks will involve a little bit of a learning curve, once you have adapted your process it can be much quicker for you to complete web design projects with the help of Bootstrap.

Another good thing about using Bootstrap is that there are loads of tools and resources available thanks to a growing community around the open-source project. You can purchase a great-looking template or theme built on Bootstrap for less than $20. Here we’ll take a look at 50 well-designed, and affordable, templates for Bootstrap.

Myway – $13



13 Resources to Design for Bootstrap

Twitter’s Bootstrap has rapidly grown into one of the most popular frameworks for web designers and developers. Bootstrap aims to make web development faster and easier, and a growing number of designers and developers are working with Bootstrap.

There are a lot of benefits to using a framework like Bootstrap, most of them focusing on the increased efficiency for building modern and responsive websites. If you’re a Bootstrap user, or if you are interested in giving it a shot, there are several resources that can help with the visual design aspect of working with Bootstrap, and we’ll look at them in this article. There are far more resources that useful for working with Bootstrap in one way or another, but in this collection we are focusing on those resources that help with creating a visual design.

Bootstrap 2.0 Photoshop Template
This free PSD file includes loads of elements that can be used to create your own Bootstrap-based designs in Photoshop. It come with things like buttons, form elements, typography, navigation elements, tables, and much more. It’s also available for Fireworks.

Bootstrap 2.0 Photoshop Template


Analyzing Your Conversion Funnel

So you’re a great designer, right? You create amazing sites that your clients fall in love with. But let me ask you something…what’s the conversion rate of the last website you created? I’m sure not many designers would be able to answer that question.

“We’re designers. That’s not a part of our job,” some of you might be thinking. Okay. But you do understand that people do not make websites just for the heck of it. Right? I mean, except for the reputation management clients who care no more than aesthetic appeal of the site, almost every website has a purpose. They want profits.

This purpose or conversion goal of the website can be anything from lead generation through form-filling, free-trial signups, and download brochure to direct sales from a website, like in the case of eCommerce websites.

The point is – if your design is in any way not doing a good job of helping people accomplish this conversion goal, no matter how beautifully designed your website might be, its value to your client decreases.


15 jQuery Carousel Plugins

A common challenge during a web design project involves finding a way to display the relevant content in an attractive and usable manner. Carousels are often used for displaying images, text, and sometimes videos. If you’d prefer to save some time during the coding of the site you can use an existing jQuery plugin to create your carousel.

There are a lot of good scripts and plugins available, and in this article we’ll highlight 15 of them. Most of them are available for free download, but some of them are premium and must be purchased. Each comes with different features and options for customization. Hopefully you will find one that will be right for your next project.


iCarousel is a premium option (cost is $8 for a regular license) that supports touch gestures. It is highly flexible and customizable to allow you to create something unique. Both 2D and 3D options are available.


7 Awesome HTML5 Website Development Tools by Adobe

PCMag recently spoke with Danny Winokur, Adobe’s vice president and general manager of Interactive Development, who said the point of today’s releases is to “advance what’s possible with HTML5 and associated technologies that have become instrumental to the modern Web.”

Adobe’s tools for HTML5 website development have brought the power of multiple technology features to build creative website designs. It aims to revolutionize the way the web is dealt with going forward. Adobe hopes to surprise web developers with a rather convenient and simpler creative process. These comprehensive tools are smart, flexible, and highly interactive in their use, style and performance.

Let’s take a look at the latest Adobe’s HTML5 website development tools re-invented for 2013:

Edge Reflow

This is a completely new, responsive web design tool by Adobe, available only for Adobe Creative Cloud members. The tool can create layouts and visual designs with CSS and is totally free in Adobe’s creative Cloud. It has a smart and intuitive design surface which can be easily resized. This surface gives an idea as to how layouts and visuals will adapt to different screen sizes.

It allows users to preview their designs in the browser, and check their designs in real-time with Edge Inspect extension. The design CSS can be transported to Dreamweaver, Edge Code or any other code editor for further modifications.

What it has in-store for Developers?

The primary purpose of Adobe’s Edge Reflow is to simplify the multi-screen design process, making it much more efficient and time-bound. Used for creating UX prototypes and visual designs followed by quick mock-ups.

Edge Reflow works on 2 design regions – design canvas for WYSIWYG layout and the property inspector (for single element styling). Breakpoints create new media query regions that can be easily tweaked to edit visual elements such as boxes, layouts and much more.

Edge Reflow


20 Awesome jQuery Sliders

Image and content sliders are an extremely common element in modern web design. Coding your own slider from scratch is always an option, but if you’re looking to save some time or if you’re not sure how to code your own slider there are plenty of options. In some cases, working with an existing jQuery plugin will give you the chance to observe the code that is being used, and learn things that can be used in situations where you do want to code from scratch.

In this post we’ll look at 20 different options for sliders. Many of them allow you to create responsive sliders, and some are optimized for mobile users as well. Most of these options are free. The last two listed are premium, and one is free with options to pay for a WordPress plugin version.

Slider Revolution
Slider Revolution is a premium WordPress plugin ($15) that allows you to easily create and customize responsive sliders. It comes with 20 different transitions, it’s touch enabled, and you can include just about any content you want within your slider.

Slider Revolution


12 Options for Easily Creating Web Forms

Creating web forms can be one of the most time consuming and sometimes frustrating parts of creating a website. It becomes especially challenging when you need an advanced form that involves things like conditional logic, multi-page forms, support for file uploads or attachments, and payment integration. Fortunately, there are a number of tools, resources, and apps that are available to make the process much less time consuming.

In this post we’ll take a look at several options for creating web forms, both basic and advanced, quickly and easily.



Page 2 of 612345...Last »