سوالاتی برای ساختن و برقرار کردن راهنمای FrontEnd (جلسه ۹) : CSS – قسمت ۵

frontend

ابزارهای CSS

  • آیا تیم شما از تکنیکهای خاصی در رابطه با CSS استفاده میکنه؟

همونطور که میدونین مدام تکنیک‌های زیادی توسط توسعه دهندگان ارائه میشه و هدف اصلی همه اونا اینه که گره از مشکلات خاصی باز کنه و Performance سایت رو بالا ببرن. مثالهای زیادی میشه برای این مورد زد و یکی از معروف‌ترین اونا Critical CSS یا CSS بحرانی هست که با استفاده از اون میتونین در همون ابتدا که سایت باز میشه، فقط استایل اون قسمتی که Abode the fold یا جایی از سایت که ما میبیینیم رو لود کنه و بعد از اون بصورت Async بقیه کدهای CSS رو با استفاده از Javascript دانلود کنه.above-the-foldدر آینده نزدیک آموزشی در این زمینه براتون در ۷Learn قرار میدم. برای مطالعه بیشتر در این زمینه میتونین این لینک رو مشاهده کنید.

framework‌های CSS

  • آیا تیم شما از Framework‌های CSS استفاده میکنه؟

همونطور که میدونین با استفاده از فریم ورکهایی که برای CSS وجود داره، دیگه نیازی نیست که همه کارها رو خودمون از پایه کدنویسی کنیم و با استفاده از این فریم ورکها و ویژگی هایی که دارن، میتونیم سرعت کدنویسی رو خیلی خیلی بالا ببریم و دیگه نگران به وجود اومدن مشکل هم نباشیم. این فریم ورکها همیشه به روز رسانی میشن و مشکلات اونا برطرف میشه و ویژگی‌های جدیدی بهشون اضافه میشه. فریم ورکهای خیلی خیلی زیادی برای CSS منتشر شده که ما در اینجا تعدادی از معروفترین‌های اونا رو بهتون معرفی میکنیم.bootstrap

این تصویر مربوط به Bootstrap هست و معروف‌ترین و پرطرفدارترین Framework محسوب میشه. به احتمال زیاد همگی شما با اون آشنا باشید. سال ۲۰۱۱ ساخته شده و روز به روز در حال پیشرفت هست.zurb foundation

این تصویر مربوط به Zurb Foundation هست که یکی از رقیبهای سرسخت Bootstrap هست. این فریم ورک توسط سایتهای خیلی بزرگی مورد استفاده قرار میگیره. این فریم ورک هم در سال ۲۰۱۱ منتشر شد.semantic ui

این تصویر مربوط به Semantic UI هست و همانند موارد قبل طرفداران زیادی داره. تمرکز این فریم ورک بر روی Semantic یا معناگرایی هست. با استفاده از این ابزار خوانایی کدهای شما خیلی بالا میره و به راحتی میتونین اون رو بفهمید. این فریم ورک در سال ۲۰۱۳ منتشر شد.pure css

این تصویر مربوط به Pure.css هست که توسط Yahoo ساخته و توسعه داده شده. حجم این مورد در مقایسه با موارد قبلی، خیلی کمتر هست. این مورد هم در سال ۲۰۱۳ منتظر شد.Materialize

این تصویر مربوط به Materialize CSS هست که میتونین با استفاده از اون طراحی متریال رو به سایتتون بیارید و به زیبایی اون بیافزاید. این ابزار محبوبیت زیادی داره و میتونین از قدرت و زیبایی اون بهره ببرید. آموزشی در سایت ۷Learn قرار داده شده که این مورد رو بصورت مقدماتی آموزش داده.uikit css

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

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

امیدوارم از این مطلب خوشتون اومده باشه.

موفق باشید

یا علی

Source

چه امتیازی به این مقاله می دید؟











نویسنده
محمد اسفندیاری

بسیار به طراحی وب علاقمندم و به سرعت در حال یادگیری تمام مباحث پیشرفته هستم و دوست دارم که به دیگران هم یاد بدهم.

نظر دهید

پاسخ دهید

Logo
بازیابی رمز عبور
مقایسه موارد
  • کل (0)
مقایسه
0