Домівка > Magento, Workhack > Додатки до Firefox для верстки Magento

Додатки до Firefox для верстки Magento

Web Developer

webdeveloper Розширення Web Developer додає меню і панель інструментів з величезною кількістю веб-інструментів. Надзвичайно потужна штука, величезний спектр дії. Рекомендую.

toolbar

Завантажити зараз

Firebug

firebug

Firebug інтегрується в Firefox, щоб дати у Ваші руки інструмент розробника. Ви можете редагувати, дебажити та моніторити CSS, HTML, і JavaScript вживу на будь-якій веб-сторінці.

Відвідайте офіційний веб-сайт Firebug для документації, скріншотів, та подискутуйте на форумі: http://getfirebug.com. «Must have!» розширення. Без нього не уявляю собі верстку та відладку сайту.

firebug_console

Завантажити зараз

YSlow

YSlow аналізує веб-сторінку і пропонує варіанти, як поліпшити її роботу, базуючись на наборі правил, які сприяють високій продуктивності веб-сторінки. YSlow – це додаток Firefox, який інтегрується у Firebug.

YSlow виставляє оцінку веб-сторінці, базуючись на одному з трьох наборів правил, який був заданий користувачем чи був вибраний за замовчуванням. Він вказує шляхи для поліпшення роботи сторінки, аналізує компоненти сторінки, показує статистику, і надає інструменти для ефективного аналізу, зокрема Smush.it™ і JSLint.

Я користуюся ним для перевірки швидкості завантаження сторінки, дивлюся на оцінки, які він виставляє та стараюся їх покращити. Приємно коли тобі ставлять «A».

yslow

Завантажити зараз

Html Validator

Просто суперовий додаток. Валідує Ваш код в реальному часі. Тобто не потрібно під час роботи щоразу заходити на W3C validator. Кількість помилок одразу видно в рядку стану браузера. Економить багато часу і змушує тримати HTML валідним, бо червоний хрестик ріже очі.

html_validator

Завантажити зараз

ColorZilla

colorzilla Додаток який працює як «піпетка», «лупа» та інші інструменти. З допомогою ColorZilla Ви можете отримати колір будь-якої точки у вашому браузері, швидко подивитися що це за колір та вставити його в іншу програму (наприклад в Photoshop). Можна використати функцію Zoom на сторінці, яку Ви переглядаєте. Та ще багато цікавих функцій для роботи з кольорами.

colorzilla

Завантажити зараз

MeasureIt

Малює лінійку та дозволяє вимірювати довжину та висоту елементів сторінки у пікселях.

measureit

Завантажити зараз

FireShot

FireShot – це додаток, який робить скріншоти веб-сторінок (повністю або тільки видиму частину)

На відміну від інших додатків, цей плагін має набір для редагування та нотування, який дозволяє користувачеві швидко модифікувати знімки веб-сторінки та вставляти текстові підписи чи графіку. Цей функціонал буде особливо корисний веб-дизайнерам, тестерам та копірайтерам.

Скріни можуть:

  • Переслати на безкоштовний хостинг скріншотів
  • Зберігатися на диск (PNG, GIF, JPEG, BMP)
  • Роздруковуватися
  • Копіюватися в буфер обміну
  • Пересилатися по e-mail
  • Відкриватися в зовнішньому редакторі для подальшої обробки

fire_shot

Завантажити зараз

Ось такими додатками користуюся я. А чим користуєтеся Ви? Поділіться, можливо я щось пропустив.

Advertisements
Категорії:Magento, Workhack Позначки:, , , ,
  1. wik
    Березень 8, 2010 о 00:45

    Так же использую: Rainbow(вместо ColorZilla), Pencil, Xdebug Helper, Firefinder for Firebug

    FireShot – интересный, но сугубо виндовый…

    • Wolf
      Березень 15, 2010 о 09:22

      На роботі стоїть Віста, так що FireShot просто знахідка. Firefinder також в мене встановлений, забув про нього написати. Дякую що поділилися своїми додатками.

  1. Квітень 8, 2010 о 11:59

Залишити відповідь

Заповніть поля нижче або авторизуйтесь клікнувши по іконці

Лого WordPress.com

Ви коментуєте, використовуючи свій обліковий запис WordPress.com. Log Out / Змінити )

Twitter picture

Ви коментуєте, використовуючи свій обліковий запис Twitter. Log Out / Змінити )

Facebook photo

Ви коментуєте, використовуючи свій обліковий запис Facebook. Log Out / Змінити )

Google+ photo

Ви коментуєте, використовуючи свій обліковий запис Google+. Log Out / Змінити )

З’єднання з %s

%d блогерам подобається це: