Розширення для web developer tools. Розширення Google Chrome для веб-розробників. Web developer розширення
Google Chrome- це найшвидший і популярний браузер в світі від розробників Google. Головним плюсом є, звичайно легкий інтерфейс і швидкість. Він не тільки швидко обробляє веб-сторінки, але і запускається швидше ніж інші браузери. У Chrome з'явилася безліч розширень для дизайнерів і розробників.
У цій статті ми зібрали список найкращих і корисних розширень Google Chrome для веб-дизайнерів і розробників.
1.
Розширення Chrome, яке додає бічну панель до вихідного коду, яка відображає інформацію про градієнтах, що застосовуються до перевіряється елементу. Ви також можете перемикати кожен градієнт індивідуально, так як вони представляють собою різні верстви.
2.
Emmet LiveStyle - це плагін для живого двонаправленого (редактор ↔ браузера) редагування CSS коду. В даний час він працює в Google Chrome, Safari і Sublime Text, інші браузери будуть доповнюватися розробниками. За допомогою цієї розширенні ви можете пов'язати два абсолютно різних джерела CSS для живого редагування.
3.
Розширення Dimensions Toolkit пропонує корисні інструменти для тестування ваших адаптованих веб-проектів, з точками відстеження і за замовчуванням, змінюваними за розміром розмірами і т. Д. Він доступний як розширення Chrome, так і веб-додаток.
4.
Якщо ви працюєте з Batman.js, це розширення Batman.js Devtools Chrome є безцінним для вас інструментом. Він включає в себе безліч інструментів, корисних для розробки з Batman.js прямо в браузері.
5. Clockwork
Якщо ви розробник PHP і використовуєте Chrome, ознайомтеся з розширенням Clockwork Chrome. Він надає нову панель з усіма корисними даними налагодження і профілювання, включаючи інформацію про даних GETі POST, куки, запит, заголовки, дані сеансу і багато іншого.
Google Chrome - швидкий і популярний браузер серед користувачів Інтернету, він швидко запускається з вашого робочого столу, швидко завантажує веб-сторінки і швидко запускає складні веб-додатки. Вікно браузера Chrome обтічно, чисто і просто. У Chrome з'явилася безліч розширень, що підтримують веб-розробники, для Chrome, але розробники все частіше пропонують Chrome спробувати, а деякі з них не озираються назад.
У цьому огляді ми зібрали деякі з кращих і корисних розширень хром для розробників і дизайнерів, які спростять завдання розробки легко і без особливих проблем. Таким чином, без особливої уваги ado дозволяє перевірити наступні хромовані расшир
Є купа безкоштовних розширень Chrome для спрощення вашому житті - ми вибрали найкращі.
Chrome DevTools- це здорово, але можливо додати ще більше цікавих можливостей в ваш браузер, щоб зробити веб-дизайн і розробку значно простіше. Ми представляємо 32 з наших улюблених розширень Chrome.
Радикально прискорити процеси стилізації елементів з DomFlags - дійсно грандіозним розширенням, яке дозволяє створювати поєднання клавіш для елементів DOM! Це як закладки для навігації по DOM і це змінить спосіб роботи з DevTools.
Ось цікавий спосіб привернути людей до обговорення: Highly Highlighter дозволяє обмінюватися фрагментами з статей в інтернеті, так що ви можете звернути увагу на найбільш значущі частини написаного.
Booom робить Dribbble краще, показуючи більше кадрів в списках, додавши до них кнопки Like і Add to Bucket, а також створюючи автозапуск GIF-файлів і роблячи прокрутку нескінченною.
Це потужне розширення для Chrome, що дозволяє створювати дизайн, а потім експортувати його в файл CSS для використання на вашому сайті. Воно підтримує шари і містить в собі безліч інструментів, які ви звикли використовувати в своєму звичайному фото-редакторі.
Це блискуче розширення візьме ваш код і виведе знімки для демо і макетів. Ви також можете додати теми і ефекти для створення зображень для ваших промо та онлайн-портфоліо.
Як веб-розробнику, вам необхідно тестувати ваші веб-сторінки. Повторювати одні й ті ж дії знову і знову може стати утомливих процесом. iМacros - це зручне розширення для Chrome, яке дозволяє записувати дії і зберігати їх, так що вам потрібно буде зробити певну дію всього один раз. Після цього ви можете тестувати ваші сторінки знову і знову, повторюючи дії одним натисненням кнопки, заощаджуючи дорогоцінний час і дозволяючи собі зосередитися на більш нагальних питаннях.
Кожен дизайнер і розробник знайде це розширення безцінним. Font Playground дозволяє експериментувати з локальними шрифтами і всієї бібліотекою шрифтів Google на веб-сторінці, не роблячи будь-яких фактичних змін. Краса цього розширення полягає в тому, що воно включає в себе всі різні накреслення шрифтів, стилі і текстові ефекти, так що ви можете переглядати веб-сторінку перед тим, як впроваджувати зміни.
Це розширення Chrome є дуже корисним інструментом, який робить саме те, що говорить його назва - змінює розмір вікна браузера, щоб допомогти вам у створенні адаптивного дизайну сайту. Вибирайте зі списку популярних розмірів монітора або додавайте самостійно призначені для користувача розміри і дозволу для збільшення точності.
Якщо вам коли-небудь доведеться працювати над макетом зображення з вбудованим текстом, це розширення може врятувати вас від невеликого роздратування. проект Лігроїн може врятувати вас в світ легкого роздратування. Завдяки вправним трюкам OCR, розширення дозволяє виділяти, копіювати і вставляти текст з будь-якого зображення і навіть може перевести його для вас.
Дуже корисне розширення для Google Chrome, що дозволяє розробникам і дизайнерам ідентифікувати шрифти, використовувані на веб-сторінці. Тому, якщо ви натрапили на незвично виглядає веб-шрифт, який хочете використовувати в одному зі своїх майбутніх проектів, просто наведіть на нього курсор і з'ясуйте, миттєво, який це шрифт.
Цей інструмент не тільки перевіряє, як швидко ваші веб-сторінки завантажуються, він також говорить вам, в разі чого, уповільнює їх. Yslow перевіряє вашу веб-сторінку по 23 з 34 правил, визначених командою продуктивності компанії Yahoo. Це надзвичайно корисний інструмент для аналізу веб-сторінок, а також пропозиції способів підвищення їх ефективності.
Як веб-розробник, ви можете запитати себе, як ви жили без цього розширення. Він додає кнопку на панелі інструментів Chrome з безліччю корисних інструментів для веб-розробника. Це офіційний порт розширення Web Developer для Firefox.
Page Ruler - це відмінний інструмент для точного вимірювання елементів на будь-який веб-сторінці і їх подальшій обробці відповідно до ваших вимог. Намалюйте лінійку, щоб отримати розміри в пікселях і розташування.
Цей інструмент дозволить вам перевірити, якщо ваші веб-сторінки слідують кращій практиці, коли справа доходить до SEO, юзабіліті, доступності та продуктивності (швидкість завантаження). Так, наприклад, якщо у вас відсутній тег H1 на сторінці або вона без мета-тегів, то розширення повідомляє вас про це, так що ви зможете швидко усунути цю проблему. Якщо ви клацніть на посилання «докладніше і допомогу» в нижній частині розширення, то знайдете більш поглиблений список.
Справжня перлина для всіх веб-розробників, DevTools Autosave дозволяє автоматично зберігати будь-які зміни, зроблені на веб-сторінці, в CSS і JS через Chrome DevTools. Розширення легке в налаштуванні і використанні, а також заощадить вам багато часу.
Перетворити будь-яку веб-сторінку в вайрфрейм за допомогою всього одного кліка. Це розширення для Google Chrome допомагає веб-розробникам і дизайнерам переглядати веб-сторінки, будь то локальні або в Інтернеті, з накладенням вайрфрейма.
Розширення ColorZilla - це вдосконалена піпетка, збирач кольору, генератор градієнта і інші корисні колірні інструменти, які допоможуть вам у вашому дизайні - прямо у вікні вашого браузера.
Це мультиплатформенний емулятор мобільного середовища, який може допомогти вам перевірити ваші веб-додатки, використовуючи різні пристрої і дозволу екрану. Ripple Emulator може використовуватися в поєднанні з існуючими засобамирозробки для виконання налагодження, перевірки DOM і автоматизованого тестування.
Якщо ви веб-розробник, то, напевно, чули про Stack Overflow - місце для вирішення будь-яких проблем і питань, пов'язаних з розробкою. Якщо немає, то вам обов'язково потрібно його перевірити, співтовариство процвітає і охоплює широкий спектр тем від C # і Java до PHP і jQuery. Це фантастичне розширення додає вікно пошуку прямо в ваш браузер, дозволяючи шукати серед величезних ресурсів Stack Overflow.
Це може бути досить важким пам'ятати кожну функцію, тому, якщо ви бували в ситуаціях, коли доводилося витрачати години на пошук певної функції PHP в Google, то це розширення обов'язково приверне вашу увагу. PHP Ninja Manual надає вам всю документацію PHP-5.5 з прикладами на восьми мовах, не виходячи з вашого браузера.
Дизайнери ненавидять, коли вони створюють приголомшливий дизайн, який в результаті не збігається з результатом кодування. PerfectPixel насправді є ідеальним розширенням для веб-розробників, які прагнуть розробляти сайти, які є точними образами дизайну. Це просте у використанні розширення дозволяє накласти напівпрозоре зображення поверх веб-сторінки і виконати порівняння пікселів, щоб гарантувати 100% точність.
Цей інструмент дозволить вам не тільки переглядати вихідний код, з яким ви вже працюєте, але він також функціонує як CSS редактор, де ви можете редагувати свої веб-сторінки і бачити зміни миттєво.
Відмінний інструмент, щоб переглядати, як виглядає сайт, використовуючи різні користувальницькі кошти, такі як iPad, iPhone або Android. Це може виявитися дуже корисним, якщо сайт був зламаний, і так ви можете переглядати те, як пошукові системибачать сторінки.
Один з найпопулярніших і корисних емуляторів IE. Він дозволяє веб-розробникам тестувати веб-сторінки в різних версіях IE безпосередньо в браузері Chrome.
Це простий у використанні, безкоштовний онлайн-фоторедактор, який дозволяє редагувати веб-сторінки, зображення та скріншоти. Але це не те, що робить його хорошим. PicMonkey дозволяє захопити будь-який образ і робити скріншот всієї сторінки одним натисканням кнопки. Після того, як ви оберете зображення, ви можете відредагувати його, як ви хочете, застосовуючи ефекти для зміни експозиції.
Дефіцит колірного зору або дальтонізм зачіпає мільйони людей по всьому світу. Це геніальне розширення використовує техніка, яка дозволяє створювати образи, які підходять для перегляду людям з даним порушенням.
Розширення допоможе веб-розробнику в перевірці бібліотек фреймворків, CMS та JavaScript на сайті, в той момент, коли ви його переглядаєте. В адресному рядку, з'явиться іконка, яка вказує виявлену бібліотеку. Це розширення Chrome має високий рейтинг і може виявити більше 100 популярних CMS і JS бібліотек.
Закінчили сайт, але забули перевірити всі посилання? Незалежно від того, наскільки ретельно ви стежили за цим, можливо, що ви упустили одну або дві, і переглянути їх усі буде досить клопітно. З цим розширенням, ви можете просто залишити сайт в роботі, і воно буде читати всі посилання на кожній сторінці, виділяючи доступні зеленим кольором і биті - червоним.
Це просто невелике розширення, яке відображає популярні фотографії з Fickr кожен раз, коли ви відкриваєте вікно. Натисніть на фотографію, щоб переглянути її в Flickr або клацніть ім'я користувача, щоб побачити більше фотографій від фотографа.
Як і у випадку з попереднім розширенням, в кожній новій вкладці ви будете бачити шедеври від таких великих художників як Ван Гог і Моне. Якщо вам сподобалося зображення, натисніть на нього, і ви потрапите на веб-сайт Google Cultural Institute, який повний інформації про роботу і її творця.
Отже, ваш останній рахунок від мобільного провайдера за Інтернет був значним? Не панікуйте. Вам просто потрібно це розширення: воно зменшує обсяг даних, що використовуються при перегляді веб-сторінок. При включенні Chrome використовуватиме сервери Google, щоб стискати сторінки перед їх завантаженням. Є тільки один нюанс: не буде включено SSL і режим інкогніто.
Існує кілька версій, створених для різних категорій користувачів. Одна з них називається Google Chrome Developer Edition. Що це за версія така і навіщо вона потрібна? Про це і піде мова в даному матеріалі.
Варто зазначити, що альтернативні збірки Хрома з'явилися вже давно. Вони супроводжують цей популярний браузер майже зі стартовою версії. Але далеко не всім користувачам підходять альтернативні варіанти.
Справа в тому, що «інші» збірки Хрома призначаються для професіоналів в тій чи іншій області: верстальників, тестувальників, розробників і так далі. Звичайним користувачам такі браузери не підійдуть. І тим не менше, потрібно розповісти про них.
Які взагалі версії Chrome бувають?
Насправді, їх не так вже й багато. Однак стабільна з них всього одна. Це якраз та, яка викладається у вільний доступ. Завантажити її може будь-який користувач. Але є і альтернативні версії. Давайте тезисно їх розглянемо.
Ось такі версії всіма улюбленого Гугл Хрому існують. Однак в даному контексті нам цікава саме Developer Edition. Тому потрібно розглянути всі ключові особливостіданої версії докладніше. Тільки тоді можна зробити висновок.
Особливості Developer Edition
Ключовою особливістю даної версії Google Chrome є наявність інструментів для розробки. Вони стануть в нагоді тим, хто розробляє розширення і плагіни для цього веб-оглядача. Звичайний користувач в таких інструментах загубиться.
Другою особливістю є просунута консоль. Вона служить для редагування коду і включення прихованих функцій браузера. Однак з нею потрібно вміти працювати. Найменша помилка в команді може привести до дуже сумних наслідків. 
Ще одна «фішка» - наявність всіх останніх нововведень, які перекочували в дану версію з Canary. Завдяки цьому розробники можуть оптимізувати свої розширення під нові можливості веб-оглядача.
часті оновлення- ще одна відмітна риса Developer Edition. Вони приходять іррегулярних, але не пізніше, ніж раз в два тижні. У деяких випадках оновлення можуть приходити вже через два дні. Це зручно для тих, хто тестує нові можливості веб-оглядача.
висновок
Отже, вище ми поговорили про те, які бувають версії Google Chrome і детально зупинилися на збірці для розробників. Тепер зрозуміло, що ця версія відрізняється набором інструментів і просунутої консоллю.
Варто відзначити, що звичайним користувачам зовсім не потрібно встановлювати Developer Edition. Толку від цього не буде ніякого. Тим більше, що особливою стабільністю ця збірка не відрізняється. Якщо ви не розробник, то краще використовувати Stable.
Працюючи в якості веб-розробника, ви, ймовірно, багато часу використовуєте браузер. Сьогодні майже кожен браузер має свої власні інструменти для розробників, які дозволяють побачити, що відбувається за лаштунками. Деякі з браузерів мають безліч розширень, які допоможуть вам оптимізувати процес веб-розробки.
У цьому пості ми зібрали наші улюблені і корисні розширення для Google Chrome, які допомагають спростити життя веб-розробника.
1 Web Developer
Web Developer Tools є одним з найбільш корисних розширень для будь-якого розробника. Він додає панель інструментів в Chrome. З її допомогою можна зручно редагувати CSS, переглядати JavaScript і багато іншого. Розширення доступно для браузерів Chrome, Firefox і Opera.
2 Accessibility Web Developer Tools
Мільйони людей користуються Інтернетом, в тому числі люди з обмеженими можливостями. Тому обов'язково ваші сайти повинні бути доступні цієї категорії користувачів. Це розширення дозволяє запустити перевірку доступності на будь-якій сторінці в мережі. Додайте його в список інструментів для веб-розробника. Щоб використовувати його, клацніть на вкладці аудити, виберіть аудит доступності, далі пункт виконати. Якщо сторінка порушує будь-які правила, вони будуть відображатися у вигляді списку з одним або декількома порушеннями елементів на сторінці.
3 Responsive Web Design Tester
Використовуйте розширення Responsive Web Design Tester, щоб перевірити, як сторінка реагує на різні пристрої. Воно відображає розмір і браузер мобільного пристрою, Поставляється з пресетами різних Android пристроїв. Він також працює в автономному режимі, який корисний при розробці сайтів на локальному хостингу без доступу до Інтернету.
4 Wappalyzer
Якщо ви коли-небудь використовували Built With, ви будете знайомі з концепцією Wappalyzer. Це розширення визначає системи управління контентом, платформи електронної комерції, веб-сервери, бази JavaScript, аналітичні інструменти та багато іншого. Крім того, додаток доступний для браузера Firefox.
5 PerfectPixel
Завдяки цьому розширенню, ви можете бути впевнені, що дизайн буде ідеально відповідати отриманому коду. Просто встановіть розширення, це дозволить вам поставити напівпрозорі накладення зображення поверх веб-сторінки, щоб порівняти зображення з версткою. Накладки можуть бути різними для кожного сайту і зберігаються між сесіями перегляду.
6 Refined GitHub
Якщо ви розчаровані призначеним для користувача інтерфейсом GitHub, це розширення є обов'язковим для вас. Воно спрощує інтерфейс GitHub за замовчуванням і додає всі види додаткових функцій: Маркування питань; виділення запитів, як непрочитаних; додавання кнопки швидкого редагування; додавання авторської посилання і багато іншого.
7 CDN Headers & Cookies
Це розширення дозволяє переглядати всі HTTP-заголовки і куки в одному місці. Це легке і просте розширення. Ви можете додавати, редагувати або видаляти призначені для користувача заголовки запитів і куки, а також заголовки запитів на експорт і куки в файл CSV.
8 User Agent Switcher
Використовуйте це розширення, щоб змінити агента користувача для підміни пристрої та / або браузера. Ви можете швидко перемикатися між різними користувачамиабо додавати свої власні з настройками, що імітують Internet Explorer, IPhone, або імітують роботу Google бота. Це корисно для налагодження і тестування поведінки сайту на різних пристроях.
9 JSON Viewer
Розширення для друку JSON і JSONP, яке ви можете налаштувати під свій смак. Воно включає в себе такі функції, як розбірні вузли; інтерактивні URL-адреси; блокнот, в який ви можете внести JSON формат на невизначений час за допомогою однієї кнопки або комбінації клавіш; 27 вбудованих тим і багато іншого.
10 Check My Links
Якщо ви регулярно редагуєте сторінки з великою кількістю посилань, не забудьте включити це розширення в свій список помічників для веб-розробника. Воно може швидко знайти всі посилання на сторінці, щоб переглянути кожну з них. Хороші посилання виділяються зеленим кольором, а биті червоним. Розширення також буде публікувати повні URL-адреси битих посилань в журналі консолі.
11 Usersnap
Часто веб-розробники щодня співпрацюють з кількома людьми, працюючи над проектом. Це невелике розширення дозволить упорядкувати процес спільної роботи, оскільки воно створює скріншоти поточного контенту. Ви зможете спілкуватися більш ефективно з різних питань, обмінюватися зворотним зв'язком між іншими розробниками, клієнтами та іншими людьми, які беруть участь в веб-розробці проекту.
12 IE Tab
IE Tab емулює Internet Explorer, використовуючи свій движок рендеринга безпосередньо в Chrome. Додаток дозволяє використовувати елементи керування ActiveX для перевірки розробляються сайтів з різними версіями IE, починаючи від IE6 до IE9.
13 DevTools AutoSave
Використання інструментів розробника для внесення змін на льоту з метою тестування, подальша вставка проведених змін в текстовий редакторі завантаження на сервер можуть обернутися пекельними муками. На щастя, це розширення приходить як рятівник, оскільки воно дозволяє автоматично зберігати будь-які внесені в CSS і JS сайту зміни в вихідний файл.
14 Chrome MySQL Admin
Якщо ви щодня працюєте з базами даних, розгляньте можливість включення цього розширення в свій робочий процес. Це простий MySQL клієнт з усіма необхідними інструментами для управління базами даних і таблиць MySQL. Ви зможете підключитися до баз даних і керувати ними, виконувати запити, створювати і видаляти таблиці та багато іншого в швидкий і легкий інтерфейс програми.
15 Grunt Devtools
Це розширення інструментів розробника Chrome додає інструменти з підтримкою фонових завдань і дозволяє виконувати завдання для численних проектів в одному вікні.
Якщо ви використовуєте інші корисні веб-розробнику розширення для Google Chrome, то поділіться ними в коментарях до статті. Нам цікаво дізнатися, що використовують інші програмісти і верстальники в своїй роботі.
Існує величезна кількість безкоштовних розширень для браузера Google Chrome, які допомагають зробити ваше життя простіше. Ось 20 з кращих.
У цій статті ми представляємо кращі розширення Google Chrome для різних цілей - але кожне покликане полегшити вам роботу.
Firefox вже давно славиться своєю користувальницької налаштуваннямі безліччю розширень, але Google Chrome також придбав в останні кілька років більшої популярності серед веб-дизайнерів і розробників. Одна з причин цього полягає в його швидкодії і вбудованих інструментах для розробників.
Тепер же, з розвитком колекції розширень Chrome, яка розширюється щодня, це стає причиною, по якій багато веб-розробники і дизайнери вибирають для себе саме цей браузер.
Хочете дізнатися про це більше? Ознайомтеся з нашим списком.
01. iMacros для Chrome
Розширення iMacros для Chrome дозволяє записувати дії і зберігати їх.
Вам, як веб-розробнику може знадобитися перевіряти свої веб-сторінки. Виконання одних і тих же дій знову і знову може бути стомлюючим процесом. iMacros - це зручне розширення для Chrome, яке дозволяє записувати ваші дії і зберегти їх, від вас вимагається тільки вчинити дію один раз.
Після цього ви можете перевіряти свої сторінки знову і знову, повторюючи дії одним натисненням кнопки. Це економить цінний час і дозволить вам сконцентруватися на більш важливих питаннях.
02. Font Playground
Font Playground дозволяє експериментувати з локальними шрифтами на активних веб-сторінках.
Кожен дизайнер і розробник знайде для себе багато корисного в цьому розширенні. Font Playground дозволяє експериментувати з локальними шрифтами і всіма бібліотеками шрифтів Google на активних веб-сторінках, при цьому, не вносячи жодних змін в самі сторінки.
Перевагою цього розширення є те, що воно включає в себе всі можливі розміри шрифту, стилі і ефекти. Ви можете спочатку візуалізувати різні варіанти шрифтів, перш ніж вносити реальні зміни в код.
03. What Font
Який шрифт вони використовують? Розширення Chrome What Font може вам це показати!
Дуже корисне розширення для Google Chrome, What Font дозволяє розробникам і дизайнерам визначити, які шрифти використовуються на веб-сторінці.
Так що, якщо ви натрапили десь в мережі на шрифт, який виглядає просто фантастично, і хочете використовувати його в одному зі своїх майбутніх проектів, просто наведіть на нього курсор, і ви миттєво дізнаєтеся, що це за шрифт.
04. Yslow
YSlow підкаже вам, що уповільнює показ сторінки.
За допомогою цього інструменту не просто можна перевірити, як швидко завантажується веб-сторінка, він також покаже вам, уповільнює чи що-небудь завантаження якщо так, то, що саме.
YSlow перевіряє веб-сторінки по 23-му з 34-ох правил визначення продуктивності, розроблених командою Yahoo. Це надзвичайно корисний інструмент для аналізу веб-сторінок, який також пропонує способи оптимізації їх роботи.
05. Web Developer
Розширення Chrome Web Developer надає ряд корисних інструментів для девелоперів.
Якщо ви веб-девелопер, то можете запитати себе: як же ви обходилися досі без цього розширення. Воно додає кнопку на панелі інструментів, через яку в Chrome здійснюється доступ до безлічі корисних інструментів для веб-девелоперів.
Це офіційна версія розширення Web Developer, розробленого для Firefox.
06. Web Developer checklist
У ньому виправлені проблеми з швидкодією в цьому зручному інструменті Chrome.
Цей інструмент дозволяє перевірити всі: чи відповідають ваші сторінки SEO, юзабіліті, а також їх видимість і продуктивність (швидкість завантаження сторінки).
Так що, якщо, наприклад, ви упустили тег H1 або якщо у сторінки відсутня мета-заголовок або мета-опис, розширення Web Developer checklist повідомляє вас про це.
Щоб ви могли швидко вирішити дану проблему. Якщо ви натиснете посилання « більше інформації і допомогу»В нижній частині розширення, ви знайдете більш детальний перелік.
07. DevTools Autosave
Автоматично зберігає зміни в вихідних файлахсторінки (CSS і JS).
Справжній скарб для всіх розробників, DevTools Autosave дозволяє автоматично зберігати будь-які зміни, внесені в CSS- і JS-вихідні файли сторінки через середу Chrome Dev Tools. Розширення легко в налаштуванні і використанні, воно заощадить вам багато часу.
08. Instant Wireframe
Дозволяє переглядати каркас веб-сторінок.
Підключіть каркасний перегляд будь-який веб-сторінки всього одним кліком миші. Це розширення для Google Chrome допомагає веб-розробникам і дизайнерам переглядати веб-сторінки, будь то локальні або опубліковані в Інтернеті, з накладенням каркаса.
09. Ripple Emulator
Ripple Emulator допомагає проводити налагодження веб-сторінок, DOM-інспектування та автоматичне тестування.
Ripple Emulator мульти платформенний емулятор мобільного середовища, який допоможе вам протестувати роботу вашого веб-додатки на різних пристроях і дозволах екранів.
Розширення Ripple Emulator може бути використано в поєднанні з існуючими засобами розробки для налагодження, DOM-інспектування та автоматичного тестування.
10. Streak
Відстеження діалогів по електронній пошті в одному тикеті, призначення завдань.
Streak є основним інструментом CRM і підтримки електронної пошти Gmail.
Розширення дозволяє об'єднати всі ваші ящики електронної пошти в одному або організувати відстеження обміну повідомленнями в одному тикеті, призначати завдання, щоб ви могли управляти процесом спілкування з вашими контрагентами особисто або надати доступ для цього іншим особам.
11. Search Stackoverflow
Отримайте швидкі відповіді на ваші питання за допомогою цього обов'язкового до використання розширення.
Якщо ви веб-розробник, то повинні були чути про Stack Overflow, місці, куди звертаються багато розробників з різними питаннями, пов'язаними з розвитком веб-проектів. Якщо немає, то вам обов'язково потрібно познайомитися з ним. Це дійсно розвинене співтовариство, яке охоплює широке коло питань: від C # і Java до PHP і JQuery.
Це фантастичне розширення додає вікно пошуку прямо в ваш браузер і дозволяє вам використовувати величезні ресурси Stack Overflow. Обов'язкове для використання розширення!
12. PHP Ninja Manual
Вся документація по PHP 5.5, в вашому браузері.
Це дійсно важко запам'ятати кожну функцію, тому, якщо ви свого часу витратили багато годин на пошук конкретних PHP функційчерез Google, це розширення обов'язково приверне вашу увагу. PHP Ninja Manual надає
Вам всю документації по PHP 5.5 з конкретними прикладами на восьми мовах в вашому браузері.
13. PerfectPixel
Це розширення допоможе вам забезпечити відповідність кожного пікселя вашого сайту дизайну.
Дизайнери ненавидять ситуації, коли вони створюють приголомшливий дизайн, але в результаті після його перекладу в код, що щось не збігається з початковим дизайном. Процесор Perfect Pixel дійсно ідеальне розширення для веб-розробників, які прагнуть створювати сайти, точно відповідні дизайну.
Це просте у використанні розширення дозволяє помістити поверх веб-сторінки напівпрозоре накладення зображення і виконати перевірку на збіг кожного пікселя, щоб переконатися, що відповідність 100-відсоткове.
14. Code Cola
Дозволяє редагувати CSS веб-сторінки на місці.
Мало того, що цей інструмент дозволить вам переглядати вихідний код, над яким ви працюєте, він також може працювати в якості CSS редактора. Це означає, що ви можете редагувати CSS стильваших веб-сторінок прямо на місці і бачити результат проведених змін негайно.
15. Chrome Sniffer
Інспектування веб-додатків і бібліотек JavaScript.
Це розширення дозволить веб-розробникам перевіряти і визначати веб-додатки, а також бібліотеки JavaScript, підключені до конкретного проекту. Розширення працює максимально просто: в адресному рядку з'являється значок, який вказує на версію використовуваного фреймворка або CMS.
16. User Agent Switcher
Перевірте, як виглядає ваш сайт на різних пристроях.
Відмінний інструмент для того, щоб подивитися, як сайт виглядає на різних видахпристроїв, таких як iPad, iPhone або Android-пристрої. Це може бути дуже корисно і в плані того, щоб побачити сайт так, як бачать його пошукові системи.