Evolución del diseño y desarrollo web

in Comunidad Latina25 days ago (edited)

Redes sociales Aviso Moderno Azul_20240522_195407_0000.png

Hola,Comunidad de Steemit,el día de hoy les hablaré un poco de la evolución del diseño y desarrollo web ,y las herramientas que facilitan la manera de diseñar y desarrollar la web hoy en día.

La web,en especial el diseño web a evolucionado mucho y no se parece nada a como la conocemos ahora,ya que antes,era necesario usar muchos div(cajas),para maquetar un sitio o página web, imagínate diseñar una página web con muchas cajas estaticas y rígidas,las cuales no se podían modificar demasiado,si querias redondear los bordes o darles un efecto más estético era necesario usar herramientas externas como Photoshop,ya que las herramientas nativas para diseñar eran limitadas,era una auténtica pesadilla.

Si deseabas agregar un video o reproducir canciones tenías que depender de flash o alguna otra herramienta,ya que Javascript estaba limitado para ese entonces.

Además las web de ese entonces no estaban diseñadas o adaptadas para dispositivos moviles como son los teléfonos y las tablets,lo más probable es que si buscas una web antigua,te resulte algo frustrante navegar por ella,ya que tendrás que estar haciendo zoom y minimizando para poder hacer alguna cosa.

Pero claro hay que resaltar que había páginas increíbles y memorables como Friv,Y8,Mattel,Cartoon network,esas páginas que estarán en nuestro recuerdo para siempre.

A medida que la web crecía y que las personas necesitaban más cosas de las páginas como suscribirse a un sitio para recibir novedades,hacer compras en linea,etc.las herramientas externas empezaban a quedarse cortas y no podian cubrir todas las necesidades. En ese momento entro en escena el trío de la web HTML,CSS y Javascript, mejorado y super poderoso.

HTML o más sencillo el lenguaje en que se escribe las páginas web,regreso con su versión 5 o mejor conocida como HTML 5, la cual es capaz de reproducir videos,música, validar formularios y hasta poder desarrollar aplicaciones de dibujo o juegos con su herramienta canva. Ya no necesita herramientas externas como flash,porque ya puede hacerlo solo.

Actualmente HTML5 va por su versión 5.2.

CSS o más sencillo el lenguaje encargado de darle estilo a las páginas regreso con su versión 3 o CSS3,la cual ya no necesita de Photoshop para redondear y darle efectos,por que puede hacer todo eso solo y mucho mas. CSS3 puede crear animaciones increíbles sin necesidad de Javascript,dibujar,crear objetos en 3D y 2D,y puede hacer un juego sencillo sin js(Javascript) así de poderoso es.

product.PNG

--Dibujo realizado con css--

Javascript o más sencillo el lenguaje para darle dinamismo a las páginas ,evolucionó con su versión 6,el complementa al trío de la web y juntos pueden hacer cualquier cosa.

Herramientas para el diseño y desarrollo web:

El validador de la W3C:

Está herramienta es muy útil si deseas asegurarte que tus documentos HTML estan bien hechos ,además tiene una herramienta para validar tus documentos CSS. La herramientas es capaz de enseñarte los errores en el documento y algunas sugerencias.

En mi perfil de Twitter o X hablo un poco más de esta herramienta.

Figma:

Está es una herramienta para desarrollar prototipos para aplicaciones y páginas web,además puedes diseñar prototipos para aplicaciones moviles. Está aplicación cuenta con una versión web pero también puedes descargarla en tu computadora.

Es gratuita pero cuenta con una versión de paga si desea tener más herramientas y actualmente cuenta con una herramienta llamada figjam para poder trabajar con más personas.

Webflow:

Está herramienta es para diseña y publicar páginas también, a diferencia de Figma ella funciona es en su página web,no tiene una versión de computadora hasta donde conozco,cuenta con una versión gratuita y una de paga.

Si deseas aprender de esta herramienta webflow tiene una página para ello webflowuniversity dónde puedes aprender todo de webflow y puedes obtener un certificado.

Estas son todas las herramientas que puedo mencionar hoy,si conoces alguna otra mencionala y espero que te sirva.

Extra:

Si deseas aprender de desarrollo web recomiendo "el gran libro de HTML5, CSS3 y Javascript" de Juan Diego Gauchat. Este fue el primer libro que leí cuando empecé en este mundo del desarrollo web.

Espero que este post te haya servido y que te gustará,si te gusta esta clase de post me gustaría saberlo para poder compartir más sobre este interesante y extenso mundo del desarrollo web. Saludos a todos😊

**--Portada diseñada en canva--**
Sort:  

Hola. Soy desarrolladora web. No es una tarea fácil :-)

 22 days ago 

Los admiro. Son muchos códigos o (cajas) como Aprendí hoy en esta maravillosa publicación, para aplicar.
Yo tengo un archivo con algunas de ellas.

Loading...
 22 days ago 

Hola 🙋🏻 @madck

Se ve interesante tu publicación. Usar esos códigos para maquetar los post han sido una de mis pesadillas. Jejejeje

Pero, ya le he ido agarrando el ritmo.

Uso Canva, para hacer mis portadas, me gusta usar esta herramienta. Cada vez que hago algo en ella, aprendo otra cosa.

Gracias por compartir esta información.

Saludos y bienvenida a esta plataforma. Ya que eres aún una recién llegada.

¿Sabías que por tres meses se te permite usar la etiqueta #Newcomers en todas tus post?

Úsala está allí con un fin.

Hola, gracias ☺️

Coin Marketplace

STEEM 0.22
TRX 0.12
JST 0.029
BTC 66103.77
ETH 3554.23
USDT 1.00
SBD 3.11