--=REKLAMA=--

Narzędzia projektanta/Narzędzia diagnostyczne

Z Joomla!WikiPL

(Przekierowano z Narzędzia diagnostyczne)

Poniższe narzędzia diagnostyczne mogą być przydatne podczas pracy nad szablonami.

Przeglądarka Mozilla Firefox

Firebug

  • Firebug (Firefox 1.5+): umożliwia modyfikowanie, debugowanie i monitorowanie kodu CSS, HTML i JavaScript przeglądanych stron.

Web Developer

  • Web Developer (Firefox 1+, Flock, Seamonkey): niezbędnik projektanta, bogaty zestaw narzędzi diagnostycznych.

Simple CSS Viewer

Google Page Speed oraz Yslow 2.0

YSlow – wtyczka dla Firebug, która analizuje stronę pod względem kilku czynników wpływających na czas ładowania strony i przedstawia wyniki tej analizy. Dodatkowo wyświetla informacje na temat załadowanych plików i czasu ich ładowania. Bardzo przydatna przy testowaniu serwisów internetowych pod względem czasu ładowania strony. [z Wikipedii.pl]. YSlow istnieje również w wersji dla przeglądarek Chrome i Opera.

EditCSS

  • EditCSS: umożliwia bezpośrednią edycję kodu CSS przeglądanej strony i podgląd efektów zmian w czasie rzeczywistym. Aby skorzystać z edytora:
    1. otwórz stronę witryny,
    2. kliknij prawym przyciskiem w dowolnym miejscu strony i z podręcznego menu wybierz polecenie Edit CSS,
    3. wprowadzaj w kodzie dowolne zmiany i obserwuj ich skutki w wyglądzie strony.
  • Walidator HTML: służy do kontroli poprawności kodu HTML
  • IE Tab: otwiera stronę na nowej karcie, wyświetlając ją za pomocą silnika Internet Explorer
  • Measurelt:
  • Aardvark: umożliwia zaznaczanie dowolnych elementów na stronie i wykonywanie na nich różnych akcji.
  • View formatted source

Aardvark - skróty klawiaturowe

Odwiedź stronę projektu: http://karmatics.com/aardvark

  • B - black on white - sprawia, że element przybiera czarno-białą kolorystykę
  • C - colorize - sprawia, że element przybiera losowy kolor tła
  • D - De-widthhify - usuwa z własności elementu zdefiniowaną szerokość
  • H - help - wyświetla pomoc
  • I - isolate - usuwa elementy otaczające wybrany
  • J - JavaScript Source - generuje kod JavaScript, dostarcza kopii elementu opartej na standardzie DOM
  • K - kill - usuwa kompletnie element (bez możliwości cofnięcia)
  • N - narrower - cofa operację wider
  • P - paste - wkleja element wycięty poleceniem remve
  • Q - quit - kończy działanie wtyczki
  • R - remove - usuwa element
  • U - undo - przywraca usunięty ostatnio element
  • W - wider - zaznacza większy obszar, np. zamiast komórki cała tabelę
  • V - view source - pokazuje źródło elementu

Przeglądarka Internet Explorer


Przeglądarka Safari

Dziękujemy za wkład

» Stefan Wajda [zwiastun],