آموزش ساده سازی توسعه وب با بهترین روشهای دستیابی

معرفی Introduction

• ساده سازی وب با قابلیت دسترسی Simplifying web development with accessibility

1. بازگشت به اصول 1. Back to Basics

• کارهای پیچیده را بیش از حد کار کنید Overcomplicating things that already work

• هدف وب The purpose of the web

• چرا دسترسی شکسته می شود Why accessibility breaks

2. طراحی قابل دسترسی 2. Accessible Design

• طراحی یک پالت رنگ قابل دسترسی Designing an accessible color palette

• طراحی تایپوگرافی قابل دسترسی Designing accessible typography

• طراحی سلسله مراتب و جریانهای محتوای در دسترس Designing accessible content hierarchies and flows

3. پنهان کردن و نشان دادن 3. Hiding and Showing

• آیا پنهان کردن یا نشان دادن محتوا ایده خوبی است؟ Is hiding or showing content a good idea?

• نحوه مخفی کردن محتوای بصری How to hide visual content

• نحوه مخفی کردن محتوا از صفحه خوان ها How to hide content from screen readers

4. معناشناسی و تعامل 4. Semantics and Interactivity

• نقش عناصر معنایی The role of semantic elements

• عناصر با هدف Elements with purpose

• اصول لینک و دکمه Link and button basics

• پیوندها Links

• دکمه ها Buttons

• صفحه و پیوندها و دکمه های مناسب صفحه خوان Screen reader–friendly links and buttons

• پیوندها و دکمه های نماد با SVG Icon links and buttons with SVG

5. تصاویر ، گرافیک ها و رسانه ها 5. Images, Graphics, and Media

• تصاویر ، گرافیک و اصول اولیه رسانه ها Images, graphics, and media basics

• عنصر IMG The img element

• شکل و عناصر شکل The figure and figcaption elements

• SVG قابل دسترسی Accessible SVG

• دسترسی بیشتر به فیلم های جاسازی شده Making embedded videos more accessible

• افزودن متن Adding transcripts

6. مثالهای عملی 6. Practical Examples

• منوی پیمایش مناسب موبایل Mobile-friendly navigation menu

• منوی ناوبری چند سطحی Multilevel navigation menu

• کارت پایه Basic card

• کارت با لینک های داخلی Card with internal links

• جمع کننده خرما Date picker

7. اثبات و پودینگ 7. Proof and Pudding

• ساده سازی توسعه وب با بهترین روشهای دستیابی Simplifying web development with accessibility best practices

• از کجا می توانید اطلاعات بیشتری پیدا کنید Where to find more information

• ابزارهایی برای آزمایش دستی سایت ها Tools for manually testing sites

• نمره فانوس دریایی و موارد مشابه Lighthouse score and similar

نتیجه Conclusion

• ذهنیت دسترسی Accessibility mindset