lunes, 25 de mayo de 2015

Adobe Dreamweaver

           

  1. Adobe Dreamweaver 
  2. es una aplicación en programa de estudio (basada en la forma de estudio de Adobe Flash) 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 Flash y, recientemente, por su soporte de los estándares del World Wide Web Consortium.
    Sus principales competidores son 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 paraInternet 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 deJavascript 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 yMicrosoft Access, para filtrar y mostrar el contenido utilizando tecnología de script como, por ejemplo, ASPASP.NET,ColdFusionJSP (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.

    Resaltado de sintaxis[editar]

    A partir de la versión 5, Dreamweaver admite el resaltado de sintaxis para los siguientes lenguajes por defecto:
    1. Elemento de lista numerada
    2. Elemento de lista numerada

    Historial de versiones[editar]

    ProveedorVersión mayorVersión menor/nombre alternativoFecha de publicaciónNotas
    Macromedia1.01.0Diciembre de 1997Primer lanzamiento, sólo para Mac OS.
    1.2Marzo de 1998Primera versión para Windows.
    2.02.0Diciembre dRRe 1998
    3.04.2Diciembre de 1999
    UltraDev 1.0Junio de 2000
    4.04.0Diciembre de 2000
    UltraDev 4.0Diciembre de 2000
    6.0MX29 de mayo de 2002
    7.0MX 200410 de septiembre de 2003
    8.08.013 de septiembre de 2005
    Adobe9.0CS316 de abril de 2007Sustituye a Adobe GoLive en la serieCreative Suite
    10.0CS423 de septiembre de 2008
    11.0CS512 de abril de 2010
    11.5CS5.512 de abril de 2011
    12.0CS621 de abril de 2012
    13.0CCAbril de 2013
    ColorSignificado
    RojoVersión antigua
    AmarilloVersión antigua; soportada aún
    VerdeVersión actual


  3.          






Adobe Muse

  1. Adobe Muse
  2. Adobe Muse es la nueva herramienta de diseño que cumple una de tus ilusiones: maquetar webs igual que compones imágenes con Photoshop, sin programar ni una línea de código. No exageramos al decir que Adobe Muse es uno de los editores web más sencillos que hemos visto.

martes, 5 de mayo de 2015

COLORES HECXADECIMALES , SU USO Y SUS FORMAS DE CONVERCION EN RGB Y CMYK

Nombres de colores hexadecimales

Del más claro al más oscuro


Los colores en HTML se representan mediante un número hexadecimal.
Un número hexadecimal se diferencia de un número decimal en que no sólo puede tomar valores del 0 al 9, sino que puede tomar hasta dieciséis valores distintos, que van del 0 al 9, y de la A a la F.
Cada color estará representado por un grupo de seis dígitos en hexadecimal, precedidos por una almohadilla, como por ejemplo #FFFFFF.
Existen 216 colores seguros para web. Éstos son los colores que se muestran de la misma forma en Microsoft Internet Explorer y en Netscape Navigator, tanto en Windows como en Macintosh.
También podemos personalizar nuestros propios colores, modificando los valores de cada uno de los dígitos que forman parte del número hexadecimal.
A continuación se muestran los 216 colores seguros para web, para que puedas consultarlos cuando lo necesites.

Nombre del color Código hex Color "seguro para web" más cercano
BLANCO #FFFFFF #FFFFFF
AZUR #F0FFFF #FFFFFF
CREMA #F5FFFA #FFFFFF
NIEVE #FFFAFA #FFFFFF
MARFIL #FFFFF0 #FFFFFF
BLANCO FANTASMA #F8F8FF #FFFFFF
BLANCO FLORAL #FFFAF0 #FFFFFF
AZUL ALICIA #F0F8FF #FFFFFF
CIAN CLARO #E0FFFF #CCFFFF
MELÓN VERDE #F0FFF0 #FFFFFF
AMARILLO CLARO #FFFFE0 #FFFFFF
CONCHA #FFF5EE #FFFFFF
SONROJO LAVANDA #FFF0F5 #FFFFFF
HUMO BLANCO #F5F5F5 #FFFFFF
ENCAJE ANTIGUO #FDF5E6 #FFFFFF
SEDA DE MAÍZ #FFF8DC #FFFFCC
LINO #FAF0E6 #FFFFFF
AMARILLO ALAMBRE DORADO CLARO #FAFAD2 #FFFFCC
GASA LIMÓN #FFFACD #FFFFCC
BEIGE #F5F5DC #FFFFCC
LAVANDA #E6E6FA #CCCCFF
BATIDO DE PAPAYA #FFEFD5 #FFFFCC
ROSA BRUMOSA #FFE4E1 #FFCCCC
BLANCO ANTIGUO #FAEBD7 #FFFFCC
BLANCO ALMENDRA #FFEBCD #FFFFCC
SOPA #FFE4C4 #FFFFCC
TURQUESA PÁLIDO #AFEEEE #99FFFF
MOCASÍN #FFE4B5 #FFCCCC
GAINSBORO #DCDCDC #CCCCCC
SOPLIDO MELOCOTÓN #FFDAB9 #FFCCCC
BLANCO NAVAJO #FFDEAD #FFCC99
DORADO ALAMBRE PÁLIDO #EEE8AA #FFFF99
TRIGO #F5DEB3 #FFCCCC
POLVO AZUL #B0E0E6 #CCCCFF
AGUAMARINA #7FFFD4 #66FFCC
GRIS CLARO #D3D3D3 #CCCCCC
ROSA #FFC0CB #FFCCCC
AZUL CLARO #ADD8E6 #99CCFF
CARDO #D8BFD8 #CCCCCC
ROSA CLARO #FFB6C1 #FFCCCC
AZUL CIELO CLARO #87CEFA #99CCFF
VERDE PÁLIDO #98FB98 #99FF99
AZUL ACERO CLARO #B0C4DE #99CCCC
CAQUI #F0D58C #FFCC99
AZUL CIELO #87CEEB #99CCFF
AGUA #00FFFF #00FFFF
CIAN #00FFFF #00FFFF
PLATA #C0C0C0 #CCCCCC
CIRUELA #DDA0DD #CC99CC
GRIS #BEBEBE #CCCCCC
VERDE CLARO #90EE90 #99FF99
VIOLETA #EE82EE #FF99FF
AMARILLO #FFFF00 #FFFF00
TURQUESA #40E0D0 #33CCCC
MADERA FORNIDA #DEB887 #CCCC99
AMARILLO VERDE #ADFF2F #99FF33
BRONCEADO #D2B48C #CCCC99
TURQUESA MEDIO #48D1CC #33CCCC
SALMÓN CLARO #FFA07A #FF9966
AGUAMARINA MEDIO #66CDAA #66CC99
GRIS OSCURO #A9A9A9 #999999
ORQUÍDEA #DA70D6 #CC66CC
VERDE MAR INTENSO #8FBC8F #99CC99
AZUL CIELO INTENSO #00BFFF #00CCFF
MARRÓN ARENA #F4A460 #FF9966
DORADO #FFD700 #FFCC00
VERDE PRIMAVERA MEDIO #00FA9A #00FF99
CAQUI OSCURO #BDB76B #CCCC66
ACIANO AZUL #6495ED #6699FF
ROSA CALIENTE #FF69B4 #FF66CC
SALMÓN OSCURO #E9967A #FF9966
TURQUESA OSCURO #00CED1 #00CCCC
VERDE PRIMAVERA #00FF7F #00FF66
CORAL CLARO #F08080 #FF9999
MARRÓN ROSADO #BC8F8F #CC9999
SALMÓN #FA8072 #FF9966
CHARTREUSE #7FFF00 #66FF00
PÚRPURA MEDIO #9370DB #9966CC
VERDE CÉSPED #7CFC00 #66FF00
AZUL DODGER #1E90FF #3399FF
VERDE AMARILLO #9ACD32 #99CC33
VIOLETA ROJO PÁLIDO #DB7093 #CC6699
AZUL PIZARRA MEDIO #7B68EE #6666FF
ORQUÍDEA MEDIO #BA55D3 #CC66CC
CORAL #FF7F50 #FF6666
AZUL CADETE #5F9EA0 #669999
VERDE MAR CLARO #20B2AA #339999
DORADO ALAMBRE #DAA520 #CC9933
NARANJA #FFA500 #FF9900
GRIS PIZARRA CLARO #778899 #669999
FUCSIA #FF00FF #FF00FF
MAGENTA #FF00FF #FF00FF
VERDE MAR MEDIO #3CB371 #33CC66
PERÚ #CD853F #CC9933
AZUL ACERO #4682B4 #3399CC
AZUL REAL #4169E1 #3366CC
GRIS PIZARRA #708090 #669999
TOMATE #FF6347 #FF6633
NARANJA OSCURO #FF8C00 #FF9900
AZUL PIZARRA #6A5ACD #6666CC
VERDE LIMA #32CD32 #33CC33
LIMA #00FF00 #00FF00
ROJO INDIO #CD5C5C #CC6666
ORQUÍDEA OSCURO #9932CC #9933CC
AZUL VIOLETA #8A2BE2 #9933FF
ROSA INTENSO #FF1493 #FF0099
DORADO ALAMBRE OSCURO #B8860B #CC9900
CHOCOLATE #D2691E #CC6633
CIAN OSCURO #008B8B #009999
GRIS DIFUSO #696969 #666666
GRIS ACEITUNA #6B8E23 #669933
VERDE MAR #2E8B57 #339966
VERDE CERCETA #008080 #009999
VIOLETA OSCURO #9400D3 #9900CC
VIOLETA ROJO MEDIO #C71585 #CC0066
NARANJA ROJO #FF4500 #FF3300
ACEITUNA #808000 #999900
SIENA #A0522D #996633
AZUL PIZARRA OSCURO #483D8B #333399
VERDE ACEITUNA OSCURO #556B2F #666633
VERDE BOSQUE #228B22 #339933
CARMESÍ #DC143C #CC0033
AZUL #0000FF #0000FF
MAGENTA OSCURO #8B008B #990099
GRIS PIZARRA OSCURO #2F4F4F #336666
MARRÓN MONTURA #8B4513 #993300
MARRÓN #A52A2A #993333
LADRILLO REFRACTARIO #B22222 #993333
PÚRPURA #800080 #990099
VERDE #008000 #009900
ROJO #FF0000 #FF0000
AZUL MEDIO #0000CD #0000CC
ÍNDIGO #4B0082 #330099
AZUL MEDIANOCHE #191970 #000066
VERDE OSCURO #006400 #006600
AZUL OSCURO #00008B #000099
AZUL MARINO #000080 #000099
ROJO OSCURO #8B0000 #990000
GRANATE #800000 #990000
NEGRO #000000 #000000

Conversiones RGB y CMYK

No existen fórmulas sencillas para la conversión entre valores RGB o CMYK y L*a*b*, ya que los modelos de color RGB y CMYK dependen del dispositivo. Los valores RGB o CMYK deben ser transformados a un espacio de color absoluto específico, tal como sRGB o RGB de Adobe. Estos espacios serán dependientes del dispositivo, a diferencia de los datos resultantes de la transformación, permitiendo que estos datos sean transformados al espacio de color CIE 1931 y luego en L*a*b*.

Conversiones XYZ a CIE L*a*b* (CIELAB) y viceversa

Transformación directa

\begin{align}
  L^\star &= 116 f(Y/Y_n) - 16\\
  a^\star &= 500 \left[f(X/X_n) - f(Y/Y_n)\right]\\
  b^\star &= 200 \left[f(Y/Y_n) - f(Z/Z_n)\right]
\end{align}
donde
f(t) = \begin{cases} 
  t^{1/3} & \mbox{para } t > (\frac{6}{29})^3 \\
  \frac13 \left( \frac{29}{6} \right)^2 t + \frac{4}{29} & \mbox{para otro valor}
\end{cases}
Donde X_n, Y_n y Z_n son los valores triestímulo CIE XYZ del punto de blanco de referencia.
La división de la función f(t) en dos dominios se hace para prevenir una pendiente infinita en t=0. Se asume que la función f(t) sea lineal para un tiempo t=t0 y que coincide con la raíz cúbica de t para t=t0, tanto en valor como en pendiente. En otras palabras, esto se puede expresar como:
\begin{align}
  t_0^{1/3} &= a t_0 + b & \text{ (coincidencia en valor)}\\
  \tfrac13 t_0^{-2/3} &= a & \text{ (coincidencia en pendiente)}
\end{align}
El valor de b fue ajustado a 16/116. Las anteriores ecuaciones pueden ser resueltas para a y t0:
\begin{align}
  a &= \tfrac13\delta^{-2} &= 7.787037\ldots\\
  t_0 &= \delta^3 &= 0.008856\ldots
\end{align}
donde δ = 6/29. Nótese que 16/116=2\delta/3

Transformación inversa

La transformación inversa es como sigue, con \delta=6/29 como se mencionó antes:
\begin{align}
  Y &= Y_n f^{-1}\left(\textstyle{\frac{1}{116}}\left(L^*+16\right)\right)\\
  X &=  X_n f^{-1}\left(\textstyle{\frac{1}{116}}\left(L^*+16\right) + \textstyle{\frac{1}{500}}a^*\right)\\
  Z &=  Z_n f^{-1}\left(\textstyle{\frac{1}{116}}\left(L^*+16\right) - \textstyle{\frac{1}{200}}b^*\right)\\
\end{align}



























miércoles, 29 de abril de 2015

TEXTO DE LOREM IPSUM

  LOREM IPSUM

"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."

"No hay nadie que ame el dolor mismo, que lo busque, lo encuentre y lo quiera, simplemente porque es el dolor."
Lorem Ipsum es simplemente el texto de relleno de las imprentas y archivos de texto. Lorem Ipsum ha sido el texto de relleno estándar de las industrias desde el año 1500, cuando un impresor (N. del T. persona que se dedica a la imprenta) desconocido usó una galería de textos y los mezcló de tal manera que logró hacer un libro de textos especimen. No sólo sobrevivió 500 años, sino que tambien ingresó como texto de relleno en documentos electrónicos, quedando esencialmente igual al original. Fue popularizado en los 60s con la creación de las hojas "Letraset", las cuales contenian pasajes de Lorem Ipsum, y más recientemente con software de autoedición, como por ejemplo Aldus PageMaker, el cual incluye versiones de Lorem Ipsum.
Es un hecho establecido hace demasiado tiempo que un lector se distraerá con el contenido del texto de un sitio mientras que mira su diseño. El punto de usar Lorem Ipsum es que tiene una distribución más o menos normal de las letras, al contrario de usar textos como por ejemplo "Contenido aquí, contenido aquí". Estos textos hacen parecerlo un español que se puede leer. Muchos paquetes de autoedición y editores de páginas web usan el Lorem Ipsum como su texto por defecto, y al hacer una búsqueda de "Lorem Ipsum" va a dar por resultado muchos sitios web que usan este texto si se encuentran en estado de desarrollo. Muchas versiones han evolucionado a través de los años, algunas veces por accidente, otras veces a propósito (por ejemplo insertándole humor y cosas por el estilo).

Al contrario del pensamiento popular, el texto de Lorem Ipsum no es simplemente texto aleatorio. Tiene sus raices en una pieza cl´sica de la literatura del Latin, que data del año 45 antes de Cristo, haciendo que este adquiera mas de 2000 años de antiguedad. Richard McClintock, un profesor de Latin de la Universidad de Hampden-Sydney en Virginia, encontró una de las palabras más oscuras de la lengua del latín, "consecteur", en un pasaje de Lorem Ipsum, y al seguir leyendo distintos textos del latín, descubrió la fuente indudable. Lorem Ipsum viene de las secciones 1.10.32 y 1.10.33 de "de Finnibus Bonorum et Malorum" (Los Extremos del Bien y El Mal) por Cicero, escrito en el año 45 antes de Cristo. Este libro es un tratado de teoría de éticas, muy popular durante el Renacimiento. La primera linea del Lorem Ipsum, "Lorem ipsum dolor sit amet..", viene de una linea en la sección 1.10.32
El trozo de texto estándar de Lorem Ipsum usado desde el año 1500 es reproducido debajo para aquellos interesados. Las secciones 1.10.32 y 1.10.33 de "de Finibus Bonorum et Malorum" por Cicero son también reproducidas en su forma original exacta, acompañadas por versiones en Inglés de la traducción realizada en 1914 por H. Rackham.
Hay muchas variaciones de los pasajes de Lorem Ipsum disponibles, pero la mayoría sufrió alteraciones en alguna manera, ya sea porque se le agregó humor, o palabras aleatorias que no parecen ni un poco creíbles. Si vas a utilizar un pasaje de Lorem Ipsum, necesitás estar seguro de que no hay nada avergonzante escondido en el medio del texto. Todos los generadores de Lorem Ipsum que se encuentran en Internet tienden a repetir trozos predefinidos cuando sea necesario, haciendo a este el único generador verdadero (válido) en la Internet. Usa un diccionario de mas de 200 palabras provenientes del latín, combinadas con estructuras muy útiles de sentencias, para generar texto de Lorem Ipsum que parezca razonable. Este Lorem Ipsum generado siempre estará libre de repeticiones, humor agregado o palabras no características del lenguaje, etc.



El pasaje estándar Lorem Ipsum, usado desde el año 1500.

"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

Sección 1.10.32 de "de Finibus Bonorum et Malorum", escrito por Cicero en el 45 antes de Cristo

"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?"

Traducción hecha por H. Rackham en 1914

"But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the great explorer of the truth, the master-builder of human happiness. No one rejects, dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know how to pursue pleasure rationally encounter consequences that are extremely painful. Nor again is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain, but because occasionally circumstances occur in which toil and pain can procure him some great pleasure. To take a trivial example, which of us ever undertakes laborious physical exercise, except to obtain some advantage from it? But who has any right to find fault with a man who chooses to enjoy a pleasure that has no annoying consequences, or one who avoids a pain that produces no resultant pleasure?"

Sección 1.10.33 de "de Finibus Bonorum et Malorum", escrito por Cicero en el 45 antes de Cristo

"At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat."

Traducción hecha por H. Rackham en 1914

"On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee the pain and trouble that are bound to ensue; and equal blame belongs to those who fail in their duty through weakness of will, which is the same as saying through shrinking from toil and pain. These cases are perfectly simple and easy to distinguish. In a free hour, when our power of choice is untrammelled and when nothing prevents our being able to do what we like best, every pleasure is to be welcomed and every pain avoided. But in certain circumstances and owing to the claims of duty or the obligations of business it will frequently occur that pleasures have to be repudiated and annoyances accepted. The wise man therefore always holds in these matters to this principle of selection: he rejects pleasures to secure other greater pleasures, or else he endures pains to avoid worse pains."

HISTORIA DE   LOREM IPSUM

Siguiendo la línea del último post me ha parecido interesante hacer una breve introducción a la historia de Lorem Ipsum la cual es una gran desconocida para mucha gente. Lorem Ipsum es usado ampliamente en el mundo editorial, el diseño gráfico y el diseño web.
Es un marcador de texto o texto de relleno usado para demostrar los elementos gráficos de un documento visual como la tipografía, las fuentes o el maquetado. Por norma general es una sección en Latín del texto de la obra Cicerón De finibus bonorum et malorum escrito en el año 45 a.C con algunas palabras o letras eliminadas para eliminar su sentido.
En contra del ideario popular, Lorem Ipsum no tiene ningún tipo de sentido en Latín clásico y nunca ha tenido intención de tenerlo. Aunque no es un texto excesivamente largo, ha servido incluso para maquetar libros completos sin tan siquiera repetir un párrrafo al combinar sus palabras.

USO DE LOREM IPSUM

Lorem ipsum es el texto que se usa habitualmente en diseño gráfico en demostraciones de tipografías o de borradores de diseño para probar el diseño visual antes de insertar el texto final.
Aunque no posee actualmente fuentes para justificar sus hipótesis, el profesor de filología clásica Richard McClintock asegura que su uso se remonta a los impresores de comienzos del siglo XVI.1 Su uso en algunos editores de texto muy conocidos en la actualidad ha dado al texto lorem ipsum nueva popularidad.
El texto en sí no tiene sentido, aunque no es completamente aleatorio, sino que deriva de un texto de Cicerón en lengua latina, a cuyas palabras se les han eliminado sílabas o letras. El significado del texto no tiene importancia, ya que solo es una demostración o prueba, sino que copia de la obra de Cicerón De finibus bonorum et malorum (Sobre los límites del bien y del mal) que comienza con:
Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit2








jueves, 23 de abril de 2015

DISEÑO WEB ADAPTABLE Y RESPONSIVE

DISEÑO WEB RESPONSIVE.
 in web web design posted 12 febrero 2015 no comments

El diseño web responsive, es una técnica de diseño web que busca la correcta visualización de una misma página en distintos dispositivos. Desde ordenadores de escritorio a tablets y móviles.

VENTAJAS.
  • Carga más veloz del sitio en los dispositivos portátiles
  • Mejor lectura, con el tamaño de letra adecuado para una lectura cómoda ya sea en smartphone o tablet.
  • Mejor experiencia en la navegación: con botones adaptados para el uso táctil del dispositivo.
  • Ahorro de costes ya que no es necesario desarrollar múltiples versiones del site o incluso desarrollar una app para Iphone / Ipad y Android.

DISEÑO WEB ADAPTABLE .
 Páginas de Internet, Diseño Web, Sitios Web y Posicionamiento en ...

El diseño web adaptable,conocido por las siglas RWD (del inglés, Responsive Web Design) es una filosofía de diseño y desarrollo cuyo objetivo es adaptar la apariencia de las páginas web al dispositivo que se esté utilizando para visualizarla. Hoy día las páginas web se visualizan en multitud de tipos de dispositivos como tabletas, smartphones, libros electrónicos, portátiles, PCs,... Además, aún dentro de cada tipo, cada dispositivo tiene sus características concretas: Tamaño de pantalla, resolución, potencia de CPU, capacidad de memoria,... Esta tecnología pretende que con un solo diseño web, tengamos una visualización adecuada en cualquier dispositivo.

VENTAJAS .
El uso de dispositivos móviles está creciendo a un ritmo increíble, dispositivos como tablets y smartphones han incrementado sus ventas en los últimos años y la navegación en Internet mediante estos dispositivos es cada vez más común. Ese es el motivo por el que el diseño web adaptable se ha vuelto tan popular, pues es una técnica que proporciona una solución web que puede manejar la visualización web tanto de escritorio como de dispositivos.
Con una sola versión en HTML y CSS se cubren todas las resoluciones de pantalla, es decir, el sitio web creado estará optimizado para todo tipo de dispositivos: PCs, tabletas, teléfonos móviles, etc. Esto mejora la experiencia de usuario a diferencia de lo que ocurre, por ejemplo, con sitios web de ancho fijo cuando se acceden desde dispositivos móviles.
De esta forma se reducen los costos de creación y mantenimiento cuando el diseño de las pantallas es similar entre dispositivos de distintos tamaños.
También se supone que evita tener que desarrollar aplicaciones ad-hoc para versiones móviles, o no, por ejemplo, una aplicación específica para iPhone, otra para móviles Android, etc.,5 aunque hoy en día las webs para móviles todavía no pueden realizar las mismas funciones que las aplicaciones nativas.
Desde el punto de vista de la optimización de motores de búsqueda, sólo aparecería una URL en los resultados de búsqueda, con lo cual se ahorran redirecciones y los fallos que se derivan de éstas. También se evitarían errores al acceder al sitio web en concreto desde los llamados "social links", es decir, desde enlaces que los usuarios comparten en medios sociales tales como Facebook, Twitter, etc y que pueden acabar en error dependiendo de qué enlace se copió (desde qué dispositivo se copió) y desde qué dispositivo se accede.


Diseño web adaptativo vs responsivo

responsive_web_designEl diseño web profesional debe reunir las cualidades de ser original, intuitivo y fiel al mensaje de la empresa: a esto hay que sumarle un nuevo requerimiento de los tiempos que corren: que nuestro sitio web pueda ser visualizado fácilmente a los diversos dispositivos móviles que se usan actualmente. Los usuarios de móviles y tablets han invadido la red, especialmente los adolescentes, jóvenes y adultos jóvenes, que prefieren acceder desde sus dispositivos a una página web cualquiera, disfrutando de la libertad y la inmediatez de la experiencia que los móviles dan.
Esta nueva tendencia se ha acrecentado en los últimos años; si existiera alguna duda, las estadísticas las despejarán rápidamente: la empresa Cisco, líder mundial en telefonía, ha elaborado un informe cuya proyección calcula en 10.000 millones de unidades la cantidad de móviles en uso a final del año 2017. Este número es superior a la población mundial actual, que se estima en 7.000 millones de habitantes, y que seguramente no aumentará en igual proporción que los teléfonos celulares para dicha fecha. Además, dentro del mercado de la telefonía celular, los llamados teléfonos inteligentes o smartphone acaparan el 50 por ciento del tráfico de datos móviles actual.
El marketing online presta atención a las nuevas tendencias, sabiendo que perder el público usuario de móviles implica perder una gran cantidad de clientes. El uso que se hace del celular es mucho más intensivo que el que se hace de la laptop o computadora, por ejemplo:
  • El 66 por ciento de los usuarios utiliza su teléfono móvil durante las comidas.
  • El 61 por ciento utiliza el celular mientras ve televisión.
  • El 36 por ciento lo usa mientras viaja en transporte público a diario.
  • Los datos de Facebook revelan que el 60 por ciento de sus usuarios acceden al sitio desde sus móviles, y el uso de Twitter y otras redes sociales desde el celular o tablet aumenta día a día.
 Una página web tradicional, cuyo diseño web no está prepardo para móviles tardará mucho más en cargar, algunas de sus funciones no responderán (reproducción de videos, por ejemplo) y el usuario deberá usar el zoom del navegador para poder apreciar todos los detalles del sitio. Cada uno de los inconvenientes que hemos nombrado puede resultar en una verdadera decepción para el visitante y por lo tanto, una perdida de clientes para ti. Por ello es necesario conocer las dos grandes tendencias del diseño web profesional actual, el diseño web adaptativo y el diseño web responsivo, de modo que podamos optar por el que cubre nuestras necesidades reales.
El diseño web profesional responsivo reestructura los elementos del sitio web original y los acomoda a la pantalla del dispositivo, cuidando de aprovechar todo el espacio disponible y guardando las relaciones entre los diversos elementos. El responsable de la fluidez con que las imágenes cambian y se redimensionan según el tipo de dispositivo que se use para acceder al sitio es el llamado código CSS u Hojas de Estilo en Cascada (tal su nombre en castellano) es un lenguaje cibernético encargado de adaptar el estilo de los documentos escrito utilizando HTML. Éste permite que el sitio sea perfectamente accesible y visible en una tablet, un celular o una PC.
El sitio que estas visitando en este momento es responsivo. Haz la prueba: cambia la ventana de tu navegador, y veras como el contenido se acomoda automáticamente para aprovechar el espacio.
El diseño web adaptativo no puede realizar esta adaptación, ya que trabaja con medidas fijas para ordernador y para dispositivo móviles, esto resta efectividad cuando la pantalla del móvil es muy pequeña; en su favor cuenta que no necesita tanto código CSS como el diseño responsivo, lo que lo hace más fácil de programar.
Los diseñadores suelen recomendar los diseños responsivos teniendo en cuenta las tendencias anteriormente mencionadas, sin embargo, existe la posibilidad de que para algunas empresas el diseño adaptativo sea el más conveniente: quizás se dirija a un público mayor, que por ciertas condiciones propias no utilizan mayormente el móvil y las visitas desde este tipo de dispositivos sean muy escasas (pongamos el caso de productos o servicios consumidos por adultos de la tercera edad, que tienen un trato pobre con el uso de internet en el móvil, problemas de vista, etc.)
La realidad que se impone en el mercado se va definiendo a medida que el tiempo pasa y las tendencias se consolidan, por lo cual podríamos decir que los días del diseño adaptativo no son demasiados si las estadísticas siguen confirmando lo que venimos diciendo del uso de móviles para visitar los sitios web. Probablemente en un corto plazo existirá una única red que podrá brindar desde ella diversas versiones de un mismo sitio web para toda clase de dispositivos diferentes.
Si tienes dudas sobre qué aproximación es mejor para tu negocio, no dudes en contactarnos. Lo importante es recordar que el uso de dispositivos móviles solo irá en aumento. Sea responsivo o adaptativo; asegurate que tu sitio web esté listo para tus clientes móviles.



jueves, 22 de enero de 2015

LENGUAJE CSS

EL LENGUAJE CSS 
Es una hoja de estilo se compone de una lista de reglas. Cada regla o conjunto de reglas consiste en uno o más selectores y un bloque de declaración (o «bloque de estilo») con los estilos a aplicar para los elementos del documento que cumplan con el selector que les precede. Cada bloque de estilos se define entre llaves, y está formado por una o varias declaraciones de estilo con el formato propiedad:valor;.<!R0>
SU USO 
Cuando se utiliza CSS, la etiqueta <h1> no debería proporcionar información sobre cómo será visualizado, solamente marca la estructura del documento. La información de estilo, separada en una hoja de estilo, especifica cómo se ha de mostrar <h1>: color, fuente, alineación del texto, tamaño y otras características no visuales, como definir el volumen de un sintetizador de voz
1.  Una hoja de estilo interna, que es una hoja de estilo que está incrustada dentro de un documento HTML, dentro del elemento <head>, marcada por la etiqueta <style>. De esta manera se obtiene el beneficio de separar la información del estilo del código HTML propiamente dicho. Se puede optar por copiar la hoja de estilo incrustada de una página a otra (esta posibilidad es difícil de ejecutar si se desea para guardar las copias sincronizadas). En general, la única vez que se usa una hoja de estilo interna, es cuando se quiere proporcionar alguna característica a una página Web en un simple fichero, por ejemplo, si se está enviando algo a la página Web
2.  Una hoja de estilo externa, es una hoja de estilo que está almacenada en un archivo diferente al archivo donde se almacena el código HTML de la página Web. Esta es la manera de programar más potente, porque separa completamente las reglas de formateo para la página HTML de la estructura básica de la página
   2.   Estilos CSS introducidos por el usuario que ve el documento, mediante un archivo CSS especificado mediante las configuraciones del navegador, y que sobreescribe los estilos definidos por el autor en una, o varias páginas web.
Los estilos marcados "por defecto" por los user agent, para diferentes elementos de un documento HTML, como por ejemplo, los enlaces 

Propiedades del Lenguaje CSS 

texto

word-spacing :normal | <longitud>
Distancia que separa a las palabras del texto; usualmente es asignada en forma automática de manera bastante adecuada.
letter-spacing :normal | <longitud>
Distancia que separa a dos letras en el texto; usualmente es asignada en forma automática de manera bastante adecuada.
white-space :normal | pre | nowrap
Define el tratamiento que se le dará al espacio en blanco dentro del elemento. Lo normal es que más de un espacio en blanco es tratado como un sólo espacio. Si se usa el valor pre, entonces los múltiples espacios en blanco producirán un espaciamiento mayor.
El valor nowrap, indica que los espacios en blanco serán considerados como un caracter más formando parte de una palabra, por lo que las palabras no serán cortadas.
text-decoration :none | [ underline | overline | line-throught | blink ]+
Indica adornos o cualidades extra de la letra. Esta propiedad no es heredada. Los valores permitidos son underline (subrayado), overline (línea por encima del texto), line-throught (tachado) y blink (parpadeo),
text-transform :none | capitalize | uppercase | lowercase
Permite cambiar el texto al cual se refiere, poniendo la primera letra en mayúscula, todo en mayúsculas o todo en minúsculas, respectivamente.

Dimensiones y flujo del texto

width (height) : none | <longitud> | <porcentaje>
Indica el ancho (respectivamente: la altura) del elemento. Esta propiedad se aplica a selectores de tipo bloque, o a los que son reemplazados por otros elementos (i.e.: imágenes).
Los valores porcentuales se refieren a las dimensiones del elemento del cual hereden propiedades.
Si una de las dos dimensiones es fijada, y la otra está en auto, las proporciones se mantienen.


BIBLIOGRAFIA: 
http://tejedoresdelweb.com/w/CSS

miércoles, 17 de diciembre de 2014

HTML

DEFINICION

HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se trata de la sigla que corresponde a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto, que podría ser traducido como Lenguaje de Formato de Documentos para Hipertexto


CUERPO O FORMATO DE HTML






Breve historia del HTML

Este lenguaje fue desarrollado por la Organización Europea de Investigación Nuclear (CERN) en el año 1945 con la finalidad de desarrollar un sistema de almacenamiento donde las cosas no se perdieran, que pudieran ser conectadas a través de hipervínculos. Primeramente crearon un dispositivo llamado “memex”, el cual era considerado como un suplemento para la

FORMATOS DE TEXTO EN HTML: NEGRITA, CURSIVA

NEGRITA
Esta palabra la vamos a poner en <b>negrita</b> y esta otra <strong>también</strong>

CURSIVA

Esta palabra la vamos a poner en <i>cursiva</i> y esta otra <em>también</em>


 Color de fondo



bgcolor = color [CI]
Desaprobado. Este atributo establece el color de fondo del cuerpo del documento

Alineación

align = left|center|right|justify [CI] 
Este atributo especifica la alineación horizontal de su elemento con respecto al contexto circundante. Valores posibles:


  • left: las líneas de texto se representan con los bordes izquierdos alineados.
  • center: las líneas de texto son centradas.
  • right: las líneas de texto se representan con los bordes derechos alineados.
  • justify: las líneas de texto se justifican en ambos márgenes.