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

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

💥تبلیغات ارزان قیمت و به صرفه:
@CodersZoneAds
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
⁣⁣🔥 برای گرفتن اسکرین شات تمام صفحه در #chrome می توانید به #DevTools رفته، ctrl+shift+P را بزنید و کلمه #screenshot را تایپ کنید.

#tips

@coderszone
🔥 تا جایی که میتوانید از #label ها استفاده نکنید.

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

برای مثال در یک #فروشگاه_اینترنتی، جهت نمایش موجودی یک کالا به جای عبارت "موجودی در انبار: 12 عدد" از "12 عدد موجود" استفاده کنید.

یا در یک وبسایت املاک به جای عبارت "تعداد اتاق : 3" از "3 اتاقه" استفاده کنید.

#tips #UI #UX #frontend #digital_marketing

@coderszone
⁣⁣⁣⁣⁣🔥 ⁣۵ سایت قدرتمند برای پاسخگویی به سوالات برنامه نویسی

👇👇👇👇👇
🌐⁣⁣https://goo.gl/tvgNrx

#programming

@coderszone
This media is not supported in your browser
VIEW IN TELEGRAM
🔥 ⁣وقتی یه #برنامه_نویس می خواد یه باگ رو ساعت 3 صبح رفع کنه😆😆😆

#gif

@coderszone
⁣⁣⁣🔥 از آنجایی که اشیاء #javascript از نوع ارجاعی هستند نمی توان آن ها را با == یا === مقایسه کرد. روشی سریع برای مقایسه استفاده از ⁣JSON.stringify یا تابع ⁣isEqual در #⁣Lodash است.

@coderszone
This media is not supported in your browser
VIEW IN TELEGRAM
🔥 نمونه #طرح الهام بخش برای نمایش به صورت grid و list در #اپ های #android

#UI #UX #frontend

@coderszone
🔥 از disable کردن دکمه های #⁣submit پرهیز کنید.

در بعضی فرم ها دکمه ارسال تا زمانی که کاربر تمامی فیلدهای الزامی را پر نکرده است غیرفعال می باشد.
این کار اولا #دسترسی_پذیری دکمه را محدود کرده و ثانیا کاربر با کلیک بر روی آن هیچ بازخوردی نخواهد دید. در عوض فعال نگه داشتن دکمه های #submit فرصت highlight فیلدهای الزامی را فراهم می کند.

💡تنها حالتی که غیرفعال کردن دکمه submit به کار می آید زمانی است که فرمی با تنها یک فیلد دارید که راهی جز پرکردن آن وجود ندارد.

@coderszone
🔥 یکی از روش های ایجاد پس زمینه تمام صفحه استفاده از واحد vh می باشد.

👇👇👇👇👇👇
🌐⁣⁣⁣https://codepen.io/pwolke/pen/MPebya

#CSS #UI #frontend

@coderszone
🔥 صفحات FAQ یکی از مهمترین المان های وبسایت #کسب_و_کار شما به حساب می آیند.

این صفحات نقش مهمی در ناوبری خوب کاربران ایفا کرده و کمک می کنند تا آنها درک درستی از محصولات یا خدماتی که ارائه می کنید پیدا کنند.

آمار نشان می دهد، صفحات FAQ دومین صفحه ای است که بسیاری از کاربران پس از مراجعه به سایت شما به آن مراجعه می کنند.

این بخش از سایت باید محتوای با کیفیت بسیار بالا داشته باشد. به علاوه این صفحات از نظر #SEO نیز مفید بوده و باعث می شوند موتورهای جستجو اطلاعاتی از نوع کسب و کار شما به دست آورند.

#digital_marketing

@coderszone
⁣⁣🔥 ⁣اپن‌لاراول (OpenLaravel) ⁣: منبع پروژه‌های اپن‌سورس فریمورک #لاراول

👇👇👇👇👇👇
🌐https://bit.ly/2pKUjth


@coderszone
This media is not supported in your browser
VIEW IN TELEGRAM
🔥 #طرح خلاقانه تکنیک #cross_sell در صفحه checkout یک #فروشگاه_اینترنتی

تکنیک ⁣cross_sell روشی است که در آن کالایی مکمل محصول خریداری شده به خریدار پیشنهاد می شود.

#inspiration #shop

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

#google

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

دلیل هم این است که گوشه های مربع موجب می شود تصاویر روشن تر به نظر برسند و این روشنایی باعث می شود #پردازش_تصویر سخت تر شود.
صورت کاربران همیشه در مرکز قرار می گیرد. در نتیجه در مواجهه با یک پروفایل مربعی، کاربران زمان بیشتری صرف تمرکز بر روی عکس میکنند.

دلیل هم این است که فاصله مرکز تصویر تا گوشه ها از فاصله تا لبه ها بیشتر است در نتیجه کاربران مجبورند چشم های خود را در امتداد قطرها جابجا کنند. در عوض در پروفایل های دایره ای، کاربران با نگاه به مرکز همه چیز را می بینند.

#UI #UX #frontend

@coderszone
🔥 بهره گیری از یک نسخه #mobile_friendly برای #فروشگاه_اینترنتی، شانس فروش محصولات را تا 67% افزایش می دهد. در حقیقت یک سوم خریدها از طریق نسخه موبایل انجام خواهد شد و نیمی از ترافیک موجود در فروشگاه متعلق به موبایل خواهد بود.

#digital_merketing #shop #ecommerce

@coderszone
⁣⁣🔥 قبل از اینکه یک #select_menu را در صفحه قرار دهید به این سوال پاسخ دهید که آیا کاربر گزینه ای که می خواهد انتخاب کند را از قبل می داند ؟ در صورتی که جواب مثبت است به جای استفاده از یک select menu ساده از فیلد ⁣autocomplete استفاده کنید.

چه لزومی دارد وقتی کاربر گزینه مورد نظر خود را از قبل می داند او را مجبور کنیم در طول یک لیست بلند بالا از گزینه ها اسکرول کند. این مشکل در نسخه #موبایل که تعداد گزینه های نمایشی کمتر است و امکان استفاده از #کیبورد هم وجود ندارد دوچندان می شود.

در عوض در فیلد های ⁣autocomplete، کاربر فقط بخشی از گزینه مورد نظر را تایپ کرده سپس از بین گزینه های پیشنهادی، مطلوب خود را انتخاب می کند.

#UI #UX #frontend

@coderszone
⁣⁣⁣⁣⁣⁣🔥 ⁣⁣راهنمای سریع برای کمک به شما در درک و ساخت برنامه‌های #⁣ReactJS

👇👇👇👇👇
🌐⁣⁣⁣https://goo.gl/Jc7Hai

#programming

@coderszone
⁣⁣⁣🔥⁣اگر توسعه دهنده اندروید هستید، حتما این افراد را در توییتر فالو کنید

👇👇👇👇👇👇
🌐 ⁣⁣https://goo.gl/WGJ49t

@coderszone
⁣⁣⁣🔥 ویوِس (Vivus) یک فریم ورک #جاوااسکریپتی مستقل با حدود 10 هزار ستاره(در Github) است که برای متحرک سازی SVG ها مورد استفاده قرار می گیرد. با استفاده از این کتابخانه قدرتمند می توانید فایل های #SVG را به صورت انیمیشنی ترسیم کنید.

⁣⁣👇👇👇👇👇👇
🌐https://github.com/maxwellito/vivus

@coderszone