es.hideout-lastation.com
Paraíso Para Los Diseñadores Y Desarrolladores


Cómo depurar el sitio web en iPad

Con miles de millones de usuarios de dispositivos móviles en la actualidad, la creación de sitios web que se puedan ver en dispositivos móviles es indispensable. Afortunadamente, tenemos muchas herramientas y opciones para depurar sitios web en plataformas móviles . Puede usar Adobe Edge Inspect, Google Chrome Emulation o XIP.io para nombrar algunos.

Si está desarrollando únicamente en un entorno OS X e iOS, es posible que no necesite esas herramientas de terceros. Apple ya ha proporcionado un conjunto de herramientas para el trabajo. Y en esta publicación, le mostraremos cómo utilizarlos para acceder y depurar sitios web estáticos, así como sitios web de WordPress en iOS para iPhone y iPad.

Sin más preámbulos, empecemos.

Empezando

Primero, inicie Safari y habilite las herramientas de desarrollo a través de Safari> Preferencia . En la pestaña Avanzado, marque la opción Mostrar el menú Desarrollar en la barra de menú .

Aparecerá un nuevo menú llamado Develop en la barra de menú de Safari.

Luego, en su iPad o iPhone, vaya a Configuración> Safari . Del mismo modo, en el menú Avanzado, habilite el Inspector web, como tal.

Para el sitio web basado en WordPress

Se requiere una ruta relativa para que los enlaces CSS, Imágenes y JavaScript se carguen correctamente en el iPad o iPhone. Si está desarrollando sitios web basados ​​en WordPress, todas las rutas de activos son absolutas. Para que sean una ruta relativa, instale y active este complemento: URL relativa.

Una vez activadas, las URL de ruta cambiarán desde:

 http: // localhost: 8888 / wordpress / 

... en algo como lo que ves a continuación:

 / wordpress / 

Depuración del sitio web

Primero, necesita saber el número de su dirección IP de red. Vaya a Preferencias del Sistema> Red . Allí, encontrarás la dirección IP. Además, asegúrese de que sus dispositivos Apple - Mac, iPad, iPhone - estén conectados en la misma red para que pueda acceder al sitio web de forma inalámbrica en el iPad o iPhone.

En su iPad o iPhone, inicie la aplicación Safari y acceda a localhost: 8888 seguido de su directorio de proyecto web; por ejemplo, localhost: 8888 / wordpress . Si configura su servidor local utilizando MAMP, localhost: 8888 debe ser su dirección de servidor local predeterminada.

Como puede ver a continuación, estamos viendo nuestro sitio web, que en este caso está basado en WordPress, en un iPad.

Además, para poder depurar el sitio web con herramientas de desarrollo, debe conectar su iPad o iPhone a su Mac utilizando el USB . Luego, en Safari, vaya al menú Desarrollar y seleccione su dispositivo conectado.

Hemos terminado.

En la siguiente captura de pantalla, cuando seleccionamos el árbol DOM de Herramientas del desarrollador, puede ver que los elementos respectivos en el iPad o iPhone están resaltados. Ahora puede depurar técnicamente su sitio web en iPad o iPhone, como lo hace en su escritorio.

20 códigos cortos y complementos de WordPress que quizás desee probar

20 códigos cortos y complementos de WordPress que quizás desee probar

Si no está familiarizado con los códigos abreviados, un código abreviado es un código específico de WordPress que le permite hacer cosas creativas con scripts y códigos. Como no tendrá que llenar sus publicaciones y páginas con códigos largos y desagradables, se condensarán en una sola línea de código: un código abreviado.En pocas pal

(Consejos de tecnología y diseño)

Empaquetado interactivo: 15 ejemplos inteligentes que debe verificar

Empaquetado interactivo: 15 ejemplos inteligentes que debe verificar

Nuestras opciones de embalaje evolucionan constantemente. Hoy, sin embargo, la creatividad reina más que nunca . Las personas anhelan algo diferente, ya sea a través de actividades, declaraciones únicas o humor.Aquí es donde intervienen los empaques interactivos. Los empaques interactivos no solo están bien diseñados en el ámbito visual, sino que también cumplen una función tal como el entretenimiento o la funcionalidad . Como su

(Consejos de tecnología y diseño)