Salesforce Designers User-Experience-Designer Question # 19 Topic 3 Discussion

The Salesforce Lightning Design System (SLDS) is a CSS framework that helps designers and developers create applications with the look and feel of Lightning Experience. SLDS provides a library of design tokens, icons, components, utilities, and patterns that can be used to build consistent, responsive, and accessible user interfaces1. One of the features that SLDS provides for designers and developers is semantic and accessible component markup. Semantic markup means using HTML elements that describe the meaning and structure of the content, rather than just the presentation. For example, using <h1> for a main heading, 

 for a paragraph, or  for a button. Semantic markup helps to improve the readability, maintainability, and SEO of the code2. Accessible markup means using HTML attributes and techniques that enhance the usability and accessibility of the content for people with disabilities. For example, using aria-label to provide a descriptive label for an element, role to indicate the function of an element, or tabindex to control the keyboard focus order. Accessible markup helps to ensure that the content can be perceived, understood, operated, and interacted with by people using assistive technologies, such as screen readers, keyboards, or voice commands3. SLDS provides semantic and accessible markup for its components, which are reusable UI elements that can be customized and composed to create complex interfaces. SLDS components follow the Web Content Accessibility Guidelines (WCAG), which are the international standards for web accessibility4. SLDS components also use the BEM (Block Element Modifier) naming convention, which is a methodology for creating clear and consistent class names for CSS selectors5. By using SLDS components, designers and developers can create user interfaces that are not only visually appealing, but also meaningful and accessible for everyone. References: Introduction to the Salesforce Lightning Design System, Semantic HTML: How to Structure Web Pages, Accessible Rich Internet Applications (WAI-ARIA), Web Content Accessibility Guidelines (WCAG) Overview, BEM — Block Element Modifier