Sesión 18: Orden en la estructura html y CSS
Aquí algunos Tips para ordenar el código de mis archivos: El primero es separar bloques de código con la etiqueta de comentario <!– INICIO DEL HEAD –> la idea es que se puedan diferenciar del resto . Para comentar en CSS se requiera de la siguiente etiqueta: /* Aquí puedes escribir tu comentario */ Etiqueta […]
Sesión 17: Propiedades Flex
Comenzamos trabajando en nuestro proyecto conociendo los atributos de display; flex cargándolos en nuestro documento html. Flexbox representa un modelo básico de maquetación que supone la existencia de una caja padre llamada contenedor flexible o caja flex. Los elementos hijos situados dentro del contenedor flexible llevan el nombre de elementos o ítems flex. Los elementos flex tienen la capacidad de redimensionarse […]
Sesión 16: Display; Flex
Cuando se comienza a traspasar el diseño o se extrae de su maquetado se debe identificar todos los bloques del sitio escribiendo el html desde arriba y bajando: de body, cabecera, nav, div, articule, section, footer etc. Qué es Flex Flex es uno de los nuevos valores HTML5 para propiedad CSS display, que nos permite maquetar […]
Sesión 15: Estilos de caja Box-model
Todo en CSS tiene una caja alrededor, comprenderlo es clave para poder crear diseños con CSS o para alinear elementos con otros, la diagramación del contenido ahora se piensa en bloques y rectángulos, un diseño de compaginación. En el modelo de cajas todos los elementos HTML se pueden considerar como cuadros. En CSS, el término «modelo […]
Sesión 14: Etiquetas y propiedades de CSS
La clase inicia con un repaso de lo visto anteriormente, se revisa de la estructura semántica de una pagina web html y consultaremos las propiedades de CSS, pero a continuación se comparte un link para revisar el ejemplo de structure-html: https://css-tricks.com/snippets/html/html5-page-structure/ Repaso de etiquetas semánticas etiqueta <ul></ul> El elemento ul representa una lista no ordenada de ítems […]
Sesión 13: Entorno desarrollo web Estilo CSS
La clase comienza con la introducción a nuevos términos para html: Etiquetas Div: Etiqueta que define las divisiones lógicas existentes en el contenido de una página web. Puede utilizar etiquetas div para centrar bloques de contenido, crear efectos de columna y crear diferentes áreas de color, entre otras posibilidades. Sus etiquetas son: <div> y </div> (ambas obligatorias). La etiqueta <div> se puede […]
Sesión 12: Entorno de desarrollo web Html
La clase comienza con un resumen de lo visto anteriormente; historia de la internet con Arpanet para llegar a la descripción de los 3 lenguajes mas usados . HTML, CSS y JavaScript son los tres lenguajes que dominan la creación de todo sitio web, al menos en su parte visual e interactiva. Aquí conocerás qué son […]
Sesión 11: Códigos / Html / Semántica
html5 es un consenso de la https://www.w3.org/ que se encarga de generar un estándar para toda la web, accesibilidad, seguridad, sus tecnologías y los navegadores tienen la función de interpretarlos. Los documentos html deben tener cierta lógica en su estructura. Un sitio es como un libro que tiene muchas paginas y cada una tiene un orden y jerarquía. […]
Sesión 10: Editor de texto / Sublime text
La clase comienza conversando sobre el entorno al desarrollo web. En el caso de la ilustración el entorno seria una tableta de dibujo utilizando los programas como ilustrator. Para el caso del desarrollo web lo mas básico es el editor de texto, el lenguaje html y css entre otros le dan formato al proyecto, los […]
Sesión 9: Diseño visual / Historia del Diseño web
La clase inicia con una conversación sobre el diseño visual y todo lo visto hasta ahora: El cual se considera una disciplina artística que se encarga de comunicar visualmente un mensaje el cual por lo general es una acción (qué debe hacer el usuario). Proximidad – Repetición – Alinear, elementos de la Gestalt considerando la […]