⁠⁣⁣⁣⁣⁣⁣⁣⁣⁣⁣🔥 اگر یک سایت #responsive دارید می توانید در آن از "تصاویر واکنش گرا" نیز استفاده کنید.

با استفاده از دو صفت جدید به نام های ⁣srcset و sizes به ترتیب برای تعیین مجموعه ای از آدرس های یک تصویر و تعیین اندازه نسبی تصویر در اسکرین های گوناگون استفاده کنید. سپس مرورگر بهترین اندازه تصویر برای نمایش در #device های مختلف را انتخاب می کند.

میزان پشتیبانی عمومی از این قابلیت در مرورگرها، ⁣88.54% است.

<img srcset="image-320w.jpg 320w,
             image-480w.jpg 480w,
             image-800w.jpg 800w"
     sizes="(max-width: 320px) 300px,
            (max-width: 480px) 440px,
            800px"
     src="image-800w.jpg" alt="Image">

#UI #frontend


✅@coderszone

⁣⁣⁣⁣⁣⁣🔥 یکی از ساده ترین روش ها برای اینکه طرح شما تمیزتر به نظر آید، این است که به عنصر فضای بیشتری برای نفس کشیدن بدهید.

#UI #UX #fronetend

✅ @coderszone

🔥 از #فریمورک #Electron می توان برای ساخت اپلیکیشن های دسکتاپ چند سکویی مناسب برای سیستم عامل های #ویندوز ، #Mac و #Linux با استفاده از #html ، #CSS و #javanoscript استفاده کرد.

🌐https://electronjs.org

#UI #frontend

✅ @coderszone

⁣⁣⁣⁣⁣⁣🔥 وقتی یه برنامه نویس پس از ساعتها کار می خواد بره استراحت کنه 😄😄

#programmer

✅ @coderszone

🔥 بهترین زبان های #برنامه_نویسی برای یادگیری در سال ۲۰۱۹

🌐https://goo.gl/BjxGT7

#programming

✅ @coderszone

⁣⁣⁣⁣⁣⁣🔥 وقتی متنی در صفحه موبایل نمایش داده میشود که کلمه/لینکی طولانی در آن وجود دارد، ممکن است باعث نمایش اسکرول بار افقی شود.

با استفاده از دستور word-break می توان از این مورد جلوگیری کرد:

.article-content p {
    word-break: break-all;
}   

#UI #frontend #css

✅ @coderszone

🔥 بهترین جایگزین های #PHP در سال ۲۰۱۹

🌐https://goo.gl/HxnS6G

#programming

✅ @coderszone

🔥 نمونه #طرح فرم #login

#UI #frontend #UX

✅@coderszone

🔥 بهترین سایز برای نمایش #headline ها در اسکرین های کوچک، چیزی بین 20px تا 24px است.

#UI #frontend #UX

✅@coderszone

🔥 بدون شرح

#programming #fun

✅@coderszone

🔥 روش های حذف مقادیر تکراری از آرایه ها و برگرداندن مقادیر unique در #ES6

#UI #frontend #javanoscript

✅@coderszone

🔥 نمونه #طرح پیاده سازی فیلتر در #app فروشگاهی

#UI #frontend #android #iOS

✅@coderszone

🔥 عملیات #phishing در گوشی های #موبایل ساده تر انجام می شود. چرا که اسکرین های موبایل کوچکتر و محدودتر از آن اند که بتوان به صورت دقیق و سریع صفحات #fake را از صفحات اصلی تشخیص داد.

✔️ مراقب باشید.

#UI #frontend #android #iOS

✅@coderszone

⁣⁣⁣⁣⁣⁣🔥 وقتی بالاخره #Bug ی رو که مدت ها دنبالش بودم پیدا می کنم.

#gif #programming

✅ @coderszone

⁣⁣⁣⁣⁣⁣🔥 تب #coverage در #DevTools مرورگر #کروم، به شما نشان می دهد که چه حجم از کد های #CSS یا #javanoscript در صفحه شما بلا استفاده اند.

#forntend #UI #chrome #browser

✅ @coderszone

⁣⁣⁣⁣⁣⁣🔥 بولما (Bulma) یکی از فریم ورک های #CSS مبتنی بر #flexbox و mobile-first است که از هیچ کد #javanoscript در آن استفاده نشده است. در واقع شما برای استفاده از آن نیاز به الحاق هیچ فایل js ندارید.

🌐https://bulma.io

#UI #frontend

✅ @coderszone

⁣⁣⁣⁣⁣🔥 پیشنهاد می شود مدت زمان اجرای انیمیشن ها در موبایل را در محدوده 200-300 میلی ثانیه قرار دهید. در #تبلت نیز باید سرعت 30% بیشتر یعنی 400-450 میلی ثانیه در نظر گرفته شود. دلیل نیز ساده است : سایز صفحه نمایش بزرگتر است و المان ها باید مسیر طولانی تری را طی کنند.

در عوض برای ابزار پوشیدنی-همچون ساعت های هوشمند- زمان اجرای انیمشین ها 30% کمتر و حدود 150-200 میلی ثانیه باشد چرا که در این گونه ابزار به دلیل سایز کوچک، مسیر جابجایی عناصر کوتاه تر است.

#UI #UX #frontend

✅@coderszone

🔥 10 #اپلیکیشن برتر فروشگاهی 2018

🌐 https://goo.gl/tPUosY

#ecommerce #android #iOS

⁣⁣⁣⁣⁣⁣🔥 بهتر است بدانید #گوگل از واکشی #sitemap هایی که حاوی #URL های نا معتبر هستند خودداری می کند. پیشنهاد می شود حداقل این گونه URL ها را به مسیر هایی که یک نوع content را برمی گردانند هدایت کنید.

#SEO #gogole

✅ @coderszone

🔥 چالش #10yearschallenge در وسط چین کردن عناصر با #CSS

🌐 https://codepen.io/MartijnCuppens/pen/roXJxe

#UI #frontend

✅@coderszone

🔥 روش های مناسب برای ساخت #backlink اصولی

🌐 https://goo.gl/YSbktq

#SEO

✅ @coderszone