Determining When You Can Use New Web Design Practices

How to decide if you can reliably use that new technique or feature

Man stacking blocks
Adding one more piece to a stack.

The web design industry is a very progressive one. There are always new practices and techniques to work with. The challenge is determining when those new practices can be safely used in your work and when they are still too experimental to deploy on production websites. This is an important distinction to make. These new techniques will likely help you do your work better or faster, but if that work cannot be reliably displayed in a wide range of web browsers and devices, then what is the point?

Here are the questions you should be asking to help you find a balance between new methods that will improve your work and ones that are widely adopted enough to be safe to use in that work.

What Am I Trying to Do?

First, you need to determine what the new method or technique you are trying to use is. This could be something straightforward like a single new HTML element or CSS property or it could be a technique that is more complex, like responsive web design. As widespread as that approach to multi-device web design is today, there was a time when it was a new technique and web designers had to determine whether or not they could safely use it on their websites. Many of those designers asked themselves the questions covered in this article. So Step 1 is defining the solution itself.

What Is Support Like?

The next item you should be concerned with is what support looks like for whatever it is you want to do.

Is this something that is only supported in the latest builds of select browsers or will this technique have widespread reach? One great tool you can use to determine this level of support is the website CanIUse.com. This site allows you to select from a list of HTML5, CSS, SVG, Javascript, and other items to see a comprehensive list of every browser that supports that feature.If a solution has broad browser support, you should be safe to use it in production.

If support is lacking, you may want to hold off for now, or at least consider the other questions in this article.

What Is the Fallback?

Once you have determined what browser support for a given feature looks like, you will then want to understand what the fallback is for browsers that do not support it. Even if a technique has fairly widespread support amongst newer versions of browsers, your site will likely be visited by people using older browsers as well. Understanding what the impact of your decisions will be for older versions is therefore important.

In some cases, the fallback for an unsupported feature may be perfectly acceptable. Other unsupported features may simply not work at all. This could be disastrous to a site is you have a reliance on those features for key functionality of interaction or it could be inconsequential to the site entirely. How your desired feature performs when it fails will determine whether you look for ways to patch that support or whether you decide that, in the end, it really doesn’t matter.

Is There Anyway That I Can Patch Support?

Certain features may be critical to your site’s performance and success. If those features are not supported by certain browsers, you may decide that a Javascript polyfill is the way to go.

A polyfill is “downloadable code which provides facilities that are not built into a web browser.” This means that you can patch the support that you need for those older browsers to reliably use that desired feature.

Polyfills can be very powerful, but remember that they are not full-proof. There are still instances where those patches may fail, like if someone has Javascript disabled in their browser. You will need to determine whether your site can, indeed, live without a feature or if the instances where support will be missing are such an edge case that is makes sense to proceed with a polyfill in place.

Does It Matter?

Certain unsupported features will simply be absent from a site. For many visual properties, like CSS drop shadows or border radius, this likely has very little impact on the site as a whole.

Visitors using older versions of certain browsers may not see those nice rounded corners but does that really matter? Those rounded edges may look attractive, but as long as someone can access the site’s content and do what they need to do on that site, they will never know what they are missing if they see 90-degree angles instead.

Not all features are mission critical to a site’s success. If an unsupported feature is a “nice-to-have” or if the fallback to that feature is perfect adequate, do not spend too much time worrying about whether or not you should use it or try to patch support. Just use the feature or technique and move on.

Don’t Wait…Be Progressive

When considering a new technique, ask yourself the questions from this article and look at the browser statistics from visitors to your website. With that information, you can determine whether it is, indeed, time to use a new feature or if you should wait awhile. Just be sure not to wait too long!

Waiting for a feature to be fully supported in all browsers is a losing strategy. To this day, there are still select browsers that do not fully support HTML5 or CSS3, both of which have been widely used for years.

If you want to do your best work, you must be progressive and forward thinking with the techniques that you use. That is how you grow as a web professional and how our industry moves forward as a whole.

Edited by Jeremy Girard on 1/16/17

Format
mla apa chicago
Your Citation
Girard, Jeremy. "Determining When You Can Use New Web Design Practices." ThoughtCo, Jan. 16, 2017, thoughtco.com/when-to-use-new-web-design-practices-3469985. Girard, Jeremy. (2017, January 16). Determining When You Can Use New Web Design Practices. Retrieved from https://www.thoughtco.com/when-to-use-new-web-design-practices-3469985 Girard, Jeremy. "Determining When You Can Use New Web Design Practices." ThoughtCo. https://www.thoughtco.com/when-to-use-new-web-design-practices-3469985 (accessed November 22, 2017).