SpryMedia

SpryMedia is a United Kingdom-based web-development practice and open-source software publisher founded and run by freelance developer Allan Jardine, who is based in Fife, Scotland. The company operates at the intersection of user-interface design, front-end engineering and developer tooling: it builds websites and web experiences for clients while also authoring and maintaining a family of open-source libraries and browser-based utilities that are widely used by other developers. SpryMedia's best-known product is DataTables, a flexible jQuery plug-in for HTML tables that adds advanced interaction such as searching, sorting and pagination to ordinary HTML tables. DataTables is documented for both new and experienced developers, has a strong community for support and third-party plug-in creation, and has spawned a set of companion plug-ins including Scroller, KeyTable, FixedHeader and TableTools. The DataTables ecosystem is the commercial and reputational centre of gravity of the SpryMedia brand. Alongside DataTables, SpryMedia publishes a suite of design-assistive browser bookmarklets. Grid overlays a highly configurable layout grid on any web page so that CSS layouts can be developed directly in the browser; Rule draws desktop-application-style rulers with guides that snap to block elements; Unit measures distances between any two points on a page; and Crosshair draws a crosshair cursor with tooltip information to help with alignment. The four tools are bundled together as Design. Other SpryMedia projects include Conditional-CSS, which lets developers use IE-style conditional comments inline with stylesheets to target specific browsers and work around rendering bugs, with feature-identical deployment options in C, C# and PHP; Visual Event, a bookmarklet that visually displays the events attached to DOM elements for debugging event-driven JavaScript; and Integrity, a link-checking tool. SpryMedia is a small, privately held, founder-led business rather than a large corporation. Its influence comes less from scale than from the adoption of its open-source tools by the global web-development community. The company's public identity is closely tied to its founder's personal reputation as a long-time web developer — Jardine has been developing websites since 1998 — and to a philosophy of building practical, well-documented tools that solve everyday front-end problems. Its website doubles as a portfolio, a product catalogue and a personal 'about' page for its founder, reflecting the studio's freelance origins.

SpryMedia grew out of the freelance web-development practice of Allan Jardine, a developer based in Fife, Scotland, who has been building websites since 1998. Rather than emerging from a venture-funded start-up or a corporate spin-out, the SpryMedia brand developed organically around one developer's client work and the open-source tools he created to solve problems he encountered in that work. The company's identity is closely bound to DataTables, a flexible jQuery plug-in for HTML tables. DataTables was created to bring advanced table interaction — searching, sorting, pagination and related features — to ordinary HTML tables, and it was deliberately documented for both new and experienced developers. Over time it attracted a community that contributed support and additional plug-ins, and SpryMedia itself released companion plug-ins such as Scroller, KeyTable, FixedHeader and TableTools. This ecosystem turned DataTables from a single utility into a small platform and became the best-known part of the SpryMedia portfolio. A second strand of SpryMedia's output is a set of design-assistive bookmarklets that run inside the browser. Grid overlays a highly configurable layout grid on a web page, allowing CSS layouts to be developed directly in the browser and matched to any set of dimensions. Rule displays rulers on a page with the features expected of a desktop design application, including guides that snap to block display elements and control over the origin location. Unit measures the distance between any two points on a page, reports basic information about each clicked point and draws a measurement line. Crosshair draws a crosshair cursor on the page to assist with layout alignment, presenting cursor information in a tooltip. SpryMedia packaged these four tools together as Design, noting that each component works well with the others and that the bundle is exceptionally useful for web developers working in the browser. SpryMedia also addressed browser-compatibility pain points with Conditional-CSS. The tool was created for developers frustrated by CSS bugs across browsers who wanted to send a given CSS parameter to one browser and another parameter to a different one. Conditional-CSS allows IE-style conditional comments to be written inline with stylesheets, making it possible to work around browser bugs, and it offers several feature-identical deployment options — C, C# and PHP. A further project, Visual Event, is a bookmarklet that visually displays the events attached to DOM elements, addressing the difficulty of identifying which elements will trigger an action in event-driven JavaScript; it works with libraries such as YUI, jQuery and MooTools. Integrity, a link-checking tool, rounds out the publicly described product set. SpryMedia has remained a small, privately held, founder-led business. Its public website functions simultaneously as a portfolio of client work, a catalogue of its open-source projects and a personal 'about' page for Jardine, who describes himself as a freelance web developer focused on creating engaging web experiences and passionate about useful, relevant user interfaces. The company's reach is therefore best measured by the adoption of its software within the global web-development community rather than by revenue or headcount, and its reputation rests on well-documented, practical tools maintained over many years.

• 1998

  Allan Jardine begins developing websites, the professional foundation on which SpryMedia is later built.

• DataTables, a flexible jQuery plug-in for HTML tables, is published and documented for new and experienced developers.

• Companion DataTables plug-ins such as Scroller, KeyTable, FixedHeader and TableTools are released.

• The Design bookmarklet suite (Grid, Rule, Unit, Crosshair) is packaged as a single browser-based design toolkit.

• Conditional-CSS is released with feature-identical C, C# and PHP deployment options.

• Visual Event, a bookmarklet for visually inspecting events attached to DOM elements, is published.

A founder-led, open-source-first web-development studio that pairs client UI work with widely adopted developer tools, especially the DataTables jQuery plug-in.

• DataTables

  Flexible jQuery plug-in for HTML tables, well documented and suitable for new and experienced developers, with a strong community for support and plug-in creation.

• Scroller

  DataTables companion plug-in.

• KeyTable

  DataTables companion plug-in.

• FixedHeader

  DataTables companion plug-in.

• TableTools

  DataTables companion plug-in.

• Grid

  Bookmarklet that overlays a highly configurable layout grid over a web page, settable to match any set of dimensions for developing CSS layouts in the browser.

• Rule

  Bookmarklet that displays rulers on a page with desktop-design-application features, including guides that snap to block display elements and origin location control.

• Unit

  Bookmarklet that measures between any two points on a web page, gives basic information about each clicked point and draws a measurement line.

• Crosshair

  Bookmarklet that draws a crosshair cursor on the page to assist in layout alignment, with cursor information presented in a tooltip.

• Design

  A single package bundling the Grid, Rule, Unit and Crosshair design-assistive tools, exceptionally useful for web developers working in the browser.

• Conditional-CSS

  Allows IE-style conditional comments inline with stylesheets to target specific browsers and work around rendering bugs, with feature-identical C, C# and PHP deployment options.

• Visual Event

  Bookmarklet that visually displays events attached to DOM elements, useful for debugging event-driven code; works with YUI, jQuery and MooTools.

• Integrity

  A tool that checks links.

1. 1SpryMedia | User interface design and developmentsprymedia.co.uk
2. 2Allan Jardine | Aboutsprymedia.co.uk
3. 3SpryMedia - Wikidatawikidata.org