1. مهمان گرامی، جهت ارسال پست، دانلود و سایر امکانات ویژه کاربران عضو، ثبت نام کنید.
    بستن اطلاعیه

10 ابزار مفید برای پاکسازی css

شروع موضوع توسط minaaa ‏9/2/14 در انجمن CSS

  1. کاربر پیشرفته

    تاریخ عضویت:
    ‏9/12/10
    ارسال ها:
    19,795
    تشکر شده:
    6,456
    امتیاز دستاورد:
    113
    [​IMG] ابزارها سی اس اس

    [h=1]10 ابزار مفید برای پاکسازی css[/h]مزایای داشتن یک سی اس اس تمیز و سازمان یافته بر کسی پوشیده نیست. سایت شما با داشتن یک css بدون اشکال، سریع تر بارگذاری شده و در نتایج جستجو رتبه بالاتری کسب خواهد کرد. همچنین این ویژگی مثبت، نشانه ای دال بر حرفه ای بودن شماست. اما، تمیز کردن css از استایل های تکراری و اشتباه، فرآیندی خسته کننده و وقت گیر است. هیچ کس علاقه ای به انجام چنین کار ملالت آوری ندارد و مشتریان هم احتمالا تمایلی ندارند برای انجام این کار زمان بر هزینه اضافه ای به شما پرداخت کنند. پس بهتر است حواستان را به جای انجام چنین کاری، روی فعالیتهای مهمتری که به بهبود وضعیت حرفه شما کمک می کنند متمرکز کنید.

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




    [h=3]ProCSSor[/h]
    [​IMG]
    ProCCSor ابزاری کارآمد برای بهینه سازی سریع css شماست. این ابزار برای تمام سیستم عامل ها و مرورگرها و همچنین iOS در دسترس است. فقط کافی است آدرس فایل css خود یا URL آن و یا کپی آن را در این ابزار وارد کنید و بلافاصله css فرمت داده شده، زیبا و مطلوب خود را تحویل بگیرید.


    [h=3]CSS Lint[/h]
    [​IMG]
    CSS Lint در مقایسه با سایر ابزارهای پاکسازی css کمی برایتان آموزنده خواهد بود. بقیه ابزارها درباره منطقی که پشت تغییرات ایجاد شده وجود دارد توضیحی به شما نمی دهند، اما در CSS Lint درباره هر تغییر توصیه شده توضیح مختصری وجود دارد. همانطور که در شکل زیر می بینید این ابزار چندین دسته خصیصه را برای ارزیابی css مورد توجه قرار می دهد که به تشخیص خود می توانید آنها را فعال یا غیرفعال کنید.

    [​IMG]


    [h=3]Dirty Markup[/h]
    [​IMG]
    Dirty Markup رویکرد منحصر بفرد خود را برای بهینه سازی دارد. این ابزار فقط css شما را بهینه نمی کند، بلکه قدرت مجموعه ای از ابزارهای بهینه سازی را درکنار هم جمع کرده و به مدد آنها، کدهای Html و جاوا اسکریپت شما را هم پاکسازی و مرتب می کند. تنها کافی است کد مد نظر خود را در فضای سفید سمت راست این ابزار کپی کنید.


    [h=3]CleanCSS[/h]
    [​IMG]
    CleanCSS آدرس css شما یا کپی آن را پذیرفته و طیف گسترده ای از پیشنهادات بهبود را به شما ارائه می دهد. شما می توانید از میان 5 گزینه مختلف فشرده سازی که در منوی آبشاری سمت راست عکس بالا قابل مشاهده است، گزینه مطلوب خود را با توجه به اینکه چقدر می خواهید فونت سی اس اس شما کوچک یا بزرگ و قابل خواندن باشد انتخاب کنید.



    [h=3]Code Beautifier[/h]
    [​IMG]
    Code Beautifier یک ابزار ساده پاکسازی css است که هیچ خصیصه پیچیده ای ندارد. مشابه بسیاری از ابزارهای قبلی، آدرس یا کپی css خود را به آن می دهید و با دقت براساس مجموعه ای از گزینه ها آن را بهینه می کند. اگر دوست دارید تمرکزتان روی پروژه حفظ شود و با دریایی از خصوصیات گیج کننده مواجه نشوید این ابزار ایده آل شماست.



    [h=3]Spritemapper[/h]
    [​IMG]
    هیچ کدام از ابزارهایی که تا اینجا معرفی شدند، هیچ امکانی برای بهینه سازی تصاویر در اختیار شما قرار نمی دهند. اما Spritemapper تصاویر موجود در سی اس اس شما را در یک عکس ادغام کرده و سپس آنها را به کمک position به شکل مناسب در جای خودش قرار می دهد. داشتن عکسهای کمتر به معنای سایت سریعتر، درخواستهای html کمتر و استایل شیتهای موثرتر است.


    [h=3]Topcoat[/h]
    [​IMG]
    Topcoat یک ابزار سنتی پاکسازی css نیست، بلکه اساسا یک فریم ورک منعطف برای توسعه css است. مسلما اگر از ابتدا یک سی اس اس خوب نوشته شده و سازگار داشته باشید، به احتمال زیاد هرگز نیازی به تمیزکاری های بعدی ندارید. با این رویکرد، شروع کار با Topcoat یک انتخاب مناسب برای شماست.



    [h=3]CSSTidy[/h]
    [​IMG]
    تفاوت عمده ای که CSSTidy با سایر ابزارهای پاکسازی css دارد این است که از طریق خط فرمان یا php فراخوانده می شود. این ابزار برای پلتفرمهای ویندوز و MAC و یونیکس در دسترس است. اگر شما پروژه های زیادی را همزمان مدیریت می کنید، CSSTidy ابزاری است که به طور کامل با تغییرات کدهای شما سازگار است و css شما را به صورت خودکار تمیز نگه می دارد.



    [h=3]Styleneat[/h]
    [​IMG]
    اگر از آن دسته افراد وسواسی هستید که دوست دارید خودتان همه کاره css تان باشید و یا آنقدر محتاطید که به ابزارهای خودکار اعتماد کامل ندارید، Styleneat ابزاری است که کاملا به درد شما می خورد. در کنار اینکه گزینه فشرده سازی را پیشنهاد نمی دهد، خروجی آن کاملا برای اینکه توسط انسانها خوانده شود آماده می شود. امکان مرتب سازی property ها و selector ها و چیدمان مناسب آنها، استایل شیت شما را به شکلی تبدیل می کند که کاملا از دیدگاه انسان تمیز و خوانا به نظر برسد.


    [h=3]W3C Validator[/h]
    [​IMG]
    هیچ مجموعه ابزار css ای بدون W3C Valdiator کامل نیست. پیش از این در نردبان به عنوان ابزاری برای ارزیابی وب سایت با آن آشنا شده اید. css validator برخلاف سایر ابزارهای گفته شده هیچ امکانی برای ساده سازی، فشرده سازی و بهینه کردن css به شما ارائه نمی دهد، اما کار بسیار مهم تر و حیاتی تری را برعهده دارد. ارزیابی معتبر بودن css. به کمک این ابزار می توانید اعتبار و درستی سی اس اس خود را تست کنید و اشکالات شناسایی شده را برطرف کنید. در بیان دلیل ارزشمندی این ابزار هم به ذکر این نکته که توسط کنسرسیوم W3 ارائه شده است، بسنده می کنیم.