SlideShare una empresa de Scribd logo
1 de 13
Descargar para leer sin conexión
Desarrollo Rápido y Pruebas Web
con Mozilla Firefox
Ultima actualización: 01.03.06

Desarrollo Web con Firefox



El desarrollo web acertado requiere de ciertas herramientas esenciales. Una de
las mejores herramientas disponible para el desarrollo y las pruebas Web es el
Mozilla Firefox Web Browser.
                       "Fuera de la caja" Firefox tiene una lista extensa de
                       herramientas construidas para el desarrollo. En segundo
                       lugar, el diseño extensible de Firefox ha animado al
                       desarrollo de muchas extensiones muy útiles que ayuden
                       en el diseño y la localización de problemas de las páginas
                       Web. Y además la funcionalidad adicional que puede ser
                       un ahorro en el tiempo real durante el proceso del
                       desarrollo Web.

Consejo Rápido
Otra importante característica de Firefox, es que su motor esta cumpliendo con
los estándares. La representación de las páginas en Firefox ha demostrado estar
muy cerca de las recomendaciones oficiales de la W3C para el comportamiento y
la exhibición. Por lo tanto, las páginas Web que ejecutan correctamente en
Firefox, usualmente trabajan razonablemente, si no es perfectamente, en la
mayoría de los otros browsers con solo hacer unos ajustes de menor
importancia.


Herramientas de desarrollo Web
incorporadas a Firefox
Firefox viene con varias herramientas estándares que se incorporan en el
navegador. Por sí mismos, estas herramientas son de gran alcance para
considerar a Firefox una herramienta esencial de desarrollo Web.
Estas herramientas incluyen:
•   Un ampliado visor de código fuente.
•   La capacidad de desplegar la información detallada sobre un página Web.
•   Una herramienta de depuración de Javascript.
•   Un editor e inspector en tiempo real de DOM.


Ver el código fuente de una
página.
Como la mayoría de los navegadores, Firefox proporciona la capacidad de
visualizar el código fuente de una página Web. Ofrece una diferente alternativa,
en vez de enviar el código fuente a un editor de textos externo, utiliza su propio
visualizador de código fuente con el resaltado de sintaxis y la codificación en
colores para las etiquetas HTML.
                                   Cuando el contenido en una página Web se
                                   resalta, Firefox también ofrece la opción para la
                                   visión del código fuente seleccionado, abriendo
                                   una versión del visualizador del código fuente,
                                   con el margen de beneficio de un marco de
                                   selección resaltado en el código fuente. Esto
                                   hace más fácil encontrar una sección específica
                                   de una página Web de todo el código fuente
                                   total.

                                   Consejo Rápido
                                Tu puedes visualizar el código fuente de una
página Web haciendo click en "View > Page Source" a través de menú el sistema
o eligiendo "View Page Source" en el menú contextual (o con el atajo del teclado
Ctrl-U).
Tu puedes visualizar solo parte de el código fuente de una página destacando
una porción de al página Web y mientras hace click derecho para mostrar wl
menó contextual y elegir "View Selection Source".


Reportes de información de
páginas
Firefox provee información detallada
acerca de una página a través de la
ventana Page Info.
•   La pestaña "General" despliega
    información sobre la página tal como
    URL, tamaño, y modo de
    representación (rendering mode).
•   La pestaña "Form" despliega los
    formularios de la página Web y los
    detalles acerca de los campos en el
    formulario.
•   La pestaña "Links" lista los enlaces en
    la página, incluyendo hypervinculos y
    hojas de estilos.
•   La pestaña "Media" contiene información acerca de todos elementos
    multimedia en la página Web, tales como imágenes e iconos.

Consejo Rápido
Tu puedes acceder a la ventana Page Info desde "Tools > Page Info" o por
haciendo click derecho en la página y seleccionando "View Page Info" desde el
menú contextual.


Consola Javascript
La Consola Javascript, es un herramienta para los desarrolladores de JavaScript
para escribir código snippets o archivos externos de JS. La consola proporciona
una interfaz para usar los componentes XPCOM, los medios para el cargamento
dinámico de script, y los reportes relacionados con Javascript así como los
errores CSS de la página Web.




Inspector DOM
El Inspector DOM proporciona acceso directo al Document Object Model. Para
cada elemento, ofrece una lista de información incluyendo cual de las reglas del
CSS están afectando cualquier elemento, dado en or  den de prioridad de la hoja
de estilo cascada. Para el acceso rápido al DOM de un elemento seleccionado,
puede también instalar la extensión Inspect Element.
Consejo Rápido
Firefox viene con el inspector DOM, pero en las maquinas Windows, tu necesitas
elegir cuando instalas por primera vez el navegador. Elige la opción "Custom
Install" y selecciona "Web Developer Tools". Una ves instalado, el Inspector DOM
de Firefox esta dentro del menú "Tools".


Extensiones de desarrollo Web de
Firefox
Adicionalmente de las herramientas de desarrollo Web incorporadas, Firefox
proporciona la habilidad de agregar funcionalidades de desarrollo Web a través
del uso de programas agregados o "add-on" llamados extensiones. Algunas de
las extensiones más útiles se describen en las diapositivas siguientes. Hay
muchas más extensiones para desarrollo y están disponibles en el sitio "Mozilla
Update". Hecha un vistazo del submenú de Developer Tools para buscar
extensiones adicionales de desarrollo.


Web Developer Extension
Esta extensión, por si sola, hace a Firefox una indispensable herramienta para el
desarrollo y pruebas W  eb. Web Developer Extension agrega una barra de
herramientas al navegador conteniendo varias herramientas de desarrollo web.
Despliega el tamaño de las imágenes, da los CSS e información de los
formularios, deshabilita ciertos elementos en una página, y mucho más.




Accesibilidad
Extención de Accesibilitdad para Firefox ayuda en las pruebas de estructura del
etiquetado de una pá  gina para resolver las necesidades de la gente con
discapacidades. Fangs da una representación textual de una página, similar a la
manera como es leído por un lector de pantalla. Para mas pruebas de
accesibilidad use la extensión Accessibar o "Web Developer Extension".
Colores
Colorzilla es una herramienta "Eyedropper". Al apuntar sobre un elemento
muestra la información del color, de la trayectoria del DOM, así como las
coordenadas X,Y basándose en el anterior click.




Cookies
La extensión Add & Edit Cookies permite la edición o agregado cookies a una
página. Esta extensión es una característica más de la extensión View Cookies.
CSS
El CSSViewer inspecciona elementos en un página dando un completo
despliegue de la declaración CSS para el elemento seleccionado.




Aardvark es un depurador de CSS con modificantes del teclado. Despliega
elementos en la página tal como el nombre del elemento, de la identificación, o
de la clase de un elemento seleccionado.

Consejo Rápido
Tu deslizas el ratón sobre la página, y podrás ver un rectángulo rojo para cada
elemento bajo el cursor. Además también veras un pequeño titulo amarillo que
muestra el tipo de elemento HTML y su clase o id si es que existen.


Depurando
Firebug ayuda en la depuración de aplicaciones web basabas en AJAX, DHTML, y
JavaScript. Desplegará errores que ocurren al momento de la visualización de
una página, colocará el cursor en la línea apropiada, y tiene en cuenta la
inspección de diversos valores del DOM.
Enlaces
LinkChecker chequea cada enlace en una página Web para buscar enlaces rotos.
La codificación simple de esquemas de colores hace fácil marcar rápidamente los
enlaces rotos en una página.




Medidas
MeasureIt dibuja una regla a través de una página Web para desplegar el ancho,
alto y alineación de algún elemento de la página.
Información de página
La extensión Extended Statusbar agrega información a la barra de estado
desplegando el promedio de la velocidad de la descarga, los bytes descargados,
tiempo de carga, numero de imágenes descargadas y el porcentaje de las
páginas descargadas. Esta es similar a la barra de estado del Opera.


La extensión MetaT ags Sidebar despliega la información desde el código fuente,
tal como la que oculta el código entre las etiquetas de la descripción, de
palabras claves, y de enlaces.




Parámetros de página.
Live HTTP Headers despliega información acerca de las cabeceras HTTP en una
página en tiempo real.
UrlParams es una barra lateral que despliega los parámetros de la forma que
Firefox ha enviado al servidor en la petición anterior. También le deja cambiar o
agregar parámetros y reenviar la petición.
Agentes del usuario
User Agent Switcher permite a Firefox identificarse como un navegador diferente,
tal como IE u Opera, o un servidor Web.




Validación
HTML Validator agregar validaciones HTML dentro del visualizador de código
fuente del Firefox.
Visores de páginas en otros
navegadores
IE Tab es una extensión que usa los lanzadores de su URL en Internet Explorer
dentro de una pestaña de Firefox. Es un ahorrador simple del tiempo al
comprobar las páginas para saber si hay compatibilidad a través de
navegadores.
IE View permite a la página actual o a un enlace seleccionado abrirse en el
navegador Internet Explorer. OperaView provee la misma funcionalidad para el
navegador web Opera. Adicionalmente, FirefoxView le permite a Firefox abrir la
página actual o el enlace seleccionado cargando el Internet Explorer.




Firefox Bookmarklets
Bookmarklets (favlets) son pequeños programas JavaScript que son almacenados
como un URL dentro de la lista de marcadores de un navegador y agrega
herramientas funcionales al navegador. Mientras que muchos de las listas de
marcadores pueden ya contar con estas listas de extensiones, 2 buenas fuentes
pueden ser encontradas en Slayer Office y Square Free. Slayer Office Favlet Suite
es particularmente útil para mostrar sugerencias, como una lista de colores de
una página web o cambiar los campos ocultos de un formulario.




Extensiones de herramientas de
desarrollo en Firefox
Además de las extensiones que ayudan a un desarrollador a codificar y a probar
una página Web, existen varias extensiones de Firefox que están diseñadas para
complementar o remplazar varias herramientas de desarrollo de escritorio. Estas
extensiones proporcionan un alternativa interesante al software tal como
Filezilla, KomodoEdit o Nvu.


Editores
Codetch es un editor de código para varios lenguajes etiquetados. Simula mucha
de las características vistas en Dreamweaver en un editor dentro de Firefox.




FTP
Fireftp es una cliente FTP que permite el acceso fácil a un servidor FTP.
Imágenes
MozImage es un simple visor de imágenes y navegador.




Capturas de pantallas
La Pearl Crescent Page Saver guarda una imagen de la página web en un archivo
de formato PNG. La extensión Page Saver utiliza la nueva característica canvas,
la cual fue introducida en la versión 1.5 de Firefox.
La extensión Screen Grab toma una captura de pantalla de una página Web en
formas muy diferentes. Lo más importantemente, es que permite que usted
capture el documento entero de la página Web que usted está viendo.
Conclusiones
Mientras que puede parecerse desalentador al principio tiene que dedicarle
tiempo para familiarizarse con muchas de las extensiones mencionadas en las
diapositivas anteriores. Esto le ahorrará una gran cantidad de tiempo y
frustraciones. Especialmente al familiarizarse con las extensiones "Web
Developer extension", "CSSViewer extension", y "Firebug Extension". Si lo haces,
deberías estar agradecido que lo hiciste!


Copyrights
Copyrights Leslie Franke.
La presentación esta licenciada bajo la Creative Commons Attribution
NonCommercial ShareAlike License.
Traducido al Español por: Leonardo Caballero y la puedes descargar desde mi
proyecto llamado Documentación de Leonardo Caballero

Más contenido relacionado

La actualidad más candente

La actualidad más candente (19)

Presentacion final netvibes
Presentacion final netvibesPresentacion final netvibes
Presentacion final netvibes
 
Presentacion final netvibes
Presentacion final netvibesPresentacion final netvibes
Presentacion final netvibes
 
Tecnologia
Tecnologia Tecnologia
Tecnologia
 
Joomla! Cms
Joomla! CmsJoomla! Cms
Joomla! Cms
 
J Clic Referencia
J Clic ReferenciaJ Clic Referencia
J Clic Referencia
 
Aplicacion web presentacion
Aplicacion web   presentacionAplicacion web   presentacion
Aplicacion web presentacion
 
Herramientas Web 2
Herramientas Web 2Herramientas Web 2
Herramientas Web 2
 
Herramientas web1.0 y 2.0 (DENNIS GARCES)
Herramientas web1.0 y 2.0 (DENNIS GARCES)Herramientas web1.0 y 2.0 (DENNIS GARCES)
Herramientas web1.0 y 2.0 (DENNIS GARCES)
 
Diseño de paginas web
Diseño de paginas webDiseño de paginas web
Diseño de paginas web
 
Principales CMS y Estadísticas de uso
Principales CMS y Estadísticas de usoPrincipales CMS y Estadísticas de uso
Principales CMS y Estadísticas de uso
 
Taller 4 powepoint vbgfh
Taller 4 powepoint    vbgfhTaller 4 powepoint    vbgfh
Taller 4 powepoint vbgfh
 
La evolución de la Web y la búsqueda de información: de solo leer al uso de l...
La evolución de la Web y la búsqueda de información: de solo leer al uso de l...La evolución de la Web y la búsqueda de información: de solo leer al uso de l...
La evolución de la Web y la búsqueda de información: de solo leer al uso de l...
 
Web 2.0
Web 2.0Web 2.0
Web 2.0
 
Herramientas Web 2.0
Herramientas Web 2.0Herramientas Web 2.0
Herramientas Web 2.0
 
Manual Programacion Php
Manual Programacion PhpManual Programacion Php
Manual Programacion Php
 
Que es joomla
Que es joomlaQue es joomla
Que es joomla
 
Herramientas de la Web 2.0
Herramientas de la Web 2.0 Herramientas de la Web 2.0
Herramientas de la Web 2.0
 
Web 2.0: Blogs, Wikis y Podcasts
Web 2.0: Blogs, Wikis y PodcastsWeb 2.0: Blogs, Wikis y Podcasts
Web 2.0: Blogs, Wikis y Podcasts
 
Web 20b
Web 20bWeb 20b
Web 20b
 

Destacado

Sistema de gestión de contenidos Plone CMS en el CISL 2013
Sistema de gestión de contenidos Plone CMS en el CISL 2013Sistema de gestión de contenidos Plone CMS en el CISL 2013
Sistema de gestión de contenidos Plone CMS en el CISL 2013Leonardo J. Caballero G.
 
Internacionalización del Sistema al Apoyo de Procesos Legislativos
Internacionalización del Sistema al Apoyo de Procesos LegislativosInternacionalización del Sistema al Apoyo de Procesos Legislativos
Internacionalización del Sistema al Apoyo de Procesos LegislativosLeonardo J. Caballero G.
 
Remodelación del sitio Web de Canaima GNU/Linux
Remodelación del sitio Web de Canaima GNU/LinuxRemodelación del sitio Web de Canaima GNU/Linux
Remodelación del sitio Web de Canaima GNU/LinuxLeonardo J. Caballero G.
 
PloneGov - ¡Liberando su plataforma informática!
PloneGov - ¡Liberando su plataforma informática!PloneGov - ¡Liberando su plataforma informática!
PloneGov - ¡Liberando su plataforma informática!Leonardo J. Caballero G.
 
Sistemas que reflejen perfiles sociales y aportes al proyecto Canaima
Sistemas que reflejen perfiles sociales y aportes al proyecto CanaimaSistemas que reflejen perfiles sociales y aportes al proyecto Canaima
Sistemas que reflejen perfiles sociales y aportes al proyecto CanaimaLeonardo J. Caballero G.
 
Mesa de trabajo Plataforma Web de Canaima GNU/Linux
Mesa de trabajo Plataforma Web de Canaima GNU/LinuxMesa de trabajo Plataforma Web de Canaima GNU/Linux
Mesa de trabajo Plataforma Web de Canaima GNU/LinuxLeonardo J. Caballero G.
 
Diseño Gráfico Digital en Software Libre v3.21
Diseño Gráfico Digital en Software Libre v3.21Diseño Gráfico Digital en Software Libre v3.21
Diseño Gráfico Digital en Software Libre v3.21Leonardo J. Caballero G.
 

Destacado (12)

Sistema de gestión de contenidos Plone CMS en el CISL 2013
Sistema de gestión de contenidos Plone CMS en el CISL 2013Sistema de gestión de contenidos Plone CMS en el CISL 2013
Sistema de gestión de contenidos Plone CMS en el CISL 2013
 
Introducción a Plone y Zope - v0.1.8
Introducción a Plone y Zope - v0.1.8Introducción a Plone y Zope - v0.1.8
Introducción a Plone y Zope - v0.1.8
 
Internacionalización del Sistema al Apoyo de Procesos Legislativos
Internacionalización del Sistema al Apoyo de Procesos LegislativosInternacionalización del Sistema al Apoyo de Procesos Legislativos
Internacionalización del Sistema al Apoyo de Procesos Legislativos
 
Redes Sociales y Web 2.0
Redes Sociales y Web 2.0Redes Sociales y Web 2.0
Redes Sociales y Web 2.0
 
PloneGov y experiencias en Venezuela
PloneGov y experiencias en VenezuelaPloneGov y experiencias en Venezuela
PloneGov y experiencias en Venezuela
 
Remodelación del sitio Web de Canaima GNU/Linux
Remodelación del sitio Web de Canaima GNU/LinuxRemodelación del sitio Web de Canaima GNU/Linux
Remodelación del sitio Web de Canaima GNU/Linux
 
PloneGov - ¡Liberando su plataforma informática!
PloneGov - ¡Liberando su plataforma informática!PloneGov - ¡Liberando su plataforma informática!
PloneGov - ¡Liberando su plataforma informática!
 
Sistemas que reflejen perfiles sociales y aportes al proyecto Canaima
Sistemas que reflejen perfiles sociales y aportes al proyecto CanaimaSistemas que reflejen perfiles sociales y aportes al proyecto Canaima
Sistemas que reflejen perfiles sociales y aportes al proyecto Canaima
 
Mesa de trabajo Plataforma Web de Canaima GNU/Linux
Mesa de trabajo Plataforma Web de Canaima GNU/LinuxMesa de trabajo Plataforma Web de Canaima GNU/Linux
Mesa de trabajo Plataforma Web de Canaima GNU/Linux
 
Diseño Gráfico Digital en Software Libre v3.21
Diseño Gráfico Digital en Software Libre v3.21Diseño Gráfico Digital en Software Libre v3.21
Diseño Gráfico Digital en Software Libre v3.21
 
El Proyecto Canaima GNU/Linux
El Proyecto Canaima GNU/LinuxEl Proyecto Canaima GNU/Linux
El Proyecto Canaima GNU/Linux
 
¿Que es Software Libre? - v3.9.4
¿Que es Software Libre? - v3.9.4¿Que es Software Libre? - v3.9.4
¿Que es Software Libre? - v3.9.4
 

Similar a Desarrollo Rápido y Pruebas Web con Mozilla Firefox

Trabajo de informática
Trabajo de informáticaTrabajo de informática
Trabajo de informáticayeleidistorres
 
Unidad 3 herramientas básicas en l liure_x_navegación por internet y creación...
Unidad 3 herramientas básicas en l liure_x_navegación por internet y creación...Unidad 3 herramientas básicas en l liure_x_navegación por internet y creación...
Unidad 3 herramientas básicas en l liure_x_navegación por internet y creación...tecnovicent
 
Clientesweb 100623183305-phpapp02
Clientesweb 100623183305-phpapp02Clientesweb 100623183305-phpapp02
Clientesweb 100623183305-phpapp02gotita1992
 
Navegadores, buscadores y paginas de internet
Navegadores, buscadores y paginas de internetNavegadores, buscadores y paginas de internet
Navegadores, buscadores y paginas de internetAndres
 
Clientes web
Clientes webClientes web
Clientes webdonzippy
 
Unidad 3 herramientas básicas en l liure_x_navegación por internet
Unidad 3 herramientas básicas en l liure_x_navegación por internetUnidad 3 herramientas básicas en l liure_x_navegación por internet
Unidad 3 herramientas básicas en l liure_x_navegación por internettecnovicent
 
Microsoft frontpage
 Microsoft frontpage Microsoft frontpage
Microsoft frontpagezhaki1234
 
Navegadoresdeinternet
NavegadoresdeinternetNavegadoresdeinternet
Navegadoresdeinternettsuperiori
 
Espacio de trabajo Dreamweaver
Espacio de trabajo DreamweaverEspacio de trabajo Dreamweaver
Espacio de trabajo Dreamweaverpaoloarevaloortiz
 
Dn13 u3 a6_slm
Dn13 u3 a6_slmDn13 u3 a6_slm
Dn13 u3 a6_slmmiri586
 

Similar a Desarrollo Rápido y Pruebas Web con Mozilla Firefox (20)

Trabajo de informática
Trabajo de informáticaTrabajo de informática
Trabajo de informática
 
Karen.pptxvgfgwer
Karen.pptxvgfgwerKaren.pptxvgfgwer
Karen.pptxvgfgwer
 
Karen.
Karen.Karen.
Karen.
 
Unidad 3 herramientas básicas en l liure_x_navegación por internet y creación...
Unidad 3 herramientas básicas en l liure_x_navegación por internet y creación...Unidad 3 herramientas básicas en l liure_x_navegación por internet y creación...
Unidad 3 herramientas básicas en l liure_x_navegación por internet y creación...
 
Clientesweb 100623183305-phpapp02
Clientesweb 100623183305-phpapp02Clientesweb 100623183305-phpapp02
Clientesweb 100623183305-phpapp02
 
Navegadores, buscadores y paginas de internet
Navegadores, buscadores y paginas de internetNavegadores, buscadores y paginas de internet
Navegadores, buscadores y paginas de internet
 
Clientes web
Clientes webClientes web
Clientes web
 
Unidad 3 herramientas básicas en l liure_x_navegación por internet
Unidad 3 herramientas básicas en l liure_x_navegación por internetUnidad 3 herramientas básicas en l liure_x_navegación por internet
Unidad 3 herramientas básicas en l liure_x_navegación por internet
 
Trabajo
TrabajoTrabajo
Trabajo
 
Trabajo
TrabajoTrabajo
Trabajo
 
Microsoft frontpage
 Microsoft frontpage Microsoft frontpage
Microsoft frontpage
 
Vega iver
Vega iverVega iver
Vega iver
 
Vega iver
Vega iverVega iver
Vega iver
 
Taller 3
Taller 3Taller 3
Taller 3
 
Navegadores
NavegadoresNavegadores
Navegadores
 
Navegadoresdeinternet
NavegadoresdeinternetNavegadoresdeinternet
Navegadoresdeinternet
 
Espacio de trabajo Dreamweaver
Espacio de trabajo DreamweaverEspacio de trabajo Dreamweaver
Espacio de trabajo Dreamweaver
 
Expo
ExpoExpo
Expo
 
Dn13 u3 a6_slm
Dn13 u3 a6_slmDn13 u3 a6_slm
Dn13 u3 a6_slm
 
Cuadro comparativo de navegadores
Cuadro comparativo de navegadoresCuadro comparativo de navegadores
Cuadro comparativo de navegadores
 

Más de Leonardo J. Caballero G.

Tecnologías open source como herramientas operativas en la transformación dig...
Tecnologías open source como herramientas operativas en la transformación dig...Tecnologías open source como herramientas operativas en la transformación dig...
Tecnologías open source como herramientas operativas en la transformación dig...Leonardo J. Caballero G.
 
Del uso de la tecnología a la innovación tecnológica - v0.1
Del uso de la tecnología a la innovación tecnológica - v0.1Del uso de la tecnología a la innovación tecnológica - v0.1
Del uso de la tecnología a la innovación tecnológica - v0.1Leonardo J. Caballero G.
 
World Plone Day 2021, soluciones empresariales hoy en día
World Plone Day 2021, soluciones empresariales hoy en díaWorld Plone Day 2021, soluciones empresariales hoy en día
World Plone Day 2021, soluciones empresariales hoy en díaLeonardo J. Caballero G.
 
Plone CMS, novedades y flexibilidad para soluciones empresariales hoy en día
Plone CMS, novedades y flexibilidad para soluciones empresariales hoy en díaPlone CMS, novedades y flexibilidad para soluciones empresariales hoy en día
Plone CMS, novedades y flexibilidad para soluciones empresariales hoy en díaLeonardo J. Caballero G.
 
Traducción Asistidas con Computadoras en Software Libre
Traducción Asistidas con Computadoras en Software LibreTraducción Asistidas con Computadoras en Software Libre
Traducción Asistidas con Computadoras en Software LibreLeonardo J. Caballero G.
 
Sistema de gestión de contenidos Plone CMS - Día de Plone en Venezuela 2013
Sistema de gestión de contenidos Plone CMS - Día de Plone en Venezuela 2013Sistema de gestión de contenidos Plone CMS - Día de Plone en Venezuela 2013
Sistema de gestión de contenidos Plone CMS - Día de Plone en Venezuela 2013Leonardo J. Caballero G.
 
Remodelación del sitio Web de Canaima - VII Cayapa Canaima Falcón
Remodelación del sitio Web de Canaima - VII Cayapa Canaima FalcónRemodelación del sitio Web de Canaima - VII Cayapa Canaima Falcón
Remodelación del sitio Web de Canaima - VII Cayapa Canaima FalcónLeonardo J. Caballero G.
 
Sistemas de publicación de noticias y contenidos multimedia Web para Medios d...
Sistemas de publicación de noticias y contenidos multimedia Web para Medios d...Sistemas de publicación de noticias y contenidos multimedia Web para Medios d...
Sistemas de publicación de noticias y contenidos multimedia Web para Medios d...Leonardo J. Caballero G.
 
Plone CMS en el Proyecto CANAIMA GNU/Linux
Plone CMS en el Proyecto CANAIMA GNU/LinuxPlone CMS en el Proyecto CANAIMA GNU/Linux
Plone CMS en el Proyecto CANAIMA GNU/LinuxLeonardo J. Caballero G.
 
Plone como un espacio virtual para compartir saberes entre comunidades locale...
Plone como un espacio virtual para compartir saberes entre comunidades locale...Plone como un espacio virtual para compartir saberes entre comunidades locale...
Plone como un espacio virtual para compartir saberes entre comunidades locale...Leonardo J. Caballero G.
 
Animación vectorial 2D con Software Libre
Animación vectorial 2D con Software LibreAnimación vectorial 2D con Software Libre
Animación vectorial 2D con Software LibreLeonardo J. Caballero G.
 

Más de Leonardo J. Caballero G. (17)

Plone 6 Themes
Plone 6 ThemesPlone 6 Themes
Plone 6 Themes
 
Tecnologías open source como herramientas operativas en la transformación dig...
Tecnologías open source como herramientas operativas en la transformación dig...Tecnologías open source como herramientas operativas en la transformación dig...
Tecnologías open source como herramientas operativas en la transformación dig...
 
¿Qué es Hardware Abierto? - v2.0
¿Qué es Hardware Abierto? - v2.0¿Qué es Hardware Abierto? - v2.0
¿Qué es Hardware Abierto? - v2.0
 
Del uso de la tecnología a la innovación tecnológica - v0.1
Del uso de la tecnología a la innovación tecnológica - v0.1Del uso de la tecnología a la innovación tecnológica - v0.1
Del uso de la tecnología a la innovación tecnológica - v0.1
 
Introducción a Plone - Pycon Chile 2021
Introducción a Plone - Pycon Chile 2021Introducción a Plone - Pycon Chile 2021
Introducción a Plone - Pycon Chile 2021
 
World Plone Day 2021, soluciones empresariales hoy en día
World Plone Day 2021, soluciones empresariales hoy en díaWorld Plone Day 2021, soluciones empresariales hoy en día
World Plone Day 2021, soluciones empresariales hoy en día
 
Plone CMS, novedades y flexibilidad para soluciones empresariales hoy en día
Plone CMS, novedades y flexibilidad para soluciones empresariales hoy en díaPlone CMS, novedades y flexibilidad para soluciones empresariales hoy en día
Plone CMS, novedades y flexibilidad para soluciones empresariales hoy en día
 
¿Qué es Software Libre? - v4.0
¿Qué es Software Libre? - v4.0¿Qué es Software Libre? - v4.0
¿Qué es Software Libre? - v4.0
 
Traducción Asistidas con Computadoras en Software Libre
Traducción Asistidas con Computadoras en Software LibreTraducción Asistidas con Computadoras en Software Libre
Traducción Asistidas con Computadoras en Software Libre
 
Sistema de gestión de contenidos Plone CMS - Día de Plone en Venezuela 2013
Sistema de gestión de contenidos Plone CMS - Día de Plone en Venezuela 2013Sistema de gestión de contenidos Plone CMS - Día de Plone en Venezuela 2013
Sistema de gestión de contenidos Plone CMS - Día de Plone en Venezuela 2013
 
Remodelación del sitio Web de Canaima - VII Cayapa Canaima Falcón
Remodelación del sitio Web de Canaima - VII Cayapa Canaima FalcónRemodelación del sitio Web de Canaima - VII Cayapa Canaima Falcón
Remodelación del sitio Web de Canaima - VII Cayapa Canaima Falcón
 
Sistemas de publicación de noticias y contenidos multimedia Web para Medios d...
Sistemas de publicación de noticias y contenidos multimedia Web para Medios d...Sistemas de publicación de noticias y contenidos multimedia Web para Medios d...
Sistemas de publicación de noticias y contenidos multimedia Web para Medios d...
 
Plone CMS es chevere!!!
Plone CMS es chevere!!!Plone CMS es chevere!!!
Plone CMS es chevere!!!
 
Plone CMS en el Proyecto CANAIMA GNU/Linux
Plone CMS en el Proyecto CANAIMA GNU/LinuxPlone CMS en el Proyecto CANAIMA GNU/Linux
Plone CMS en el Proyecto CANAIMA GNU/Linux
 
Plone como un espacio virtual para compartir saberes entre comunidades locale...
Plone como un espacio virtual para compartir saberes entre comunidades locale...Plone como un espacio virtual para compartir saberes entre comunidades locale...
Plone como un espacio virtual para compartir saberes entre comunidades locale...
 
Animación vectorial 2D con Software Libre
Animación vectorial 2D con Software LibreAnimación vectorial 2D con Software Libre
Animación vectorial 2D con Software Libre
 
Proyecto "Mundo Accesible"
Proyecto "Mundo Accesible"Proyecto "Mundo Accesible"
Proyecto "Mundo Accesible"
 

Último

Presentación - Diseño de Algoritmos Paralelos - Grupo 2.pdf
Presentación - Diseño de Algoritmos Paralelos - Grupo 2.pdfPresentación - Diseño de Algoritmos Paralelos - Grupo 2.pdf
Presentación - Diseño de Algoritmos Paralelos - Grupo 2.pdfymiranda2
 
De Código a Ejecución: El Papel Fundamental del MSIL en .NET
De Código a Ejecución: El Papel Fundamental del MSIL en .NETDe Código a Ejecución: El Papel Fundamental del MSIL en .NET
De Código a Ejecución: El Papel Fundamental del MSIL en .NETGermán Küber
 
La Electricidad y La Electrónica.pdf....
La Electricidad y La Electrónica.pdf....La Electricidad y La Electrónica.pdf....
La Electricidad y La Electrónica.pdf....Aaron Betancourt
 
La tablet trabajo en grupo del grado 9-2
La tablet trabajo en grupo del grado 9-2La tablet trabajo en grupo del grado 9-2
La tablet trabajo en grupo del grado 9-2montoyagabriela340
 
Tecnológia 2024.docx.Tecnológia 2024.docx.
Tecnológia 2024.docx.Tecnológia 2024.docx.Tecnológia 2024.docx.Tecnológia 2024.docx.
Tecnológia 2024.docx.Tecnológia 2024.docx.marianarodriguezc797
 
Análisis de artefactos tecnologicos .pdf
Análisis de artefactos tecnologicos .pdfAnálisis de artefactos tecnologicos .pdf
Análisis de artefactos tecnologicos .pdfcastrodanna185
 
Actividad 1-PRESENTACIÓN ANIMADA.pptxPreservación y conservación de los docum...
Actividad 1-PRESENTACIÓN ANIMADA.pptxPreservación y conservación de los docum...Actividad 1-PRESENTACIÓN ANIMADA.pptxPreservación y conservación de los docum...
Actividad 1-PRESENTACIÓN ANIMADA.pptxPreservación y conservación de los docum...OLGAMILENAMONTAEZNIO
 
Inteligencia artificial dentro de la contabilidad
Inteligencia artificial dentro de la contabilidadInteligencia artificial dentro de la contabilidad
Inteligencia artificial dentro de la contabilidaddanik1023m
 
Actividad 14: Diseño de Algoritmos Paralelos Actividad 14: Diseño de Algoritm...
Actividad 14: Diseño de Algoritmos Paralelos Actividad 14: Diseño de Algoritm...Actividad 14: Diseño de Algoritmos Paralelos Actividad 14: Diseño de Algoritm...
Actividad 14: Diseño de Algoritmos Paralelos Actividad 14: Diseño de Algoritm...RaymondCode
 
VIDEOS DE APOYO.docx E
VIDEOS DE APOYO.docx                                  EVIDEOS DE APOYO.docx                                  E
VIDEOS DE APOYO.docx Emialexsolar
 
El diseño de Algoritmos Paralelos.pdf - analisis de algortimos
El diseño de Algoritmos Paralelos.pdf - analisis de algortimosEl diseño de Algoritmos Paralelos.pdf - analisis de algortimos
El diseño de Algoritmos Paralelos.pdf - analisis de algortimosLCristinaForchue
 
Inmersión global en ciberseguridad e IA en la conferencia RSA.pdf
Inmersión global en ciberseguridad e IA en la conferencia RSA.pdfInmersión global en ciberseguridad e IA en la conferencia RSA.pdf
Inmersión global en ciberseguridad e IA en la conferencia RSA.pdfOBr.global
 
Matriz de integración de tecnologías- Paola Carvajal.docx
Matriz de integración de tecnologías- Paola Carvajal.docxMatriz de integración de tecnologías- Paola Carvajal.docx
Matriz de integración de tecnologías- Paola Carvajal.docxPaolaCarolinaCarvaja
 
TENDENCIAS DE IA Explorando el futuro de la tecnologia.pdf
TENDENCIAS DE IA Explorando el futuro de la tecnologia.pdfTENDENCIAS DE IA Explorando el futuro de la tecnologia.pdf
TENDENCIAS DE IA Explorando el futuro de la tecnologia.pdfJoseAlejandroPerezBa
 
Los mejores simuladores de circuitos electrónicos.pdf
Los mejores simuladores de circuitos electrónicos.pdfLos mejores simuladores de circuitos electrónicos.pdf
Los mejores simuladores de circuitos electrónicos.pdfodalistar77
 
Carta de Premio y Excel angeline 11-2pdf
Carta de Premio y Excel angeline 11-2pdfCarta de Premio y Excel angeline 11-2pdf
Carta de Premio y Excel angeline 11-2pdfangelinebocanegra1
 
PRESENTACION DEL TEMA LOS MEJORES SIMULADORES DE CIRCUITOS ELCTRONICOS
PRESENTACION DEL TEMA LOS MEJORES SIMULADORES DE CIRCUITOS ELCTRONICOSPRESENTACION DEL TEMA LOS MEJORES SIMULADORES DE CIRCUITOS ELCTRONICOS
PRESENTACION DEL TEMA LOS MEJORES SIMULADORES DE CIRCUITOS ELCTRONICOSLincangoKevin
 
Actividad 14_ Diseño de Algoritmos Paralelos.pdf
Actividad 14_ Diseño de Algoritmos Paralelos.pdfActividad 14_ Diseño de Algoritmos Paralelos.pdf
Actividad 14_ Diseño de Algoritmos Paralelos.pdfalejandrogomezescoto
 

Último (20)

Presentación - Diseño de Algoritmos Paralelos - Grupo 2.pdf
Presentación - Diseño de Algoritmos Paralelos - Grupo 2.pdfPresentación - Diseño de Algoritmos Paralelos - Grupo 2.pdf
Presentación - Diseño de Algoritmos Paralelos - Grupo 2.pdf
 
De Código a Ejecución: El Papel Fundamental del MSIL en .NET
De Código a Ejecución: El Papel Fundamental del MSIL en .NETDe Código a Ejecución: El Papel Fundamental del MSIL en .NET
De Código a Ejecución: El Papel Fundamental del MSIL en .NET
 
La Electricidad y La Electrónica.pdf....
La Electricidad y La Electrónica.pdf....La Electricidad y La Electrónica.pdf....
La Electricidad y La Electrónica.pdf....
 
BEDEC Proyecto y obra , novedades 2024 - Xavier Folch
BEDEC Proyecto y obra , novedades 2024 - Xavier FolchBEDEC Proyecto y obra , novedades 2024 - Xavier Folch
BEDEC Proyecto y obra , novedades 2024 - Xavier Folch
 
La tablet trabajo en grupo del grado 9-2
La tablet trabajo en grupo del grado 9-2La tablet trabajo en grupo del grado 9-2
La tablet trabajo en grupo del grado 9-2
 
Tecnológia 2024.docx.Tecnológia 2024.docx.
Tecnológia 2024.docx.Tecnológia 2024.docx.Tecnológia 2024.docx.Tecnológia 2024.docx.
Tecnológia 2024.docx.Tecnológia 2024.docx.
 
Análisis de artefactos tecnologicos .pdf
Análisis de artefactos tecnologicos .pdfAnálisis de artefactos tecnologicos .pdf
Análisis de artefactos tecnologicos .pdf
 
Actividad 1-PRESENTACIÓN ANIMADA.pptxPreservación y conservación de los docum...
Actividad 1-PRESENTACIÓN ANIMADA.pptxPreservación y conservación de los docum...Actividad 1-PRESENTACIÓN ANIMADA.pptxPreservación y conservación de los docum...
Actividad 1-PRESENTACIÓN ANIMADA.pptxPreservación y conservación de los docum...
 
Inteligencia artificial dentro de la contabilidad
Inteligencia artificial dentro de la contabilidadInteligencia artificial dentro de la contabilidad
Inteligencia artificial dentro de la contabilidad
 
Actividad 14: Diseño de Algoritmos Paralelos Actividad 14: Diseño de Algoritm...
Actividad 14: Diseño de Algoritmos Paralelos Actividad 14: Diseño de Algoritm...Actividad 14: Diseño de Algoritmos Paralelos Actividad 14: Diseño de Algoritm...
Actividad 14: Diseño de Algoritmos Paralelos Actividad 14: Diseño de Algoritm...
 
VIDEOS DE APOYO.docx E
VIDEOS DE APOYO.docx                                  EVIDEOS DE APOYO.docx                                  E
VIDEOS DE APOYO.docx E
 
El diseño de Algoritmos Paralelos.pdf - analisis de algortimos
El diseño de Algoritmos Paralelos.pdf - analisis de algortimosEl diseño de Algoritmos Paralelos.pdf - analisis de algortimos
El diseño de Algoritmos Paralelos.pdf - analisis de algortimos
 
Inmersión global en ciberseguridad e IA en la conferencia RSA.pdf
Inmersión global en ciberseguridad e IA en la conferencia RSA.pdfInmersión global en ciberseguridad e IA en la conferencia RSA.pdf
Inmersión global en ciberseguridad e IA en la conferencia RSA.pdf
 
Matriz de integración de tecnologías- Paola Carvajal.docx
Matriz de integración de tecnologías- Paola Carvajal.docxMatriz de integración de tecnologías- Paola Carvajal.docx
Matriz de integración de tecnologías- Paola Carvajal.docx
 
BEDEC Sostenibilidad, novedades 2024 - Laura Silva
BEDEC Sostenibilidad, novedades 2024 - Laura SilvaBEDEC Sostenibilidad, novedades 2024 - Laura Silva
BEDEC Sostenibilidad, novedades 2024 - Laura Silva
 
TENDENCIAS DE IA Explorando el futuro de la tecnologia.pdf
TENDENCIAS DE IA Explorando el futuro de la tecnologia.pdfTENDENCIAS DE IA Explorando el futuro de la tecnologia.pdf
TENDENCIAS DE IA Explorando el futuro de la tecnologia.pdf
 
Los mejores simuladores de circuitos electrónicos.pdf
Los mejores simuladores de circuitos electrónicos.pdfLos mejores simuladores de circuitos electrónicos.pdf
Los mejores simuladores de circuitos electrónicos.pdf
 
Carta de Premio y Excel angeline 11-2pdf
Carta de Premio y Excel angeline 11-2pdfCarta de Premio y Excel angeline 11-2pdf
Carta de Premio y Excel angeline 11-2pdf
 
PRESENTACION DEL TEMA LOS MEJORES SIMULADORES DE CIRCUITOS ELCTRONICOS
PRESENTACION DEL TEMA LOS MEJORES SIMULADORES DE CIRCUITOS ELCTRONICOSPRESENTACION DEL TEMA LOS MEJORES SIMULADORES DE CIRCUITOS ELCTRONICOS
PRESENTACION DEL TEMA LOS MEJORES SIMULADORES DE CIRCUITOS ELCTRONICOS
 
Actividad 14_ Diseño de Algoritmos Paralelos.pdf
Actividad 14_ Diseño de Algoritmos Paralelos.pdfActividad 14_ Diseño de Algoritmos Paralelos.pdf
Actividad 14_ Diseño de Algoritmos Paralelos.pdf
 

Desarrollo Rápido y Pruebas Web con Mozilla Firefox

  • 1. Desarrollo Rápido y Pruebas Web con Mozilla Firefox Ultima actualización: 01.03.06 Desarrollo Web con Firefox El desarrollo web acertado requiere de ciertas herramientas esenciales. Una de las mejores herramientas disponible para el desarrollo y las pruebas Web es el Mozilla Firefox Web Browser. "Fuera de la caja" Firefox tiene una lista extensa de herramientas construidas para el desarrollo. En segundo lugar, el diseño extensible de Firefox ha animado al desarrollo de muchas extensiones muy útiles que ayuden en el diseño y la localización de problemas de las páginas Web. Y además la funcionalidad adicional que puede ser un ahorro en el tiempo real durante el proceso del desarrollo Web. Consejo Rápido Otra importante característica de Firefox, es que su motor esta cumpliendo con los estándares. La representación de las páginas en Firefox ha demostrado estar muy cerca de las recomendaciones oficiales de la W3C para el comportamiento y la exhibición. Por lo tanto, las páginas Web que ejecutan correctamente en Firefox, usualmente trabajan razonablemente, si no es perfectamente, en la mayoría de los otros browsers con solo hacer unos ajustes de menor importancia. Herramientas de desarrollo Web incorporadas a Firefox Firefox viene con varias herramientas estándares que se incorporan en el navegador. Por sí mismos, estas herramientas son de gran alcance para considerar a Firefox una herramienta esencial de desarrollo Web. Estas herramientas incluyen: • Un ampliado visor de código fuente. • La capacidad de desplegar la información detallada sobre un página Web.
  • 2. Una herramienta de depuración de Javascript. • Un editor e inspector en tiempo real de DOM. Ver el código fuente de una página. Como la mayoría de los navegadores, Firefox proporciona la capacidad de visualizar el código fuente de una página Web. Ofrece una diferente alternativa, en vez de enviar el código fuente a un editor de textos externo, utiliza su propio visualizador de código fuente con el resaltado de sintaxis y la codificación en colores para las etiquetas HTML. Cuando el contenido en una página Web se resalta, Firefox también ofrece la opción para la visión del código fuente seleccionado, abriendo una versión del visualizador del código fuente, con el margen de beneficio de un marco de selección resaltado en el código fuente. Esto hace más fácil encontrar una sección específica de una página Web de todo el código fuente total. Consejo Rápido Tu puedes visualizar el código fuente de una página Web haciendo click en "View > Page Source" a través de menú el sistema o eligiendo "View Page Source" en el menú contextual (o con el atajo del teclado Ctrl-U). Tu puedes visualizar solo parte de el código fuente de una página destacando una porción de al página Web y mientras hace click derecho para mostrar wl menó contextual y elegir "View Selection Source". Reportes de información de páginas Firefox provee información detallada acerca de una página a través de la ventana Page Info. • La pestaña "General" despliega información sobre la página tal como URL, tamaño, y modo de representación (rendering mode). • La pestaña "Form" despliega los formularios de la página Web y los detalles acerca de los campos en el formulario. • La pestaña "Links" lista los enlaces en la página, incluyendo hypervinculos y hojas de estilos.
  • 3. La pestaña "Media" contiene información acerca de todos elementos multimedia en la página Web, tales como imágenes e iconos. Consejo Rápido Tu puedes acceder a la ventana Page Info desde "Tools > Page Info" o por haciendo click derecho en la página y seleccionando "View Page Info" desde el menú contextual. Consola Javascript La Consola Javascript, es un herramienta para los desarrolladores de JavaScript para escribir código snippets o archivos externos de JS. La consola proporciona una interfaz para usar los componentes XPCOM, los medios para el cargamento dinámico de script, y los reportes relacionados con Javascript así como los errores CSS de la página Web. Inspector DOM El Inspector DOM proporciona acceso directo al Document Object Model. Para cada elemento, ofrece una lista de información incluyendo cual de las reglas del CSS están afectando cualquier elemento, dado en or den de prioridad de la hoja de estilo cascada. Para el acceso rápido al DOM de un elemento seleccionado, puede también instalar la extensión Inspect Element.
  • 4. Consejo Rápido Firefox viene con el inspector DOM, pero en las maquinas Windows, tu necesitas elegir cuando instalas por primera vez el navegador. Elige la opción "Custom Install" y selecciona "Web Developer Tools". Una ves instalado, el Inspector DOM de Firefox esta dentro del menú "Tools". Extensiones de desarrollo Web de Firefox Adicionalmente de las herramientas de desarrollo Web incorporadas, Firefox proporciona la habilidad de agregar funcionalidades de desarrollo Web a través del uso de programas agregados o "add-on" llamados extensiones. Algunas de las extensiones más útiles se describen en las diapositivas siguientes. Hay muchas más extensiones para desarrollo y están disponibles en el sitio "Mozilla Update". Hecha un vistazo del submenú de Developer Tools para buscar extensiones adicionales de desarrollo. Web Developer Extension Esta extensión, por si sola, hace a Firefox una indispensable herramienta para el desarrollo y pruebas W eb. Web Developer Extension agrega una barra de herramientas al navegador conteniendo varias herramientas de desarrollo web. Despliega el tamaño de las imágenes, da los CSS e información de los formularios, deshabilita ciertos elementos en una página, y mucho más. Accesibilidad Extención de Accesibilitdad para Firefox ayuda en las pruebas de estructura del etiquetado de una pá gina para resolver las necesidades de la gente con discapacidades. Fangs da una representación textual de una página, similar a la manera como es leído por un lector de pantalla. Para mas pruebas de accesibilidad use la extensión Accessibar o "Web Developer Extension".
  • 5. Colores Colorzilla es una herramienta "Eyedropper". Al apuntar sobre un elemento muestra la información del color, de la trayectoria del DOM, así como las coordenadas X,Y basándose en el anterior click. Cookies La extensión Add & Edit Cookies permite la edición o agregado cookies a una página. Esta extensión es una característica más de la extensión View Cookies.
  • 6. CSS El CSSViewer inspecciona elementos en un página dando un completo despliegue de la declaración CSS para el elemento seleccionado. Aardvark es un depurador de CSS con modificantes del teclado. Despliega elementos en la página tal como el nombre del elemento, de la identificación, o de la clase de un elemento seleccionado. Consejo Rápido Tu deslizas el ratón sobre la página, y podrás ver un rectángulo rojo para cada elemento bajo el cursor. Además también veras un pequeño titulo amarillo que muestra el tipo de elemento HTML y su clase o id si es que existen. Depurando Firebug ayuda en la depuración de aplicaciones web basabas en AJAX, DHTML, y JavaScript. Desplegará errores que ocurren al momento de la visualización de una página, colocará el cursor en la línea apropiada, y tiene en cuenta la inspección de diversos valores del DOM.
  • 7. Enlaces LinkChecker chequea cada enlace en una página Web para buscar enlaces rotos. La codificación simple de esquemas de colores hace fácil marcar rápidamente los enlaces rotos en una página. Medidas MeasureIt dibuja una regla a través de una página Web para desplegar el ancho, alto y alineación de algún elemento de la página.
  • 8. Información de página La extensión Extended Statusbar agrega información a la barra de estado desplegando el promedio de la velocidad de la descarga, los bytes descargados, tiempo de carga, numero de imágenes descargadas y el porcentaje de las páginas descargadas. Esta es similar a la barra de estado del Opera. La extensión MetaT ags Sidebar despliega la información desde el código fuente, tal como la que oculta el código entre las etiquetas de la descripción, de palabras claves, y de enlaces. Parámetros de página. Live HTTP Headers despliega información acerca de las cabeceras HTTP en una página en tiempo real. UrlParams es una barra lateral que despliega los parámetros de la forma que Firefox ha enviado al servidor en la petición anterior. También le deja cambiar o agregar parámetros y reenviar la petición.
  • 9. Agentes del usuario User Agent Switcher permite a Firefox identificarse como un navegador diferente, tal como IE u Opera, o un servidor Web. Validación HTML Validator agregar validaciones HTML dentro del visualizador de código fuente del Firefox.
  • 10. Visores de páginas en otros navegadores IE Tab es una extensión que usa los lanzadores de su URL en Internet Explorer dentro de una pestaña de Firefox. Es un ahorrador simple del tiempo al comprobar las páginas para saber si hay compatibilidad a través de navegadores. IE View permite a la página actual o a un enlace seleccionado abrirse en el navegador Internet Explorer. OperaView provee la misma funcionalidad para el navegador web Opera. Adicionalmente, FirefoxView le permite a Firefox abrir la página actual o el enlace seleccionado cargando el Internet Explorer. Firefox Bookmarklets Bookmarklets (favlets) son pequeños programas JavaScript que son almacenados como un URL dentro de la lista de marcadores de un navegador y agrega herramientas funcionales al navegador. Mientras que muchos de las listas de marcadores pueden ya contar con estas listas de extensiones, 2 buenas fuentes
  • 11. pueden ser encontradas en Slayer Office y Square Free. Slayer Office Favlet Suite es particularmente útil para mostrar sugerencias, como una lista de colores de una página web o cambiar los campos ocultos de un formulario. Extensiones de herramientas de desarrollo en Firefox Además de las extensiones que ayudan a un desarrollador a codificar y a probar una página Web, existen varias extensiones de Firefox que están diseñadas para complementar o remplazar varias herramientas de desarrollo de escritorio. Estas extensiones proporcionan un alternativa interesante al software tal como Filezilla, KomodoEdit o Nvu. Editores Codetch es un editor de código para varios lenguajes etiquetados. Simula mucha de las características vistas en Dreamweaver en un editor dentro de Firefox. FTP Fireftp es una cliente FTP que permite el acceso fácil a un servidor FTP.
  • 12. Imágenes MozImage es un simple visor de imágenes y navegador. Capturas de pantallas La Pearl Crescent Page Saver guarda una imagen de la página web en un archivo de formato PNG. La extensión Page Saver utiliza la nueva característica canvas, la cual fue introducida en la versión 1.5 de Firefox. La extensión Screen Grab toma una captura de pantalla de una página Web en formas muy diferentes. Lo más importantemente, es que permite que usted capture el documento entero de la página Web que usted está viendo.
  • 13. Conclusiones Mientras que puede parecerse desalentador al principio tiene que dedicarle tiempo para familiarizarse con muchas de las extensiones mencionadas en las diapositivas anteriores. Esto le ahorrará una gran cantidad de tiempo y frustraciones. Especialmente al familiarizarse con las extensiones "Web Developer extension", "CSSViewer extension", y "Firebug Extension". Si lo haces, deberías estar agradecido que lo hiciste! Copyrights Copyrights Leslie Franke. La presentación esta licenciada bajo la Creative Commons Attribution NonCommercial ShareAlike License. Traducido al Español por: Leonardo Caballero y la puedes descargar desde mi proyecto llamado Documentación de Leonardo Caballero