YoVDO

Building an Accessible Dark-Light Toggle from a Figma Design - FEM Social Media Dashboard, Part 3

Offered By: YouTube

Tags

HTML & CSS Courses Computer Science Courses Web Development Courses Accessibility Courses HTML Courses User Interface Design Courses Responsive Design Courses

Course Description

Overview

Learn how to build and style an accessible dark/light toggle from a Figma design in this comprehensive tutorial video. Study the design, construct the top bar, implement accessible HTML markup for the toggle, and style both the top bar and toggle with accessibility in mind. Follow along as the instructor guides you through each step, from initial design analysis to final styling touches. Gain valuable insights into creating user-friendly and inclusive web interfaces while working on a practical project from Frontend Mentor's social media dashboard challenge.

Syllabus

- Intro.
- Study design.
- Building top bar.
- Using accessible markup for toggle.
- Styling the top bar.
- Styling the toggle so that it's accessible.


Taught by

Coder Coder

Related Courses

Mobile Web Development
Google via Udacity
iDESWEB, Introducción al desarrollo web
Miríadax
Information Design
University of California, San Diego via Coursera
Advanced Styling with Responsive Design
University of Michigan via Coursera
Front-End Web UI Frameworks and Tools
The Hong Kong University of Science and Technology via Coursera