Example Tagging

[bradfrost]

Before sinking my teeth in and committing a whole shitload of examples, I think it would be a good idea to get a taxonomy established to classify them. With the current infrastructure, is tagging possible? Tagging would be ideal since many style guides often incorporate multiple categories (some are both component libraries and coding guidelines, others are branding and writing documents, and so on).

I'm thinking a general list of tags can help people filter through the resources to hone in on examples that feature the things they're looking for. A proposed initial list of tags:

• #branding
• #frontend
• #voiceandtone
• #writing
• #designlanguage
• #code

Thoughts? Level of effort?

[brendanfalkowski]

Right on, that's what I was trying to get at here: #8 (comment)

Could we just do a YAML list like this?

---
title: Frodo
link: http://bagend.com
tags:
 - branding
 - writing
---

Then drop those tags into a data-tags attribute on the card? Just a little JS needed to filter visibility of cards without one active tag.

Might be annoying enforcing the defined tags, but with a good start I think people will play along if the READMEs are clear.

[bradfrost]

@brendanfalkowski ah yeah, that would be great! I'm not totally familiar with YAML so your code example is really helpful. I'll go through and populate the tags for the examples and start seeding more.

[brendanfalkowski]

@bradfrost That's how YAML works in Statamic — pretty sure Jekyll can parse the same. Looks about equivalent: http://stackoverflow.com/questions/23773873/jekyll-tag-list-on-a-page

Actually like this list format more (haven't seen that before):

tags: [branding, writing]

Maybe try with a handful before tagging them all?

[bradfrost]

Alright, I've dropped in the tagging to _includes/examples.html. Right now the tags aren't doing anything, but I've added the appropriate tags to all the recommended examples.

[bjankord]

+1, I like this list, helps add clarity to question, what is a style guide?

[maban]

I'll get the tags doing something cool in Jekyll soon.

[maban]

I've merged all the examples and guides together, so now they're just examples. I've also added an extra tag called "patterns", based on Brad's blog post. That'll help people find the pattern libraries from the code standards style guides.

[bradfrost]

Ah whoops! I should have read this before creating #39

[brendanfalkowski]

Updated the tag style a bit so it doesn't look like description text.

Also, I used a #backend tag for my Gravity Department example because I have a style guide for PHP code. I know a few other places these exist. Pretty sure that's worth documenting, no?

[bradfrost]

The tag styles look great! And yeah, if we're keeping the 'frontend' tag in there, I suppose backend makes sense. I thought 'frontend' was replaced by 'patterns' so frontend would be retired, but it does work in the context that's on the site now. I'm fine keeping it if you all are.

[brendanfalkowski]

Technically "code" (frontend or backend) + "ui" would cover all three cases. Not sure if others would find it useful to have "backend" code guides separated from "frontend". They're all in one place for most code guides.

[maban]

@brendanfalkowski: You're on fire! The tags look great! I'll make them links on Friday so people can filter examples by tag.

I think a backend tag is useful, definitely.