Lenguaje de ProgramaciónTecnología

Lenguaje de programación CSS   

Investigación página de programación (Cascading Style Sheets) hojas de estilo en cascada  

¿ Que es CSS ?

El CSS es una página de programación de diseño gráfico para la presentación de documentos estructurados en un lenguaje de mercado por lo tanto si les gusta el mundo del diseño web es de las mejores, mayor mente utilizada para dotar cualidades visuales y estéticas en una página web, es un lenguaje que podría estar en inglés y en alemán que los navegadores como Chrome o Firefox conocen y pueden entender                       

para que es utilizado               

CSS es uno de los lenguajes base en el Open web y posee una especificación estandarizada por parte del W3C. Antes, el desarrollo de varias partes de especializaciones de CSS se realizaba sincrónica, lo que permite versionar las recomendaciones. HTML es la página que se utiliza antes para sentar las bases. además puedes crear formatos específicos útiles para desarrollar tus ideas y producir experiencias más agradables, en aspecto visual, para los usuarios del sitio web.

Primeros pasos

ahora que has adquirido familiaridad con él con el lenguaje y su sintaxis has ganado cierta experiencia básica en su uso profundizando el lenguaje este analiza la cascada y la herencia, todos los tipos de que tenemos disponibles, unidades, tamaño, estilo de fondos y bordes, depuración y mucho mas

Bloques de construcción

este modulo continúa a partir de donde dejó el modulo de primeros pasos . ahora que has adquirido familiaridad con el lenguaje y su sintaxis, has ganado cierta experiencia básica con su uso, es hora de profundizar un poco mas. este módulo analiza la cascada y la herencia, todos los tipos de sectores que tenemos disponibles, unidades, tamaños, estilo de fondos y bordes, depuración y mucho mas.

el propósito de este modulo es proporcionarte un set de herramientas para escribir CSS competente y ayudarte a entender toda la teoría esencial antes de avanzar hacia cuestiones mas especificas como estilo de textos y diseño CSS

Estilo de texto

Con los conceptos básicos del lenguaje CSS cubiertos, el siguiente tema de CSS en el que debes concentrarte es dar estilo al texto, una de las cosas más comunes que harás con CSS. Aquí veremos los fundamentos del estilo de texto, incluida configuración de la fuente, negrita, cursiva, espaciado entre líneas y letras, sombras y otras características del texto. Terminaremos el modulo analizando la aplicación de fuentes personalizadas a tu página y en el estilo de listas y enlaces.

Diseño de CSS

En este punto ya hemos analizado los fundamentos de CSS, cómo dar estilo al texto y cómo diseñar y manipular las cajas en las que se encuentra el contenido. Ahora es el momento de ver cómo colocar sus cajas en el lugar correcto en relación con la plantilla del dispositivo y entre si. Hemos cubierto los requisitos previos necesarios para que ahora pueda profundizar el diseño de CSS, mirando diferentes configuraciones de pantalla, métodos de diseño tradicionales que implican flotación y posicionamiento, y nuevas herramientas de diseño como flexbox, grid y posicionamiento, Así como algunas técnicas de herencia que quizás deseas conocer.

Herramientas para el desarrollo de CSS

Puede usar el servicio de validación CSS de W3C para verificar si su CSS es valido. es una herramienta de depuración de valor incalculable.

Las herramientas para desarrolladores de Firefox ye permitan ver y editar el CSS de una pagina en vivo a través de las herramientas inspector y editor de estilos.

La extensión Web Developer para Firefox le permite rastrear y editar CSS en vivo en sitios vigilados.

La comunidad Web ha creado varias herramientas para que las uses

Ventajas de usar CSS

Separación de la estructura y la presentación. CSS permite separar el contenido HTML de su presentación visual. Es decir, te permite contener el código HTML limpio estructurado, mientras que el estilo se define en un archivo CSS separado. Este orden mejora la legibilidad del código y facilita al mantenimiento, así como la actualización de los estilos.

Consistencia y mantenibilidad. Al utilizar CSS, puedes aplicar estilos de manera consistente a un sitio o aplicación web. Los estilos se definen una vez y se aplican a múltiples elementos en las páginas, lo que favorece la renovación de la apariencia visual de todo el proyecto.

Eficiencia en el rendimiento. CSS permite cargar estilos externos en un archivo separado. Con esto, el navegador almacenará en caché los estilos y los aplicará a todas las páginas del sitio, lo que mejora el rendimiento al reducir la cantidad de datos que deben transferirse entre servidor y el cliente.

Flexibilidad y control. Asimismo, ofrece una amplia gama de propiedades y selectores con los que tendrás un control preciso sobre el estilo de los elementos HTML. podrás modificar, de forma sencilla, los colores, fuentes, márgenes, tamaños, diseños, etc. Gracias a esta características, podrás personalizar y adaptar a varios dispositivos y tamaños de pantalla tu sitio web.

Desventajas de usar CSS

Curva de aprendizaje. CSS puede tener una curva de aprendizaje empinada, en particular, para los principiantes. entender, por completo, todas las propiedades, selectores y conceptos avanzados puede llevar tiempo y práctica.

Compatibilidad entre navegadores. Aunque los estándares de CSS son de los más aceptados, algunos navegadores podrían interpretar y renderizar los estilos de manera diferente. Esto puede resultar en inconsistencias visuales y requerir pruebas o ajustes adicionales para garantizar la compatibilidad entre plataformas.

Especificidad y herencia. CSS utiliza reglas de especificidad y herencia para determinar qué estilos se aplican a los elementos. En ocasiones, el orden de las reglas y la jerarquía pueden generar resultados inesperados. Esto requiere una comprensión cuidadosa de cómo funcionan estas reglas para evitar conflictos y problemas de estilo.

Limitaciones en la maquetación. Aunque CSS ofrece una amplia gama de propiedades para el diseño y la maquetación, puede presentar limitaciones en ciertos casos más complejos. Algunos diseños específicos pueden requerir soluciones adicionales o el uso de técnicas más avanzadas para lograr el resultado deseado.

Diferencia entre HTML y CSS

Es un lenguaje de programación diferente a HTML

HTML es un lenguaje que sirve para gestionar la información contenida en un sitio web. por otro lado, CSS tiene la función de estructura el estilo de páginas. Ambos lenguajes trabajan en conjunto para presentar la información al público final.

Permite el apilamiento de instrucciones para definir formatos específicos

Esto significa que se pueden crear bloques de instrucciones animadas que permiten hacer modificaciones generales, de modo sencillo, lo cual simplifica la tarea de diseño y la creación de estilos estandarizados. Así se crean formatos específicos que pueden aplicarse a distancia páginas, los cuales, además, son modificables de forma muy sencilla.

Es utilizable en todos los navegadores y plataformas

Debido a que es un lenguaje popular para dar formato a los sitios web, su uso es universal para un amplio número de dispositivos, formatos t plataformas como Edge, Safari, Chrome, etc. por ello, es fácil dar formato a las páginas, según el navegador utilizado por cada usuario.

Optimiza el funcionamiento de las páginas web

Al separa el código de contenido y estilo, es mucho más rápido el procesamiento de la información, lo cual se traduce en una experiencia más fluida para los usuarios y en una carga de trabajo menor para los procesadores. Es importante e imprescindible la sincronización del código en HTML con CSS para que la información se presente de modo correcto.

Tiene una sintaxis específica

Si bien, la mayoría de los lenguajes comparten algunas funciones y signos, existen particularidades en el uso de CSS, por lo que es necesarios conocer el lenguaje de programación, así como las características de apilamiento. Más adelante revisaremos algunas de sus utilidades específicas.

Permiten personalizar totalmente la apariencia de las páginas

CSS da cabida a una gran libertan creativa. los diseñadores tienen un amplio espectro de posibilidades con sus herramientas. El uso de diferentes códigos de colores y de fuentes permiten emplear paletas de muchísimas tonalidades y múltiples tipografías. Así mismo, se pueden disponer los elementos visuales de un sitio según las necesidades del diseño.

Los 3 tipos de estilos CSS

CSS externo

El CSS externo existe en su propio archivo, el cual está enlazado a un documento HTML con la etiqueta <link>. Es el modo más para añadir CSS a HTML, ya que una hoja de estilo externa puede dictar el estilo de diferentes documentos HTML. Esto permite que los desarrolladores hagan cambios a lo ancho del sitio con un solo archivo CSS

CSS interno

El CSS interno es un código CSS incrustado en un documento HTML. está escrito dentro del elemento <styles>, que se acomoda en la sección de <head>:

CSS en línea

CSS en línea se ubica dentro de una etiqueta HTML para cambiar el estilo de un elemento en específico. La sintaxis inline es un poco diferente de lo que hemos visto, pues la declaración está escrita como el valor del atributo de estilo.

Mejores prácticas en CSS

MetodologÍa BEN

BEM (Block Element Modifer) es una metodologia de nomenclatura para las clases CSS que busca proporcionar una estructura clara y consistente en el código. BEM se basa en la idea de dividir la interfaz de usuario en bloques independientes , elementos dentro de esos bloques y modificadores para cambiar su apariencia o comportamiento.

Autor : Edward Nicolás Ruiz Marroquín

Editor :

código : UCPA-1

universidad : universidad Central

Fuentes :

(29/11/2022). CSS - MDN Web Docs
. Mozilla
trabajo visual. https://developer.mozilla.org/es/docs/Web/CSS
(Jul 25, 2023).Inbound Marketing
Introducción al CSS: qué es, para qué sirve y otras 10 ..
 https://blog.hubspot.es/website/que-es-css  
(27 nov 2019). ¿Qué es CSS? - CSS en español
 Lenguaje CSS
https://lenguajecss.com/css/introduccion/que-es-css/
ManzDev,(27 nov 2019)Photos.https://lenguajecss.com/css/introduccion/que-es-css/html-css-navegador.png
ManzDev,(27 nov 2019)Photos.https://lenguajecss.com/css/introduccion/que-es-css/html-css-navegador.png
Tu Web Creativa S. (2021/03). COLOMBIA. 
 Photos.
https://tuwebcreativa.com/centrar-imagen-css/  
akus.net,(22 feb 2014). COLOMBIA.  Photos.https://disenowebakus.net/imagenes/articulos/aprender-css-hojas-de-estilo-en-cascada.jpg
Bitech Studio. (16 nov 2017). ¿Qué es CSS? bien explicado [Video]. YouTube. https://youtu.be/8cSo0ijtkzU?feature=shared