jueves, 30 de abril de 2015

Lorem Ipsum

http://www.techpavan.com/wp-content/uploads/lorem%20ipsum.jpg
Imagen. http://www.techpavan.com/wp-content/uploads/lorem%20ipsum.jpg
Historia de Lorem Ipsum

El texto que conforma Lorem Ipsum lleva usándose como estándar de maquetación desde principios del siglo XVI cuando algún encuadernador/creador de libros usó dicho texto para hacer unaespecie de modelo genérico de maquetado y edición para presentar a sus posibles clientes.
Lorem Ipsum ha sobrevivido letra por letra hasta nuestros días dando incluso el salto al formato digital de la mano de la Aldus Corporation que lo integraba en su PageMaker hace ya bastantes años. La búsqueda de “Lorem Ipsum” en Google produce 56.900.000 resultados, una cifra nada despreciable.
Como curiosidad comentar que Cicerón fue asesinado (decapitado) por orden de Marco Antonio(cónsul de Roma tras el asesinato de Julio Cesar) en represalia al discurso que publicó atacándole en su obra las Filípicas y que está considerado como una flagrante vulneración de la libertad de expresión.
Características de lorem ipsum
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.
Detrás de Lorem Ipsum
Aunque durante mucho tiempo se ha pensado que el texto eran palabras aleatorias en latín, Richard McClintock profesor de latín en Hampden-Sydney, Virginia investigó la palabra menos común del texto, consectetur y descubrió que Lorem Ipsum es latín ofuscado proveniente sin duda del pasaje 1.10.32 y 1.10.33 del texto de Cicerón De finibus bonorum et malorum (Sobre los límites del bien y del mal).
El libro fue muy popular durante el Renacimiento. La primera línea de Lorem Ipsum “Lorem ipsum dolor sit amet…“, viene de una linea de la sección 1.10.32 que dice:
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[ng] velit, sed quia non numquam [do] eius modi tempora inci[di]dunt, 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?
Mientras que el resto del texto viene de la sección 1.10.33:
At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditatenon 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…
En ambos párrafos puede leerse en negrita las palabras que componen el texto definitivo de Lorem Ipsum:
“Lorem ipsum dolor sit amet, consectetur adipisicing 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. 

Traducción de LOREM IPSUM

Lorem Ipsum o –para los amigos– Lipsum es el nombre que recibe un texto de relleno que se suele utilizar en diseño editorial, diseño gráfico y diseño web para demostraciones de tipografía y borradores de diseño. Es lo que algunos llaman "texto ciego". Su función es suplantar al texto final que ha de figurar luego –y que muchas veces el propio diseñador desconoce– para exhibir solamente una imagen general del espacio que aquél ha de ocupar.  
Diferencias 

 Lo que diferencia al Lipsum de otros textos ciegos es que mantiene una distribución de las letras más o menos similar a la de un texto normal. Además, fue deliberadamente concebido como un texto ilegible, para procurar que el observador no se distraiga con el contenido y preste atención sólo a la imagen del diseño. Por lo tanto, oh nauta indagador, no existe una traducción del Lorem Ipsum.
Uso del 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.
Se emplea como texto de prueba y relleno desde el año 1500, cuando debió de ser empleado por un impresor desconocido. Su uso en algunos editores de texto muy conocidos en la actualidad ha dado al texto lorem ipsum nueva popularidad.


jueves, 23 de abril de 2015

DISEÑO WEB RESPONSIVE O ADADTIVO

IMAGEN.1http://www.mitziweb.com/img/blog/web-adaptativa02.jpg
IMAGEN.RODOS2http://www.roldos.es/blog/que-tu-web-sea-responsive/

Características diseño responsive
IMAGEN3..http://www.40defiebre.com/que-es/diseno-responsive/

¿Qué es el diseño responsive?

El diseño web responsive o adaptativo 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.

Hoy en día accedemos a sitios web desde todo tipo de dispositivos; ordenador, tablet, smartphone… por lo que, cada vez más, nos surge la necesidad de que nuestra web se adapte a los diferentes tamaños de los mismos. 

¿En qué consiste el diseño responsive?

Se trata de redimensionar y colocar los elementos de la web de forma que se adapten al ancho de cada dispositivo permitiendo una correcta visualización y una mejor experiencia de usuario. Se caracteriza porque los layouts (contenidos) e imágenes son fluidos y se usa código media-queries de CSS3. 

El diseño responsive permite reducir el tiempo de desarrollo, evita los contenidos duplicados, y aumenta la viralidad de los contenidos ya que permite compartirlos de una forma mucho más rápida y natural.

Se basa en proporcionar a todos los usuarios de una web los mismos contenidos y una experiencia de usuario lo más similar posible, frente a otras aproximaciones al desarrollo web móvil como la creación de apps, el cambio de dominio o webs servidas dinámicamente en función del dispositivo.

En definitiva, el diseño web responsive se consolida como una de las mejores pràcticas hoy en dìa en diseño web. Aunque como todas, tiene sus pros y contras, la web responsive es considerada hoy en día la mejor práctica posible en el diseño web, y nosotros te enseñasmos los puntos que hay q tener en cuenta a la hora de hacer tu web responsive  

¿Cuales son las principales ventajas?

La principal y más obvia es la correcta visualización desde cualquier dispositivo: sea cual sea su tamaño, la web se adaptará a él. Además, varios motivos más nos hacen decantarnos por esta solución:
  • Mejoras SEO: Google recomienda el uso de Responsive y tiene lógica ya que todos los esfuerzos SEO se centralizan en una misma url y no en diferentes.
  • Mantenimiento web: mantener una web se hace mucho más sencillo ya que solamente se tiene una web -Responsive- y no dos (versión PC y versión móvil) por lo que se ahorra tiempo, recursos y esfuerzo.
  • Disponibilidad de contenidos: a diferencia de las versiones para móviles, las páginas Responsive muestran el mismo contenido en PC que en dispositivos móviles, lo que hace que cualquier usuario, independientemente de su dispositivo pueda usar cualquier contenido o funcionalidad de la web. 
¿Cuales son los principales inconvenientes?
  • A nuestro modo de ver, dos son los principales problemas que genera el diseño Responsive:

  • Velocidad de carga: las páginas con un diseño Responsive tardan más en cargar, es un hecho. Sin embargo, la mejora de los dispositivos, de las velocidades de conexión y de las tarifas de datos, cada vez más harán este inconveniente menos importante.
  • Estrategia web única: no está claro si es una ventaja o un inconveniente. En cualquier caso, la web que se sirve a móviles y a PCs es la misma por lo que no se pueden diseñar estrategias diferenciadas en función del dispositivo. Por un lado es bueno, porque se establece una estrategia web global; pero al mismo tiempo nos deja menos margen de maniobra a la hora de pensar en estrategias orientadas a un dispositivo específico.  

                   Diseño web adaptable

El diseño web adaptable o adaptativo, 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 electònicos ,portatiles ,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 del diseño web adaptable
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.,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.

Diferencias entre el diseño web adaptativo y responsive 

El diseño web responsive: reestructura en la pantalla del dispositivo de los elementos de la web para optimizar todo el espacio disponible y ofrecer una exelente experiencia de usuario.

Esto se consigue estableciendo unas medidas de ancho y de màrgenes  de diseño en tamaño proporcionales.

Por ejemplo , un menù  horizontal se covierte en vertical si se visualiza en smartphones evitando los scrolls infinitos y organizando el contenido de una mejor forma. La  ùnica desventaja de esta tecnica  de diseño web  es que los elementos no son redimensionables,con los videos y banners, que no cambian su tamaño dependiendo del dispositivo.

Un diseño web adaptativo: por otro lado , no es tan flexible como el responsive ,
Aunque las ventajas del sitio web con diseño web adaptativo son numerosas, sin embargo existen ciertos inconvenientes. Se trata particularmente del tiempo de carga de la web.

La mayoría de las veces, los usuarios se encuentran en la obligación de descargar de manera inútil un código HTML/CSS. De igual manera, las imágenes son a menudo simplemente alargadas y redimensionadas provocando un impacto negativo en el tiempo de descarga. Si el código está bien optimizado, esta descarga de información extra será imperceptible para el usuario. Las imágenes si que deben adecuarse en tamaño y sobre todo en peso (kb) para reducir la máximo su carga con velocidades de conexión lentas.Por otra parte, el diseño web adaptativo no permite ajustar fácilmente los títulos, las descripciones y otros contenidos en los teléfonos móviles. Además, el desarrollo del sitio web adaptativo exige más tiempo. Obliga a una descarga de todos los elementos que constituyen la página pudiendo ocasionar un rendimiento menor. Existen definitivamente más dificultades en cargar el contenido de un sitio web adaptativo que el contenido de un sitio móvil especializado. Al trabajar con diseños webs adaptables deberemos olvidarnos de las anchuras y tamaños en píxeles y pensar en %. Lo mismo pasa con los tamaños de letra. Ya no podrán tener un tamaño definido sino que deberán crecer y reducirse en función de la pantalla