Open Automation Software
Moving Data From Anywhere to Anywhere
1-303-679-0898

HTML Common Terms

AJAX (Asynchronous Javascript And Xml)

This term was originally used to describe a set of technologies pieced-together to allow client-based code to communicate with a server asynchronously, without a full page refresh.

Since the advent of JQuery and many other tool sets to simplify web application development, and because web developers rarely use XML or the embedded XmlHttpRequest object at the core of the browser technology, the term AJAX is not often used any more. It is usually assumed that these techniques are in play and just how the web works now.

AngularJS, BackboneJS, MarionetteJS, Ember, MeteorJS

These are all Javascript-based application frameworks to allow developers to rapidly and rationally create highly functional applications.  MeteorJS also utilizes WebSocket technologies to enable persistent connections between client and server, allowing updates to be pushed to clients in real time without polling.

Bootstrap (often called Twitter Bootstrap)

This is an open-source UI framework originally created by a pair of Twitter developers. This set of stylesheets and Javascript provide some very clean solutions for creating responsive layouts and standard elements such as buttons, navigation items, dialogs, etc.

CSS (Cascading Stylesheets)

This is a separate language layer that describes styling on top of HTML. For example, a textbox is created with an HTML tag, but the color, size, border style, background, spacing and thousands of other attributes are applied using CSS. Because it is separate from HTML and typically held in separate files, this allows developers to separate the styling from the web application functionality and can add a whole new look and feel by changing the stylesheet.

HTML5

The most recent accepted specification of HTML, the core language for constructing web pages. The major advancements in HTML5 over previous versions include the canvas specification for drawing and animation, as well as embedded video which are now supported by all modern browsers and no longer requiring plugins.

The canvas specification allows developers to create dynamic drawings and elements such as animated gauges. Embedded video allows developers to more easily embed videos in a web page without requiring Flash players.This was an important advancement since Apple and other device vendors explicitly do not support Flash, and require HTML5 for animation and video.

Javascript

A commonly-used scripting language that all browsers natively understand. This is used to create client-side functionality, calculations, or any other logic within a web user interface.

Javascript has become a popular language for server-side development as well, using a framework such as NodeJS, now that the script interpreters and processing speeds are approaching that of compiled code. Despite its name, Javascript has no relation to the Java programming language and should not be mistaken for one another.

JQuery

This is an open-source library that provides a fast, useful coding interface between script code and UI elements. It is written to be cross-browser compatible, so developers do not need to be concerned with all of the various quirks of each browser’s implementation of the DOM (Document Object Model), describing all UI elements defined in HTML.

JQuery also provides a common communications framework to allow script code to make HTTP calls out to servers, either synchronously or asynchronously. The vast majority of interactive web applications developed today use JQuery in one way or another.

JSON (JavaScript Object Notation)

This is part of the Javascript language, which is a specification for defining hierarchical objects in key:value format. These objects are typically passed around in code and over communications channels since they’re lighter-weight than XML (previously popular in web services), and still human-readable.

NodeJS

A Javascript runtime that executes independently from any browser. This allows developers to create very lightweight, platform-agnostic applications using the popular Javascript language.

These applications are often run on servers and can replace more monolithic and resource-intensive application servers such as Microsoft IIS. By utilizing NodeJS, developers can create “full-stack” applications (meaning front-end to back-end) using a single language (Javascript) for all logic.

Responsive Design

By combining HTML, CSS, and sometimes Javascript, a web developer can create a single code base that renders differently depending on the form-factor of the device.  This strategy allows developers to create a single application that works on a desktop screen, and many mobile devices.

While very powerful, this can also take more time upfront to design, develop, and test each screen since a developer must take into consideration each form factor.

REST or RESTful

This is a technique for building web services upon HTTP actions such as GET, POST, PUT, and DELETE, typically passing JSON data in each request and response.

RESTful APIs are stateless and use URLs to define common object-oriented actions such as create, read, update, delete (often referred to as CRUD). This is advancement over such technologies as SOAP or other XML schema-based web services as the data is more streamlined and the APIs are dramatically less complex.

For example, a REST API may expose a URL such as http://server.com/products, which would return a JSON array describing each product in a catalog.

Furthermore, a URL of http://server.com/product/12345 would return JSON describing a single product with the ID of 12345.  Any client could also execute an HTTP POST or DELETE operation with JSON describing the object to request an update or deletion of the record, respectively.

Single Page Applications

With the advent of extremely fast Javascript interpreters in all modern browsers, it is now possible to develop applications that no longer reload web pages when the context changes.

The client script and UI elements are loaded upon initially requesting a URL and then script calls are used to dynamically swap out entire screens or individual elements. This creates an extremely quick and responsive user interface, and presents a much better user experience, while also reducing server processing overhead and communications bandwidth. Single Page Applications are becoming the norm, and are typically built-upon frameworks like AngularJS, BackboneJS, MarionetteJS, and MeteorJS.

UI/UX

User Interface / User Experience – there’s a subtle distinction between these today. The former is typically the “Look” and the latter is the “Feel” when one talks about “Look & Feel”.  User Interface is the organizational structure of visual elements, and User Experience is the way the elements behave and how the application flows.

WebSockets

WebSockets are a communication protocol that allows web browsers to maintain a persistent, full-duplex connection with a server. Doing so makes it possible for servers to push data down to a client without the browser making an HTTP request. Typical HTTP calls are stateless and require the client to initiate the communications in a Request/Response model. With WebSockets, a server can stream data down to individual browser more efficiently since there is no need to wait for the client to make a request, and also because it eliminates the overhead of communication handshakes after the initial connection. Some web UI frameworks like MeteorJS are built upon WebSockets, but older browsers have limited support for the protocol.