Screencasts de video 2024, Diciembre
Una plantilla es un fragmento de HTML que necesita inyectar en la página. A menudo, las plantillas se crean "del lado del servidor", en el sentido de que llegan a JavaScript por completo "
Lo dejamos con un widget de encuesta totalmente decente. La tipografía es limpia y todo perfectamente utilizable. Sin embargo, no fue exactamente convincente ni divertido. Nosotros"
Hay todas estas tareas que debemos hacer como desarrolladores frontales. Concatenar y comprimir nuestros archivos. Ejecute nuestros preprocesadores. Optimiza las imágenes. Correr"
Existe una larga tradición de encuestas sobre CSS-Tricks. Son divertidos, recopilan buenos datos importantes y aumentan la conexión de las personas con el sitio. ¡Compromiso FTW! "
En este video abordamos un pequeño problema de diseño de interfaz que hubiera sido prácticamente imposible sin Flexbox. También escribí un artículo al respecto "
Ya hemos pasado un poco de tiempo eliminando páginas para que funcione nuestra navegación (video n. ° 030) y puedas hacer clic en el sitio, pero ¿qué hay en esos sub?
Tuve una pequeña situación de diseño en la que estaba haciendo una cuadrícula fluida de cajas con flotadores. Quería especificar cuántos cuadros en una fila era muy "
Tenemos el diseño de cuadrícula para la Galería en marcha. Desafortunadamente, la carga es un poco abrupta y torpe. Esto se debe a que las columnas CSS3 están diseñadas para "
Publiqué una publicación escrita sobre esta idea del Server Side Mustard Cut. Así que si le gusta leer y comprobar ejemplos de código y todo eso, ese es el "
Comenzamos a profundizar en el diseño del área de la Galería, que es algo que ha estado en mi mente desde el comienzo de este proceso de rediseño. Principalmente"
En el segundo episodio de esta serie, continuamos con la estructura del sitio. En Photoshop, creamos los tres estados diferentes del menú, luego dividimos "
En el que descubrimos los problemas que teníamos para que el diseño de la columna se cargara correctamente. La solución fue eliminar el CSS que estaba creando el "
Recientemente nos mudamos a "HTTPS en todas partes" aquí en CSS-Tricks. Escribí una publicación de blog detallando los pasos para llegar allí. Este video es un complemento "
Agregamos cierta capacidad de respuesta a la cuadrícula que hemos configurado para la Galería. En las pantallas más amplias, lo tenemos configurado en cuatro columnas. Luego comenzamos a agregar "
En lugar de un screencast típico, este es un video de mi charla SVG is for Everybody grabado por la banda de Treehouse en BlendConf. Por supuesto que hay "
Tenemos un buen comienzo en el diseño receptivo. El menú en los tamaños de pantalla más pequeños se divide en una cuadrícula de 2x4. Encaja muy bien en la pantalla, pero "
En este video, hablo de una situación particular del "mundo real" en la que estaba involucrado en cómo manejo la página de CodePen Meetups. En los primeros días "
Hasta ahora, hemos realizado cambios de código localmente sin utilizar ningún tipo de control de versiones. Con la complejidad de este sitio en aumento, se está convirtiendo en "
No hay una sola propiedad de CSS a la que busque cuando oculte y muestre cosas en CSS. Hay un montón de consideraciones que analizaremos en "
Hay siete áreas principales diferentes del sitio más allá de la página de inicio. Entonces, contraté a siete ilustradores diferentes para hacer diseños. Este es el primero que somos "
Conoces las imágenes receptivas. Se trata de la sintaxis de la imagen en HTML. Si le proporciona la información correcta en la sintaxis correcta, puede obtener el navegador "
Acabamos de instalar el encabezado personalizado para la Galería, así que mientras estamos en, sigamos agregando otro encabezado personalizado. este fue hecho por "
Animar SVG es un poco único en el sentido de que hay tres formas claramente diferentes de abordar la animación. 1. Animando con CSS @keyframes SVG "
Tenemos el encabezado básico de la galería en su lugar, pero faltan las personitas azules que Erica puso en la ilustración original. Lo habíamos hablado en "
Esta es la versión de video screencast de una publicación de blog que hice no hace mucho: Técnica útil de Flexbox: Envoltura de cambio de alineación. Estuve en una reunión de CodePen "
Mientras trabajaba en este diseño, se lanzó jQuery 1.8. Este es solo un video rápido para confiar en el hecho de que este tipo de cosas suceden a medida que desarrolla sitios "
Probablemente soy un poco raro en el sentido de que disfruté tratando de mantenerme al día con las imágenes receptivas. Es un problema interesante que generó muchos "
La ilustración de Nick tenía tres capas diferentes para las cabezas. Son variaciones ligeramente diferentes. Podríamos intercambiar las imágenes con una animación "
Sobre el diseño de CSS-Tricks mientras grabo esto, una de las cosas que quería agregar era un widget de "Trabajos de diseño y desarrollo de front-end", impulsado por CodePen "
Como saben, algunos de los anuncios de CSS-Tricks son "autogestionados", como el patrocinador principal de Treehouse. Lo asumí porque es solo un sencillo "