Your SlideShare is downloading. ×
0
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Pincipios css3 & html5
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Pincipios css3 & html5

212

Published on

En esta presentación se dan a conocer los nuevos principios de Html5 Y Css3, presentación creada para Tc Unibague

En esta presentación se dan a conocer los nuevos principios de Html5 Y Css3, presentación creada para Tc Unibague

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
212
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. PRINCIPIOS EN HTML5 Y CSS3 Marlon Ramirez (Zhionit) Tc Unibague
  • 2. Html5 y familia Html5 Un cambio que ahora estamos viviendo con HTML5, es una nueva revisión del estándar que mueve Internet. Html5 Es una combinación de nuevas etiquetas de Markup. La familia HTML5 incluye nuevas etiquetas y tecnologías como CSS3, Geolocalización, Almacenamiento Web (Web Storage) y WebSockets entre otras. A continuación se dará una breve explicación sobre algunas de ellas
  • 3. Api • Que es una Api?? • Interfaz de Programación de Aplicaciones Definición formal • “Llave de acceso” • Llave de acceso? • Lllave de acceso a funciones que nos permiten hacer uso de un servicio web provisto por un tercero, dentro de una aplicación web propia, de manera segura.
  • 4. Ejemplos de APIs • Google Maps a través de su acceso a "API" nos permite ponerle datos e información útil sobre sus mapas, y presentarlos con ciertas búsquedas o funciones personalizadas, desde nuestra propia aplicación • Paypal con su "API" nos permite hacer operaciones de pagos electrónicos usando nuestro propio sistema web, sin necesidad de acceder/operar en la web de Paypal • Algunos Booking Engines (centrales de reservas de hoteles y tickets aereos) abren sus aplicaciones a partir de APIs para permitir que terceros re-vendan desde sus propios sistemas • Twitter ha permitido el desarrollo de un gran número de sistemas alternativos y servicios web que operan a través de su API • UPS y DHL (operadoras logísticas internacionales) brindan acceso a sus sistemas desde APIs, para permitirles a los sitios de comercio electrónico poder calcular el costo de envío de los productos vendidos según ciertos parámetros • Facebook Connect cede a través delAPI ciertos datos para registrar automáticamente usuarios en otros sitios web, dándoles la posibilidad de registrarse y loguearse con sus propias cuentas de Facebook
  • 5. Pollyfill • Qué es un polyfill? • Es un código que nos proporciona la tecnología para tener nuevas funcionalidades. • También conocido como “Plugin” • Para que sirve? • Nos permite usar las nuevas funcionalidades de HTML5 en navegadores que no las soportan de forma nativa.
  • 6. Algunos Pollyfil • Drag and Drop • Arrastrar y soltar es una expresión informática que se refiere a la acción de mover con el ratón objetos de una ventana a otra o entre partes de una misma ventana. • jQuery UI Draggable • Geolocalización • El nuevo estandar HTML5 permite detectar la geolocalización del usuario de una página o aplicación web de forma extremadamente sencilla. • https://developers.google.com/maps/?hl=es
  • 7. • WebSockets • Hacer una app real-time (en tiempo real) es una gran mejora y los WebSockets brindan esta habilidad para agregar comunicación bi-direccional en una conexión persistente para tu aplicación, permitiendo incrementar la interactividad y el compromiso con el usuario. • https://github.com/gimite/web-socket-js • Socket.io: un framework para Nonde.js que ayuda con transportes de bajo nivel para navegadores que carecen soporte nativo de WebSockets.
  • 8. Css3 • Las ventajas principales en esta nueva versión son la inclusión de nuevas propiedades especialmente en cuanto al aspecto gráfico. • He aquí una lista de las principales propiedades que son novedad en CSS3. • Bordes • border-color, border-image, border-radius, box-shadow. • Fondos • background-origin, background-clip, background-size, hacer capas con múltiples imágenes de fondo.
  • 9. • Color • colores HSL, colores HSLA, colores RGBA, Opacidad. • Texto • text-shadow, text-overflow, Rotura de palabras largas,Web Fonts. • Interfaz • box-sizing, resize, outline, nav-top, nav-right, nav-bottom, nav-left. • Selectores • Selectores por atributos.
  • 10. • Modelo de caja básico • overflow-x, overflow-y. • Degradados CSS3 • Degradados lineales, Degradados radiales, Degradados lineales de repetición, Degradados radiales de repetición. • Otros • media queries , creación de múltiples columnas de texto. • propiedades orientadas a discurso o lectura automática de páginas web. • animacionesCSS3.
  • 11. Transformaciones yTransiciones con Css • Transformaciones • http://msdn.microsoft.com/es-es/library/ie/jj665791%28v=vs.85%29.aspx • Transiciones • http://www.cristalab.com/tutoriales/uso-de-transiciones-en-css3-c107220l/ • Animaciones con Css • http://webintenta.com/userfiles/2012/01/ej29112011_17/css3animation.php • http://webintenta.com/userfiles/2012/01/ej29112011_17/css3animation2.php • http://webintenta.com/userfiles/2012/01/ej29112011_17/css3animation3.php • http://webintenta.com/css3-animaciones.html
  • 12. GRACIAS! Marlon Ramírez (Zhionit)

×