یک رویداد جدا 2022 دنور دیروز به پایان رسید و در حالی که این بار نتوانستم به هر سه روز برسم، اقدام دیروز را متوجه شدم - و این شد عالی. من خیلی اجتماعی یا برونگردی نیستم، اما این اولین کنفرانسی بود که حداقل در چند سال گذشته در آن شرکت میکردم، و دیدن افراد بهصورت حضوری فوقالعاده با طراوت بود.
البته یادداشت کردم! فکر کردم آنها را اینجا پست کنم زیرا اشتراک گذاری اهمیت دارد. حداقل، این همان چیزی است که کودک شش ساله ام روز گذشته هنگام درخواست یک لقمه از دسر من به من گفت.
من این را با بلندگو تجزیه می کنم. هشدار منصفانه: من همه چیز در مورد یادداشت های دست نویس و یک شخص بصری زیبا هستم، بنابراین یادداشت های من نسبت به بسیاری از آنها ساختار کمتری دارند. و این یادداشت ها فقط چیزهایی هستند که برای من برجسته بودند. شاید حتی ایده اصلی مجری هم نباشند، اما توجه من را به خود جلب کردند!
کریس کویر: وب سایت ها اکنون خوب هستند
کریس قبلاً این سخنرانی را انجام داده است (ما آن را پیوند دادیم فقط هفته گذشته)، اما این بار آن را به طور قابل توجهی گسترش داد، به ویژه با جزئیات واحدهای نسبی کانتینری که در صورت ترکیب با clamp()
، پاسخگویی دقیق تری را ایجاد می کند زیرا مقادیر به جای نمایشگر نسبت به کانتینر هستند. بنابراین، شما می دانید که چگونه ما اغلب از عرض viewport استفاده می کنیم (vh
) واحد برای نوع سیال؟
font-size: clamp(1rem, 1rem + 2vw, 2rem);
خوب، ما می توانیم از یک واحد نسبی کانتینر مانند استفاده کنیم پرس و جوی ظرف درون خطی (cqi
) در عوض، کجا 1cqi
برابر است با 1% اندازه درونی ظرف (در اینجا مشخصات پیش نویس در مورد آن است):
font-size: clamp(1rem, 1rem + 1cqi, 2rem);
کریس همچنین کمی در مورد مزایای عملکرد صحبت کرد میزبانی در لبه. احتمالاً جای تعجب نیست زیرا او همینطور است کتبی در مورد آن اینجا کلیک نمایید بیش از چند بار حتی به عنوان کسی که قبلاً آن مقالات را خوانده بودم، صادقانه بگویم که مفهوم کامل محاسبات در لبه را درک نکردم.
ایده به طرز فریبنده ای ساده است: CDN های جهانی می توانند خدمت کنند دارایی به سرعت زیرا آنها را از نظر جغرافیایی نزدیک به کاربر میزبانی می کنند. این یک روش کاملاً استاندارد برای ارائه تصاویر شطرنجی است. اما به فایلهای استاتیک، مانند همان فایلهای HTML، CSS، و جاوا اسکریپت که یک سایت را نیرو میدهند، گسترش یافته است - آنها را از قبل بسازید و فایلهای از قبل کامپایلشده و بهینهسازی شده از CDN جهانی سریع را ارائه کنید. این کل مفهوم Jamstack است!
اما اگر هنوز به پاسخ سرور از آن نیاز دارید چه؟ این خیلی جالب نیست، اینطور است؟ خوب، اکنون کنترلکنندههایی داریم که میتوانند روی یک URL واحد اجرا کنند و دادهها را از قبل واکشی کنند و آن را قبل از رندر تزریق کنند - مستقیماً از CDN. مطمئناً، کار اضافی در پسزمینه اتفاق میافتد. با این حال، این واقعیت که ما میتوانیم دادهها را بهصورت پویا واکشی کنیم، آنها را تزریق کنیم، از قبل بسازیم، و به صورت ایستا به آنها سرویس دهیم. در تقاضاو از نظر جغرافیایی نزدیکتر به کاربر اجرا شود، این کار را بسیار سریع می کند.
Tolu Adegbite: چگونه در ARIA برنده شویم و بر دسترسی به وب تأثیر بگذاریم
خداییش این یک ارائه عالی بود! تولو آدگبیته آنقدر مرا در مورد WAI-ARIA آموزش داد که به سختی تمام جواهراتی را که او به اشتراک گذاشته بود یادداشت کردم - نقش ها! ایالت ها! برچسب زدن! توضیحات! همه چیز فوق العاده خوب پوشش داده شده بود، و چیزهایی که می دانم بارها و بارها به آنها باز خواهم گشت.
اما یک چیز خاصی که توجه من را جلب کرد دسترسی به SVG درون خطی است. حتی اگر SVG به انواع دیگر دارایی های طراحی مرتبط است، این واقعیت که نشانه گذاری آن در پایان روز است آن را متمایز می کند زیرا همیشه به عنوان یک تصویر شناسایی نمی شود.
فناوری کمکی با دادن نقش و برچسب مناسب در دسترس به احتمال زیاد SVG درون خطی را به عنوان یک تصویر می خواند:
میریام سوزان: لایه های آبشاری با اهمیت!
سلام، یک آلوم دیگر CSS-Tricks! میریام زمان و تلاش زیادی را صرف این موضوع کرده است مشخصات لایه های آبشاری. او همچنین نوشته است راهنمای بزرگ در مورد آنها اینجا در CSS-Tricks و در An Event Apart درباره آنها صحبت کردیم.
چیزی که بیش از همه به من گیر کرده این است که چقدر این تغییر ذهنی بزرگ است. این مفهوم به خودی خود پیچیده نیست. اعلام @layer
در بالای سند CSS، لایهها را به ترتیب ویژگی فهرست کنید، سپس استایلها را در آن لایهها بنویسید. اما برای دایناسور قدیمی مثل من که مدتی است CSS می نویسد، باید به این واقعیت عادت کنم که لایه های Cascade این امکان را برای یک انتخابگر کلاس ساده فراهم می کند تا چیزی را که معمولاً ویژگی بالاتری دارد، شکست دهد. مثل شناسنامه
🤯
میریام همچنین به اتاق یادآوری کرد که لایههای آبشاری تنها ابزاری هستند که ما در کمربند ابزار مدیریت ویژگیهای خود داریم، علاوه بر انتخابگرهایی که بر ویژگی تأثیر میگذارند (به عنوان مثال، :is()
, :where()
و :has()
).
اوه، و این یک نکته جالب است. همانطور که میریام در طول تاریخچه اختصاصی بودن در CSS قدم می زد، آن را به خاطر می آورد !important
در ابتدا به عنوان ابزاری برای کاربران برای نادیده گرفتن سبک های عامل کاربر و نویسنده طراحی شد. اما در جایی پایین تر، ما آن را پذیرفته ایم تا سبک های نویسنده را به بالاترین سطح برسانیم. لایه های آبشاری به حذف کمک می کنند بهانه نیاز به استفاده !important
زیرا آنها به ما این قدرت را می دهند که "اولویت بندی لایه ها و حفاظت از ارث"
به زیبایی گفته می شود، میریام!
Dave Rupert: Unblocking Accessibility Backlog
تصور کنید که یک روز با صدها اعلان GitHub در مورد مشکلات گزارش شده در سایت خود بیدار شوید. اصلا از کجا شروع می کنی؟ شاید لپ تاپ خود را ببندید و به جای آن کانال ریشه بگیرید؟ این اتفاق برای دیو افتاد! یک ممیزی دسترسی خودکار، انبوهی از خطاها را برگرداند و آنها را بهعنوان بلیتهایی برای اصلاح دیو تعیین کرد.
اما او پس از گرفتن یک صفحه گسترده اکسل از آن مسائل متوجه الگویی شد، آنها را برای دید بهتر به Notion منتقل کرد، ستون های غیر ضروری را پنهان کرد، همه چیز را دسته بندی کرد و نتایج را در گروه های منطقی نمایش داد. بسیاری از مسائل گزارش شده همان موضوع بود که در چندین صفحه تکرار می شد. فقط به این دلیل که یک تست خودکار تعداد انگشت شماری از خطاها را برمی گرداند به این معنی نیست که همه آنها منحصر به فرد هستند. این باعث شد که بخش خوبی از بلیط ها کاهش یابد.
او در ادامه نشان داد که چگونه - با تلاش نسبتاً کمی - تعداد مشکلات تقریباً 50٪ کاهش یافت.
چیزهای زیادی برای جمع آوری وجود دارد، به خصوص در مورد نحوه پردازش و سازماندهی کارمان. بزرگترین نکته برای من زمانی است که دیو گفت ما باید بر افراد و تعاملات بر فرآیندها و ابزارها تأکید کنیم. ابزارهایی مانند اسکن خطاهای دسترسی مفید هستند، اما ممکن است کل داستان را بیان نکنند. به جای اینکه آنها را به حرف هایشان بپذیرید، ارزش دارد قبل از فرو رفتن در آشفتگی، سؤال بپرسید و زمینه بیشتری را به دست آورید.
به عنوان یک امتیاز، سازماندهی مجدد مسائل در Notion به دیو اجازه داد تا مسائل را به گونهای گروهبندی کند که به وضوح نشان میدهد که محصولش به طور فعال در برابر کدام آسیبها تبعیضآمیز است، و به او همدلی بیشتری نسبت به آن اشتباهات و نحوه اولویتبندی آنها میدهد.
یک جلسه مجازی دیگر توسط هوی جینگ چن روز را به پایان رساند، اما مسلماً من تقریباً نیمی از آن را از دست دادم زیرا در حال گفتگو در راهرو بودم. این گفتگو ارزشش را داشت، حتی با وجود اینکه ناراحت هستم ارائه را از دست دادم. وقتی منتشر شد ویدیوی آن را می بینم!