Manual de ADOBE DREAMWEAVER CS3 [Tutorial]

CONTENIDO DEL MANUAL DE ADOBE DREAMWEAVER CS3

GUÍA DEL USUARIO
Capítulo 1: Introducción
Instalación
Ayuda de Adobe
Recursos
Novedades
Capítulo 2: Espacio de trabajo
Flujo de trabajo y espacio de trabajo de Dreamweaver
Utilización de la ventana de documento
Utilización de barras de herramientas, menús contextuales y paneles
Personalización del espacio de trabajo de Dreamweaver CS3
Capítulo 3: Utilización de los sitios de Dreamweaver
Configuración de un sitio de Dreamweaver
Utilización de un mapa visual del sitio
Administración de sitios de Contribute con Dreamweaver
Utilización de archivos sin definir ningún sitio
Opciones de la ficha Básicas
Capítulo 4: Creación y administración de archivos
Cómo crear y abrir documentos
Administración de archivos y carpetas
Obtención y colocación de archivos en el servidor
Desprotección y protección de archivos
Sincronización de archivos
Comparación de archivos para detectar diferencias
Recuperación de versiones anteriores de archivos (usuarios de Contribute)
Cómo ocultar carpetas y archivos en el sitio
Almacenamiento de información sobre archivos en Design Notes
Comprobación del sitio
Capítulo 5: Administración de activos y bibliotecas
Activos y bibliotecas
Utilización de activos
Creación y administración de una lista de activos favoritos
Utilización de los elementos de biblioteca
Capítulo 6: Creación de páginas con CSS
Aspectos básicos de las hojas de estilos en cascada
Creación y administración de CSS
Diseño de páginas con CSS
Utilización de etiquetas div
Animación de elementos PA
Manual ex Macromedia
Manuales Adobe Dreamweaver CS3 español
Curso guia gratis
Gratuito pdf
Tutorial
Tutoriales web
Capítulo 7: Maquetación de páginas con HTML
Utilización de ayudas visuales al diseñar
Presentación de contenido en tablas
Diseño de páginas en el modo de diseño
Utilización de marcos
Capítulo 8: Adición de contenido a las páginas
Utilización de páginas
Adición y aplicación de formato al texto
Adición y modificación de imágenes
Inserción de contenido de Flash
Adición de contenido de Flash Video
Adición de sonido
Adición de otros objetos multimedia
Capítulo 9: Establecimiento de vínculos y navegación
Acerca del establecimiento de vínculos y la navegación
Vinculación
Menús de salto
Barras de navegación
Mapas de imágenes
Solución de problemas de vínculos
Capítulo 10: Obtención de vista previa de páginas
Obtención de vista previa de páginas en navegadores
Obtención de vista previa de páginas en dispositivos móviles
Capítulo 11: Utilización del código de las páginas
Codificación en Dreamweaver
Configuración del entorno de codificación
Personalización del entorno de codificación
Escritura y edición de código
Contracción del código
Optimización y depuración del código
Edición de código en la vista Diseño
Utilización del contenido de Head para páginas
Utilización de server-side includes
Administración de bibliotecas de etiquetas
Importación de etiquetas personalizadas a Dreamweaver
Capítulo 12: Cómo añadir comportamientos JavaScript
Utilización de comportamientos JavaScript
Aplicación de comportamientos incorporados en Dreamweaver
Capítulo 13: Utilización con otras aplicaciones
Integración con otras aplicaciones
Utilización de Fireworks
Utilización con Photoshop
Utilización de Flash
Utilización con Bridge
Utilización de Device Central
Capítulo 14: Creación y administración de plantillas
Plantillas de Dreamweaver
Reconocimiento de plantillas y documentos basados en plantillas
Creación de una plantilla de Dreamweaver
Creación de regiones editables
Creación de regiones repetidas
Utilización de regiones opcionales
Definición de atributos de etiqueta editables
Creación de una plantilla anidada
Edición, actualización y eliminación de plantillas
Exportación e importación de contenido de plantillas
Aplicación o eliminación de una plantilla de un documento existente
Edición de contenido de un documento basado en plantilla
Sintaxis de plantilla
Configuración de preferencias de edición para plantillas
Capítulo 15: Visualización de datos XML
Acerca de XML y XSLT
Realización de transformaciones XSL en el servidor
Realización de transformaciones XSL en el cliente
Entidades de caracteres no presentes
Capítulo 16: Creación visual de páginas de Spry
Acerca del framework de Spry
Adición de widgets de Spry
Utilización del widget de acordeón
Utilización del widget de barra de menús
Utilización del widget de panel que puede contraerse
Utilización del widget de paneles en fichas
Utilización del widget de campo de texto de validación
Utilización del widget de área de texto de validación
Utilización del widget de selección de validación
Utilización del widget de casilla de verificación de validación
Visualización de datos con Spry
Adición de efectos de Spry
Capítulo 17: Preparación para crear sitios dinámicos
Aspectos básicos de las aplicaciones Web
Instalación de un servidor Web local
Configuración de una aplicación Web
Conexiones de base de datos para desarrolladores de ColdFusion
Conexiones de base de datos para desarrolladores de ASP
Conexiones de base de datos para desarrolladores de PHP
Conexiones de base de datos para desarrolladores de ASP.NET
Conexiones de base de datos para desarrolladores de JSP
Solución de problemas de conexiones de base de datos
Eliminación de scripts de conexión
Capítulo 18: Fuentes de datos para aplicaciones Web
Utilización de una base de datos para almacenar contenido
Recopilación de los datos enviados por los usuarios
Acceso a datos almacenados en variables de sesión
Capítulo 19: Creación de páginas dinámicas
Optimización del espacio de trabajo para desarrollo visual
Diseño de páginas dinámicas
Introducción a las fuentes de contenido dinámico
Paneles de contenido dinámico
Definición de fuentes de contenido dinámico
Adición de contenido dinámico a las páginas
Cambio de contenido dinámico
Visualización de registros de la base de datos
Visualización de Live Data
Utilización de servicios Web
Adición de comportamientos de servidor personalizados
Creación de formularios
Capítulo 20: Creación visual de aplicaciones
Creación de páginas maestra y detalle (todos los servidores)
Creación de páginas de búsqueda y resultados (ColdFusion, ASP, JSP, PHP)
Creación de una página de búsqueda en la base de datos (ASP.NET)
Creación de una página de inserción de registro (todos los servidores)
Creación de páginas para actualizar un registro (todos los servidores)
Creación de páginas para eliminar un registro (todos los servidores)
Creación de páginas con objetos de manipulación avanzados (ColdFusion, ASP, ASP.NET, JSP)
Creación de una página de registro (ColdFusion, ASP, JSP, PHP)
Creación de una página de conexión (ColdFusion, ASP, JSP, PHP)
Creación de una página para acceso de usuarios autorizados (ColdFusion, ASP, JSP, PHP)
Protección de una carpeta de su aplicación (ColdFusion)
Utilización de componentes de ColdFusion (ColdFusion)
Utilización de JavaBeans (JSP)
Capítulo 21: Creación de formularios ASP.NET y ColdFusion
Creación de formularios ColdFusion MX 7
Creación de formularios ASP.NET
Creación de controles Web Cuadrícula de datos y Lista de datos de ASP.NET
Capítulo 22: Automatización de tareas
Automatización de tareas
Capítulo 23: Accesibilidad
Dreamweaver y accesibilidad
Funciones de accesibilidad de Dreamweaver
Diseño de páginas accesibles
Capítulo 24: Métodos abreviados y extensiones
Métodos abreviados de teclado
Extensiones
Índice

MANUAL DE ADOBE DREAMWEAVER CS3

Crear Popup’s [ventanas emergentes] en Dreamweaver

Para crear un pop-up usando Dreamweaver, la extensión Popup Link de FlevOOware, podrá serte de utilidad. Aunque es cierto que Dreamweaver trae una opción para poder hacerlo, esta extensión te permite configurar la manera en cómo se abrirá la ventana emergente, tal como el que se abra centrada o en algún lugar en específico. En la imagen de arriba podrás ver el cuadro de diálogo que se muestra para su configuración.

Lo mas interesante es que esta extensión es totalmente gratis. En el mismo sitio podrás encontras mas extensiones para Dreamweaver que te pueden ser de utilidad.

Enlace | Extension

El proceso del diseño web

La creación de una buena página web puede ser un verdadero desafío. Con tantos componentes distintos, que van desde el diseño visual a la integración de bases de datos, existe una elevada probabilidad de que algo vaya mal.

Si bien, para minimizar el riesgo de fracaso de un proyecto Web, necesitamos un método que nos sirva de guía. Desgraciadamente, muchos diseñadores Web simplemente hacen un diseño web, a menudo, con poca previsión y planificación.

Ésta no es una forma metódica de construir un sitio. Los objetivos del sitio suelen estar definidos de forma poco precisa, el proceso es más intuitivo que planificado y el resultado suele ser impredecible pues todo se hace al azar, como salga, sin planificación.

Los sitios desarrollados de ésta manera son como plantas, crecen de una manera orgánica, ocasionalmente producen una hermosa flor, pero lo más frecuente es que -a largo plazo- se conviertan en una confusa maraña.

Una compleja página web requiere de una cuidadosa planificación. Siempre debería utilizarse un procedimiento o una metodología que guíe nuestro diseño Web y nuestros trabajos o proyectos de páginas web en desarollo…

Necesidad de un método de diseño web

En el campo del desarrollo Web existe hoy una crisis similar a la crisis del Software de final de los años setenta. Hace sólo unos pocos años que la mayoría de los sitios no eran más que folletos digitales, y se les denominaba a menudo folletoware (… ¿?). Para crear éste tipo de página web en ese entonces, no era necesario aplicar una planificación. Con frecuencia, bastaba simplemente, con desarrollar una interfaz y luego ir llenando el sitio con contenido para tener buenos resultados.

Los sitios actuales son mucho más grandes y más complejos. Con el advenimiento del comercio electrónico y de las páginas dinámicas, los sitios se han distanciado claramente en los folletoware, convirtiéndose en aplicaciones de software mucho más maduras. Sin embargo, muchos diseñadores de páginas web (webmasters) no han adoptado una doctrina o metodología estricta.

Para disminuir la dificultad o fracaso en la construcción de Sitios web, deberíamos adoptar un método modelo que describa las diferentes fases presentes en el desarrollo de sitios Web. A continuación, el diseñador puede llevar a la práctica cada uno de los pasos, utilizando las guías y la documentación que le muestra al diseñador el modo de hacer las cosas para asegurarse que cada paso se realiza adecuadamente.

Un modelo de procedimiento ideal para el desarrollo Web ayudaría al diseñador (webmaster) a superar la complejidad o fracaso del sitio, a minimizar el riesgo de fallo del proyecto, a encargarse de los cambios que, con toda certeza, surgirán durante la realización del proyecto y a entregar el sitio con rapidez proporcionando la información necesaria para poder realizar toda la gestión durante el proceso.

La idea es planificar bien el objetivo de nuestra página web para así implementar todas éstas recomendaciones que te he facilitado.

Construye sitios web pensando en los usuarios

Probablemente este apartado tenga mucho que ver con términos como usabilidad, accesibilidad, facilidad, eficacia, sencillez y sensatez en el diseño web.

Un error frecuente en el desarrollo web es que los sitios se construyen más para los diseñadores y sus necesidades que para los verdaderos usuarios finales que son los que generalmente nos traerán beneficios o casos de éxito.

El modelo de proceso del diseño web no garantizará la obtención de un buen sitio si los diseñadores ignoran las necesidades de los usuarios. Una normativa que tú como webmaster es que debes asumir que tú no eres el usuario.

Lo que el diseñador entiende no es lo que un usuario entenderá. Como diseñador, tienes profundo conocimiento del sitio Web, conoces dónde se encuentran la información, sabes cómo instalar programas complementarios, dispones de una resolución óptima de pantalla, has configurado correctamente su navegador, etc.

Es necesario aceptar el hecho de que la mayoría de los usuarios no tienen un profundo conocimiento del sitio que tú estás elaborando tan cuidadosamente. Incluso puede que ni siquiera tengan tus mismos intereses.

Dada la importancia de los intereses y deseos de los usuarios, podría parecer apropiado preguntarles para diseñar el sitio de la manera que ellos desean. Este proceder pudiera parecerle una buena idea, hasta que tengas en cuenta otra normativa del diseño web: los usuarios no son diseñadores.

No todo el mundo es o debe ser diseñador web. Igual que parecería una tontería permitir a los espectadores de cine que intenten dirigir una importancia película porque han visto numerosas películas, no deberías esperar que los usuarios sean capaces de diseñar sitios web simplemente por el hecho de que hayan navegado por miles de sitios a través de los años.

Los usuarios tienen a veces expectativas e imponen requisitos poco realistas para los sitios web a los cuales acceden. Los usuarios no son los que analizan detenidamente los componentes individuales de un sitio web. En resumen, los usuarios no disponen de un conocimiento tan sofisticado de la web como el que tiene un diseñador.

La clave para obtener el éxito en el diseño de un sitio web funcional es pensar siempre teniendo en cuenta el punto de vista dle usuario. Vamos a enfocarnos en el diseño centrado en el usuario lo que, sí, es una expresión con que se denomina al diseño que siempre pone al usuario en primer lugar porque dependemos de ellos.

Pero, ¿qué podemos decir de los usuarios? ¿Hay un usuario tipo? ¿Existe un usuario medio de Internet para quien podamos diseñar nuestros sitios? Probablemente no, pero cuando diseñemos sitios deberíamos tener en cuenta características medias, tales como el tiepo de reacción, la memoria y otras capacidades físicas o cognitivas.

Un repaso a la ciencia cognitiva nos ayudará a comprender capacidades básicas del usuario. Recuerda, sin embargo, que aunque los usuarios puedan tener características básicas similares, cada uno de ellos es único.

Lo que puede parecer sencillo para un usuario será difícil para otros. Los sitios que se construyen para un usuario genérico pueden no satisfacer las necesidades de todos los usuarios. Los usuarios expertos pueden encontrar el sitio muy limitado, mientras que los usuarios novatos pueden encontrarlo muy difícil.

Los usuarios son individuos con ciertas capacidades y características compartidas. Los sitios deberían tener en cuenta las diferencias importantes mientras se concentran en las características comunes.

Para concluir esta reflexión, en una simple lista de cuatro frases, expondré un resumen (o extracto) de todo lo que hemos tocado en este apartado:

- Tú no eres el usuario.
- Los usuarios no tienen un profundo conocimiento.
- Los usuarios no son diseñadores.
- Diseña para el usuario medio, pero ten en cuenta las diferencias.

El contenido de un sitio web es muy importante

Los sitios web suelen estar más enfocados al contenido que el software tradicional. La intersección entre un sitio y su contenido, a menudo, es muy difuminada.

El contenido es lo que estructura un sitio web.

A los diseñadores y mantenedores de sitios web (webmasters), el contenido nos proporciona los ladrillos para nuestra pirámide virtual. El contenido puede ser texto, imágenes, animación, audio, vídeo, o la mezcla de alguna de estas formas.

Un contenido original y de calidad es el activo más importante de la web. Los usuarios buscan contenidos útiles y, cuando los encuentran, los consumen con voracidad.

Aunque utilizar unos gráficos atractivos para facilitar la navegación o unos diseños de aspecto sofisticado puede animar a los usuarios a navegar por un sitio, no los retendrá allí durante mucho tiempo.

Finalmente, los usuarios comenzaron a explorar el sitio con la intención de hacer algo útil o encontrar algún contenido de valor. Si no hay nada útil, abandonarán el sitio. Sin embargo, incluso existiendo un contenido de calidad, no tendrá valor si el usuario no puede extraerlo.

Los usuarios necesitan ayuda para no perderse en un sitio. Estructurar de forma clara el sitio web que estamos elaborando sí ayuda…, pero una buena navegación y experiencia de usuario necesita algo más que una buena estructura.

Asignar nombres claros a los vínculos, agrupar de forma lógica los botones, emplear títulos de página claros y elementos de navegacón consistentes, también incluye para que el usuario encuentre el camino.

El diseño de la navegación es realmente importante, los diseñadores emplean tanto tiempo intentado organizar un sitio de una manera lógica que, finalmente, olvidan el concepto mismo de navegación.

Los mejores diseños web son, a menudo, aquellos que emplean una navegación sencilla y refinada. Recuerda siempre que los usuarios no se conectan a tu sitio para maravillarse con los ingeniosos métodos de navegación empleados.

Los visitantes utilizan la navegación para moverse en busca de la información deseada. La navegación es, sencillamente, la herramienta que utilizan para encontrar la información que requieren.

Si el método de navegación utilizado es realmente ingenioso es un tema que pasará prácticamente inadvertido. Recuerda que desde la perspectiva del usuario lo importante no es el movimiento o la ejecución, sino los resultados que consigue o el contenido que encuentra.

De hecho, a pesar del análisis de la estructura y del sistema de navegación empleado en el sitio, resultado muy dudoso que los usuarios presten especial interés en saber dónde se encuentran dentro de un sitio.

Los usuarios no organizan diagramas de flujo mentales ni pierden el tiempo dibujando relaciones de organización complejas. En general, los usuarios sólo desean conocer su ubicación de un sitio cuando no encuentran lo que están buscando.

Siempre que los usuarios piensen que están siguiendo el camino correcto para llegar al resultado esperado, la navegación será la adecuada.

Por supuesto, debido a las diferencias existentes entre los usuarios, es imposibel desarrollar un sistema de navegación perfecto; aunque existan estándares, no hay hasta ahora un estándar único del tipo de usuario.

Los usuarios necesitarán cierta asistencia para encontrar su camino, por ejemplo, un motor de búsqueda interno en tu sitio web, un plano o un índice del sitio, o, incluso, un sistema de ayuda que les guíe para conseguir sus objetivos.

Sugerencias y consejos en Accesibilidad en páginas web

Es justo y necesario complementar el artículo anterior donde tocábamos aspectos o mejor dicho, los principios básicos relacionados con la accesibilidad web en sitios.

Con el objetivo de ampliar más la información que debe tomarse en cuenta sobre la accesibilidad en páginas web, he recopilado una serie de sugerencias que la misma W3C han planteado desde sus inicios.

• Proporciona alternativas equivalentes para los contenidos auditivo y visual.

En otras palabras, no confíes solamente en una única forma de comunicación. Si utilizas botones, proporciona vínculos de texto. Si utilizas sonido, proporciona a tus usuarios una transcripción textual del mensaje, etc.

• No confíes únicamente en el color.

No todo el mundo puede ver los colores de manera correcta, de forma que si se utiliza únicamente el color para proporcionar determinadas informaciones, por ejemplo, usar el color azul para indicar la existencia de un vínculo, las personas que no puedan diferenciar los colores o aquellos usuarios que usen dispositivos monocromos no podrán saber qué se les está presentando.

Es necesario evitar combinaciones de colores con matices similares o aquellos con contraste insuficiente -fundamentalmente si van a verse en pantallas mono- cromas o por personas con algún tipo de deficiencia de visión del color.

• Utiliza hojas de estilo y de marcado, y hágalo de forma adecuada.

Básicamente, asegúrate de utilizar HTML para la estructura del sitio y CSS para la presentación. Particularmente, entonces evita el uso de elementos propietarios de presentación o de marcado y duda utilizar tecnologías que puedan no aparecer de la misma forma en diferentes exploradores.

• Aclara el uso del lenguaje natural.

Asegúrate de definir los términos y utilice un sistema de marcado para resaltar las abreviaturas, las definiciones, las citas, etc. En otras palabras, utiliza un sistema de marcado más lógico. Además, asegúrate de indicar claramente el idioma que se usa en el documento, para que el explorador pueda cambiar a otro distinto.

• Crea tablas que se adapten adecuadamente.

En resumen, en el futuro, cuando el CSS sea un estándar, no utilices tablas para definir la estructura, utilízalas para representar datos tabulados en forma de hojas de cálculo. Cuando utilices tablas, incluya encabezamientos, títulos de las filas y de las columnas, y otras indicaciones claras que faciliten la interpretación de los contenidos de las celdas.

• Garantiza que las páginas que utilicen algunas nuevas tecnologías se transformen adecuadamente y sean visibles en diversos navegadores.

Básicamente, si vas a utilizar lo último en tecnología de diseño, asegúrate que esta nueva tecnología se degrada adecuadamente cuando el usuario use un explorador antiguo. Por ejemplo, si estás utilizando JavaScript, ¿seguirá funcionando correctamente la página si usa un explorador que no sea compatible con este lenguaje?

• Asegúrate que el usuario controla los cambios del contenido sensibles al tiempo.

Asegúrate que el usuario puede detener de forma temporal o total los traslados, los parpadeos, los desplazamientos de los objetos o la actualización del contenido de las páginas. Además de ser muy molestos, tales distracciones pueden dificultar la concentración del usuario en el sitio.

• Garantiza la accesibilidad directa de las interfaces de usuario incrustadas.

Si usas una interfaz dentro de una página, por ejemplo, una aplicación Java que cuente con su propia interfaz interna, asegúrese de su accesibilidad.

• Diseña con independencia de los dispositivos.

Intenta crear interfaces que funcionen bajo múltiples dispositivos, incluyendo diferentes tamaños de pantalla, distintos dispositivos de visualización (teléfonos móviles frente a computadoras), y utilizando otros dispositivos de manipulación, tales como sólo teclado o ratón y teclado.

Un tema especialmente importante es asegurarse que un sitio no depende únicamente del ratón para su exploración. Algunos usuarios pueden encontrar serias dificultades a la hora de manejar el ratón y los usuarios expertos pueden preferir el empleo del teclado.

• Usa soluciones provisionales.

Puesto que no todos los exploradores soportarán completamente las mismas tecnologías o los estándar, asegúrate de proporcionar alternativas para exploradores no compatibles.

• Utiliza tecnologías y directrices W3C.

Es una sugerencia en cierto modo evidente, pero ocasionalmente molesta. Por supuesto que tú siempre deberías intentar seguir las directrices de W3C, al menos en espíritu. Sin embargo, tenga cuidado, puesto que muchas directrices de W3C no son más que ideas propuestas y los exploradores pueden no dar un soporte consistente o significativo para una detenninada especificación.

• Proporciona información de contexto y de orientación.

En cierto sentido, esto significa simplemente que trate de explicar las cosas o que proporcione instrucciones para poder abordar con éxito partes complejas.

Deberías intentar crear páginas en las que el significado de los vínculos esté claro utilizando mensajes de ayuda o notas especiales. Dicho en términos sencillos, todo sitio Web debe disponer de un sistema de ayuda.

• Proporciona mecanismos claros de exploración.

Básicamente, tu sitio deberá contar con un sistema de exploración fácil de entender y perfectamente visible. También deberá proporcionar otras ayudas a la exploración, tales como motores de búsqueda, planos del sitio e índices del mismo.

• Asegúrate que los documentos son claros y sencillos.

Otra sugerencia no por obvia menos importante, es que la simplicidad mejorará la accesibilidad. Dado que no todo el mundo puede entender con facilidad el idioma en que desarrolle sus páginas Web, y teniendo en cuenta que la facilidad de empleo está relacionada de forma directa con la sencillez y la consistencia, intenta hacer tus documentos sencillos.

Además de la inspección manual de un sitio, es bastante sencillo evaluar su accesibilidad utilizando herramientas tales como Bobby. Esta herramienta analizará una página Web y comprobará si cumple con ciertos criterios básicos de accesibilidad, tales como el uso de texto ALT.

KompoZer: Completo editor visual de páginas web

Si con Dreamweaver sientes que te falta mucho más por conocer, o al menos quisieras probar algunas alternativas libres al mismo, pues estás leyendo lo que precisamente buscabas: KompoZer, un excelente editor HTML para trabajar visualmente.

KompoZer es un editor visual de páginas web (lo que se conoce como WYSIWYG , lo que ves es lo que obtendrás) con excelentes funciones, además con sus útiles posibilidades, multiplataforma, ligero (no consume muchos recursos) y de código abierto.

En principio comienzo por decir que KompoZer es portable, es decir que no requiere de instalación. El mismo viene comprimido, lo único que necesitas es descomprimir el programa en una carpeta y ejecutarlo para empezar a crear tus páginas web.

KompoZer ha sido creado especialmente para los usuarios novatos que no tienen altos conocimientos en HTML y quieren crear páginas web con aspectos profesionales; su uso es sencillo, perfecto para escribir páginas web de forma sencilla con resultados eficaces.

Entre otras cosas, KompoZer incluye un gestor de sitios FTP, incluye una perfecta organización y navegación a través de pestañas para que cambies entre los diversos modos de edición disponibles: visual, por código, entre otras; y editar múltiples páginas.

KompoZer soporta tablas, formularios, plantillas y más; además de que es compatible con estándares web como CSS. Su barra de tareas son personalizables, contiene un potente selector de colores, y en definitiva, una de las mejores alternativas para el desarrollo web.

Sitio oficial | KompoZer
Descargar KompoZer

Descargar Adobe Dreamweaver CS3 Portable

Principales funciones nuevas de Adobe Dreamweaver CS3

Framework de Spry para Ajax
Con Adobe® Dreamweaver® CS3, puede diseñar visualmente, desarrollar y desplegar interfaces de usuario empleando el framework de Spry para Ajax. El framework de Spry para Ajax es una biblioteca JavaScript que proporciona a los diseñadores Web la capacidad de crear páginas que ofrezcan una experiencia más completa a los usuarios. A diferencia de otros frameworks Ajax, Spry es accesible tanto para diseñadores como para desarrolladores, ya que es en un 99% código HTML. Consulte Creación visual de páginas de Spry.

Widgets de Spry
Los widgets de Spry son componentes comunes de interfaz de usuario listos para ser utilizados que puede personalizar mediante CSS y, posteriormente, añadir a sus páginas Web. Con Dreamweaver, puede añadir a las páginas diversos widgets de Spry, incluidas listas y tablas gestionadas mediante XML, acordeones, interfaces en fichas y elementos de formulario con validación. Consulte Adición de widgets de Spry.

Efectos de Spry
Los efectos de Spry ofrecen un método sencillo y elegante para mejorar el aspecto y el funcionamiento de un sitio Web. Puede aplicarlos prácticamente a cualquier elemento de una página HTML. Puede añadir efectos de Spry para aumentar o reducir el tamaño de elementos; hacer que se desvanezcan o resaltarlos; modificar visualmente un elemento de una página durante un período de tiempo determinado, etc. Consulte Adición de efectos de Spry.

Integración de Photoshop CS3 avanzada
Dreamweaver incluye integración avanzada con Photoshop CS3. Los diseñadores ahora pueden simplemente seleccionar cualquier parte de un diseño en Photoshop (que abarque incluso varias capas) y pegarla directamente en una página de Dreamweaver. Dreamweaver muestra un cuadro de diálogo en el que puede especificar las opciones de optimización de la imagen. Si en algún momento necesita editar la imagen, sólo tendrá que hacer doble clic en ella para abrir el archivo PSD con las capas originales y modificarla en Photoshop. Consulte Utilización con Photoshop.

Comprobación de compatibilidad con navegadores
La nueva función Comprobación de compatibilidad con navegadores de Dreamweaver genera informes que identifican problemas de representación relacionados con CSS en diversos navegadores. En la vista Código, los problemas se indican mediante un subrayado verde para que sepa dónde se encuentran exactamente. Una vez que haya identificado el problema, podrá resolverlo rápidamente si conoce la solución o visitar Adobe CSS Advisor si necesita más información. Consulte Comprobación de problemas de representación de CSS con distintos navegadores.

Adobe CSS Advisor
El sitio Web de Adobe CSS Advisor contiene información sobre los problemas de CSS más recientes y puede obtener acceso a él directamente desde la interfaz de usuario de Dreamweaver durante el proceso de Comprobación de compatibilidad con navegadores. Más que un foro, una página estilo wiki o un grupo de debate, CSS Advisor facilita la adición de comentarios con sugerencias y mejoras al contenido existente, así como la incorporación de nuevos problemas que puedan beneficiar a toda la comunidad de usuarios. Consulte Comprobación de problemas de representación de CSS con distintos navegadores.

Diseños CSS
Dreamweaver ofrece un conjunto de diseños CSS predefinidos que le permiten crear páginas con rapidez y le ayudan a conocer el diseño de páginas CSS mediante amplios comentarios en línea incluidos en el código. La mayoría de los diseños de sitios existentes en la Web pueden agruparse en tres categorías: diseños de una, dos o tres columnas, cada uno de ellos con una serie de elementos adicionales (como los encabezados y pies de página). Dreamweaver ofrece ahora una lista completa de diseños esenciales que puede personalizar para adaptarlos a sus necesidades. Consulte Creación de una página con un diseño CSS.

Administración de CSS
La función de administración de CSS facilita el traslado de reglas CSS de un documento a otro, de la sección head de un documento a una hoja externa, entre archivos CSS externos, etc. También puede convertir CSS en línea en reglas CSS y colocarlas en el lugar en el que sean necesarias simplemente arrastrándolas y colocándolas. Consulte Desplazamiento de reglas CSS y Conversión de CSS en línea en una regla CSS.

Adobe Device Central
Adobe Device Central, que se encuentra integrado en Dreamweaver y en el resto de productos de software de la familia Creative Suite 3, simplifica la creación de contenido móvil permitiéndole un acceso rápido a especificaciones técnicas esenciales para cada dispositivo y reduciendo el texto y las imágenes de la página HTML para mostrar una representación precisa de cómo aparecerían en el dispositivo. Consulte Obtención de vista previa de páginas en dispositivos móviles.

Adobe Bridge CS3
Utilice Dreamweaver con Adobe Bridge CS3 para administrar imágenes y activos de manera sencilla y coherente. Adobe Bridge ofrece un acceso centralizado a los archivos de proyectos, aplicaciones y parámetros de configuración, además de prestaciones de asignación y búsqueda de etiquetas de metadatos XMP. Gracias a sus funciones para organizar y compartir archivos, además del acceso a Adobe Stock Photos, Adobe Bridge proporciona un flujo de trabajo más eficiente y le permite un mayor control de sus proyectos de impresión, Web, vídeo y móvil. Consulte Utilización con Bridge.

Descarga:

http://xirror.com/spread/66086154/AdobreamweaverCS3-Portable_Hendoone.rar.html

WordPress y Joomla Dreamweaver extension

WordPress Dreamweaver extension

WordPress Dreamweaver extensión, que básicamente nos permitía estructurar themes para wordpress utilizando Dreamweaver. Entre las tantas opciones que podremos encontrar, incluye código para:

• Include Header
• Include Sidebar
• Comments Template
• Include Footer
• Categories ASC & DESC
• Lastest 10 Post
• Dynamic Title Tag
• Entry Content
• etc…

Enlace Descarga version Dreamweaver 8 (Vikiworks)

Joomla Dreamweaver extension

Para los que diseñan bajo joomla, Dreamweaver extension Joomla es una útil extensión que les permitirá estructurar y crear bajo Dreamweaver plantillas para sus blog. También posee buenas opciones, de las cuales podrán sacar provecho.

Aprender CSS en Dreamweaver CS3

Introducción

* Historia y el por qué de CSS
* La importancia de una buena escritura de XHTML

Funcionamiento

* Entendiendo y armando una regla CSS
* Formas de Aplicar el CSS en un documento
* Sobre la herencia y la cascada
* Elementos con que se relaciona CSS
* El modelo de caja

CSS y Dreamweaver

* Creación y Edición de estilos CSS con Dreamweaver CS3
* Edición directa en el código fuente usando Dreamweaver CS3
* El administrador de estilos CSS de Dreamweaver CS3

Aplicando CSS a

* textos
* vínculos
* listas
* imágenes
* tablas
* listas
* formularios

Diagramación de páginas

* páginas fijas
* páginas líquidas
* páginas elásticas
* páginas híbridas
* Elementos de Interfaz

Validación de CSS

* La importancia de la definición del documento html para css
* La importancia de saber las caracteristicas de los navegadores
* Validando con Dreamweaver
* Uso del validador de W3C
* Uso del check browser compatibility y el consejero CSS
* Los hacks y sus problemas con la validación.

CSS y otros Medios

* Uso de CSS en otros dispositivos
* XML y CSS

Acceder al curso

Manual Adobe Dreamweaver CS3

Tipo de Manual: PDF
Cantidad de Páginas: 1212
Idioma: Inglés
Peso del archivo: 22,49 MB.

ÍNDICE DEL MANUAL DE ADOBE DREAMWEAVER CS3

Acknowledgments
Introduction
Part I: Laying the Groundwork in Dreamweaver CS3
Chapter 1: What’s New in Dreamweaver CS3
Chapter 2: Introducing Dreamweaver CS3
Chapter 3: Touring Dreamweaver
Chapter 4: Setting Your Preferences
Chapter 5: Setting Up Sites and Servers
Part II: Designing and Crafting Core Pages
Chapter 6: Accessing the Code Directly
Chapter 7: Building Style Sheet Web Pages
Chapter 8: Working with Text
Chapter 9: Inserting Images
Chapter 10: Establishing Web Links
Part III: Adding Advanced Design Features
Chapter 11: Working with Divs and AP Elements
Chapter 12: Using Behaviors
Chapter 13: Setting Up Tables
Chapter 14: Interactive Forms
Chapter 15: Creating Lists
Chapter 16: Using Frames and Framesets
Chapter 17: Working with Timelines
Chapter 18: Powering Ajax Pages with Spry
Part IV: Incorporating Dynamic Data
Chapter 19: Establishing Connections and Recordsets
Chapter 20: Making Data Dynamic
Chapter 21: Managing Data
Chapter 22: Working with Live Data
Chapter 23: Crafting Multiple-Page Applications
Part V: Including Multimedia Elements
Chapter 24: Adobe Photoshop, Fireworks, and Bridge Integration
Chapter 25: Inserting Flash and Shockwave Elements
Chapter 26: Adding Video to Your Web Page
Chapter 27: Using Audio on Your Web Page
Part VI: Enhancing Productivity and Web Site Management
Chapter 28: Using Dreamweaver Templates
Chapter 29: Using Repeating Elements
Chapter 30: Maximizing Browser Targeting
Chapter 31: Building Web Sites with a Team
Chapter 32: Integrating with XML and XSLT
Part VII: Extending Dreamweaver
Chapter 33: Customizing Dreamweaver
Chapter 34: Handling Server Behaviors
Part VIII: Appendix
Appendix A: What’s on the CD-ROM?
Bonus Chapters
Bonus Chapter 1
Bonus Chapter 2
Index
End-User License Agreement
ix

Descargar Manual Adobe Dreamweaver CS3

Tips para Dreamweaver CS3

En el siguiente artículo presentamos algunos consejos útiles para los usuarios de Dreamweaver CS3.

Dreamweaver es una poderoso Editor WYSIWYG de páginas web. Este producto fue creado por Macromedia y luego adquirido por Adobe. La última versión de este producto Adobe Dreamweaver CS3, incorpora muchas mejoras que hacen que nuestro trabajo sea más sencillo y ahorra tiempo en el desarrollo de proyectos.

Esta poderosa herramienta es muy utilizada por los programadores y diseñadores web, entre los lenguaje que podemos utilizar para crear nuestros sitios web se encuentran (HTML, ColdFusion, PHP, ASP, XSLT, CSS, JavaScript, XML, JSP, ASP .Net).

Razones que plantea Adobe por las cuales debemos actualizar:

• Estructura Spry para Ajax
• Datos Spry
• Objetos Spry
• Efectos Spry
• Integración con Adobe Photoshop® y Fireworks®
• Comprobación de compatibilidad con el explorador
• Sitio web CSS Advisor (Asesor de CSS)
• Diseños de CSS
• Gestión de CSS
• Adobe Device Central CS3

Definir Sitio:

Definir un sitio nos ayuda a administrar de una forma más fácil nuestro sitio web, ya sea local o remoto. También nos posibilita el uso de “Templates”, crear caché de nuestro sitio entre otras posibilidades. Para ello debemos ir a la ventana “Files” u oprimir la tecla “F8”.

Uso de Templates:

El uso de Templates nos ayuda a mantener una plantilla de nuestro sitio. Esto nos posibilita el no tener que modificar todo el sitio cuando necesitamos realizar cambios. Para ello debemos seleccionar regiones editables.

• Make Template: esta opción nos permite salvar nuestra página web como plantilla, podemos definir su nombre. El sitio con el cual usaremos la plantilla.
• Editable Region: con ésta opción podemos definir las regiones que serán editables en el sitio. Debemos tener en cuenta que las regiones no editables deberán modificarse desde la plantilla.

Para crear una página desde la platilla es necesario crear un nuevo documento y seleccionar desde plantilla, luego nos mostrará una lista de las plantillas que hemos creado.

Chequear la compatibilidad de las páginas Web:

El verificar nuestro sitio es un paso importante ya que nos ayuda a comprobar si el mismo es compatible o no, con la mayoría de los navegadores. Con la opción “Check Browser Compatibility” podemos verificar la compatibilidad. Nos mostrará los resultados en la ventana de resultados.

Podemos configurar los navegadores con los cuales analizaremos la compatibilidad y su versión, para ello solo debemos ir a “Settings”.

Validación de documentos:

Debemos tener en cuenta lo útil y necesario que es el realizar validaciones de nuestro sitio. Podemos configurar las validaciones de los documentos en “Settings”.

Estas validaciones se realizan en el documento actual, en el sitio completo que tenemos definido, o seleccionar los ficheros que deseamos validar.

Usar HTML en caracteres especiales:

En muchas ocasiones encontramos páginas web que en lugar de mostrarnos los caracteres especiales como vocales con tildes (á, é, í, ó, ú) muestras caracteres extraños ilegibles . Para que esto no ocurra debemos sustituirlo por su código HTML.

Entre los caracteres especiales que más usamos encontramos:

• á - á
• é - é
• í - í
• ó - ó
• ú - ú

Estos caracteres especiales los podemos encontrar en la pestaña “Text” que se encuentra en la ventana “Insert”.

Es muy aconsejable usarlos siempre que necesitemos insertar estos tipos de caracteres.

Usar la Regla:

Esta importante opción que muchas veces pasamos por alto nos ayuda a mantener una alineación de nuestro diseño.

Si pinchamos la regla con el clic izquierdo del mouse y arrastramos hacia el área de trabajo, nos mostrará unas líneas que nos ayudarán a mantener en alineación los objetos de nuestro diseño.

Usar hojas de estilos CSS:

Es muy útil tener organizado los estilos en un fichero. En la esta ventana CSS se encuentra en la parte derecha de Dreamweaver, también podemos activarla con las teclas “Shift+F11”.

Con los botones de la parte inferior derecha podemos:

• Adjuntar una hoja de estilo externo.
• Agregar una nueva regla.
• Editar regla.
• Eliminar regla.

Vincular hojas de estilos a nuestras páginas del sitio nos ayuda a no repetir los códigos, y al realizar un cambio solo hacerlo en el fichero CSS.

Vista previa:

Esta opción nos permite tener una vista previa de nuestras páginas web. En la lista de navegadores podemos seleccionar el navegador con el que deseamos realizar la vista previa. También podemos Editar esta lista en la opción “Edit Browser List”.

Dreamweaver CS3 incorpora una nueva opción que nos permite tener una vista previa de nuestra Web en diferentes marcas y modelos de teléfonos celulares, esta opción se llama “Preview in Device Central”.

Barra de código:

Esta barra nos permite varias opciones como:

• Crear nuevo documentos.
• Colapsar código completo.
• Colapsar código seleccionado.
• Expandir todo.
• Seleccionar código.
• Mostrar número de líneas.
• Señalar código no válido.
• Crear comentario.
• Borrar comentario.
• Mover estilos a un fichero externo.
• Alinear código.
• Aplicar formato al códigos.

Utilizar Spry framework para AJAX:

Entre las mejoras incorporadas en Dreamweaver CS3 en esta nueva versión, se encuentran el SPRY framework para AJAX.

El Spry framework para Ajax esta compuesto por librerías Javascript para proveer funcionalidades en el diseño Web.

Los Spry de Datos nos permite mostrar datos desde un XML. Veremos en varios pasos como crearlo. Primeramente debemos definir los “Spry XML Data Set”, en este caso hemos utilizado el xml de Maestros del Web.

Pasos 1 : Spry XML Data Set

Definir el XML del cual podremos leer los datos.

• Data Set Name: Aquí definiremos el nombre, podemos definir el que deseemos. En este caso usamos “MaestrosDelWeb”.
• XML Source: Ruta donde se encuentra el XML, del cual se leerán los datos (preferiblemente debe estar dentro del directorio del sitio).
• Get schema: Al presionar este botón se verifican los elementos que contiene.
• Row element: Seleccionamos los elementos a mostrar. En este caso seleccionamos “item”, ya que son solo esos datos los que necesitamos leer.
  También podemos definir el tipo de datos, dirección, el tiempo en que se refrescaran los datos.
• Luego presionamos el botón “OK”, si todo esta correcto.

Paso 2 : Spry Region. Insertar la región de los Spry

Aquí se definirá el contenedor de los datos, el tipo, y el “Spry Data Set” a utilizar. En el paso anterior lo definimos con el nombre “MaestrosDelWeb”.

Spry Repeat. Mostrar los diferentes registros o item del XML. Si agregamos directamente los “Spry Repeat” sin seleccionar los “Spry Region” este nos preguntará si deseamos agregarla. Como es un paso necesario debemos agregarla.

Si solo deseamos mostrar un solo registro o item del XML no necesitamos usar los “Spry Repeat”. Estos nos permitirán recorrer todos los item del XML, para poder mostrarlos.

Pasos 3 : Insert Spry Repeat List. Insertar en forma de lista

Esta opción nos permite insertar los datos provenientes del xml en forma de lista. Podemos seleccionar el contenedor. El nombre del Spry de Datos “MaestrosDelWeb” y los datos que mostraremos. Estos podemos agregarlos de uno en uno si queremos mostrar varios. Insert Spry Table. Insertar en forma de tabla.

Y esta opción para resolver nuestros problemas cuando queremos mostrar nuestros datos en forma de tabla.

• Spry Data Set: Seleccionamos el nombre de nuestro Spry de Datos.
• Columns: Agregamos/Quitamos columnas, y la cambiamos de posición.
• Luego oprimimos OK.

Las otras opciones podemos ajustarlas a nuestro gusto, estilos y demás. Estos también pueden ser insertados por la Ventana de Aplicación “Bindings”, podemos mostrarla de forma rápida con las teclas “Ctrl+F10”. Podemos marcarlos y arrastrarlos.

Con los Spry de Validación podemos validar Campos de Texto, Listas Desplegables, Checkbox. Esta importante función nos brinda la posibilidad de validar los formularios de nuestro sitio web de parte del cliente, sin necesidad de realizar un POST a nuestro sitio.

Al seleccionar esta opción, podemos seleccionar el tipo de validación del campo, que puede ser Correo Electrónico, Dirección IP, Fecha, URL, Código Postal, etc. Podemos definir el formato con el que se va a validar. Definir una cantidad mínima y máxima de caracteres.

Los Spry Layout, nos brindan la posibilidad de crear interfaces de usuarios más dinámicas mediante componentes AJAX.

• Spry Menu Bar: nos brindan la posibilidad de crear menús horizontales y verticales. En las propiedades podemos configurarlo y adaptarlo a nuestras necesidades.



• Spry Tabbed Panels: como su nombre lo indica podemos crear paneles tabulados de una forma muy fácil.
• Spry Accordion, con esta opción podemos crear menú en forma de Acordión.
• Spry Collapsible Panel, nos permite crear paneles plegables, con los mismos podemos mostrar y ocultar información al seleccionarlos.

Esperamos que estos tips les permitan hace buen uso de las diferentes opciones que brinda Adobe Dreamweaver CS3 y compartan su experiencia en los comentarios en el uso del programa.

Dreamweaver CS3 portable

Titulo: Adobe Dreamweaver CS3 Portable
Idioma: Ingles
Tamaño: 67.85 MB

Requisitos:
Procesador Intel® Pentium® 4, Intel Centrino®, Intel Xeon® o Intel Core™ Duo (o compatible)
Microsoft® Windows® XP con Service Pack 2 o Windows Vista™ Home Premium, Business, Ultimate o Enterprise (certificada para ediciones de 32 bits)
512 MB de RAM
40 MB de espacio disponible en el disco duro (se necesita espacio libre adicional durante la instalación)
Resolución de pantalla de 1.024 x 768
Unidad de DVD-ROM
Software QuickTime 7 necesario para funciones multimedia
Es necesaria una conexión a Internet o telefónica para activar el producto

Descargar

Video Tutorial en Español de Dreamweaver CS3

Dreamweaver CS3 no sólo supone la primera versión del potente programa de diseño web desde que está bajo el tutelaje de su nuevo propietario, Adobe, sino que también se trata de la primera versión que funciona de forma nativa en los Mac basados en procesadores Intel.

Dreamweaver CS3 ofrece nuevas herramientas para diseñadores y también una muestra de cómo pueden beneficiarse los usuarios de Dreamweaver de la integración con el resto de los programas que componen la Creative Suite.

Aqui el videotutorial..

Dreamweaver CS3

Presentación oficial de Dreamweaver CS3

Unas diapositivas on-line en la cual podrán conocer las bondades del software y todas las novedades que trae esta nueva versión http://adobechats.adobe.acrobat.com/p34836888/