10 برنامه افزودنی و ابزار برتر Chrome برای طراحان وب

اگر به برخی از کاربری های مفید برای سرعت بخشیدن ، همکاری و یا ممیزی پروژه های توسعه وب خود نیاز دارید ، Chromeextension دارای ابزارهای زیادی است.

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

1. DomFlags

DOM Flags استفاده ساده از برنامه افزودنی Chrome روش جدیدی را برای توسعه دهندگان برای کار با ابزارهای مرورگر فراهم می کند. این برنامه به توسعه دهندگان اجازه می دهد تا کار عناصر یک ظاهر طراحی شده را سرعت بخشند.

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

همه ما مشکل در انتخاب عناصر کاملاً دقیق را تجربه کرده ایم و گم شدن آن آسان است.

DOM Flags به شما امکان می دهد عناصر یک ظاهر طراحی شده را ردیابی کنید ، یک ویژگی را در خود دارد تا قطعات را با دقت به طور خودکار بررسی کنید. این ، inturn ، به سرعت بخشیدن به گردش کار و اجرای DevTools کمک خواهد کرد.

DOM Flags شما را قادر می سازد تغییرات را ردیابی کنید. تمرکز خود را بر روی عناصری که با آنها کار می کنید ، حفظ کنید.

2. Sizzy

Sizzy به طراحان و توسعه دهندگان یک راه ساده برای آزمایش سایت های خود در چندین بازدید از مکان.

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

با نصب یک پسوند Chrome ، دکمه ای به نوار ابزار شما اضافه می شود که با کلیک بر روی آن ، URL فعلی را در پلت فرم Sizzy باز کنید. این برنامه افزودنی همه عناوین "گزینه های x-frame " را مسدود می کند ، بنابراین می توانید به هر وب سایتی به صورت آنلاین نگاهی بیندازید.

Sizzy یک پروژه منبع باز است و می توانید کل را مشاهده کنید کد اینجا.

3. Checkbot

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

با استفاده از بیش از 50 معیار بهترین روش ، یک وب سایت را برای انجام بهترین سئو ، پیوندهای خراب ، کپی کردن مطالب و موارد دیگر. این ابزار همچنین اعتبار CSS ، JS و HTML را تأیید می کند.

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

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

برای طراحان ، می تواند به شما در کمینه کردن CCSS و JS کمک کند. و همچنین توصیه هایی راجع به به حداقل رساندن حافظه نهان CSS و مرورگر خود ارائه دهید.

4. GistBox Clipper

GistBox یکی از مفیدترین Chromeextensions برای طراحان وب است.

GistBox می تواند GitHub Gist را از هر بلوک کد در صفحه وب مشاهده شده ایجاد کند.

در گوشه سمت راست بالای هر کدبانک ، یک دکمه کوچک را مشاهده می کنید ، که در صورت فشار دادن ، به شما امکان می دهد تا کد پاپ آپ را برای شما ذخیره کند تا کد را در Gist ذخیره کند.

شما می توانید Gists جدید را با یک موس موس مناسب ایجاد کرده و بلوک های کد را برای بازرسی و استفاده بعدی ذخیره می کنید.

ادغام با GitHub به طراحان و توسعه دهندگان امکان می دهد تا بلوک های کد را جمع آوری کرده و آنها را دستکاری کرده یا آنها را دسته بندی کنند. این امر آن را به ابزاری مناسب و کارآمد برای پسوند Chrome تبدیل می کند.

5. ColorZilla

ColorZilla فوق العاده است Chromeextension مفید برای جمع آوری کدهای hex که می توانند برچسب گذاری شوند ، برچسب گذاری شوند و برای پروژه های طراحی وب جداگانه طبقه بندی شوند.

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

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

6. WhatFont

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

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

نه تنها با این کار بلکه برنامه افزودنی نیز خدمتی را که برای سرویس دهی به کار می رود شناسایی می کند. صفحات به قلم می روند و از Google Font API و typekit.

7 پشتیبانی می کنند. LightShot

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

عکسهای گرفته شده توسط LightShot را می توان در رسانه های اجتماعی استفاده کرد و به اشتراک گذاشت.

می توانید متن ، فلش و قسمت دیگری از صفحه را حاشیه نویسی و اضافه کنید. اما شاید یکی از برجسته ترین ویژگی های این ابزار ساده برای طراحان وب این باشد که با انتخاب یک imagey می توانید یک جستجوی کامل Google را برای جستجوی تصاویر مشابه در خط مشابه انجام دهید.

LightShot می تواند در چند زبانه تنظیم شود.

برنامه افزودنی به زبان JavaScript خالص نوشته شده است و همچنین برای Windows ، Chromebook ، Linux و Mac OS کار خواهد کرد. همچنین می تواند به عنوان برنامه دسک تاپ قابل دسترسی باشد و این یک انتخاب عالی برای طراحان وب است که به چندین دستگاه وابسته هستند. عکس بسیار جذاب

مانند Lightshot ، تصویر جالب بسیار عالی است که یک تصویر پس زمینه ضبط تصویر است.

اما با وجود روش های مختلف ، با Lightshot متفاوت است. پیکربندی عالی می تواند پیکربندی شود تا تمام عکسهای شما را با درایو Google شما متصل کند.

این امکان را به شما می دهد تا صفحه هایی را که از نظر شما غیرقابل مشاهده هستند به منظور ضبط کل صفحه به تصویر بکشید. این ویرایش ها و ابزارهای حاشیه نویسی تدریجی حین امکان ویرایش و تصویربرداری همه در پسوند امکان پذیر است .. یا با استفاده از برنامه های اضافی AwesomeScreenshot

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

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

9. Clear Cache

Clear Cache Chrome Extension ابزاری سریع و ساده است که به شما امکان می دهد کوکی ها و حافظه نهان صفحه ای را که مشاهده می کنید پاک کنید. به منظور پاک کردن چند عنصر صفحه ساده ، نیاز به پیمایش به صفحه تنظیمات مرورگر شما را حذف می کند.

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

گاهی اوقات شما نیاز دارید تا کوکی های حافظه پنهان خود را پاک کنید ، اما پیمایش به تنظیمات Chrome خسته کننده است. Clear Cache به شما امکان می دهد حافظه پنهان خود و همچنین کوکی های جهانی یا محلی را با کلیک یک دکمه از بین ببرید.

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

10. توسعه دهنده وب Google ChromeExtension

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

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

Theextension نوار ابزار را با چندین ابزار توسعه دهنده وب نصب می کند.

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

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

می توانید ویژگی های اصلی ابزار و همچنین قابلیت های کامل آن را در توسعه دهنده مرور کنید. وب سایت کریس پدریکس.

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

Dragnet: Big Cab / Big Slip / Big Try / Big Little Mother

Related posts:


27.03.2019