De qué forma mejorar tu cibersitio para cualquier dispositivo

1. Dale a tu portal web un diseño receptivo y un diseño coincidente con gadgets móviles inteligentes

Su página web se ve y marcha realmente bien en mi PC; Es fantastico.

¿Probaste a abrirlo en un móvil?

¿Se semeja a esto?

Si es de esta forma, entonces tienes un enorme inconveniente. Este lugar es casi inservible en gadgets móviles inteligentes.

Lamentablemente, ser coincidente con la PC no provoca que un portal de internet sea coincidente de forma automática con gadgets móviles inteligentes.

Y debido al índice móvil inteligente de Google plus, si su ubicación no funciona con gadgets móviles inteligentes, posiblemente jamás vea la luz del día en la página 1 de las páginas de desenlaces del motor de búsqueda (SERP).

¿Entonces, qué haces?

El paso inicial esencial para lograr que su página web sea coincidente con gadgets móviles inteligentes es trabajar en un diseño receptivo.

En el momento en que un lugar responde, se expone adecuadamente en todos y cada uno de los tamaños de pantallaMe agrada esto:

De qué forma ofrecerle a su página web un diseño móvil inteligente primero

Hay 2 maneras de actualizar su página web a una experiencia coincidente con gadgets móviles inteligentes. Cada solución tiene sus compensaciones.

1. La vía mucho más rápida: disponer un fichero dedicado primer complemento para gadgets móviles inteligentes como WPtouch a Dale a tu página web un diseño receptivo en minutos. Es el procedimiento mucho más simple, pero no exento de peligros; los complementos son propensos a romperse y (en las situaciones mucho más extremos) aun a ser pirateados.
2. La manera mucho más segura y fiable: Modifique el código de su página web para integrar resoluciones receptivas.

De qué forma codificar de forma manual un portal de internet receptivo

Si quiere tomar el tema en sus manos y editar su ubicación de escritorio en un portal de internet receptivo y mejorado para gadgets móviles inteligentes, va a deber integrar:

• una gorra
• Imágenes receptivas.
• Una observación dinámica.
• Cuestiones de los medios.

Le enseñaremos todo el código que precisa a fin de que su lugar responda. Pero primero, asegúrese de realizar una backup de su lugar antes de efectuar cualquier cambio en el código.

De qué forma modificar una ventana gráfica en un portal de internet

Las ventanas gráficas asisten a cada navegador a comprender de qué manera cambiar el tamaño de su web a su pantalla.

Si añade una ventana gráfica al HTML de su página web, sus páginas se ajustarán de forma automática para amoldarse a cualquier dispositivo móvil inteligente.

Añade esto:

Para entablar la ventana gráfica en una página, agréguele esta línea de código HTML etiqueta:

De qué manera lograr que las imágenes respondan

Tratándose de compatibilidad móvil inteligente, es esencial que su visitante no deba mover el dedo hacia la izquierda o hacia la derecha para poder ver el contenido de su lugar.

Esto asimismo se aplica a todas y cada una de las imágenes, en especial a las infografías.

Las imágenes receptivas deberían reducirse y medrar de forma automática para amoldarse de manera perfecta al ancho de la pantalla de cada visitante.

Por ende, quiere usar la propiedad max-width.

De qué manera añadir ancho máximo para lograr que las imágenes respondan

1. Abra el papel de estilo de su página web (fichero CSS).
2. Añada «ancho máximo: 100%» a etiqueta como esta:

img 

En este momento, si sus imágenes son mucho más anchas que la ventana gráfica que añadió en el paso previo, se reducirán de forma automática para amoldarse al espacio libre.

De qué forma disponer un diseño fluido

En el momento en que tiene un diseño receptivo en su página web, los elementos de la página se amoldan a cualquier pantalla. Por poner un ejemplo, si tiene una mesa dinámica, la mesa cambiará de tamaño con la pantalla. Así, puede ver todas y cada una de las columnas sin la necesidad de mover el dedo hacia la izquierda o hacia la derecha, aun en una pequeña pantalla móvil inteligente.

Existen varios métodos de diseño fluido que puede evaluar, según su lugar individual:

Úsalos en el momento en que sea correspondiente.

Cuándo emplear Flexbox

Use este procedimiento en el momento en que tenga una proporción de elementos de distintas tamaños y quiera ponerlos en una fila. Añada la propiedad «display: flex» a su etiqueta HTML, como en este caso de ejemplo:

.elementos 

Cuándo utilizar Multicol

Este procedimiento divide el contenido en columnas. Use la propiedad de recuento de columnas así:

.container 

En este caso de ejemplo, consigues tres columnas.

Cuándo emplear la parrilla

Como recomienda el nombre, este procedimiento crea una cuadrícula que se ajusta a los elementos del interior. Aquí hay un caso de muestra:

.container 

La propiedad grid-template-columns establece el número de columnas (tres en este caso) y su tamaño (1fr).

¿Aún no tienes idea cuál utilizar? complementos puede advertir y también llevar a cabo de forma automática el más destacable diseño fluido.

De qué forma añadir consultas de medios a su página web

Las consultas de medios son otra forma de escalar su contenido a cualquier tamaño de pantalla. Pero tienen otra virtud considerablemente más considerable: amoldan tu lugar a especificaciones nativas concretas para distintas gadgets.

Por servirnos de un ejemplo, el cursor del mouse de una PC puede pasar sobre los elementos de la página y los teléfonos capaces tienen pantallas táctiles. Considere estas peculiaridades y va a poder ajustar la experiencia del usuario para cualquier género de dispositivo.

Hay bastante que absorber tratándose de consultas de medios, pero MDN Web Docs tiene bastante que sugerir normas detalladas.

En el momento en que haya hecho todo, compruebe de qué manera marcha observando su ubicación en varios gadgets distintas.

2. Haz que todo tu lugar se vea bien en gadgets móviles inteligentes

El paso inicial cubrió el marco técnico que provoca que su portal web sea coincidente con gadgets móviles inteligentes.

Buenas novedades: esa fue la parte bien difícil. Solo hay unos pocos pasos mucho más.

Con un diseño receptivo, su portal web es prácticamente absolutamente coincidente con gadgets móviles inteligentes. ¿Qué mucho más precisas para realizar el trabajo?

Ahora, es hora de:

• Use artículo grande y simple de leer. Los títulos y subtítulos han de ser especialmente interesantes.
• Lleve a cabo que sus elementos entretenidos (como botones y casillas de verificación) sean suficientemente enormes para verse sensacionales.
• Evite la utilización de parágrafos largos. Corto siempre y en todo momento es preferible.
• Emplea el espacio negativo ampliamente. Esto evitará que su lugar se vea desordenado.
• Deje espacio en torno a los links y otros elementos entretenidos. Así, los clientes no presionarán de manera accidental lo que no desean apretar.

3. No obstruya su contenido con ventanas emergentes

Las ventanas emergentes complican que su visitante consiga la información que procuraba y dan como resultado altas tasas de choque, lo que quiere decir que la gente abandonan su ubicación tan rápido como ingresan.

En este momento, ciertos géneros de ventanas emergentes son bastante enormes. La mayor parte de los websites precisan utilizar cookies y el de el probablemente no sea una salvedad. Y GDPR hizo obligación soliciar permiso a los clientes para utilizar sus datos, con lo que no puede eludir emplear una ventana nuevo para eso.

No obstante, sus individuos no visitan su lugar para poder ver ventanas emergentes. En el momento en que toda la página está denegada por una petición para admitir la utilización de cookies, posiblemente los visitantes no estén tan deseoso por ponerse en su sitio. Por contra, está garantizado que los molestará, e inclusive podrían irse sin andar por su ubicación.

qué llevar a cabo en su rincón

Los clientes son mucho más tolerantes con las ventanas emergentes en el momento en que solo cubren una pequeña una parte de la pantalla. Y si son simples de apagar y negar, bastante superior.

4. Soluciona fallos profesionales en tu portal web

Aun los inconvenientes mucho más pequeños van a ser simple de advertir en un display pequeña, incluyendo los temidos fallos 404.

Más allá de que una página 404 con un diseño entretenido puede ser útil, un fallo todavía es un fallo; interrumpirá la experiencia del usuario. Es preferible removerlos completamente como un aspecto.

De qué manera advertir fallos profesionales en su página web

¿Qué otros fallos tienen la posibilidad de arruinar el día de un usuario móvil inteligente? Para denominar unos pocos:

• Links rotos.
• Imágenes rotas.
• Redirecciones de página no deseadas.
• CSS y Javascript rotos.
• Inconvenientes del servidor (por poner un ejemplo, tiempo de espera de la puerta de link).

Todo mandará al usuario corriendo salvo que lleve a cabo algo.
Para empezar, localizar todos y cada uno de los fallos especialistas en su cibersitio Escanéelo con la herramienta de auditoría técnica de WebCEO para producir un informe.

Corrija los fallos del lugar que halle lo mucho más veloz viable.

No se confunda con códigos como «Estado: 503» – Aquí hay ciertos avisos de especialistas para encararlos.

Entonces, adquiera el hábito de seguir su lugar de manera regular (una vez a la semana está bien) y también intente advertir fallos de forma oportuna.

5. Haz que tu lugar cargue veloz

Andas visitando tu ubicación y tarda bastante en cargar. ¡Oh, no!

¿Internet no marcha? ¿No? Lamentablemente, en este momento su usuario puede elegir que su lugar jamás marcha y jamás regresa.

Por consiguiente, es esencial que hagas todo cuanto esté a tu alcance para cerciorarte de que tu ubicación cargue de manera rápida en todo instante.

De qué manera lograr que tu cibersitio cargue mucho más veloz

Prosiga estos seis consejos a fin de que su lugar se cargue mucho más veloz:

• Optima tus imágenes. Minimice el tamaño de los ficheros ajustando su prominente y ancho, guárdelos en el formato acertado y comprímalos.
• Activar la compresión (si aún no está habilitado). La compresión GZIP se encuentra dentro de los métodos mucho más populares.
• Emplear el almacenaje en caché del navegador. Halle el fichero .htaccess de su dominio y constituya tiempos de espera para los elementos de su página.
• Utilizar carga aplazada. Exactamente la misma la compresión, con frecuencia ahora está activada. Si no lo tiene, puede insertar el atributo loading=»lazy» en las etiquetas HTML de los elementos que quiere cargar. O sencillamente use un complemento como liso.
• Optima el código de tus páginas. Si tiene bastante conocimiento de HTML, Javascript y otros idiomas que conforman su página web, puede procurar cortar el código. Tenga precaución de no romper nada.
• Combina los elementos donde sea correcto. Por poner un ejemplo, si tiene 2 imágenes una a la vera de la otra, fusionarlas en una imagen va a ayudar a que la página se cargue mucho más veloz.

Verifica tu agilidad de carga de hoy con el mejorador de agilidad de WebCEO. Resaltará los inconvenientes de agilidad que te están afectando ahora mismo.

6. Optimice su cibersitio para la búsqueda local y por voz

Los teléfonos capaces son simples de transportar, lo que los transforma en una herramienta idónea para andar on-line mientras que viaja.

¿El usuario precisa hallar algo cerca? Su propósito está a únicamente una pregunta de distancia.

Y ya que el interrogante probablemente tenga dentro la palabra «dónde», su ubicación ha de estar dispuesto para ello. Esto se hace mediante la optimización de búsqueda local y, conjuntado con el SEO móvil inteligente, se regresa increíblemente efectivo para la búsqueda por voz al tiempo.

Solo haz estas cosas:

1. Use keywords y oraciones fundamentadas en la localización en su contenido. En la mayoría de los casos, tienen dentro expresiones como dónde, mucho más próximo, mucho más próximo, cerca de mí o en «nombre de su localización». Por servirnos de un ejemplo: lavado de coches cerca de mí.
2. Tenga una página de cuestiones usuales en su página web Sostenga sus respuestas breves y al punto.
3. Ingrese el nombre, la dirección y el número de teléfono de su compañía en la página de comienzo de su portal web. Mejor aún, póngalos en el sótano.
4. Crea una lista en Perfil de compañía de Google plusy complétalo con la mayor proporción de información viable. Esto es requisito si deseas manifestarse en Google plus Maps.
5. Recopile críticas positivas de los clientes del servicio: cuantas mucho más, mejor.

7. Haz que tu primer deslizamiento sea eficaz

Idealmente, debería poder apresar al visitante tan rápido como vea su cibersitio. Pero solo tienen la posibilidad de ver tanto en un display pequeña. ¿Entonces, qué haces?

Lograr que su lugar esté «arriba» (lo que los individuos ven en el primer movimiento) es un golpe de felicidad total.

¿Cuáles son los indispensables que debes poner allí?

• Título descriptivo y embriagador.
• Menú de Navegación.
• Barra de búsqueda.
• Llamada a la acción.

Pero estos son solo los conceptos básicos.

Aquí hay ciertas ideas de nivel especialista:

• Un factor amigable (como una fotografía panorámica, un modelo 3D o un juego fácil). Aun un vídeo habitual marcha.
• Una llamada a la acción móvil inteligente que siempre y en todo momento continúa en la pantalla, sin importar lo más mínimo cuánto te desplaces.

8. Haz que tus resultados de la búsqueda sean atractivos

Como dicen, el más destacable sitio para ocultar misterios es en la página 2 de Google plus.

No obstante, esto unicamente se aplica a la versión de escritorio.

Google plus Mobile muestra Infinite Scroll, que exhibe los primeros 40 desenlaces en vez de los 10 antes de hallar el botón «Ver mucho más».

No obstante, en el top 10 o abajo, sus resultados de la búsqueda jamás conseguirán clicks si no se resaltan.

Y como cualquier otra cosa, debes poner énfasis. ¿De qué manera aplica este principio a sus resultados de la búsqueda?

De qué forma lograr que sus resultados de la búsqueda se resalten

Hay tres geniales formas de lograr que los desenlaces de su búsqueda sean mucho más atrayentes para su porvenir visitante:

• Utiliza las mejores keywords. No solo en concepto de volumen de búsqueda: use keywords que capturen la intención de búsqueda de los individuos mejor que otras. Para comprender cuáles son estas keywords, hay que ponerse en la piel de los individuos. O sencillamente pregunte a los individuos que conoce sus opciones de búsqueda.
• Use títulos y especificaciones pegadizas. Las keywords son un ingrediente primordial; el otro ingrediente son las expresiones de poder que despiertan las conmuevas de los clientes. ¿Sabes qué conmuevas son correctas para tu contenido?
• Añadir datos estructurados. Marque los elementos de su página para hacer extractos enriquecidos simples de clickear.

Hace unos años, Google plus vio el potencial de los gadgets móviles inteligentes y resultó que llevaba razón.

El enorme de las buscas ha invertido bastante en la compatibilidad móvil inteligente, y no cabe duda de que Internet es bastante superior para esto. El contenido on line se volvió considerablemente más simple de ver y de emplear.

Pero, ¿su ubicación cumple con el estándar de oro? ¿Tus individuos gozan de exactamente la misma increíble experiencia en sus gadgets?

Si tiene alguna duda, es hora de usar todas y cada una de las herramientas a su predisposición para cerciorarse de que su ubicación esté a la altura. Suscríbase en este momento y deje que WebCEO lo asista a solucionar las cosas.

¡Comience a progresar sus clasificaciones de búsqueda y la participación de los individuos con un portal de internet receptivo el día de hoy!