Optimización Responsive WordPress y Elementor Pro
Budget / SalaryHourly project
TypeFreelance project
LocationRemote
Posted53 minutes ago
BRIEF TÉCNICO DEL PROYECTO
Correcciones responsive en WordPress y Elementor Pro
1. Objetivo del proyecto
Revisar y corregir los problemas de diseño y maquetación responsive de un sitio web existente, desarrollado con WordPress y Elementor Pro.
Los problemas aparecen principalmente en dispositivos móviles, aunque también hay algunos detalles menores en la versión de escritorio.
El objetivo es conseguir que las páginas se visualicen correctamente en distintos tamaños de pantalla y que los elementos afectados se ajusten a las referencias visuales proporcionadas.
No se solicita un rediseño completo. Se deben corregir los problemas existentes, conservando el diseño, los contenidos y las funcionalidades originales.
2. Alcance general
Se debe realizar una revisión de las páginas existentes para identificar y corregir los problemas visuales.
El cliente ha indicado lo siguiente:
- Los errores aparecen en casi todas las páginas móviles.
- En escritorio hay menos problemas, pero también es necesario revisarlo.
- Las páginas están maquetadas directamente con Elementor Pro.
- No se utilizan plantillas para las páginas afectadas.
- Existen seis formularios de contacto creados con Elementor Pro, sin un plugin externo para su construcción.
La revisión no debe limitarse únicamente a los ejemplos de las capturas. Se deben inspeccionar las páginas existentes para detectar los problemas adicionales que entren dentro del alcance descrito.
3. Correcciones en dispositivos móviles
Esta es la prioridad principal del proyecto.
Revisar y corregir los siguientes aspectos cuando presenten problemas:
- Márgenes y rellenos excesivos o insuficientes.
- Espaciados incorrectos entre elementos.
- Títulos, textos, imágenes y botones desalineados.
- Contenedores con anchuras incorrectas.
- Secciones cuya distribución no coincide con la referencia visual.
- Elementos que se salen de los límites de la pantalla.
- Componentes que se superponen.
- Botones y campos que no se adaptan correctamente al ancho disponible.
- Distancias inconsistentes entre títulos, textos, imágenes y otros elementos.
- Problemas de distribución y alineación en las distintas secciones.
- Cualquier otro error menor de maquetación responsive que afecte a la presentación visual.
Las correcciones deben realizarse preferentemente mediante los ajustes responsive de Elementor Pro.
Se debe identificar el origen de cada problema antes de modificar los elementos, evitando soluciones improvisadas que puedan afectar a otras secciones.
4. Correcciones en escritorio
Aunque los problemas son menos frecuentes en escritorio, también se debe revisar esta versión.
Corregir los detalles visuales identificados dentro del alcance, especialmente:
- Márgenes y espaciados inconsistentes.
- Elementos desalineados.
- Distribución incorrecta de los bloques.
- Problemas de anchura y alineación.
- Diferencias visuales respecto a las referencias proporcionadas.
No modificar elementos que ya estén correctamente maquetados.
5. Referencias visuales y diseño de Salesforce
El cliente ha proporcionado capturas que muestran cómo se visualizan actualmente algunos elementos y cómo desea que se vean después de las correcciones.
Ha indicado expresamente que la idea es que las páginas se vean como Salesforce.
Por tanto, Salesforce debe utilizarse como referencia visual para determinar la presentación que se busca conseguir en los elementos afectados.
¿Qué se debe comprobar?
Al comparar las capturas, revisar especialmente:
- La alineación de los elementos.
- Los márgenes y espaciados.
- La distribución de los bloques de contenido.
- La anchura de los contenedores.
- La relación visual entre títulos, textos, imágenes y botones.
- La adaptación de los componentes a dispositivos móviles.
- La consistencia visual de las secciones.
¿Cómo se deben utilizar las capturas?
Capturas del estado actual: permiten identificar los problemas existentes y localizar los elementos que necesitan ajustes.
Capturas del resultado esperado: sirven como referencia para determinar cómo deben quedar visualmente los elementos después de las correcciones.
Se debe comparar cada caso y realizar los ajustes necesarios en Elementor Pro.
No se trata de copiar toda la web de Salesforce ni de construir una página nueva. El objetivo es corregir la maquetación existente para aproximar los elementos afectados a las referencias visuales.
Aclaración pendiente sobre Salesforce
Es necesario confirmar si la referencia a Salesforce se limita a la distribución, alineación, márgenes y espaciados mostrados en las capturas, o si el cliente espera reproducir algún elemento específico de su diseño.
Hasta tener esa confirmación, se debe trabajar con las referencias proporcionadas y no introducir cambios adicionales basados en suposiciones.
No se debe ampliar el alcance para replicar páginas completas de Salesforce sin autorización.
6. Revisión de los seis formularios de contacto
Los seis formularios están construidos directamente con Elementor Pro.
Se deben revisar visualmente y corregir los problemas de presentación que se encuentren, especialmente en móviles.
Comprobar:
- Alineación de los campos.
- Anchura de los campos.
- Espaciado entre campos y etiquetas.
- Distribución de los elementos.
- Alineación y presentación de los botones de envío.
- Adaptación al ancho de pantalla.
- Consistencia visual con el resto de la página.
Los formularios deben conservar su estructura y funcionamiento originales.
No se deben eliminar campos, modificar las reglas de validación ni alterar el comportamiento del envío.
7. Restricciones técnicas importantes
Se debe conservar el diseño original del sitio.
Queda fuera del alcance:
- Rediseñar páginas completas.
- Crear nuevas plantillas.
- Cambiar textos o contenidos.
- Modificar colores.
- Sustituir imágenes.
- Cambiar tipografías.
- Modificar funcionalidades existentes.
- Instalar plugins adicionales.
- Alterar innecesariamente la estructura de las páginas.
- Aplicar cambios globales sin comprobar sus efectos.
- Realizar cambios de diseño no solicitados.
Advertencia sobre las tipografías
En la copia de pruebas, algunos textos pueden aparecer con una tipografía diferente a la del sitio original.
Esta diferencia pertenece al entorno de pruebas y no debe corregirse mediante cambios de diseño.
No modificar fuentes, tamaños de texto, márgenes ni espaciados para compensar esa diferencia.
El trabajo debe centrarse en los problemas reales de maquetación responsive.
8. Procedimiento de trabajo
Fase 1. Inspección
Revisar las páginas existentes, priorizando la versión móvil.
Identificar los problemas visuales y determinar qué elementos necesitan correcciones.
Fase 2. Correcciones
Realizar los ajustes necesarios en Elementor Pro, revisando:
- Márgenes.
- Rellenos.
- Anchuras.
- Alineaciones.
- Distribución de contenedores.
- Ajustes específicos para móvil y escritorio.
Evitar modificaciones innecesarias en elementos que ya funcionan correctamente.
Fase 3. Comprobación
Revisar las páginas corregidas en dispositivos móviles y escritorio.
Verificar que los elementos estén correctamente distribuidos, que no existan desbordamientos y que los formularios mantengan su estructura y presentación.
Fase 4. Revisión final
Comparar el resultado con las capturas proporcionadas.
Comprobar que las correcciones no hayan generado nuevos problemas visuales en otras secciones.
Si se encuentra una incidencia que requiera un rediseño o una modificación funcional importante, debe comunicarse antes de ampliar el trabajo.
9. Entregables
Al finalizar, se debe entregar:
1. Sitio de pruebas corregido: todos los ajustes acordados deben estar aplicados directamente en Elementor Pro.
2. Páginas revisadas: corrección de los problemas visuales identificados dentro del alcance.
3. Versión móvil corregida: ajustes responsive en las páginas afectadas.
4. Versión de escritorio revisada: corrección de los problemas menores encontrados.
5. Seis formularios revisados: correcciones visuales sin alterar su estructura ni su funcionamiento.
6. Verificación final: comprobación de las páginas modificadas y revisión de posibles efectos secundarios.
7. Informe breve: listado de las páginas o secciones modificadas, los ajustes realizados y los problemas que hayan quedado pendientes.
El entregable principal debe ser el trabajo implementado y comprobable directamente en el sitio de pruebas.
No es suficiente con enviar capturas, vídeos o explicaciones sin aplicar las correcciones.
10. Plazo y presupuesto
Fecha límite de entrega: este fin de semana.
Presupuesto asignado para la ejecución: USD 12.
Se debe priorizar la corrección de los problemas móviles y realizar los ajustes menores de escritorio dentro del alcance definido.
No se deben realizar rediseños completos ni trabajos adicionales sin autorización previa.
Si el volumen de incidencias resulta considerablemente mayor de lo previsto, se debe informar antes de realizar trabajos que excedan el alcance.
11. Criterios de aceptación
El trabajo se considerará terminado cuando:
- Se hayan revisado las páginas existentes.
- Se hayan corregido los problemas responsive identificados dentro del alcance.
- La presentación móvil sea coherente con las referencias visuales.
- Se hayan corregido los detalles menores de escritorio.
- Los seis formularios se visualicen correctamente y conserven su funcionamiento.
- Se hayan respetado los contenidos y estilos originales.
- No se hayan introducido nuevas incidencias visuales.
- Las correcciones estén aplicadas en el sitio de pruebas y puedan verificarse.
- Se haya entregado un resumen de las modificaciones realizadas.
Prioridad final
Corregir los problemas visuales existentes, mejorar la adaptación móvil, respetar las referencias proporcionadas y mantener intactos el diseño y las funcionalidades originales.
Correcciones responsive en WordPress y Elementor Pro
1. Objetivo del proyecto
Revisar y corregir los problemas de diseño y maquetación responsive de un sitio web existente, desarrollado con WordPress y Elementor Pro.
Los problemas aparecen principalmente en dispositivos móviles, aunque también hay algunos detalles menores en la versión de escritorio.
El objetivo es conseguir que las páginas se visualicen correctamente en distintos tamaños de pantalla y que los elementos afectados se ajusten a las referencias visuales proporcionadas.
No se solicita un rediseño completo. Se deben corregir los problemas existentes, conservando el diseño, los contenidos y las funcionalidades originales.
2. Alcance general
Se debe realizar una revisión de las páginas existentes para identificar y corregir los problemas visuales.
El cliente ha indicado lo siguiente:
- Los errores aparecen en casi todas las páginas móviles.
- En escritorio hay menos problemas, pero también es necesario revisarlo.
- Las páginas están maquetadas directamente con Elementor Pro.
- No se utilizan plantillas para las páginas afectadas.
- Existen seis formularios de contacto creados con Elementor Pro, sin un plugin externo para su construcción.
La revisión no debe limitarse únicamente a los ejemplos de las capturas. Se deben inspeccionar las páginas existentes para detectar los problemas adicionales que entren dentro del alcance descrito.
3. Correcciones en dispositivos móviles
Esta es la prioridad principal del proyecto.
Revisar y corregir los siguientes aspectos cuando presenten problemas:
- Márgenes y rellenos excesivos o insuficientes.
- Espaciados incorrectos entre elementos.
- Títulos, textos, imágenes y botones desalineados.
- Contenedores con anchuras incorrectas.
- Secciones cuya distribución no coincide con la referencia visual.
- Elementos que se salen de los límites de la pantalla.
- Componentes que se superponen.
- Botones y campos que no se adaptan correctamente al ancho disponible.
- Distancias inconsistentes entre títulos, textos, imágenes y otros elementos.
- Problemas de distribución y alineación en las distintas secciones.
- Cualquier otro error menor de maquetación responsive que afecte a la presentación visual.
Las correcciones deben realizarse preferentemente mediante los ajustes responsive de Elementor Pro.
Se debe identificar el origen de cada problema antes de modificar los elementos, evitando soluciones improvisadas que puedan afectar a otras secciones.
4. Correcciones en escritorio
Aunque los problemas son menos frecuentes en escritorio, también se debe revisar esta versión.
Corregir los detalles visuales identificados dentro del alcance, especialmente:
- Márgenes y espaciados inconsistentes.
- Elementos desalineados.
- Distribución incorrecta de los bloques.
- Problemas de anchura y alineación.
- Diferencias visuales respecto a las referencias proporcionadas.
No modificar elementos que ya estén correctamente maquetados.
5. Referencias visuales y diseño de Salesforce
El cliente ha proporcionado capturas que muestran cómo se visualizan actualmente algunos elementos y cómo desea que se vean después de las correcciones.
Ha indicado expresamente que la idea es que las páginas se vean como Salesforce.
Por tanto, Salesforce debe utilizarse como referencia visual para determinar la presentación que se busca conseguir en los elementos afectados.
¿Qué se debe comprobar?
Al comparar las capturas, revisar especialmente:
- La alineación de los elementos.
- Los márgenes y espaciados.
- La distribución de los bloques de contenido.
- La anchura de los contenedores.
- La relación visual entre títulos, textos, imágenes y botones.
- La adaptación de los componentes a dispositivos móviles.
- La consistencia visual de las secciones.
¿Cómo se deben utilizar las capturas?
Capturas del estado actual: permiten identificar los problemas existentes y localizar los elementos que necesitan ajustes.
Capturas del resultado esperado: sirven como referencia para determinar cómo deben quedar visualmente los elementos después de las correcciones.
Se debe comparar cada caso y realizar los ajustes necesarios en Elementor Pro.
No se trata de copiar toda la web de Salesforce ni de construir una página nueva. El objetivo es corregir la maquetación existente para aproximar los elementos afectados a las referencias visuales.
Aclaración pendiente sobre Salesforce
Es necesario confirmar si la referencia a Salesforce se limita a la distribución, alineación, márgenes y espaciados mostrados en las capturas, o si el cliente espera reproducir algún elemento específico de su diseño.
Hasta tener esa confirmación, se debe trabajar con las referencias proporcionadas y no introducir cambios adicionales basados en suposiciones.
No se debe ampliar el alcance para replicar páginas completas de Salesforce sin autorización.
6. Revisión de los seis formularios de contacto
Los seis formularios están construidos directamente con Elementor Pro.
Se deben revisar visualmente y corregir los problemas de presentación que se encuentren, especialmente en móviles.
Comprobar:
- Alineación de los campos.
- Anchura de los campos.
- Espaciado entre campos y etiquetas.
- Distribución de los elementos.
- Alineación y presentación de los botones de envío.
- Adaptación al ancho de pantalla.
- Consistencia visual con el resto de la página.
Los formularios deben conservar su estructura y funcionamiento originales.
No se deben eliminar campos, modificar las reglas de validación ni alterar el comportamiento del envío.
7. Restricciones técnicas importantes
Se debe conservar el diseño original del sitio.
Queda fuera del alcance:
- Rediseñar páginas completas.
- Crear nuevas plantillas.
- Cambiar textos o contenidos.
- Modificar colores.
- Sustituir imágenes.
- Cambiar tipografías.
- Modificar funcionalidades existentes.
- Instalar plugins adicionales.
- Alterar innecesariamente la estructura de las páginas.
- Aplicar cambios globales sin comprobar sus efectos.
- Realizar cambios de diseño no solicitados.
Advertencia sobre las tipografías
En la copia de pruebas, algunos textos pueden aparecer con una tipografía diferente a la del sitio original.
Esta diferencia pertenece al entorno de pruebas y no debe corregirse mediante cambios de diseño.
No modificar fuentes, tamaños de texto, márgenes ni espaciados para compensar esa diferencia.
El trabajo debe centrarse en los problemas reales de maquetación responsive.
8. Procedimiento de trabajo
Fase 1. Inspección
Revisar las páginas existentes, priorizando la versión móvil.
Identificar los problemas visuales y determinar qué elementos necesitan correcciones.
Fase 2. Correcciones
Realizar los ajustes necesarios en Elementor Pro, revisando:
- Márgenes.
- Rellenos.
- Anchuras.
- Alineaciones.
- Distribución de contenedores.
- Ajustes específicos para móvil y escritorio.
Evitar modificaciones innecesarias en elementos que ya funcionan correctamente.
Fase 3. Comprobación
Revisar las páginas corregidas en dispositivos móviles y escritorio.
Verificar que los elementos estén correctamente distribuidos, que no existan desbordamientos y que los formularios mantengan su estructura y presentación.
Fase 4. Revisión final
Comparar el resultado con las capturas proporcionadas.
Comprobar que las correcciones no hayan generado nuevos problemas visuales en otras secciones.
Si se encuentra una incidencia que requiera un rediseño o una modificación funcional importante, debe comunicarse antes de ampliar el trabajo.
9. Entregables
Al finalizar, se debe entregar:
1. Sitio de pruebas corregido: todos los ajustes acordados deben estar aplicados directamente en Elementor Pro.
2. Páginas revisadas: corrección de los problemas visuales identificados dentro del alcance.
3. Versión móvil corregida: ajustes responsive en las páginas afectadas.
4. Versión de escritorio revisada: corrección de los problemas menores encontrados.
5. Seis formularios revisados: correcciones visuales sin alterar su estructura ni su funcionamiento.
6. Verificación final: comprobación de las páginas modificadas y revisión de posibles efectos secundarios.
7. Informe breve: listado de las páginas o secciones modificadas, los ajustes realizados y los problemas que hayan quedado pendientes.
El entregable principal debe ser el trabajo implementado y comprobable directamente en el sitio de pruebas.
No es suficiente con enviar capturas, vídeos o explicaciones sin aplicar las correcciones.
10. Plazo y presupuesto
Fecha límite de entrega: este fin de semana.
Presupuesto asignado para la ejecución: USD 12.
Se debe priorizar la corrección de los problemas móviles y realizar los ajustes menores de escritorio dentro del alcance definido.
No se deben realizar rediseños completos ni trabajos adicionales sin autorización previa.
Si el volumen de incidencias resulta considerablemente mayor de lo previsto, se debe informar antes de realizar trabajos que excedan el alcance.
11. Criterios de aceptación
El trabajo se considerará terminado cuando:
- Se hayan revisado las páginas existentes.
- Se hayan corregido los problemas responsive identificados dentro del alcance.
- La presentación móvil sea coherente con las referencias visuales.
- Se hayan corregido los detalles menores de escritorio.
- Los seis formularios se visualicen correctamente y conserven su funcionamiento.
- Se hayan respetado los contenidos y estilos originales.
- No se hayan introducido nuevas incidencias visuales.
- Las correcciones estén aplicadas en el sitio de pruebas y puedan verificarse.
- Se haya entregado un resumen de las modificaciones realizadas.
Prioridad final
Corregir los problemas visuales existentes, mejorar la adaptación móvil, respetar las referencias proporcionadas y mantener intactos el diseño y las funcionalidades originales.
Apply on Freelancer →
Project sourced from Freelancer.com. Applications happen directly on the original platform — we never collect your data.