کاربر گرامی بمنظور مشاهده سطح عضویت بعد از خرید از کلید F5 برای رفرش صفحه استفاده نمایید.
پریناز محمدی
مطالب آموزشی
۱۳۹۶-۱۱-۲۳
206 بازدید

فایرباگ چگونه به طراحان سایت کمک می کند؟

افزونه فایرباگ برای مرورگر فایرفاکس

امروز از سری مقالات آموزشی وبسایت افزونه فا به بررسی یک ابزار کاربردی و مهم در طراحی وبسایت خواهیم پرداخت.فایرباگ یک ابزار قدرتمند open source برای توسعه دهندگان وب است که اولین بار به صورت یک افزونه برای مروگر فایرفاکس ارائه شد.بوسیله این ابزار قدرتمند قادر به مشاهده و ویرایش و debug کردن کدهای HTML, CSS , JavaScript به صورت آنی در هر صفحه وب خواهیم بود. به وسیله این افزونه انجام کارهای حسی و حدسی بدون مشاهده نتیجه کار (تغییر استایلها و کدها و ریفرش کردن صفحه وب برای دیدن نتیجه و احتمالا ویرایش مجدد استایلها و کدها) که قبل از firebug به شدت مرسوم بود جلوگیری بعمل آمده و این ویژگی باعث بالا رفتن سرعت تست و بررسی مجدد صفحات و در نتیجه کاهش زمان انجام کار در طراحی و توسعه صفحات وب شده است.

فایرباگ دستیار طراحان وب

برای کار با فایرباگ شما نیاز به مرورگر Mozilla Firefox دارید.بعد از دانلود و نصب فایرفاکس از طریق همین مرورگر میتوانید با مراجعه به منوی add-ons و جستوجوی عبارت firebug این افزونه را براحتی نصب نمایید.
در حین مراحل نصب نیاز به انجام هیچ کاری نیست و مرورگر فایرفاکس مراحل نصب را انجام میدهد و درپایان از شما درخواست میکند که مرورگرتان را یکبار بسته و مجدد باز کنید و شما باید این پیغام را بپذیرید.

فعال کردن فایرباگ

با استفاده از کلید F12  میتوانید پنل فایرباگ را باز (فعال و آماده استفاده) کنید یا با استفاده از منو براحتی میتوانید در هر صفحه وب بر روی یک عنصر HTML مانند(Div , Hyperlink , Image , Button , …) راست کلیک کنید و گزینه Inspect Element را از منو نمایش داده شده انتخاب کنید.

 

آیکون فایرباگ

 همچنین میتوانید با کلیک برروی آیکون firebug پنل فایرباگ را فعال کنید . مکان آیکون firebug بستگی به نسخه فایرفاکس شما دارد. ممکن است در پائین صفحه باشد یا همانند مرورگر Google Chrome (اگر این افزونه را در Chrome نصب کرده باشید) در بالای صفحه در کنار نوار جستجو باشد.

کارکردن با فایرباگ در پنجره جداگانه و اختصاصی

وقتی که یکبار پنل firebug را فعال کردید میتوانید این پنل را به صورت یک پنجره جداگانه در اختیار داشته باشید در حالت پیش فرض پنل فایرباگ در پائین همان صفحه وب جاری فعال می شود.

بررسی عناصر HTML یک صفحه وب

یک سوال که همیشه (تا قبل از پیدایش firebug) برای طراحان سایت مطرح بوده این است که، مشکل از کجاست؟فایرباگ کوتاهترین و راحتترین پاسخ به این سوال است. وقتی شما پنل firebug را باز می کنید از قسمت HTML Panel که به صورت پیش فرض نمایش داده می شود، می توانید تمام عناصر html موجود در صفحه را در این قسمت مشاهده کنید. فرض میکنیم شما برروی یک div گزینه Inspect Element را زدید (از طریق راست کلیک) در قسمت بالای پنل html تمام عناصر قبل از آن div تا عنصر body و head را به شما در یک نوار نشان میدهد، بدین ترتیب شما براحتی میتوانید در divهای تودرتو کاوش کنید و عنصر مورد نظرتان پیدا کرده و بررسی کنید.

برای سفارشی سازی وبسایت خود یا انجام تنظیمات حرفه ای کارشناسان افزونه فا آماده ارائه خدمات به شما وبمستران عزیز می باشند. بمنظور بهره مندی از مشاوره رایگان یا ثبت سفارش می توانید از منوی تماس با ما اقدام نمایید.

افزونه فا یک سایت فروش ابزار وب است که محصولاتی همچون قالب های آماده ، افزونه های اورجینال ، پلاگین های پرداخت ، پلاگین های پیامکی ، آموزش طراحی وب ، برنامه نویسی ، طراحی اختصاصی قالب برای جوملا و وردپرس و هر ابزار یا آموزش دیگری که برای طراحان وب مفید باشد را بصورت اختصاصی تولید یا خریداری کرده و با زبان فارسی و انگلیسی با قیمت ویژه و شرایط و خدمات استثنایی در اختیارتان قرار می دهد. تیم مدیریت افزونه فا امیدوار است با تغییراتی در روند فروش ابزار وب، تغییر سیاست سایت و تغییر شکل ظاهری سایت رضایت شما مشتریان را جلب کند.

اعتماد حق طبیعی شماست !