CodersZone 🔥 قلمرو برنامه نویسان
404 subscribers
369 photos
42 videos
77 links
آموزش UI و UX
آموزش Tip و Trick های frontEnd و backEnd
نکات SEO و Digital Marketing
اخبار تکنولوژی

تبادل/انتقادات و پیشنهادات:
@coderszone_admin

💥تبلیغات ارزان قیمت و به صرفه:
@CodersZoneAds
Download Telegram
🔥 یکی از چالش هایی که بسیاری از کاربران در مواجهه با دکمه های #toggle با آن روبرو می شوند این است که به راحتی نمی توانند
تشخیص دهند که هم اکنون دکمه در چه وضعیتی قرار دارد. فعال است یا غیر فعال؟

این مسئله بیشتر زمانی رخ می دهد که طراح از طرح رنگی #معکوس برای ساخت آن ها استفاده می کند.

#UI #frontend #UX

@coderszone
CodersZone 🔥 قلمرو برنامه نویسان
🔥 یکی از چالش هایی که بسیاری از کاربران در مواجهه با دکمه های #toggle با آن روبرو می شوند این است که به راحتی نمی توانند تشخیص دهند که هم اکنون دکمه در چه وضعیتی قرار دارد. فعال است یا غیر فعال؟ این مسئله بیشتر زمانی رخ می دهد که طراح از طرح رنگی #معکوس…
💥 از این رو این نوع دکمه ها باید استایل مشابه و نزدیکی داشته باشند.

در عوض می توانید از طرح رنگی موسوم به #direct استفاده کنید. در این روش هر دو نوع دکمه به صورت یک متن تیره بر روی پس زمینه روشن نمایش داده می شوند. اما تفاوت آن ها این است که گزینه انتخابی دارای متن #bold، یک Border تیره و یک سایه روشن در پس زمینه است.

#UI #frontend #UX

@coderszone
🔥 برای چک کردن کنتراست براساس استاندارد AA یا همان #تست #کنتراست در #طراحی، ابزار مختلفی وجود داره، یکی از بهترین گزینه‌ها اپ Contrast برای مک هست. در ادامه ابزارهای دیگری نیز اضافه خواهد شد.

🌐 https://usecontrast.com

#UI #frontend

@coderszone
🔥 همیشه سعی کنید از درج دکمه های متعدد در صفحه یک محصول در #فروشگاه_اینترنتی خود پرهیز کنید. مگر کاربران در این صفحه به بیشتر از یک دکمه جهت افزودن محصول به سبد خریدشان نیاز دارند؟

به تصویر فوق که از سایت https://www.blenderseyewear.com انتخاب شده است دقت کنید. در کل این صفحه فقط یک #دکمه وجود دارد. دکمه ای بزرگ، bold و تنها متنی در صفحه که رنگ پس زمینه دارد.

#ecommerce #tips #ux #ui #frontend

@coderszone
🔥 در نسخه 77 #chrome می توانید با کلیک راست بر روی یک node موجود در DOM، استایل های آن را کپی کنید.

#devTools #browser #UI #frontend

@coderszone
🔥 اغلب می خواهیم عناصری که دارای #محتوا هستند را استایل دهی کنیم. اما مواقعی نیز وجود دارد که مایلیم عناصر فاقد محتوا را استایل بدهیم. برای این کار می توانید از #گزینشگر empty: استفاده کنید.

#frontend #UI #CSS

@coderszone
This media is not supported in your browser
VIEW IN TELEGRAM
🔥 استفاده از خاصیت line-clamp برای مدیریت تعداد خطوط نمایشی در #CSS

#UI #frontend

@coderszone