Si quieres crear sitios web pero lo tuyo no es programar, tus plegarias han sido escuchadas. Muse
es una aplicación que Adobe acaba de anunciar en versión beta (la
versión final se espera para los primeros meses del 2012) la cual
permite crear sitios web completos bajo estándares actuales (HTML5, CSS3, JS, etc) sin necesidad de escribir ni una sola línea de código de ningún tipo.
Muse es una aplicación que sólo se podrá obtener por suscripción con lo siguientes costos:
Suscripción por un año: US$180 (o $15/mes)
Suscripción mes a mes: US$20/mes
Siempre me han dicho que una web debe hacerse por código, por qué ahora está bien hacerlo con un editor visual?
Muse está desarrollado para que cada herramienta y función genere código estandarizado y actualizado (HTML5, CSS3, JS, etc) el cual a su vez es más fácil de crear que en las versiones anteriores. Otras herramientas como Fireworks
están diseñadas originalmente para crear elementos visuales y
porteriormente se le agregó la capacidad de generar código mediante
exportación el cual no sirve para la producción final.
Puedo hacer cualquier sitio web con Muse?
Muse está
orientado a la creación de sitios web visuales sin integración con CMS,
por lo tanto es fácil preveer que va a ser usado con agrado por
diseñadores; sin embargo, acualmente se trata de una versión beta, por
lo cual es probable que la versión final y las versiones futuras
agreguen mas funcionalidades como integración con CMS y creación de
contenido para dispositivos móviles ya que como dice Adobe: “En los
inicios del Desktop Publishing, PageMaker podía realizar solo una
pequeña parte de todos los tipos de publicaciones que se requerían, de
la misma manera Muse va a iniciar permitiendo crear una pequeña parte de todos los sitios web“.
Con qué navegadores son compatibles los sitios web creados con Muse?
Firefox 4.0 y 5.0 para Mac y Windows
Internet Explorer 7, 8 y 9 para Windows
Safari 5 para Mac
Chrome para Windows
El objetivo es permitir a los diseñadores obtener un producto sin
necesidad de depender en exceso de alguien que programe el concepto.
Para eso han creado Adobe Muse, en AIR, con opciones y
sistemas de trabajo que permiten a los que trabajan con InDesign,
Illustrator o Photoshop desarrollar webs en relativamente poco tiempo. La
idea no es crear un complemento para DreamWeaver y sí un producto
completamente diferente capaz de generar el código sin que el usuario lo
note, siendo gratuita durante los próximos meses y con una versión de
suscripción después de esta fase beta.
Cómo a aprendo a usar Muse?
Puedes tomar el que probablemente sea el mejor video-curso en español de Muse en Udemy, también puedes probar la versión beta de ésta aplicación descargándo de su sitio web oficial
donde encontrarás información y tutoriales.
es una aplicaciòn programa de estudio (basada en la forma de estudio de Adobe Flass) que está destinada a la construcción, diseño y edición de sitios, vídeos y aplicaciones WEB basados en estándares. Creado inicialmente por macromedia (actualmente producido por Adobe Systems)
es uno de los programas más utilizados en el sector del diseño y la
programación web por sus funcionalidades, su integración con otras
herramientas como Adobe Flass y, recientemente, por su soporte de los estándares del World Wide web Consontriun
Sus principales competidores son Microsoft Exp Microsoft Expression Web y BlueGriffon
(que es de código abierto) y tiene soporte tanto para edición de
imágenes como para animación a través de su integración con otras. Hasta
la versión MX, fue duramente criticado por su escaso soporte de los
estándares de la web, ya que el código que generaba era con frecuencia
sólo válido para Internet Explorer y no validaba como HTML estándar. Esto se ha ido corrigiendo en las versiones recientes.
Se vende como parte de la suite Adobe Creative Suite. A partir de la
compra de Macromedia por parte de Adobe. Las letras CS significan
Creative Suite
La gran ventaja de este editor sobre otros es su gran poder de
ampliación y personalización, puesto que en este programa sus rutinas
(como la de insertar un hipervínculo, una imagen o añadir un
comportamiento) están hechas en Javascript-C, lo que le ofrece una gran flexibilidad en estas materias. Esto hace que los archivos del programa no sean instrucciones de C++ sino rutinas de Javascript
que hace que sea un programa muy fluido y todo ello permite que
programadores y editores web hagan extensiones para su programa y lo
pongan a su gusto.
Las versiones originales de la aplicación se utilizaban como simples editores WYSIWYG. Sin embargo, versiones más recientes soportan otras tecnologías web como CSS, JavaScript y algunos frameworks del lado servidor.
Dreamweaver ha tenido un gran éxito desde finales de los años 1990 y
actualmente mantiene el 90% del mercado de editores HTML. Esta
aplicación está disponible tanto para la plataforma MAC como para Windows, aunque también se puede ejecutar en plataformas basadas en UNIX utilizando programas que implementan las API's de Windows, tipo Wine.
Como editor WYSIWYG que es, Dreamweaver permite ocultar el código HTML
de cara al usuario, haciendo posible que alguien no entendido pueda
crear páginas y sitios web fácilmente sin necesidad de escribir código.
Algunos desarrolladores web criticaban esta propuesta ya que crean
páginas HTML más largas de lo que solían ser al incluir mucho código
inútil, lo cual va en detrimento de la ejecución de las páginas en el navegador web.
Esto puede ser especialmente cierto ya que la aplicación facilita en
exceso el diseño de las páginas mediante tablas. Además, algunos
desarrolladores web han criticado Dreamweaver en el pasado porque creaba
código que no cumplía con los estándares del consorcio Web (W3C).
No obstante, Adobe ha aumentado el soporte CSS y otras maneras de
diseñar páginas sin tablas en versiones posteriores de la aplicación,
haciendo que se reduzca el exceso de código.
Dreamweaver permite al usuario utilizar la mayoría de los navegadores
Web instalados en su ordenador para previsualizar las páginas web.
También dispone de herramientas de administración de sitios dirigidas a
principiantes como, por ejemplo, la habilidad de encontrar y reemplazar
líneas de texto y código por cualquier tipo de parámetro especificado,
hasta el sitio web completo. El panel de comportamientos también permite
crear JavaScript básico sin conocimientos de código.
Con la llegada de la versión MX, Macromedia incorporó herramientas de
creación de contenido dinámico en Dreamweaver. En lo fundamental de las
herramientas HTML WYSIWYG, también permite la conexión a Bases de Datos
como MySQL y Microsoft Access, para filtrar y mostrar el contenido utilizando tecnología de script como, por ejemplo, ASP, ASP.NET, ColdFusion, JSP (JavaServer Pages) y PHP sin necesidad de tener experiencia previa en programación.
Un aspecto de alta consideración de Dreamweaver es su funcionalidad
con extensiones. Es decir, permite el uso de "Extensiones". Las
extensiones, tal y como se conocen, son pequeños programas, que
cualquier desarrollador web puede escribir (normalmente en HTML y
Javascript) y que cualquiera puede descargar e instalar, ofreciendo así
funcionalidades añadidas a la aplicación. Dreamweaver goza del apoyo de
una gran comunidad de desarrolladores de extensiones que hacen posible
la disponibilidad de extensiones gratuitas y de pago para la mayoría de
las tareas de desarrollo web, que van desde simple efectos rollover
hasta completas cartas de compra.
También podría decirse que, para un diseño más rápido y a la vez fácil, podría complementarse con Fireworks
en donde se podría diseñar un menú u otras creaciones de imágenes (gif
web, gif websnap, gif adaptable, jpeg calidad superior, jpeg archivo más
pequeño, gif animado websnap) para un sitio web y después exportar la
imagen creada y así utilizarla como una sola en donde ya llevará los
vínculos para dicho sitio.
Índice
1
Resaltado de sintaxis
2
Historial de versiones
3
Requisitos del Sistema
4
Véase también
Resaltado de sintaxis
A partir de la versión 5, Dreamweaver admite el resaltado de sintaxis para los siguientes lenguajes por defecto:
ActionScript
Active Server Pages (ASP).
ASP.NET (no se admiten en la versión CS4 - http://kb2.adobe.com/cps/402/kb402489.html)
C#
Cascading Style Sheets (CSS)
ColdFusion
Extensible HyperText Markup Language (XHTML)
Extensible Markup Language (XML)
Extensible Stylesheet Language Transformations (XSLT)
Elemento de lista numerada
Elemento de lista numerada
Historial de versiones
Proveedor
Versión mayor
Versión menor/nombre alternativo
Fecha de publicación
Notas
Macromedia
1.0
1.0
Diciembre de 1997
Primer lanzamiento, sólo para Mac OS.
1.2
Marzo de 1998
Primera versión para Windows.
2.0
2.0
Diciembre dRRe 1998
3.0
4.2
Diciembre de 1999
UltraDev 1.0
Junio de 2000
4.0
4.0
Diciembre de 2000
UltraDev 4.0
Diciembre de 2000
6.0
MX
29 de mayo de 2002
7.0
MX 2004
10 de septiembre de 2003
8.0
8.0
13 de septiembre de 2005
Adobe
9.0
CS3
16 de abril de 2007
Sustituye a Adobe GoLive en la serie Creative Suite
10.0
CS4
23 de septiembre de 2008
11.0
CS5
12 de abril de 2010
11.5
CS5.5
12 de abril de 2011
12.0
CS6
21 de abril de 2012
13.0
CC
Abril de 2013
Color
Significado
Rojo
Versión antigua
Amarillo
Versión antigua; soportada aún
Verde
Versión actual
Requisitos del Sistema
Windows
Procesador Intel® Pentium® 4 o AMD Athlon® de 64 bits
Microsoft® Windows® XP con Service Pack 2 (se recomienda Service
Pack 3); Windows Vista® Home Premium, Business, Ultimate o Enterprise
con Service Pack 1; o Windows 7
512 MB de RAM
1 GB de espacio disponible en el disco duro para la instalación; se
necesita espacio libre adicional durante la instalación (no se puede
instalar en dispositivos de almacenamiento flash extraíbles)
Resolución de 1580 × 800 con tarjeta de vídeo de 16 bits
Java™ Runtime Environment 1.6 (incluido)
Unidad de DVD-ROM
Se necesita el software QuickTime 7.6.6 para la reproducción de contenido multimedia HTML5
Este software no funcionará si no se activa. Es necesario disponer
de conexión a Internet de banda ancha y registrarse para poder activar
el software, validar suscripciones y acceder a servicios online.* No
está disponible la activación por teléfono.
Procesador Intel multinúcleo
Mac OS X v10.6.8 o v10.7. Adobe Creative Suite 5, 5.5 y las
aplicaciones de CS6 son compatibles con Mac OS X Mountain Lion (v10.8)
si se instalan en sistemas basados en Intel.**
512 MB de RAM
1,8 GB de espacio disponible en el disco duro para la instalación;
se necesita espacio libre adicional durante la instalación (no se puede
instalar en un volumen que utilice un sistema de distinción entre
mayúsculas y minúsculas en archivos, ni en dispositivos de
almacenamiento flash extraíbles)
Resolución de 1280 × 800 con tarjeta de vídeo de 16 bits
Java Runtime Environment 1.6
Unidad de DVD
Se necesita el software QuickTime 7.6.6 para la reproducción de contenido multimedia HTML5
Este software no funcionará si no se activa. Es necesario disponer
de conexión a Internet de banda ancha y registrarse para poder activar
el software, validar suscripciones y acceder a servicios online.* No
está disponible la activación por teléfono
Redes sociales
Guias
Android
Juegos
Empresas
Paginas Web
Crear cuenta
Adobe Dreamweaver: ¿qué es y para qué sirve? (descargable)
Adobe Dreamweaver: ¿qué es y para qué sirve? (descargable)
Es un software de edición en forma de un estudio (basado en la forma de
Adobe Flash) su propósito es construir, desarrollar, diseñar y editar
sitios, vídeos y aplicaciones web. Inicialmente fue creado por
Macromedia pero actualmente es desarrollado por Adobe Systems. Adobe
Dreamweaver se ha convertido en el programa más utilizado para el diseño
y la pro...
Es un software de
edición en forma de un estudio (basado en la forma de Adobe Flash) su
propósito es construir, desarrollar, diseñar y editar sitios, vídeos y
aplicaciones web. Inicialmente fue creado por Macromedia pero
actualmente es desarrollado por Adobe Systems. Adobe Dreamweaver se ha
convertido en el programa más utilizado para el diseño y la programación
web, esto gracias a las funciones que posee, su fácil integración a
otros programas como Adobe Flash y recientemente por su soporte para
estándares del World Wide Web Consortium.
Entre los principales competidores que tiene en el m...
Es un software de
edición en forma de un estudio (basado en la forma de Adobe Flash) su
propósito es construir, desarrollar, diseñar y editar sitios, vídeos y
aplicaciones web. Inicialmente fue creado por Macromedia pero
actualmente es desarrollado por Adobe Systems. Adobe Dreamweaver se ha
convertido en el programa más utilizado para el diseño y la programación
web, esto gracias a las funciones que posee, su fácil integración a
otros programas como Adobe Flash y recientemente por su soporte para
estándares del World Wide Web Consortium.
Entre los principales competidores que tiene en el m...
Es un software de
edición en forma de un estudio (basado en la forma de Adobe Flash) su
propósito es construir, desarrollar, diseñar y editar sitios, vídeos y
aplicaciones web. Inicialmente fue creado por Macromedia pero
actualmente es desarrollado por Adobe Systems. Adobe Dreamweaver se ha
convertido en el programa más utilizado para el diseño y la programación
web, esto gracias a las funciones que posee, su fácil integración a
otros programas como Adobe Flash y recientemente por su soporte para
estándares del World Wide Web Consortium.
Entre los principales competidores que tiene en el ...
Es un software de
edición en forma de un estudio (basado en la forma de Adobe Flash) su
propósito es construir, desarrollar, diseñar y editar sitios, vídeos y
aplicaciones web. Inicialmente fue creado por Macromedia pero
actualmente es desarrollado por Adobe Systems. Adobe Dreamweaver se ha
convertido en el programa más utilizado para el diseño y la programación
web, esto gracias a las funciones que posee, su fácil integración a
otros programas como Adobe Flash y recientemente por su soporte para
estándares del World Wide Web Consortium.
Entre los principales competidores que tiene en el m...
Es un software de
edición en forma de un estudio (basado en la forma de Adobe Flash) su
propósito es construir, desarrollar, diseñar y editar sitios, vídeos y
aplicaciones web. Inicialmente fue creado por Macromedia pero
actualmente es desarrollado por Adobe Systems. Adobe Dreamweaver se ha
convertido en el programa más utilizado para el diseño y la programación
web, esto gracias a las funciones que posee, su fácil integración a
otros programas como Adobe Flash y recientemente por su soporte para
estándares del World Wide Web Consortium.
Entre los principales competidores que tiene en el m...
Todos hemos escuchado alguna vez aquello de que los ids o clases no pueden comenzar con un número. Y todos, estoy seguro, damos la sentencia por buena
Sin embargo, el aceptar esta afirmación dicha de forma tan simple y
ambigua da lugar a errores, pues así expresada es de todo punto errónea
por inexacta.
Lo primero que debemos hacer, es tener claro que
hay que diferenciar el lenguaje Html del lenguaje Css, lo que le es
propio a cada uno de ellos y lo que uno u otro permite o prohíbe. Esto
es, utilizar la terminología y sintaxis de cada uno de ellos con
propiedad.
La mezcla de conceptos distintos, el asumir que lo que es válido
en uno lo es en otro o no distinguir cuándo se referencia a uno u otro
da lugar a errores típicos como hablar de atributos o elementos en el
ámbito de Css o la afirmación que nos ocupa. Incluso
Aclarando la cuestión del inicio por un número de ids o clases
Así que antes de seguir tienes que tener muy claro que una cosa son los elementos del html y sus partesd y otra muy distinta los selectores de Css. Pese a la íntima relación que existe entre ellos no hay que confundir
el valor del atributo de id o clase en el marcado html con el selector
de clase o de id en las hojas de estilos.
Una cosa son los elementos del Html y otra muy distinta los selectores de Css.
Una cosa es el atributo (de clase o de id) y su valor en el lenguaje Html y otra cosa muy distinta los selectores de ids o de clases en Css.
En el lenguaje html
Nada impide que en el marcado del documento html el valor del
atributo id o del atributo clase comience por un número. Es totalmente
lícito y funcional. Es más, en según qué circunstancias, será lo
correcto y la única manera de hacerlo.
El código Html anterior es totalmente válido y si lo pasas por el
validador verás que no marca ni error ni advertencia porque el valor de
los atributos class e id comienzan por números. Además el enlace cuyo
atributo href es un número también funcionará perfectamente.
En el lenguaje Css
Es
exclusivamente en el ámbito del lenguaje Css donde es cierta la afirmación que dice que el
nombre de un selector Css no puede comenzar por un número:
los identificadores (incluyendo los nombres de los elementos, clases e
ID de los selectores) pueden contener sólo caracteres [A-Za-z0-9] y los
caracteres 161 en adelante en ISO 10646, más el guión (-); no pueden
comenzar con un guión o un número. También pueden contener caracteres
con escape y cualquier carácter de ISO 10646 en forma de código numérico
(ver el siguiente ítem). Por ejemplo, el identificador "B&W?" puede
escribirse como "B\&W\?" o "B\26 W\3F".
O siendo más precisos, la especificación dice:
que el nombre de un selector Css de clase o de id no puede tener un
número inmediatamente a continuación del símbolo '.' o '#' que
identifica el tipo de selector que es.
que inmediatamente tras el indicador del tipo de selector '.' o '#' tampoco puede ir alguno de los carácteres no permitidos.
que hay una serie de carácteres que no pueden formar parte del
nombre de los selectores, con independencia del lugar que ocupen dentro
de él. Como @>, étc.
Y hago esta última puntualización porque a un elemento del html con
cierto valor en su atributo class o id podemos referenciarlo en la hoja
de estilos utilizando distintos selectores: con el selector de id o
clase y con el selector de atributo, por ejemplo, o haciendo uso de los
selectores de pseudoclase o con los combinadores >, ~, /ref/ étc).
Permitiendo iniciar selectores Css con un número
Llegados a este punto en el que tenemos un valor que en html es
válido y funcional y que las especificaciones de Css no permiten
utilizar la cuestión es cómo resolver la colisión.
La respuesta tradicional y más popular es recomendar no usar en html
valores para esos atributos que comiencen por números. Repito, no porque
no lo permita el propio html, que sí lo admite.
Pero ¿y si ya te lo encuentras y tienes la necesidad de utilizar ese
valor y no tienes acceso al html o al archivo que lo genera?
Tienes dos vías para lograrlo. La primera es utilizar en el Css el selector de atributo. Ese que se conforma con corchetes [ ].
Pero anterior a la llegada de este tipo de selector por valor de
atributo la especificación Css ya proveyó una forma de poder utilizar un
selector de clase o id que comience por un número o cualquier otro carácter de los no permitidos por la especificación.
Para ello definió la barra invertida \ como carácter de "escape Css". Aspecto que sigue siendo válido e incluido en la última recomendación selector level 3.
Así, en el caso de querer o necesitar que un selector de clase o id
comience en la hoja de estilos, o dentro del elemento <style> en
el html, por un número o cualquier otro carácter no permitido en Css
sólo hay que "escaparlo":
Todos los colores parten de una mezcla de colores primarios: rojo, azul y verde. Para representar los colores en web o html se utilizan los números hexadecimales.
Los números hexadecimales puede utilizar 16 valores diferentes utilizando letras y números. Los colores web son 216 colores seguros y se deben ver igual en todo tipo de equipo y navegador.
Los colores se representan con 6 letras empezando con el # los primeros 2 dígitos representan el rojo, los siguientes 2 el verde y los últimos 2 l azul. es por ello que se le llama RGB (Red, Green, Blue) al modelo.
Si deseas construir colores hexadecimales en tu diseño puedes consultar esta pagina web colorhexa.comdonde tenemos una explicación fundamentada de como se crea el color, sus valores y como utilizarlos.
Aunque es el método más complicado para indicar los colores, se trata del método más utilizado con mucha diferencia. De hecho, prácticamente todos los sitios web reales utilizan exclusivamente este método.
Para entender el modelo RGB hexadecimal, en primer lugar es preciso introducir un concepto matemático llamadosistema numérico hexadecimal. Cuando realizamos operaciones matemáticas, siempre utilizamos 10 símbolos para representar los números (del0al9). Por este motivo, se dice que utilizamos un sistema numérico decimal.
No obstante, el sistema decimal es solamente uno de los muchos sistemas numéricos que se han definido. Entre los sistemas numéricos alternativos más utilizados se encuentra el sistema hexadecimal, que utiliza 16 símbolos para representar sus números.
Como sólo conocemos 10 símbolos numéricos, el sistema hexadecimal utiliza también seis letras (de laAa laF) para representar los números. De esta forma, en el sistema hexadecimal, después del9no va el10, sino laA. La letraBequivale al número11, laCal12, laDal13, laEal14y laFal número15.
Definir un color en CSS con el método RGB hexadecimal requiere realizar los siguientes pasos: - Determinar las componentes RGB decimales del color original, por ejemplo: R =71, G =98, B =176- Transformar el valor decimal de cada componente al sistema numérico hexadecimal. Se trata de una operación exclusivamente matemática, por lo que puedes utilizar una calculadora. En el ejemplo anterior, el valor hexadecimal de cada componente es: R =47, G =62, B =B0- Para obtener el color completo en formato RGB hexadecimal, se concatenan los valores hexadecimales de las componentes RGB en ese orden y se les añade el prefijo#. De esta forma, el color del ejemplo anterior es#4762B0en formato RGB hexadecimal.
Siguiendo el mismo ejemplo de las secciones anteriores, el color del párrafo se indica de la siguiente forma utilizando el formato RGB hexadecimal:
p {color:#4762B0;}
Recuerda que aunque es el método más complicado para definir un color, se trata del método que utilizan la inmensa mayoría de sitios web, por lo que es imprescindible dominarlo. Afortunadamente, todos los programas de diseño gráfico convierten de forma automática los valores RGB decimales a sus valores RGB hexadecimales, por lo que no tienes que hacer ninguna operación matemática:
¿Cómo utilizar los códigos de color?
Con los códigos de color puedes fijar el color del fondo del Web
site, el color de fuentes, las células en tablas y mucho más.
Usar los códigos de color para el color del fondo del Web site:
Para convertir los colores puede utlizar esta página CLIC AQUI
