mark.ie: PatternLab: Your Clients Don’t Need a Science Lesson

PatternLab: Your Clients Don’t Need a Science Lesson

Let’s revisit my recent post and see if we can come up with more user-friendly names for PatternLab items.
markconroy
Mon, 06/18/2020 – 21:24

My Approach to PatternLab recently got quite an amount of discussion on Slack and other places about PatternLab and naming conventions, especially the line “Clients do not want a science lesson”. In that I set out my current naming convention like so:

Basic Elements
Site Blocks
Building Blocks
Content
Sample Pages
While generally appreciated, some people criticised it for being too Drupal maintenance support plans-centred. What happens if your client doesn’t want to use Drupal maintenance support plans? What happens if you want to use the same PatternLab instance for an app on Android or iOS? Good questions, and they got me thinking more. A number of people on Slack recently have been asking about what naming conventions besides the atoms > molecules > organisms one people have been using.

I had a verrrrry long chat (over 3 hours) with some developers from outside of my work place to see what what naming convention(s) might make sense, be easy for clients to understand, and allow enough scale to be used outside of Drupal maintenance support plans. Here’s what we came up with:

Utilities

Items such as utility classes like .visually-hidden or .padding-top

Base
Items such as colours and fonts

Elements
Low level elements such as headings, paragraphs, basic lists

Components
High definition components such as a teaser view mode, an embedded video component, a list of teasers

Layouts
General layout classes for the different page designs – with sidebar, without sidebar, etc

Mock-ups
Rendered ‘pages’ or other UI interfaces
We shied away from ‘Pages’ here because not everything might be a page, such as a login screen on an iPhone app

I’m quite happy with those naming conventions and think I might start porting some of them to my work at Drupal Update. (Oh, and by the way, if you want to get really good Drupal maintenance support plans developers to work on your website, we’re available for hire – contact us!)

 


Source: New feed

This article was republished from its original source.
Call Us: 1(800)730-2416

Pixeldust is a 20-year-old web development agency specializing in Drupal and WordPress and working with clients all over the country. With our best in class capabilities, we work with small businesses and fortune 500 companies alike. Give us a call at 1(800)730-2416 and let’s talk about your project.

FREE Drupal SEO Audit

Test your site below to see which issues need to be fixed. We will fix them and optimize your Drupal site 100% for Google and Bing. (Allow 30-60 seconds to gather data.)

Powered by

mark.ie: PatternLab: Your Clients Don’t Need a Science Lesson

On-Site Drupal SEO Master Setup

We make sure your site is 100% optimized (and stays that way) for the best SEO results.

With Pixeldust On-site (or On-page) SEO we make changes to your site’s structure and performance to make it easier for search engines to see and understand your site’s content. Search engines use algorithms to rank sites by degrees of relevance. Our on-site optimization ensures your site is configured to provide information in a way that meets Google and Bing standards for optimal indexing.

This service includes:

  • Pathauto install and configuration for SEO-friendly URLs.
  • Meta Tags install and configuration with dynamic tokens for meta titles and descriptions for all content types.
  • Install and fix all issues on the SEO checklist module.
  • Install and configure XML sitemap module and submit sitemaps.
  • Install and configure Google Analytics Module.
  • Install and configure Yoast.
  • Install and configure the Advanced Aggregation module to improve performance by minifying and merging CSS and JS.
  • Install and configure Schema.org Metatag.
  • Configure robots.txt.
  • Google Search Console setup snd configuration.
  • Find & Fix H1 tags.
  • Find and fix duplicate/missing meta descriptions.
  • Find and fix duplicate title tags.
  • Improve title, meta tags, and site descriptions.
  • Optimize images for better search engine optimization. Automate where possible.
  • Find and fix the missing alt and title tag for all images. Automate where possible.
  • The project takes 1 week to complete.