Cascading Media

Handcrafted Websites & Applications
Since 2008

Web Technologies

Leading-edge, front to back.

Open Platform

The web is a truly open platform that no single corporation or even country controls. While there are widely accepted standards put in place by the W3C (World Wide Web Consortium) there are still a vast number of technical decisions that need to be made by the developer(s) of any web project.

Over the next few years, the web will become more capable, look better and load even faster than it does today. A website or application is a significant investment and like any good investment, it should grow in value over time. This is why Cascading Media is very forward thinking when it comes to choosing web technologies.

Terminology

This section contains a brief overview of four pieces of terminology we use everyday in our work. They are key to understanding how the web technologies we use relate to one another.

Front-end & Back-end

A website’s front-end refers to code rendered by the user’s web browser (or other software) on their local device. This is opposed to a website’s back-end, which refers to code executed on the remote server(s) that host all of the application’s assets.

Site & Application

Cascading Media uses the term Site when back-end code is not required and Application when back-end code is required. This distinction is important because each are used for different purposes as explained on our Services page.

HTML5 logo

HTML5 Front-end

Cascading Media employs nothing less than the most advanced front-end standards such as HTML5, Sass (CSS3) and the ES6 (ECMAScript 6) implementation of JavaScript for all sites and web applications we build. We leverage only the best front-end code libraries like Bourbon, Modernizr and jQuery to build fully custom websites that work great across all major desktop browsers, tablet computers and smart phones.

We are asked about Adobe Flash from time to time and our policy is simple – Flash has no business on modern websites due to its poor compatibility with mobile devices, various security issues and the fact it has been rendered obsolete by HTML5 and related technologies.

Ruby gemstone

Ruby Back-end

For applications that require dynamic web pages and database interactions, Cascading Media’s programing language of choice is Ruby. Ruby is a powerful programming language with a focus on simplicity and productivity. It has an elegant syntax that is natural to read and easy to write.

Ruby fuels one of the most advanced web application frameworks available, Rails – also know as Ruby on Rails. Rails is a full-stack framework capable of creating web applications that gather information from a database and then render results for users to view and interact with. Rails emphasizes the use of well-known software engineering patterns and paradigms such as MVC (Model View Controller), Convention over Configuration and DRY (Don’t Repeat Yourself) code. In short, Rails makes web applications faster to develop and easier to maintain.

Human eye surrounded by a full spectrum of color.

Retina Images

All serious smart phones, tablets and many high-end laptops now have high resolution (High DPI) displays or as Apple likes to call them, Retina displays. It is only a matter of time before manufacturing costs fall and the majority of displays will contain these high pixel densities.

Standard 72-DPI web images look pixelated and blurry on Retina displays. Cascading Media corrects this problem by employing SVG (Scalable Vector Graphics), which are resolution independent, wherever possible. SVG has the advantage of looking perfectly sharp and clear on all displays (High DPI or standard) plus they usually load faster than their PNG counterparts. With the exception of photographs, all images on this site are SVG.

Photographs are raster-based files and cannot be displayed as SVG. To create High DPI photos, specialized styles are written in CSS to effectively double the perceived screen resolution. JavaScript can also be used to swap out images based on pixel density but in most cases, we have found CSS to be more performant. Either way, the end results are sharp, clear photos on Retina displays.

Measurements of the letter A.

Modern Typography

Just a few short years ago, only a handful of fonts could be used on the web. Now modern browsers and stylesheets offer advanced typography options only previously possible in printed media or by using images. Displaying text as images should be avoided due to its poor search engine performance, large file sizes and general lack of flexibility.

A great resource for exploring available web fonts is Google Fonts, a free service providing access to hundreds of open-source fonts that are optimized for the web. If Google Fonts does not have what you are looking for, popular commercial web font services include Fonts.com, Font Deck and Adobe Typekit.

Typography may seem like a minor detail, but when done right, it can dramatically improve the legibility and aesthetics of any website. Just as a film score can define the difference between a good movie and a great movie, typography is an aspect of any website that should not be ignored.