Tu diseño es muy importante para nosotras: maquetación HTML CSS JS

 

Nos comprometemos con tu diseño en la maquetación web

Si tienes una agencia o eres diseñador y tienes tu estudio de diseño independiente, y necesitas soporte técnico en maquetación web HTML CSS, te contamos a continuación cómo brindamos este servicio.

Entendemos a la maquetación web como el puente entre tu diseño y el usuario de Internet. Es decir, la maquetación web resulta una herramienta necesaria para que tu diseño tenga visibilidad en todos los navegadores.

En Pizzaferri Morrone | Programadores Freelance maquetamos en lenguajes HTML, CSS y JavaScript, usando o no BootStrap dependiendo de cada requerimiento. Pasamos tu diseño en PSD a HTML o en AI a HTML. Nosotras, además de programación de Back-End, nos ocuparemos de que tu diseño sea respetado en el navegador.

8 imprescindibles en la maquetación HTML CSS que incluye nuestro servicio

1. Maquetación web responsive

En los casos en que tu cliente no te solicita un diseño especial para web y otro especial para móviles, no será necesario que nos prepares dos versiones del diseño, dado que lo maquetamos para que se adapte a las diferentes resoluciones de pantalla. Si no nos indicas medidas en particular, utilizaremos las medidas estándar para desktop (a partir de 1200 píxeles), tableta (entre 768 y 1024 píxeles) y teléfono móvil (entre 320 y 480 píxeles). De esta forma, nosotras resolvemos la adaptatividad de tu diseño a las distintas pantallas, optimizando tu tiempo y costes de maquetación.

Estos “breakpoints” o “puntos de ruptura” de tu diseño los usamos para que el mismo se adecue al ancho de pantalla desde donde el usuario ingresa y pueda visualizar el desarrollo desde donde se encuentre. De esta forma ya no habrá preocupación por el dispositivo desde el cual se acceda al sitio.

2. Maquetación de diseño web para desktop y dispositivos móviles

En los casos en que tu hayas creado un diseño web especial para desktop y otro especial para móviles, vamos a atender cada detalle del diseño que compone cada una de las piezas, comprendiendo la importancia y comportamiento que has decidido dar a cada elemento en cada versión.

3. Maquetación cross-browsing o cross-browser

Es la aptitud de navegabilidad de un sitio web o su compatibilidad con los navegadores y sistemas operativos.
Cumplimos con las “Pautas de Accesibilidad al Contenido en la Web” emitidas y actualizadas por la W3E.
Entendemos que Internet debe ser una herramienta de integración social. Es por ello que procuramos que cualquier persona pueda acceder a sus contenidos. Para lograrlo, nuestro servicio de maquetación web observa las convenciones sobre diseño accesible, estructuramos los desarrollos de manera que cualquier usuario pueda identificar sus partes (header, body, footer), utilizamos etiquetas H1 y H2 para diferenciar titulares, “alt” para las imágenes y “hover” para que se advierta la existencia de un enlace y se pueda acceder a su contenido con un clic.

4. Maquetación pixel perfect

Nuestro trabajo de maquetación web es "al píxel", exacto. Un trabajo de maquetación web de tu diseño no es pixel perfect si:

- los elementos que componen el diseño no se redimensionan según la pantalla del dispositivo desde el que se lo mira
- no se respetan márgenes, distancias entre elementos respecto de su anterior o lateral
- no se respetan las alineaciones dispuestas en tu diseño
- el maquetado HTML CSS JS no es armónico a primera vista, es decir, sus elementos no funcionan como un ecosistema

5. Maquetación web sobre WordPress

Creamos themes para WordPress desde cero. Partiremos del diseño que has preparado para tu cliente y lo maquetaremos en HTML/CSS/JS, implementándolo sobre WordPress, uno de los gestores de contenidos de mayor popularidad, para que tu cliente pueda modificar con mayor autonomía textos, imágenes, elementos, enlaces desde el Back-Office.

Aunque también podemos implementar tu diseño en HTML CSS JS, sin Back-Office, probablemente en aquellos casos en los que tu cliente no vaya a modificar sus contenidos de forma periódica. En este caso, solo usaremos lenguajes HTML CSS y JS.

6. Maquetación web sobre PHP a medida

Puedes entregarnos tu diseño en formato AI o PSD y lo convertiremos a HTML CSS, pudiendo implementarlo sobre WordPress o cualquier CMS pre-hecho, o bien sobre un CMS desarrollado en PHP, a medida. Todo dependerá de las necesidades de cada proyecto. Analizamos cada proyecto en particular y te asesoramos para que tu diseño pueda ser gestionado en mayor o en menor medida por tu cliente desde un Back-Office preparado en PHP, exclusivamente para cada caso.

7. Queremos saber exactamente cómo has pensado tu diseño

En forma previa a enviarte un presupuesto, nos involucramos con tu diseño: vamos a hacer las preguntas clave que debe hacer todo maquetador antes de comenzar a trabajar. Así, te pediremos:
- las referencias de color que has usado en tu diseño, en elementos activos y en elementos en descanso
- las tipografías (sus familias y tipos)
- el comportamiento del menú principal
- los comportamientos que sufre cada elemento cuando el ratón lo apunta
- los comportamientos de los sliders
- cómo deben mostrarse las imágenes de cada página
- qué campos debemos validar en cada formulario del sitio

8. Trato confidencial y cesión de los derechos de propiedad

La no divulgación de tus originales de diseño a terceras personas está garantizada por Pizzaferri Morrone | Programadores Freelance. Recibimos y tratamos el material de diseño con absoluta confidencialidad. Asimismo, desde el momento de la contratación, te cedemos la totalidad de los derechos de propiedad sobre código fuente de las piezas maquetadas.

¿Cómo proveemos el servicio de maquetación web en remoto?

De ser posible, nos gusta conocer el diseño antes de preparar un presupuesto. Pero si aún no lo tienes, no hay problema, te haremos las consultas clave que nos permita enviar una propuesta de trabajo que contemple los escenarios más frecuentes, evitando sorpresas ingratas en el resultado final y pérdida de tiempo.

Nos adaptamos al programa de diseño que usas: recibiremos el material en formatos Illustrator, PhotoShop, InVision o Zeplin. Haremos las preguntas necesarias una vez recibido el material y comenzaremos con nuestra tarea de maquetación web. Una vez que esté terminada, realizamos un testing de visualización en un entorno de staging y en diferentes dispositivos, navegadores y sistemas operativos. Esto lo incluimos como parte de nuestro servicio de maquetación web, debido a que uno de nuestros objetivos es que tu inversión en tiempo y esfuerzo en testear la calidad sean los menores posibles. Una vez testeada la calidad del trabajo, te entregaremos los archivos del diseño maquetado en HTML, CSS, JS o bien lo subimos a tu servidor, según lo prefieras.

Si buscas soporte técnico de maquetación freelance HTML CSS JS, esperamos tu consulta con la descripción de la necesidad. Trabajamos de lunes a viernes, por lo que contratando nuestro servicio, dispondrás de dos desarrolladoras front-end full-time senior en remoto.