Language
Defining anything will involve some subjectivity. The goal of semantic is not to create code that is free from prescription, but to create code that tends to avoid arbitrary decisions if a conventional choice presents itself.
The following are some guidelines which help avoid some common pitfalls in writing UI element definitions.
Neutral Base Form
In order to make UI components be able to exist in most websites, the prototype version of an element should be neutrally styled using greytones and neutral colors. This will allow other elements to be more robust giving other developers freedom to make decisions about color and style when adapting your element for their website.
Namespacing
All css code must live inside a namespace. By default all ui elements use the class "ui". This prevents rules from altering styles of other content in the page. This also helps differentiate between UI elements and parts of an element
Tags inside of a ui element do not need to be prefixed with ui. They can simple descend from the element.
Commonality
Try to use the most obvious names for classes. If you're not sure, prototype the element, then ask a friend or two what they would call it.
Precision
Classes should be defined in one word, if the concept cannot be reduced to a single word then consider factoring it into multiple sub classes
Use real words
Abbreviations are useful for taking notes, but css definitions should attempt to use consistent, common language.
Non prescriptive
Avoid requiring any specific tags in your definitions. This will allow developers to choose which tags they would like to use with an element.
Sometimes however it makes sense to allow for common tags to be used in place of classnames for brevity. Paragraph tags, links, labels, and tables may be useful to use in a UI element definition without classnames.
Be cautious though, for example, requiring a form definition to use a form tag limits a developers ability to nest form elements inside other forms. The same is true for anchor tags
Writing Variations
Same but not the same
Multiple elements may contain similar variations that function slightly different.
For example it may be useful for various elements to float left or right. At first it may seem most useful to write a helper class that floats all UI element types when given a certain class name, but the way which an element may be floated might vary depending on the type of element.
Inversion
Elements are often inverted to stand out on dark backgrounds. Consider creating a variation of your element defines how the element can invert its colors.
Keep in mind you might have to increase the contrast between shades of your element when inverting colors, its much easier to detect in a design between multiple shades of a light color than a dark one.