CARRERA: TECNOLOGÍA EN DESARROLLO DE SOFTWARE
ASIGNATURA: DESARROLLO DE APLICACIONES MÓVILES (MODALIDAD VIRTUAL)
NOMBRE DEL DOCENTE: Richard Tigrero
NOMBRE DEL ESTUDIANTE: Riera Andrade Melany Paola
AULA: 4to A
Introducción a CSS3 Y Javascript
CSS/CSS3 - Historia y Para que sirve
JAVASCRITP - Historia y Para que sirve
HISTORIA DE CSS
Las hojas de estilos aparecieron poco después que el lenguaje de etiquetas SGML
Desde la creación de SGML, se observó la necesidad de definir un mecanismo que permitiera aplicar de
forma consistente diferentes estilos a los documentos electrónicos.
El organismo W3C (World Wide Web Consortium), encargado de crear todos los estándares relacionados
con la web, propuso la creación de un lenguaje de hojas de estilos específico para el lenguaje HTML y se
presentaron nueve propuestas
Las dos propuestas que se tuvieron en cuenta fueron la
• CHSS (Cascading HTML Style Sheets)
• SSP (Stream-based Style Sheet Proposal).
La propuesta CHSS fue realizada por Håkon Wium Lie y SSP fue propuesto
por Bert Bos
Lie y Bos se unieron para definir un nuevo lenguaje que tomaba lo mejor
de cada propuesta y lo llamaron CSS (Cascading Style Sheets).
En 1995, el W3C decidió apostar por el desarrollo y estandarización de CSS
y lo añadió a su grupo de trabajo de HTML.
A finales de 1996, el W3C publicó la primera recomendación oficial, conocida como "CSS nivel 1".
A principios de 1997, el W3C decide separar los trabajos del grupo de HTML en tres secciones: el grupo de
trabajo de HTML, el grupo de trabajo de DOM y el grupo de trabajo de CSS.
El 12 de Mayo de 1998, el grupo de trabajo de CSS publica su segunda recomendación oficial, conocida
como "CSS nivel 2".
La adopción de CSS por parte de los navegadores ha requerido un largo periodo de tiempo. El mismo año
que se publicó CSS 1, Microsoft lanzaba su navegador Internet Explorer 3.0, que disponía de un soporte
bastante reducido de CSS. El primer navegador con soporte completo de CSS 1 fue la versión para Mac de
Internet Explorer 5, que se publicó en el año 2000. Por el momento, ningún navegador tiene soporte
completo de CSS 2.1.
¿Para qué sirve ?
Como ya mencionamos, CSS3 sirve para cambiar el aspecto de un sitio web, desde las medidas para los
márgenes hasta las especificaciones para las imágenes y el texto. CSS3 funciona mediante módulos, algunos
de los más comunes son “colors”, “fonts”, “backgrounds”, etc. Los módulos son sólo categorías en las que
se pueden dividir las modificaciones que hacemos al aspecto de nuestro sitio webEl código CSS hace la vida
más fácil al desarrollador front-end al separar las estructura de un documento HTML de su presentación.
Dicho de otro modo el HTML actuaría como es esqueleto de la web, definiendo su estructura básica, y el
CSS añadiría toda la
La base de
CSS CSS3
comparación entre
CSS vs CSS3
CSS1 no es compatible con CSS3. Su
CSS3 es compatible con versiones
objetivo principal era proporcionar varias
anteriores de CSS1. No hará que ningún
funciones de formato. También agregaron
código escrito en CSS1 sea inválido. Mejora
capacidades de posicionamiento para
Compatibilidad aún más la apariencia de una página web.
textos y objetos. Pero todo esto se
Se cargan más rápido y el tiempo
actualizó gradualmente a CSS3. Por lo
requerido para crear una página es aún
tanto, podemos decir que CSS se ha
menor.
elevado a CSS3.
Antes del lanzamiento de CSS3, los Desde el momento en que se introdujo
desarrolladores solían diseñar imágenes CSS3, el desarrollador solo necesita escribir
que parecían esquinas redondeadas a el código como ".roundBorder (border-
Esquinas diferentes estructuras y gradientes de radius: 10px;)". Tada! Se hace. El usuario
redondeadas y fondo. El proceso incluyó al desarrollador no necesita colocar el código en el servidor
gradientes diseñando el borde particular, cargando y realizar las otras actividades. Los
este diseño sobre el servidor, colocando la gradientes se pueden configurar usando un
imagen en la página web y al final CSS tuvo código como ".gradBG (background: liner-
que posicionar correctamente este borde. gradient (white, black);)"
Usando CSS3, un desarrollador puede
agregar sombra de texto para que sea más
fácil de leer. También pueden agregar
Las animaciones en CSS se escribieron en efectos visuales a las líneas discontinuas y
JavaScript y JQuery. CSS no tenía palabras más largas para que se ajusten
Animación y características en la capa de diseño y los correctamente dentro de las columnas y
efectos de texto elementos de la página tampoco podían las envolturas de palabras. Otras
tener efectos especiales como sombreado características también incluyen un cambio
de texto, secciones de texto, etc. continuo de tamaño y color del texto. Se
puede establecer el tiempo de cambio.
Incluso se puede configurar una acción
como pasar el mouse sobre el cambio.
CSS permite a un usuario: Para usar una lista en CSS3, la propiedad
1) Establecer diferentes listas para listas 'display' debe tener un elemento de lista
ordenadas definido en ella. El elemento de la lista
2) Establecer diferentes listas para listas tiene un contador y está directamente
Liza desordenadas afectado por las propiedades de
incremento y restablecimiento del
3) Establecer una imagen para un
contador. CSS3 no es compatible con el
marcador de elemento de lista
sistema de numeración y, por lo tanto,
4) Agregue colores de fondo a la lista y podría ignorar su uso. La propiedad de
elementos de la lista. imagen de estilo de lista en CSS3 permite
que una imagen se establezca contra el
Los diferentes marcadores de elementos
marcador del elemento de lista. Una vez
de lista son de tipo lista-estilo.
que la imagen esté disponible, se
Estos se pueden configurar como círculo, configurará para mostrar el marcador de
cuadrado, etc. tipo de estilo.
También tiene la propiedad de posición de
estilo de lista que especificará la posición
del cuadro marcador en un cuadro
principal. Se puede configurar como dentro
de la caja o fuera de la caja.
Las pseudo-clases en CSS3 son bastante
similares a CSS. Pero tienen algunas
características adicionales que lo hacen
Las pseudo-clases se utilizan para definir
más fácil y famoso de usar. Éstos incluyen:
especialmente un estado de un elemento.
1): objetivo raíz del elemento raíz del
Sintaxis: selector: pseudo-class (
documento.
El valor de la propiedad;
2): nth-child (n) usa valores numéricos
Pseudo-clases )
dentro de (n) para seleccionar elementos
Proporciona diferentes propiedades como secundarios con respecto a su posición en
Hover on (), Simple tooltip hovers (). La el elemento primario. Por ejemplo, podría
pseudo clase: primer hijo coincide con el usar esto para agregar colores de fondo
primer hijo de cualquier elemento. alternativos a los comentarios del blog
3): elementos de destino vacíos que no
tienen texto o elementos secundarios,
como elementos vacíos como
capa de personalización sobre el que la web define su aspecto final.
Siguiendo este fundamento resulta muy fácil para un diseñador web realizar cambios en la apariencia de
una web sin afectar de manera dramática a su contenido. El contenido siempre será el mismo, solo cambia
como aquello que podemos ver. CSS es fácil de entender y aprender, y nos da un potente control de cómo
diseñar los documentos HTML.
Por ejemplo, gracias al CSS podemos definir que todas las etiquetas <H1> de un texto cambie su apariencia
por aquella que definamos, cambiando colores, fuentes y añadiendo efectos sin modificar nada del
contenido que sirve de base. Imagina ahora si tuvieras que hacerlo revisando línea a línea.
Por tanto la principal ventaja del CSS es que al poder ordenar nuestras preferencias de estilo en un único
documento independiente ahorramos una considerable cantidad de tiempo al escribir nuestras órdenes
CSS en forma de plantilla una única vez para ser aplicado luego a todos las páginas que componen nuestra
página web.
JAVASCRITP - Historia y Para que sirve
Historia
Nacimiento de JavaScript
JavaScript fue desarrollado originalmente por Brendan Eich de Netscape con el nombre de Mocha, el cual
fue renombrado posteriormente a LiveScript, para finalmente quedar como JavaScript. El cambio de
nombre coincidió aproximadamente con el momento en que Netscape agregó compatibilidad con la
tecnología Java en su navegador web Netscape Navigator en la versión 2002 en diciembre de 1995. La
denominación produjo confusión, dando la impresión de que el lenguaje es una prolongación de Java, y fue
considerada por muchos como una estrategia de mercadotecnia de Netscape para obtener prestigio e
innovar en el ámbito de los nuevos lenguajes de programación web.910
«JAVASCRIPT» es una marca registrada de Oracle Corporation.11 Es usada con licencia por los productos
creados por Netscape Communications y entidades actuales como la Fundación Mozilla.1213
Microsoft dio como nombre a su dialecto de JavaScript «JScript», para evitar problemas relacionadas con
la marca. JScript fue adoptado en la versión 3.0 de Internet Explorer, liberado en agosto de 1996, e incluyó
compatibilidad con el Efecto 2000 con las funciones de fecha, una diferencia de los que se basaban en ese
momento. Los dialectos pueden parecer tan similares que los términos «JavaScript» y «JScript» a menudo
se utilizan indistintamente, pero la especificación de JScript es incompatible con la de ECMA en muchos
aspectos.
Para evitar estas incompatibilidades, el World Wide Web Consortium diseñó el estándar Document Object
Model (DOM, o Modelo de Objetos del Documento en español), que incorporan Konqueror, las versiones
6 de Internet Explorer y Netscape Navigator, Opera la versión 7, Mozilla Application Suite y Mozilla Firefox
desde su primera versión.[cita requerida]
En 1997 los autores propusieron14 JavaScript para que fuera adoptado como estándar de la European
Computer Manufacturers 'Association ECMA, que a pesar de su nombre no es europeo sino internacional,
con sede en Ginebra. En junio de 1997 fue adoptado como un estándar ECMA, con el nombre de
ECMAScript. Poco después también como un estándar ISO.
Para que sirve JavaScript
Con este lenguaje de programación del lado del cliente (no en el servidor) podemos crear efectos y
animaciones sin ninguna interacción, o respondiendo a eventos causados por el propio usuario tales como
botones pulsados y modificaciones del DOM (document object model). Por tanto, nada tiene que ver con
el lenguaje de programación Java, ya que su principal función es ayudar a crear páginas webs dinámicas.
El código de programación de JavaScript se ejecuta en los navegadores, ya sean de escritorio o móviles, ya
sean Android o Iphone. Sirve para exactamente lo mismo, da igual en el tipo de dispositivo que se ejecute
el navegador.
JavaScript es capaz de detectar errores en formularios, de crear bonitos sliders que se adapten a cualquier
pantalla, de hacer cálculos matemáticos de forma eficiente, de modificar elementos de una página web de
forma sencilla. Pero también JS es el encargado de que existan herramientas como Google Analytics, Google
Tag Manager, Facebook Pixel y tantas otras, que son claros ejemplos de JavaScript.
Existe una tecnología llamada AJAX que permite intercambiar información con el servidor sin tener que
recargar la página. Es decir, sólo cargamos de la página lo necesario. Esta tecnología desarrollada en
JavaScript ha supuesto uno de los principales avances en el desarrollo web. Aunque no la sepamos
reconocer, es la encargada de que podamos conseguir más mensajes, tweets, emails…sólo pulsando un
botón, sin tener que recargar la página.
JavaScript ahora mismo es el lenguaje más popular. De hecho, desde hace años se ha creado una versión
que es capaz de ser ejecutada también en el lado del servidor (Node JS). Por tanto, ahora mismo se ejecuta
JavaScript en los navegadores y en los servidores, creando a su alrededor una amplísima comunidad de
desarrolladores casi full-stack. JavaScript del lado del servidor compite en igualdad de condiciones con PHP,
por ejemplo.
Como casi todo lenguaje de programación, podemos hacer programación orientada a objetos en JavaScript.
Sin duda alguna, la forma en la que se crean, modifican y se muestran los objetos en el navegador ha sido
uno de los grandes causantes de su auge.
En la actualidad existen algunas prácticas, no demasiado recomendadas por los SEO, donde JS se encarga
de numerosas funciones de estilo. Por ejemplo, muchos temas y plugins de WordPress utilizan scripts para
hacer responsive el diseño web. Los navegadores modernos interpretan esto sin problemas, pero es posible
que la araña de Google piense que no es la mejor manera de hacerlo.
La librería de JavaScript más utilizada en la historia, y que todavía se sigue utilizando es jQuery. Con jQuery
podíamos hacer más cosas, escribiendo menos. Con una sintaxis mucho más sencilla, podíamos modificar
nuestro sitio web, crear plugins, animar videojuegos y muchas cosas más. En la actualidad, jQueey ha
perdido espacio en favor otras tecnologías más modelas como React o Angular.
Bibliografía
https://prezi.com/qihmvzmiyxqn/historia-de-
css/?frame=be4bd8c39ad085ed9d8d40df5d20bc3ffe2e5109
https://es.education-wiki.com/8189942-css-vs-css3
https://blog.aulaformativa.com/definicion-usos-ventajas-lenguaje-css3/
https://soyrafaramos.com/que-es-javascript-para-que-sirve/
https://es.wikipedia.org/wiki/JavaScript
