Front of the front-end developer

August 10, 2022

Job titles in the Web industry have never been as straightforward as the semantics of the specific title. In a lot of ways, titles have been meaningless without a bit more explanation. Different people can have the same job title but the responsibilities and expectations of the specific job can be very different. It has been this way since I first started working in the industry over 20 years ago.

Thirteen years ago, I wrote a post explaining what “web designer” meant to me. As I started exploring other job opportunities at the time, I often felt a disconnect with others as to what I considered the responsibilities of a web designer.

Fast forward to about five years ago, I started to see that “front-end developer” meant different things to different people. More and more job descriptions were focused on developers who were heavier in JavaScript skills, which I would have considered a JavaScript developer.

Today I want to bring some clarity to what my role as a front-end developer looks like in terms of my responsibilities and the expectations of the agency I work for.

Front of the front-end developer

Brad Frost coined the term “front-of-the-front-end-developer” several years ago. I think it does a good job of capturing the type of developer I am.

“A front-of-the-front-end developer is a web developer who specializes in writing HTML, CSS, and presentational JavaScript code.”

So let’s unpack this a little bit so that you can understand the distinction.

Responsibilities 1

As a front of the front-end developer, my responsibilities include:

  • Writing semantic HTML markup with a strong focus on accessibility. I strive to write code that is friendly to browsers, assistive technologies, search engines, and other environments that can consume HTML.
  • Crafting CSS code that controls the look and feel of the web experience. It includes crafting layouts that change to take advantage of the available real estate as screen sizes get wider or change to optimize the experience for screens that don’t have as much vertical real estate. I also tackle color, typography, spacing, and animation to create beautiful interfaces that are accessible to all users.
  • Authoring JavaScript that primarily manipulates the DOM. This can include making an accordion panel expand to show more content when you click it, triggering animations as you scroll down the page, opening modals to play videos, or showing more information about locations accessed through a map.
  • Testing the developed site across a spectrum of browsers and devices to ensure the design is functional and looks good for everyone. I also test to make sure the interfaces I build are accessible through keyboard navigation and that color contrast and semantic elements can help users with assistive devices successfully find what they are looking for.
  • Optimizing the performance of the front-end code and assets (images, videos) to create a lightweight and fast loading experience for users connecting on different bandwidths and speeds.
  • Working with designers to ensure that the brand, design vision, and UX best practices are properly translated into the solution creating an optimal user experience for the site. Because in the end, it is all about the user and whether he or she can accomplish what they came to the site for.

What I don’t do

  • Write application business logic to handle things like CRUD functionality and to control application state, routing, cache, authentication, and so on
  • Work with frameworks like Vue or React
  • Build headless applications that consume APIs or use front-end tooling such as Vue or React
  • Get and mutate data (Okay I do some of this with APIs – the getting part at least)
  • Write complex animations with three.js or D3

I am not a JavaScript-heavy developer

The main distinction is that I am not a JavaScript-heavy developer. I use JavaScript primarily to manipulate the DOM for user interaction and to add animations to make an interface more enjoyable to interact with.

I don’t like having to configure build tools and processes. I want something simple to set up and something I don’t have to manage by running updates and fixing things that break. I don’t want to have to write scripts just to get me started in building out a new project and I don’t want to have to think about it every time I start something new. I want to be able to jump into writing the HTML structure and then making it come to life with CSS and some JavaScript.

I don’t completely fit in the box

That said, I do have some other skills that I flex from time to time that go beyond the responsibilities I listed above:

  • I write PHP code for WordPress templates and simple PHP (no database) websites
  • I use JavaScript and PHP to pull data from APIs to display data on the sites I create
  • I have used Vue in the past but mostly for state management

I love what I do

I love what I do. And I understand that the demand for what I do has shrunk significantly over the past five years. I started on the Web as a designer–I would design and build out those designs. I still am more design-focused. I love to bring a design to life by starting with a solid foundation of semantic HTML and then seeing it come to life as I add CSS and a sprinkle of JavaScript. I love to work with our designers to help make their vision a reality. And to add my creative skills to push their design even further than they may have imagined it.

I like thinking about how to build the best experience for those who will be using the sites I build. I want to help the clients we work with to win and succeed through the products we partner with them to create. I have become even more accessibility conscious over the past few years and champion accessibility within my current team.

This is who I am. I am a front of the front-end developer.

Resources that helped me to put my thinking together

Infographic by Ahmad Shadeed

Footnotes

1. I need to credit Brad Frost for this list of responsibilities. It is not a word-for-word copy of the list from his article. I tried to reword it to sound more like how I would say it or add things that were important to me. But need to give him credit where credit is due. Thanks Brad.

Comments are closed.