گشتاسب مظفریان – GMozafarian

مشاور و توسعه دهنده نرم افزار -Adviser and Software Developer

بهترین افزونه های فایرفاکس برای طراحی وب
۲

معرفی ۵ تا از بهترین افزونه های فایرفاکس برای توسعه دهندگان وب

معرفی ۵ تا از بهترین افزونه های فایرفاکس برای توسعه دهندگان وب

به نام اهورامزدای پاک

معرفی ۵ تا از بهترین add-ons های فایرفاکس برای توسعه دهندگان وب

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

پ.ن: در این معرفی, فرض را بر این گرفته ام که خوانندگان آن در سطح مبتدی قرار دارند.

۱- Wappalyzer

 برخلاف اون چیزی که تمامی تازه کارها در زمینه طراحی و توسعه وب فکر میکنن کارفرما هرگز (تقریبا توی ۹۸% پروژه ها) به اونا اجازه طراحی و توسعه با سلیقه خودشون رو بهشون نمیده و نمیزاره که تکنولوژی ها رو خودشون انتخاب کنن (حداقل اونایی که من باهاشون کار کردم اینجوری بودن 😥 ) بیشتر کارفرماها قبل از سفارش دادن نمونه سایت ها و اپلیکیشن هایی رو در نظر دارن و در هنگام سفارش شما را مجبور به طراحی و توسعه کل یا قسمتی از سیستم دقیقا مثل اون نمونه های ارائه شده میکنن. حالا شاید پیش خودتون بگید که اینا چه ربطی به این افزونه داره ربطش به اینه که در بین این اجبارها همیشه یه کارفرمای اعصاب خوردکن پیدا میشه که میخواد سیستم دقیقا با همون تکنلوژی نوشته بشه که نمونه ارائه شده توسط خودش نوشته شده. خب اینجا یکم کارتون سخت میشه و دقیقا نمیشه CMS یا …. سیستم رو درست تشخیص داد و برای تشخیصش باید از صد جوز اسکنر مختلف استفاده کنید و …. حالا افزونه Wappalyzer اومده تمامی اون اسکنرها و … رو یکجا تبدیل به یک افزونه اختصاصی کرده که به محز باز شدن یک سایت توی مرورگر تمامی اطلاعات مربوط به تکنولوژی های استفاده شده برای ساختش رو براتون لیست میکنه

 

۲- Web Developer

افزونه توسعه دهنده وب ( Web Developer ) یک افزونه بسیار کاربردی برای اجرای کدهای دلخواه و تغییر و خواندن بخشی از کدهای صفحات وب هست که با شما امکانات بسیار خوبی برای مدیریت درخواست های http و … میده همچنین این افزونه همخوانی بسیار خوبی با Firebug داره.

من شخصا فقط برای پیدا کردن مسیر سلکتور ها ازش استفاده میکنم 🙂

پ.ن: بنظرتون میشه توی ترجمه اسم این افزونه بجای توسعه دهنده وب گفت توسعگر وب؟

۳-FireBug

افزونه حشره آتشین (FireBug) تقریبا مثل inspect خود مرورگر هست با یک سری تفاوت های ریز و کاربردی مثلا دیباگ رو دقیق تر انجام میده و کدها رو موقع خوندن تمیز تر نشون میده 🙂 و البته یکی از کاربردی ترین افزونه های توسعه وب هست که به شما امکان ویرایش زنده صفحه رو میده و میتونید تمامی کد های صفحه رو مدیریت کنید و به صلاح دید خودتون اصلاح کنید.

۴-ColorZilla

افزونه ColorZilla یک افزونه بسیار کاربردی هست اولین افزونه ای که معرفی کردم رو یادتونه؟ (مگه میشه یادتون نباشه 🙂 ) خب همونجور که گفتم کارفرما ازتون میخواد که تمام یا بخش هایی از تارنما رو مثل نمونه ارائه شده طراحی کنید و برای اینکار نیاز دارید رنگبندی صفحات رو مشخص کنید. خب برای اینکار چند روش وجود داره اول اینکه میتونید یه عکس از بخش مورد نظر بگیرید و با استفاده از قطره چکون  😀 فوتوشاپ رنگ اون بخش رو مشخص کنید.  روش دوم هم اینه که با استفاده از web developer یا firebug اون بخش رو انتخاب کنید و توی کد های css اون بخش به دنبال background-color بگردید تا بتونید کد رنگ استفاده شده رو پیدا کنید. راه سوم اینه که به حرف من گوش بدید و از تجربه ما استفاده کنید و colorzilla رو نصب کنید و با چند کلیک ساده کد رنگ هر بخش رو پیدا کنید.

(به تصویر زیر توجه کنید در بالا و سمت راست تصویر پنل colorzilla رو مشاهده میکنید. هرجا که موس قرار بگیره رنگ همون بخش در پنل سیاه رنگ بالایی نمایش داده میشود و میتوانید کد رنگ رو انتخاب کنید و . . .)

۵-Screenshoter Fixes

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

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

ممنون که تحمل کردید و تا آخر مقاله رو مطالعه کردید با نظرها و نقدها و پیشنهاد هاتون راهنمای من باشید ممنون.

معرفی ۵ تا از بهترین افزونه های فایرفاکس برای توسعه دهندگان وب معرفی ۵ تا از بهترین افزونه های فایرفاکس برای توسعه دهندگان وب معرفی ۵ تا از بهترین افزونه های فایرفاکس برای توسعه دهندگان وب معرفی ۵ تا از بهترین افزونه های فایرفاکس برای توسعه دهندگان وب معرفی ۵ تا از بهترین افزونه های فایرفاکس برای توسعه دهندگان وب معرفی ۵ تا از بهترین افزونه های فایرفاکس برای توسعه دهندگان وب معرفی ۵ تا از بهترین افزونه های فایرفاکس برای توسعه دهندگان وب 

پست های مرتبط

لینک کوتاه: http://GMozafarian.ir/XC0qy
افزونهافزونه طراحی وبافزونه های فایرفایرفاکسپروژه طراحی وبتوسعهتوسعه وب اپلیکیشنطراحیطراحی و توسعهطراحی وبفایرفاکسوب

گشتاسب مظفریان گشتاسب مظفریان • اسفند ۲۹, ۱۳۹۵


پست‌های قبلی

پست‌های بعدی

Comments

  1. حسین مرادی اسفند ۲۹, ۱۳۹۵ - ۸:۵۰ ب.ظ Reply

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

  2. مرضیه اسفند ۲۹, ۱۳۹۵ - ۸:۵۱ ب.ظ Reply

    سلام چرا پیام میدم جواب نمیدین ؟؟؟
    کلاس خصوصی هم میزارید ؟؟

پاسخ دهید

Your email address will not be published / Required fields are marked *