اکستنشن های گوگل کروم برای طراحان و برنامه نویسان وب سایت اکستنشن های گوگل کروم برای طراحان و برنامه نویسان وب سایت

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

شما می توانید افزونه های کوروم را با فشار دادن نماد منو در گوشه سمت راست بالای مرورگر مدیریت کنید. گزینه ابزارهای بیشتر را انتخاب کرده و گزینه "extention" را انتخاب کنید.

پس از نصب افزونه در کروم ، معمولا یک آیکون کوچک برای آنها در کنار فیلد url ظاهر می شود. در این مقاله با برخی از افزونه های گوگل کوروم آشنا می شوید.

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

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

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

با توجه به نیازهای شما و انتخاب افزونه ها، می توانید به راحتی یک محیط کار شخصی ایجاد کنید که به میزان قابل توجهی می تواند کار شما را بهبود ببخشد.

چند برنامه گوگل کروم که برای شما انتخاب کرده ایم ، به دسته بندی های زیر طبقه بندی می شوند:

افزونه های مفید گوگل کروم

نمایش زمین از google earth

این افزونه یک تصویر ماهواره ای جذاب را از  google earth  هر بار که برگه جدیدی باز می کنید، می گیرد. شما می توانید عکس ها را به عنوان تصویر زمینه ذخیره کنید و یا آنها را در گوگل مپ مشاهده کنید و یا آن را در رسانه های اجتماعی به اشتراک بگذارید.

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

MagiCSS

یک افزونه ویرایشگر CSS است که دارای یک ویرایشگر داخلی است، که می تواند کدهای CSS  را زیباتر کند.

CSS Dig

CSS DIG گروه ها، سبک ها و بلوک سبک ها را در اکثروب سایت ها پیدا می کند. این کار راه حل آسان برای تجزیه و تحلیل کد و برنامه ریزی مجدد در وب سایت ها است.

CSSViewer

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

CSS-Shack

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

CSS3 generator

همانطور که از نام آن پیدا است، تمام کد های مورد نیاز css  را تولید می کند.

CSS Shapes Editor

 یک اکستنشن برای ویرایش مقادیر css shape  است.

اکستنشن های ویرایشگر

WordPress Style Editor

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

PageEdit

این ابزار گوگل کروم را به WYSIWYG  ویرایشگر html  تغییر خواهد داد که به شما این امکان را می دهد تا صفحات خود را ویرایش کنید.

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

Perfmap

این ابزار یک برنامه افزودنی است که یک نقشه عملکردی از دامنه شما را تعیین می کند و زمان بندی منابع موجود در مرورگر را با استفاده از این API  بارگزاری می کند.

اعتبار (validity)

این یک افزونه است که به شما اجازه می دهد تا هر صفحه وب که خواستید را تائید کنید.

Visual Inspector

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

فهرست برنامه نویسان وب

این افزونه یک اکستنشن است که هر صفحه را برای خطاها و اشتباهات چک می کند.

Bootlint This Page

این افزونه یک دکمه bootline  به هر صفحه اضافه خواهد کرد که هر صفحه را برای خطاهای رایج بررسی می کند. خطاها در پنجره کنسول نشان داده شده می شود.

پلاگین های اندازه گیری

ابعاد

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

افزونه های رنگ بندی

Color zilla

این افزونه در اصل برای فایرفاکس طراحی شده است. این پلاگین بسیاری از ابزارهای رنگی مانند eyedropper ، جمع کننده رنگ و پالت بیننده را اضافه می کند.

تستر طراحی وب سایت ریسپانسیو

تستر طراحی سایت ریسپانسیو یک ابزار است که به شما اجازه می دهد تا وب سایت خود را بر روی هر دستگاهی تست کنید.

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

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

هرکدام از این افزونه ها بدون هیچ گونه سفارش خاصی در Google Webstore یافت می شود. با کلیک بر روی آن می توانید آن را بر روی مرورگر گوگل کروم خود نصب کنید. هنگامی که یک افزونه که آن را دوست دارید پیدا می کنید، فقط با یک کلیک بر روی آن می توانید به آسانی آن را نصب کنید. پس از نصب، افزونه به عنوان یک آیکون کوچک در مرورگر کروم ظاهر خواهد شد.

Loom

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

Lorem Ipsum Generator

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

Stylebot

 یک ابزار دستی برای طراحان وب، به ویژه کسانی که فقط با استفاده از اسکریپت شروع به کار می کنند، این ابزار به کاربران اجازه می دهند تا عناصر css موجود در وب سایت خود را مشاهده و دستکاری کنند. همچنین به کاربرانی که می خواهند از Css  استفاده کنند بسیار کمک می کند.

Viewport Dimensions

ابزاری دیگر که برای اسکریپت های  css مناسب هستند. Viewport Dimensions یک افزونه ظریف و مفید است که ابعاد مرورگر را در پائین پنجره مرورگر نشان می دهد.

هنگام تعویض پنجره مرورگر ، Viewport به طور اتوماتیک ابعاد اندازه صفحه نمایش را نشان می دهد.

Clear Cache

یکی از مهمترین افزونه ها، clear cash است که به کاربران اجازه می دهد در کمتر از چند ثانیه حافظه پنهان مرورگر خود را پاک کنند. زمانی که میلیون ها گام را می روید و حافظه پنهان پر از اطلاعات می شود برای توسعه دهی و حذف داده های قدیمی از حافظه پنهان، از این افزونه استفاده می کنیم.

LastPass

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

Awesome Screenshot

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

Marmoset

این ابزار یک ابزار کمی سرگرم کننده برای ایجاد تصاویر 3d از شما است. هنگامی که یک تصویر را شبیه سازی می کنید.  هنگامی که یک تصویر را شبیه سازی می کنید، چرخش در مقیاس 3d باعث می شود که آن جالب تر از زمان عادی باشد. این ابزار همچنین در زمان استفاده از تصاویر مبتنی بر کد نیز مفید هستند.

Wappalyzer

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

IE Tab

در فوریه سال 2018 ، بیش از 13 درصد از کاربران دسکتاپ هنوز هم از اینترنت اکسپلورر استفاده می کنند. و این بسیار خجالت آور است زیرا اینترنت اکسپلورر با بسیاری از استانداردهای مدرن امروزی متناقض است. به همین دلیل است که شما نیاز به این ابزار دارید. IE TAB در واقع یک شبیه ساز IE  است که  IE  را در یک تب جدید شبیه سازی می کند و به شما اجازه می دهد تا وب سایت خود را در نسخه های مختلف مانند IE6، IE7، IE8، IE9 شبیه سازی کنید. این بسیار مهم است که شما بتوانید وب سایت خود را با تمام نسخه ها و مرورگر ها سازگار کنید، صرف نظر از این که وب سایتتان چقدر عمر دارد.

Click&Clean

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

WhatFont

این ابزار سریعترین راه برای شناسایی فونت ها در وب سایت است. بر روی عناصر راست کلیک کرده سپس گزینه inspect element  را انتخاب می کنید، سپس آنچه می خواهید را پیدا می کنید. به وسیله این ابزار نه تنها می توانید ببینید که چه فونتی استفاده می کنید بلکه می توانید کاربرد آن را هم ببینید.

ColorPick Eyedropper

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

Lorem Ipsum Generator

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

Check My Links

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

گوگل در سال 2008 معرفی شد در سال 2013 37 درصد از مرور کل کاربران توسط این مرورگر انجام می شود. اکستنشن های بسیاری برای کروم وجود دارد. برخی از این اکستنشن ها برای برنامه نویسان و طراحان وبایجاد گردیده و کمک بسیار زیادی به آنان می نماید. در زیر برخی از آنها را که با انها آشنا شده ام برای شما لیست می نمایم.

اکستنشن های مورد نیاز طراحان و برنامه نویسان وب