Why there are no commas in Form Function & Class: how we’re defining our (writing) style guide

A few years ago, we debuted a new visual identity for Form Function & Class and talked about how it has evolved from its original design in 2009 to the brand that addresses our needs & goals today. We didn’t want to stop there, and are slowly building a design system that will make our work easier. Since we’re so busy putting our events together, though, that’s going to take a while. In the meantime, here’s a look at one aspect that is just as important as the design and development of that system: the writing.

What is a style guide?

In the digital design world, a style guide tends to focus on the visual components of an interface in order to build more cohesive systems and streamlined workflows. In this case, the style guide we’re talking about pertains specifically to writing.

A style guide (or manual of style) is a set of standards for the writing and design of documents, either for general use or for a specific publication, organization, or field. (It is often called a style sheet, though that term has other meanings.) –Wikipedia

As you’ve noticed, a lot of the concepts in the digital world have taken cues from the analog world, like “style sheets” and “style guides”.

Why do we need to care about words?

One might think, “I’m just organizing an event” or “I’m just designing or coding something for the org” and wonder how writing can be applicable to them.

Consistency & clarity are among the most important aspects of good design & experience. Our words have power, and content is the foundation on which we execute our design & code.

It’s also valuable to understand the past to do a good job in the present and figure out what can be done better for the future.

Now, on to what our writing guide looks like right now!

Philippine Web Designers Organization

The name of the org is Philippine Web Designers Organization.

Its registered name is Philippine Web Designers Organization, Inc. (If you’ve dealt with our bank account or official receipts before, that might be familiar to you.)

Shorthand: PWDO

Given the long name, we usually abbreviate it to the first letters of each word. But since the first three letters spell “PWD”, as in “persons with disability”, we would like to discourage using this abbreviation if people don’t know who we are. If you’re talking to someone who already knows about us, then that would be okay.

In terms of pronunciation, people usually rattle off the 4 letters, but we recommend saying it as “puedo” which is faster, and just happens to be the Spanish origin of “pwede”, meaning it can be done ;)

<form> function() & .class

The event is officially spelled as <form> function() & .class.

The three words allude to the 3 elements of a website, <form> from HTML, function() from JS, & .class from CSS. The words also allude to 3 concepts central to the craft: form, function, & continuous learning.

For platforms that might escape the < > signs, Form Function & Class can be used instead. The logo is currently fashioned this way.

No commas are used when spelling the event name, because it’s clunky to add commas in between all the symbols, e.g. <form>, function(), & .class. If you insist on adding commas to fit your own style guide, use the Oxford comma.

The ampersand “&” is used, not the word “and”.

When spelling with the symbols, the words should use lowercase:

<form> function() & .class

Without the symbols, the words should use titlecase:

Form Function & Class

When does one drop the symbols? To stay on the safe side of platforms that don’t properly escape the < and > symbols.

Shorthand: FFC as abbreviation, #FFCPH as hashtag

The official hashtag is #ffcph. For event-specific tags, the year is added, e.g. #ffcph2017. (We have also used FF&C as abbreviation in the past, but sadly it doesn’t work well for social media tags.) Besides year-specific tags, we have variations on FFC events, such as Masterclasses, so we’ve also used tags like #ffcmasterclass.

Mini Form Function & Class

The event is officially spelled as MiniFFC. Formally, it is called Mini Form Function & Class. It’s spelled more often as an abbreviation, but like the term PWDO, one must always make sure to explain what it means.

MiniFFC is short for Mini Form Function & Class. It is the smaller, more informal version of Form Function & Class, our annual web design conference. MiniFFC is where hobbyist & professional web designers can gather, share experiences, and mingle with fellow colleagues.

(If you’ve been to our very first events, you might remember it was originally called FFC Mini).

Naming system

Since we have a lot of MiniFFC events, we have to identify them in a scalable but descriptive way. All MiniFFCs are called this way:

MiniFFC #[number]: [title]
  • The [number] is prefixed by the pound sign or octothorpe, “#”.
  • The [number] has no placeholder digits (#001), just its actual number (#1).
  • The [number] and [title] are separated by a colon, “:”.
  • The [title] can be the type the MiniFFC, which we have classified into Meetup, Workshop, or Roadshow.
  • The [title] can also be custom, to hint at the agenda of the event.

Around 2013–2017, we introduced a season/episode naming system, e.g MiniFFC s2017e01 (s = year, e = nth that year), possibly because we’ve lost count of how many we’ve done so far. We received feedback that it was hard to read, so we eventually decided to go back to the numbered format, but also retained a title after the number.

This encouraged us to document our events more thoroughly, and to celebrate that we’ve organized a lot of events over the years already. :)

Writing style

Be enthusiastic and warm

As organizers, we should be able to convey how excited we are to share this event with others, and how it’ll be an amazing experience for them.

Be descriptive, don’t alienate

Avoid jargon or hifalutin words unless absolutely necessary. Not everyone knows the same acronyms, technologies, or inside jokes you do, and we don’t want to leave people out of the conversation.

Make it easy to find what they need

When writing a post on social media answering queries, be sure to link to the site or registration page. You can also identify the speakers and venues by tagging or mentioning them, and add the event hashtags.

Practice proper email etiquette

When sending to multiple recipients, use BCC unless it’s necessary or you’ve gotten permission to reveal everyone’s email addresses to one another.

Choose casual over formal

When someone reaches out for assistance, write to them like you’re talking to them in person: friendly & casual, instead of than business-like & formal. If they ask you a question in Filipino, reply in the same language. Even if the answer to their question can be found somewhere in the event details, be patient and give the answer anyway.

Example: “Hi FFC! Ask ko lang kung may slots pa ba kayo?”

Stiff, not descriptive:

“Yes, please check our Eventbrite form for further details.”

Clearer, more helpful:

“Hi! Oo, meron pa pero paubos na! Register ka na sa formfunctionclass.com. Salamat!”

Sign replies

When replying, sign each message with your initials so we can keep track of who replied. This is most applicable to Twitter direct messages and emails; Facebook pages already show who published a post or replied to a message.

Example: “@charis: Hi FFC! Do you have any hotel recommendations near the conf venue?”

Signed: “Yes, we have a list on our About page. We’re also trying to secure a corporate discount for our attendees :) ^kv”

And that’s it! We hope to keep our guides and systems up-to-date as much as possible. For more information about the organization and our events, be sure to visit our sites.