۴۰ افزونه گوگل کروم برای طراحان وب

به گزارش گروه وبگردی « سراج24 » ColorPicker همینجور که اسمش میگه افزونه‌ایست برای به دست آوردن کد هگز یه رنگ خاص از روی یک صفحه وب. قابلیت جالب دیگه‌ای که داره اینه که یک محدوده رو انتخاب میکنید، و رنگ اون رو با این افزونه تغییر میدین، بدون اینکه حتی به یک خط کد دست بزنید.

Chrome Pallete از شدت خسته کننده بودن پیدا کردن طرح رنگ(Color Scheme) یک عکس سردرد میگیرید؟ پس افزونه‌ی کروم پالت مخصوص شماست، از هر عکس ۶۴ پالت مختلف ایجاد میکنه

Colour Tweaker همون کار Color Picker رو انجام میده اما با یک متد خاص. در فیلد سلکتور(Selector) ، سلکتور مربوطه در بخش CSS قسمتی رو که میخواین رو وارد کنید و بعد به راحتی رنگ متن، زمینه، و حاشیه اون رو تغییر بدین

 
تایپوگرافی

Font Editor دیگه حدس زدن و یک عالمه از این پنجره به اون پنجره رفتن برای مشاهده تغییرات اعمال شده لازم نیست. این افزونه به شما اجازه میده تغییرات واریانت، ارتفاع، نوع و خانواده، ارتفاع خطوط و …. رو به سادگی اعمال کنید و همان لحظه مشاهده کنید
Google Font Previewer همان‌طور که از اسمش پیداست امکان پیش‌نمایش فونت‌ها رو از فولدر فونت‌های گوگل رو در اختیار شما میگذاره. همچنین میتونید استایل فونت‌ها رو هم تغییر بدین. این تغییرات شامل size,style,weight و shadow میشه. اگه از فونت خاصی خوشتون اومد میتونید میتونید کد CSS اون فونت رو که این افزونه در اختیارتون قرار میده رو در وبسایتتون کپی کنید تا از این فونت استفاده کنید.

 

 
طراحی و توسعه

Web Developer مطمئنا افزونه‌ایست که داشتنش برای هر طراح وب لازم و واجبه. از دیدن اسکریپت‌ها گرفته تا نمایش اطلاعات هر شیئ. این افزونه سعی میکنه هرنوع اطلاعاتی رو که از یک وب‌سایت خاص لازم دارید رو در اختیارتون بگذاره. این افزونه همچنین مجهز به ابزارهای مفیدی مثل color picker, windows resizer, validaor,…. شده.

Pendule یک ابزار سبک مشابه Web Developer اما فقط مجهز به ابزار خاص مثل Style Viewer, Source Viewer و Validator

Firebug Lite با کاری که در فایرفاکس انجام میده متفاوته. یک نوع نمایش ویژوال فایرفاکس-مانند رو در اختیار شما قرار میده. همچنین قابلیت ردیابی المان‌های HTML با موس رو هم دارد. همچنین میتونید به صورت زنده کد CSS مربوط به هر المان رو تغییر بدین و تغییرات رو همون لحظه مشاهده کنید

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

CSSViewer از زدن دکمه‌ی ‘inspect element’ هر دفعه که میخواین کد CSS یک بخش رو ببینید خسته شدین؟ این افزونه کار شما رو با نمایش اطلاعاتی مثل فونت، رنگ، مکان و … راحت میکنه

Stylesheet Reloader بدون refresh کردن کل وبسایت CSS جدید رو به اون اعمال کنید که در زمان به شدت صرفه‌جویی میکنه مخصوصا برای طراحانی با سرعت اینترنت پایین

BuiltWith Technology Profiler باحال‌ترین قسمت این افزونه اینه که هر نوع تکنولوجی وب به کار رفته رو مثل فریم‌ورک‌ها و استانداردهای وب رو با اطلاعات کامل در مورد جزئیات رو لیست میکنه

IE Tab Multi این افزونه در واقع اینتزنت اکسپلورر شما داخل کروم هست که مقدار زیادی از قابلیت‌های پیش‌فرض اینترنت اکسپلورر رو پشتیبانی میکنه

Window Resizer با این افزونه میتونید سازگاری وضوح(Resolution) صفحه وبسایتتون رو با وضوح استاندارد یا تعریف شده توسط خودتون تست کنید

HTML Validator یکی از بهترین افزونه‌ها در نوع خودش که میتونه به اعتبارسنجی کدهای HTML انلاین یا افلاین(روی localhost) به صورت دستی یا اتوماتیک بپردازه. میتونید نتیجه اعتبارسنجی رو در یک تب جدید یا در همان تب ببینید.

Sight با گزینه‌های فونت و تم متعدد. این افزونه متن کد وبسابت رو به یک حالت راحت‌تر برای خواندن تبدیل میکنه
PHP Console با باگ‌های PHP روبرو شدین اما نمیدونید کدوم قسمت باعث ایجاد مشکل شده؟ این افزونه با نشان دادن خطاها، استثتاهای رخ داده و پیغام‌های خطایابی شما رو یاری میکنه

JavaScript API Search با داشتن قابلیت AutoComplete امکان جست و جوی توابع و APIهای جاوااسکریپت رو از طریق نوار آدرس به صورت آنلاین در اختیار شما میگذاره. اگر هم مورد جست‌و‌جوی شما پیدا نشد به کمک سرویس‌های Google Codesearch, Development and Coding Search و the Mozilla Developer Network search موارد مرتبط رو نمایش میده
jQuery API Search امکان جست‌وجوی API های jQuery رو از نوار آدرس رو در اختیار شما قرار میده. فقط کافیه در نوار آدرس jq رو با یک فاصله بعد از اون وارد کنید و جست‌وجوی خودتون رو انجام بدین
PHP Search مانند افزونه‌ی قبلی اما برای PHP

 

 
افزایش کارایی

Stay Focused به خودتون قول دادین از وب‌سایت‌هایی که زمان شما رو به هدر میدن دوری کنید اما نتونستین؟ این افزونه به مدت زمان مشخص شده توسط شما این وبسایت‌ها رو بلاک میکنه. و هنگامی که میخواین این افزونه رو غیرفعال کنید یا زمان بلاک بودن وبسایت‌ها رو کاهش بدین به شدت به شما هشدار میده. همچنین مجهز به قابلیت هسته‌ای! هست که به طور جالبی میل شما برای دستیابی به این وبسایت‌ها رو به شیوه‌ی بی‌رحمانه‌ای از بین میبره

Speed Dial قابلیتی مثل مرورگر اپرا که در صفحه‌ی تب جدید بوک‌مارک‌های مورد علاقه رو نشون میده. همچنین میتونید پس زمینه و تم رو هم تغییر بدین

PopChrom به کمک این افزونه میتونید کلید میانبر برای عبارات و متن‌هایی که زیاد مورد استفاده قرار میگیرن تعریف کنید مثل ٬مت برای ٬متشکرم٬ که با زدن کلید فعال‌سازی متن میانبر رو به متن موردنظر تبدیل میکنه

Quickrr Productivity Kit شامل یکسری از ابزار مفید مثل مترجم،ماشین حساب، لیست کارها و …. هست

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

Ananke Timer مدت زمانی رو که روی یک کار خاص یا یک صفحه یا یک وب‌سایت صرف کردین رو اندازه بگیرین

Chrome Toolbox قابلیت‌های جدیدی رو به کروم اضافه میکنه مثل تغییر رفتار مرورگر در موقعیت خاص و تعریف میانبرها
Chrome Page Extended ایجاد میانبر برای دسترسی سریع به صفحات کروم مثل افزونه‌ها

AppJump میتونید با این افزونه برنامه‌های کروم رو از طریق تولبار مرتب و اجرا کنید

Bookmark Bar Switcher با این افزونه میتونید نوار بوکمارک‌های متفاوتی تعربف کنید و به سادگی بین اون‌ها سوییچ کنید
TabCloud تب‌های باز خودتون رو در هر جلسه ذخیره کنید تا در دفعات بعدی باز کردن کروم به سادگی اون‌ها رو بازیابی کنید

 

 
منابع

Similar Pages این افزونه که توسط گوگل درست شده صفحاتی که داراری مطالب مشابه با مطلبی که در حال خواندن اون هستین رو نمایش میده

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

Awesome Screenshot میتونید از هر قسمت صفحه که نیاز دارید عکس تهییه کنید و نواحی مورد نظر رو با دایره، مربع، متن و … مشخص کنید سپس عکستون رو با فرمت PNG روی کامپیوتر یا وب ذخیره کنید

Clip to Evernote افزونه‌ی رسمی Evernote، با قابلیت همگام‌سازی تمام متون شما و همچنین جست‌وجو در میان آن‌ها
Diigo با این افزونه هر قسمت از متن یک صفحه رو که مایلید هایلایت کنید و همچنین میتونید اون رو با دیگران به اشتراک بگذارید. تا هربار که به صفحه برگشتین موارد هایلایت شده رو ببینید

Thinkery یه جورایی ذهن آنلاین شماست. متن‌ها و لینک‌هاتون رو توش ذخیره کنید تا بعدا به اون‌ها رسیدگی کنید

MyNotes نت برداری باید یک پروسه‌ی آسان باشه. با این افزونه هست! هر متنی رو که انتخاب کردین از منوی قابل دسترسی در راست کلیک، اون رو به افزونه برای ذخیره سازی بفرستین

Add to Google Bookmarks وب‌سایت جالبی رو دیدین که زمان کافی برای مطالعه‌اش رو ندارید؟ کافیه روش راست‌کلیک کنید تا به بوک‌مارک‌های گوگل اضافه کنید تا بعدا ازون لذت ببرید

Microstock Photo Power Search افزونه‌ای برای جست‌وجوی وبسایت‌های عکس مثل Fotolia, Dreamstime and Shutterstock

منبع: دروپالیون