Esquema del diseño y desarrollo web

El siguiente esquema se proporciona como una descripción general y una guía temática sobre el diseño web y el desarrollo web, dos campos muy relacionados:

Diseño web : campo que abarca diversas habilidades y disciplinas en la producción y el mantenimiento de sitios web . Las diferentes áreas del diseño web incluyen el diseño gráfico web; el diseño de interfaces ; la autoría, incluyendo código estandarizado y software propietario ; el diseño de experiencia de usuario ; y la optimización para motores de búsqueda . A menudo, varias personas trabajan en equipos que cubren diferentes aspectos del proceso de diseño, aunque algunos diseñadores los cubren todos. ^{[ 1 ]} El término diseño web se usa normalmente para describir el proceso de diseño relacionado con el diseño de la interfaz (lado del cliente) de un sitio web, incluyendo la escritura de marcado . El diseño web se superpone parcialmente con la ingeniería web en el ámbito más amplio del desarrollo web . Se espera que los diseñadores web tengan conciencia de la usabilidad y, si su función implica la creación de marcado, también se espera que estén al día con las pautas de accesibilidad web .

Desarrollo web : trabajo que implica el desarrollo de un sitio web para Internet ( World Wide Web ) o una intranet (una red privada). ^{[ 2 ]} El desarrollo web puede abarcar desde el desarrollo de una página estática simple de texto plano hasta aplicaciones web complejas ( web apps ), negocios electrónicos y servicios de redes sociales . Una lista más completa de tareas a las que comúnmente se refiere el desarrollo web puede incluir ingeniería web , diseño web , desarrollo de contenido web , enlace con el cliente, programación del lado del cliente / servidor , configuración de seguridad de red y servidor web , ydesarrollo de comercio electrónico .

Entre los profesionales web, "desarrollo web" generalmente se refiere a los aspectos principales no relacionados con el diseño de la creación de sitios web: escribir marcado y codificación . ^{[ 3 ]} El desarrollo web puede utilizar sistemas de gestión de contenido (CMS) para facilitar los cambios de contenido y hacerlos accesibles con conocimientos técnicos básicos.

Para organizaciones y empresas más grandes, los equipos de desarrollo web pueden estar formados por cientos de personas ( desarrolladores web ) y seguir métodos estándar como las metodologías ágiles durante el desarrollo de sitios web. Las organizaciones más pequeñas pueden requerir solo un desarrollador permanente o contratado, o una asignación secundaria a puestos relacionados, como un diseñador gráfico o un técnico de sistemas de información . El desarrollo web puede ser un esfuerzo colaborativo entre departamentos en lugar de ser dominio de un departamento específico. Existen tres tipos de especialización en desarrollo web: desarrollador front-end , desarrollador back-end y desarrollador full-stack . Los desarrolladores front-end son responsables del comportamiento y los elementos visuales que se ejecutan en el navegador del usuario, los desarrolladores back-end se ocupan de los servidores y los desarrolladores full-stack son responsables de ambos. Actualmente, la demanda de desarrolladores de React y Node.js es muy alta en todo el mundo.

• Diseño gráfico
  • Tipografía
  • Diseño de página
• Diseño de experiencia de usuario (diseño UX)
• Diseño de interfaz de usuario (diseño UI)
• Técnicas de diseño web
  • Diseño web adaptable (RWD)
  • Diseño web adaptativo (AWD)
  • Mejora progresiva
  • Diseño web sin tablas
• Software
  • Adobe Photoshop
  • Adobe Illustrator
  • Adobe XD
  • Figma
  • Boceto (software)
  • Diseñador de afinidad
  • Inkscape

• Desarrollo web front-end : la práctica de convertir datos en una interfaz gráfica, mediante el uso de HTML, CSS y JavaScript, para que los usuarios puedan ver e interactuar con esos datos.
  • Lenguaje de marcado de hipertexto ( HTML ) (*.html)
  • Hojas de estilo en cascada ( CSS ) (*.css)
    • marco CSS
  • JavaScript (*.js)
    • Gestores de paquetes para JavaScript
      • npm (originalmente abreviatura de Node Package Manager)
• Programación del lado del servidor (también conocida como "desarrollo web del lado del servidor" o "desarrollo web de back-end")
  • ASP (*.asp)
  • Formularios web ASP.NET (*.aspx)
  • Páginas web ASP.NET (*.cshtml, *.vbhtml)
  • Lenguaje de marcado ColdFusion (*.cfm)
  • Ir (*.go)
  • Script de Google Apps (*.gs)
  • Hack (*.php)
  • Haskell (*.hs) (ejemplo: Yesod )
  • Java (*.jsp) a través de JavaServer Pages
  • JavaScript o TypeScript usando JavaScript del lado del servidor (*.ssjs, *.js, *.ts) (ejemplo: Node.js )
  • Lazo (*.lasso)
  • Lua (*.lp *.op *.lua)
  • Node.js (*.node)
  • Analizador sintáctico (*.p)
  • Perl a través del módulo CGI.pm (*.cgi, *.ipl, *.pl)
  • PHP (*.php, *.php3, *.php4, *.phtml)
  • Progreso de la velocidad web (*.r,*.w)
  • Python (*.py) (ejemplos: Pyramid , Flask , Django )
  • R (*.rhtml) – (ejemplo: rApache )
  • React (*.jsx, *.tsx)
  • Ruby (*.rb, *.rbw) (ejemplo: Ruby on Rails )
  • SMX (*.smx)
  • Tcl (*.tcl)
• Desarrollo web full stack: implica tanto el desarrollo front-end como el back-end (lado del servidor).
• Marco de trabajo web
  • Tipos de arquitecturas de marcos de trabajo
    • Modelo-vista-controlador
    • Arquitectura de tres niveles
• Software
  • Átomo
  • IntelliJ IDEA
  • Texto sublime
  • Código de Visual Studio

• Esquema de las computadoras
  • Esquema de informática y esquema de tecnología de la información.
    • Esquema de la informática
      • Esquema de la inteligencia artificial
      • Esquema de criptografía
    • Esquema de Internet
      • Esquema de Google
    • Esquema del software
      • Tipos de software
        • Esquema del software libre
        • Esquema de los motores de búsqueda
      • Esquema del desarrollo de software
        • Esquema de ingeniería de software
        • Esquema del diseño y desarrollo web
        • Esquema de programación informática
          • Lenguajes de programación
            • Esquema de C++
            • Esquema de Perl
    • Esquema de ingeniería informática