Jamf is an international software company that sells device management software exclusive to Apple platforms. The primary purpose of jamf.com is lead generation, but it also houses an extensive library of product resources and serves as a registration platform for online webinars. We also translate parts of the site into 5 languages.
In the past 3 years I have been the principle Front End Developer on the 2 latest iterations of jamf.com. The scope of the rebuild to the current iteration was massive, and the requirements were somewhat nebulous (flexibility was the buzz-word used by stakeholders to describe their vision.) The ask was more of a design tool than content management system. As we began to build components and layouts from the pixel-perfect comps the digital designers provided us, we had to take care to ensure all components could:
- live next to each other in any combination
- live in a 1, 2, 3, or 4 column layout
- be contained in a max-width layout or bleed to the edge of the viewport.
At its core, jamf.com is built with the ExpressionEngine CMS. In the current iteration we chose an ExpressionEngine plugin called Bloqs to meet the flexibility requirements of the project. We continued to use Bootstrap (from the previous site’s templates) for the contained layouts and wrote our own grid for the full-bleed layouts using Flexbox.
From a markup perspective, it is valid, responsive, accessible and semantic. It also passes Google’s performance benchmarks for Desktop and Mobile. Some highlights of the site that I am extremely proud of and provide a good example of my abilities include:
In some ways the current version of jamf.com is still a prototype. Pages are overbuilt because we just didn’t know what the the end results were going to be at the time of development.
Since launch I have identified and documented numerous layout patterns and formulas the content creators use repeatedly. When time allows to address technical debt, I take these patterns and build more lean and purposeful templates that turn our system back in to a more traditional CMS. An example:Initial:Final:This gist can be seen ‘in the wild’ at: https://www.jamf.com/solutions/industries/k12-education/ (bottom of the page)