12.12.13

2014 Web Development Trends

BY JON SYU

As with the close of every year, it is a time to reflect on the past and dream about the future. New tools and methodologies have been introduced that stretch the possibilities of what a website can do

TOP FOUR WEB DEVELOPMENT TRENDS FOR 2014

  1. Programming-less website tools - This year was an impressive one for startups geared towards web development for non-technical people. While websites like CodeAcademy are looking to teach people basic development skills, other companies are building new sets of tools that allow for robust, interesting websites to be built without any technical skills. Most of these apps are still in beta mode, and most of them haven’t proven too useful beyond simple landing pages, but either way, they are definitely worth a look at.
    • Canva (www.canva.com) - a graphic design program for the web that has gotten an intense amount of press lately. We got early access to the program, and it’s been fairly impressive with a sleuth of great features and templates.
    • Webflow (www.webflow.com) - a fully visual website creator with a ton of common features that allow for great, fully-responsive websites to be built fairly quickly (responsive means that it works on all devices - desktop, tablet, and smartphones).
    • Froont (www.froont.com) - another popular visual website creator that has a few more robust features, which is slightly more appealing for a developer with some programming experience. With great adaptability and some cool integrations, Froont is a great tool for people across skill ranges.
    • Tackk (www.tackk.com) - while it’s only useful for landing pages right now, Tackk makes some great looking pages with a minimum of work. It’s great for simple, yet customizable landing pages for a clear, concise message.
  2. Pre-Processors - This is a very technical one, but don’t check out quite yet. So, if you’ve been marginally involved in websites before, you’ve probably heard of things like HTML, CSS, and Javascript. Well, each of these languages have gotten extensively more powerful and complicated as time has gone on, and pre-processors have allowed developers to program in far more impressive features into a site quicker than ever before. Here are some popular pre-processors currently being used by top agencies.
    • LESS and SASS - both of these preprocessors are for CSS, which is the language that determines pretty much every visual component of your site including fonts, colors, sizes, etc. These are all written into files called “stylesheets”, and they often take hundreds of lines of code to construct. LESS and SASS are two tools that aim to accomplish the same thing - to turn CSS into more of a programming language which allows developers to create robust stylesheets far more efficiently, and allows for much easier editing down the road.
    • Coffeescript - the main preprocessor for Javascript, Coffeescript takes some notes from the Ruby programming language (don’t worry about what that means) and makes Javascript far more simple to code. Essentially, it lets people program using a more “natural” language, making the code look more like instructions you would say rather than technical gibberish. Since Javascript is responsible for basically every animation and interactive element on your site - Coffeescript is very useful.
  3. Javascript Frameworks - Another technical one, but still very important to know - Javascript frameworks allow for very robust, interactive websites to be created. While most websites do not need the level of intensity provided by a Javascript framework, web apps like Facebook and Google both heavily rely on Javascript frameworks to make the front-end of their sites work. While there’s quite a few frameworks that exist, the big ones are Backbone.js, Angular.js (Google’s framework), and Ember.js. Generally, websites don’t really need this level of interactivity to function well, but as the line between a website and a web application begin to blur, don’t be surprised if these frameworks begin taking a more prominent role.
  4. CSS3 and HTML5 animations - If you’ve never seen these two terms before, don’t be scared. CSS3 and HTML5 just means the newest versions of HTML and CSS, which are the two languages used in creating websites - HTML determines structure, and CSS determines style. Don’t confuse either of these with a “programming” language though - they don’t manipulate data or crunch numbers in any way. All you need to know is that with HTML5 and CSS3, you can create some pretty crazy animations without programming a single thing.
    • For an example - here is the Star Wars opening intro made entirely in HTML and CSS, which means that this thing requires zero programming to exist, which is pretty crazy. http://codepen.io/TimPietrusky/pen/eHGfj (click the intro to start)
Jon Syu
written by JON SYU

Jonathan is the senior technology manager at Carbon8, with years of experience working with various nonprofits and businesses in technical, development, and marketing positions. He began his programming career at 12, when he realized that he could create games on his graphic calculator instead of learning math. At Carbon8, he is responsible for all things technical, providing direction to Carbon8's development offerings and overall strategy.

share this
iamges