Backend: Lado del servidor - Equipos Sensoriales de México

Backend: Lado del servidor (PHP, Ruby on Rails, Django, Node.js, .NET)
Un programador tiende a ser backend. Es la labor de ingeniería que compone el
acceso a bases de datos y generación de plantillas del lado del servidor.
Frontend: Lado del cliente (HTML, CSS, HTML5, CSS3, Javascript, jQuery)
Los Frontends tienden a ser programadores, pero hay diseñadores genios que
también hacen frontend.
Son los encargados de maquetar la estructura semántica del contenido (HTML),
codificar el diseño en hojas de estilo (CSS) y agregar la interacción con el usuario
(Javascript).
Un diseñador web sabe de interfaces, entiende la interacción con el usuario.
Imagina las animaciones, las transiciones, los cambios en la aplicación. Sabe dónde
usar una caja de texto, un botón, un radio button, un checkbox, un desplegable.
HTML5
<header> </header> - encabezado
<nav> </nav> - botonera
<figure> <img src="images/logotipo.jpg" /> </figure> - imágenes
<footer> </footer> - pie
<h1> - solo una vez, sirve para posicionamiento
- imágenes que son contenido van en etiqueta img (logo,banner)
- imágenes que son diseño van en css (fondo)
CSS
- Se acomodan por orden alfabético.
- Primero van los ID (#logo)
- Después las clases (.titulo)
- Imágenes al doble de tamaño que van a ser utilizadas (para una mejor
visualización en pantallas retina)
- Agregar siempre normalize.css (esto normaliza los estilos que los navegadores
cambian)
-Ocupar icomoon (http://icomoon.io/) estos iconos al ocuparse como fuentes
cargan mas rapido las paginas.
- padding - margen interior de la caja
- margin - margen exterior de la caja
margin: 0 0 0 0 (superior, derecha, inferior, derecha)
margin: 0 0 (arriba y abajo, izquierda y derecha)
- display
+ block - todo lo que esta enfrente salta a la parte de abajo con márgenes
+ inline - se mezcla con el texto
+ inline-block - tiene márgenes y texto a lado
- position
+ static - posición por defecto de todas la cajas
+ relative - la caja obtiene los atributos top, left, right, bottom, y mueve
todo lo demás
+ absolute - rompe el vínculo, se va al punto 0,0 del objeto más cercano
(body)