Posicionamiento SEO gratis

Posicionamiento SEO gratis

Te vamos a enseñar 10 simples tareas básicas, de ‘posicionamiento seo gratis’, con las que Google te abrirá las puertas y no te va a generar errores al indexar una página web.

Posicionamietno SEO gratis

Quizá el título del artículo resulte un poco chocante, podríamos haberlo cambiado por ‘posicionamiento seo casero’,  ‘posicionamiento seo mínimo’, por no decir ‘que menos que hacer algo en SEO para que tu web tenga posibilidades de aparecer en Google’.

Y es que para los que trabajamos en este mundo es muy chirriante ver como aun hoy día existen muchas páginas web con errores básicos como las direcciones amigables o velocidades de carga lentas.

Este artículo no pretende ser el santo grial del posicionamiento, un experto en SEO sabe que se requiere de un bagaje largo en conocimiento y experiencia para poder moverse dentro del tejido competitivo de la red. Aquí encontrarás una guía práctica para dar visibilidad y así tener presencia en internet.

Cómo hacer posicionamiento seo gratis

Índice de contenidos

  1. Planifica estructura pensando en seo
  2. Alojamiento
  3. Instalación de WordPress
  4. Tema hijo
  5. Plantilla
  6. Contenido, texto e imágenes
  7. Planificador palabras clave y Google
  8. Usabilidad
  9. Accesibilidad
  10. Alta en google

Planifica estructura pensando en seo

Diseña la usabilidad web del sitio, de tal manera que la información sea accesible en uno o dos clics como máximo.

Piensa que el internauta es un usuario al volante de un vehículo que circula por una autovía y no puede detenerse a ver con exactitud los mensajes de los carteles. La información tiene que ser accesible de un vistazo, así se ofrecerá una toma de decisión rápida.

Posicionamiento SEO. Trabajos

Alojamiento

Si la usabilidad es fundamental para dar efectividad a la web, el tiempo con el que se muestra la información lo es aún más, ya sea texto, imágenes o vídeos.

La velocidad de carga está en relación a alojamiento web en tanto este disponga de tecnología actual, discos duros rápidos, tipo SSD, capacidad de memoria, sistema cache efectivo, etc.

Comprueba las características de tu alojamiento y si no son las adecuadas es hora de ir buscado otro proveedor para hosting.

Instalación de WordPress

Vamos a suponer que el posicionamiento se va a realizar sobre el popular y hoy día más extendido gestor de contenidos.

Si bien una instalación del cuore de WordPress es sencilla, hay que tener cuidado y considerar los aspectos de seguridad. Personalmente prefiero descargar la versión de la página oficial https://es.wordpress.org/ frente a las opciones que suelen dar los propios alojamientos para instalación, ¿por qué?, estos últimos suelen condicionar las opciones de instalación así como el propio escritorio de WordPress.

Otro punto importante dentro de la instalación es atender a la seguridad de la base de datos, no deje de visitar el enlace anterior.

Tema hijo

Este es sin duda el aspecto más importante a la hora de instalar WordPress, ¿qué es un tema hijo?, en su definición se dice que un tema hijo hereda la funcionalidad del padre, a groso modo con esto conseguimos poder personalizar un proyecto sin que afecte a la funcionalidad de WordPress así como a sus futuras actualizaciones.

Plantilla

Plantillas hay miles, el propio WordPress en su página oficial ofrece muchas totalmente gratis, si bien algunas están condicionadas en su funcionamiento.

La elección de una plantilla va a condicionar la evolución futura del proyecto así como la gestión de su contenido. Es importante elegir una plantilla que permita la adaptación a los constantes cambios de los buscadores, así como la adaptación a las nuevas tendencias en materia de diseño. Además hay que elegir una plantilla amigable a la hora de trabajar, de esta manera la subida de contenidos será cómoda y sencilla para usuarios sin experiencia.

Instalación WordPress para posicionamiento seo

Planificador de palabras clave y Google

Planifica las palabras clave que van a ser empleadas. El planificador de palabras clave de Google Adwords es un recurso fundamental para realizar un análisis de las principales keywords para nuestra web. Tienes la opción de segmentar palabras en relación a términos comunes, además tienes la localización de dichas búsquedas.

Podrás segmentar las keywords en base a una serie de términos comunes, así como la localización de dichas búsquedas y la tendencia.

Un método muy efectivo es construir para long tail, con lo que también se pueden encontrar similitudes.

Accesibilidad

Una página web accesible es una página que va a llegar a más público, además facilita la navegación a todos y de paso Google es algo que premia.

Hablar de accesibilidad web llevaría cientos de páginas, hay toda una organización alrededor como es el W3C, además cada país tiene su propia normativa.

Así que cuando diseñes, piensa si la información que ofreces podrá ser universal para todos. Ofrece alternativas con descripciones correctas para imágenes, subtítulos para vídeos, semántica, tipografía, etc. Si quieres ampliar información visita accesibilidad web AA y su importancia.

Alta en google

Una vez tenemos nuestro proyecto web, queda algo muy importante, comunicar a Google que tenemos una web preparada para ser indexada.

Una gestión completa en Google requiere de aprendizaje y experiencia además sobre todo mucho tiempo que dedicar.

Lo mínimo para tener visión es:

  • Abrir una cuenta en Google.
  • Verificar la propiedad del sitio web.
  • Enviar el Sitemap o catálogo de páginas así como el Robots.
  • Referenciar cada página.

Como ya se ha dicho anteriormente, este no es el santo grial de técnicas a aplicar, pero si quieres tener un mínimo de presencia te va a servir de gran ayuda, y lo mejor es que se trata de posicionamiento seo gratis.

Cómo hacer una página web popular

Cómo hacer una página web popular

Muchas son las preguntas y dudas que surgen cuando un emprendedor decide tener presencia en internet. Por supuesto lo primero que piensa es: ‘necesito una página web’. Pero, ¿cómo hacer una página web popular?, ¿qué tiene que tener un sitio web para ser exitoso?

Vamos a dar respuesta de forma muy concisa a esta pregunta. Nos vamos a apoyar en 5 factores como pilares principales de una buena web.

Cómo hacer una web popular

5 Factores para una página web exitosa

SEO

Lo situamos en primer lugar, ya que en internet como ya es popularmente conocido, ‘si no apareces no existes‘. Y hoy por hoy, la existencia pasa por aparecer en los primeros puestos de Google. Si bien es imposible tener todo el proyecto en las primeras posiciones, por lo menos tenemos que tener algunas páginas.

Así que es importante encontrar a un desarrollador que programe desde la estructura pensando en posicionamiento SEO. Así es como se ahorrarán esfuerzos y costes en el futuro.

Como base del posicionamiento web hay que tener muy claro que lo primero que tiene que dar una respuesta optima es el alojamiento web o hosting.

Responsive Web Design (RWD)

Al igual que se busca presencia en los resultados de Google, es deseable llegar al máximo público. Cada vez más los internautas usan distintos dispositivos móviles.

Un diseño web optimizado debe responder a las exigencias de cada dispositivo además de evolucionar la adaptación a las futuras demandas.

Es muy importante elegir un sistema que facilite la evolución según avanza la tecnología.Web exitosa. Imagen

Accesibilidad

Al igual que en SEO es recomendable que tanto desarrollador como diseñador tengan amplios conocimientos en accesibilidad. Al igual que queremos tener presencia en buscadores y que nuestra web se muestre en dispositivos móviles, es imprescindible llegar a todo el público y ahí es donde tenemos que prestar atención a la accesiblidad.

Como ya hemos dicho en otras ocasiones, una web accesible tiene unos tiempos de carga muy buenos y su estructura a nivel lógico y de información va a ser impecable.

Es deseable que una web cumpla con los requisitos de accesibilidad AA.

Usabilidad

La usabilidad tiene que ser tenida en cuenta como parte de la experiencia que el usuario va  tener a la hora de visitar una página web.

Se tiene que facilitar la navegación, tiempos de carga rápidos, llegar a la información rápidamente, para lo cual la profundidad de navegación tiene que ser muy reducida.

Aquí además el contenido juega un papel muy importante, al igual que en SEO, tiene que ser sencillo y práctico.

Atractivo

Por supuesto, por mucho que cumpla con los anteriores requisitos, una web tiene que ser atractiva. Como dice nuestro lema: ‘diseños que atraen’, una web construida con gusto y elegancia reportará tiempos de visita óptimos.

Aquí es donde es importante contar con la pericia y experiencia de un buen diseñador capaz de hacer una página web popular.

Herramienta AMP de Google

Herramienta AMP de Google

Se ha lanzado la herramienta AMP de Google con su actualización más novedosa desde el año 2016. Un gran empujón para la herramienta de pruebas de páginas en versión AMP (Acelerated Mobile Pages). El acceso sigue siendo en la url habitual para validar página AMP, también se pueden probar los resultados de búsqueda directamente.

Formulario de validación de la herramienta AMP de Google. Imagen

INDEXACIÓN DE PÁGINAS AMP

Tras la ejecución de una dirección URL en versión AMP en el formulario de la herramienta, se mostrarán los resultados. Lo mejor es que ahora se puede enviar la versión AMP directamente a la indexación de Google. Asegúrese antes de enviar que lógicamente todo está correcto. La vista previa de los resultados de búsqueda está disponible y nos da una visión real del resultado.

Resultados de validación AMP. Imagen

Ni que decir tiene que la herramienta AMP de Google, no solo está para analizar las urls propias. Así que si quieres espiar a la competencia y ver cómo es su código fuente, es una oportunidad muy buena.versión AMP. Imagen

Si estás interesado en implementar el sistema AMP en un blog, aquí te presentamos un tutorial muy sencillo de como instalar versión AMP en WordPress.

Diseño web para móvil

Diseño web para móvil

Un diseño web para móvil, no consiste simplemente en una adaptación de la versión web de escritorio. Si es cierto que nos debería de proporcionar también la misma información que la versión para monitor.

Muchos son los factores que hay que manejar para crear una página web con una versión móvil eficiente, hojas de estilo CSS, optimización de código JavaScript, compresión de imágenes, usabilidad, accesibilidad, etc.

En primer lugar hay que tener en cuenta que un dispositivo móvil, sobre todo smartphone o similar, consumen ancho de banda a través de un proveedor de comunicaciones, por lo tanto, es especialmente relevante reducir el peso en Kilobytes de la web con el fin de tener un consumo mínimo.

Por otro lado, algunos elementos que ocupan gran espacio en una versión de escritorio, sobre todo sistemas tipo SLIDER o carrusel, se deberían suprimir en la versión móvil y así ofrecer una mejor experiencia de usuario y optimizar la carga de la página web.

Llegados a este punto en el que estamos quitando elementos y modificando otros, nos damos cuenta que según trabajemos sobre un gestor de contenidos CMS, por ejemplo WordPress, o un diseño a medida, esto nos va a condicionar en gran medida el resultado.

Diseño web para móvil

CMS vs Diseño web para móvil a medida. Ventajas y desventajas

Gestor de contenidos CMS

Ventajas: En un sistema CMS encontraremos miles de plantillas en el mercado que ya incorporan la versión móvil por defecto. Si tenemos los conocimientos y pericia adecuados, podremos manipular la plantilla para adaptarla a las necesidades del proyecto.

Desventajas: Al ser plantillas que pretenden dar soluciones a muchos proyectos, tienen numerosas páginas con diferente código que en consecuencia desaceleran la carga de la página y consumen más ancho de banda. Más notable aun es la manipulación que hay que realizar para mover elementos dentro de la página.

Diseño web a medida

Ventajas:

La velocidad de carga de la página web es muy alta, el consumo de ancho de conexión a internet es muy reducido como resultado de emplear el código y recursos imprescindibles para el óptimo visualizado de la web.

En las futuras actualizaciones o modificaciones que se realicen en la página web, el tiempo que se invierta será mínimo.

Desventajas:

El trabajo para el desarrollo web inicial es más complicado ya que hay que elaborar todos los elementos de la web, esto requiere una gran labor al principio, sin embargo a medio plazo la inversión está más que amortizada.

Entonces ¿qué versión móvil debo elegir?

Parece muy evidente que una versión a medida es la opción idónea, pero lamentablemente esta es una pregunta que no se puede resolver mediante una fórmula, claro que siempre queremos lo mejor para un proyecto, sin embargo, como se ha expuesto anteriormente un desarrollo a medida supone un desembolso inicial alto frente a un sistema CMS.

Probablemente la mejor recomendación sea, si es un proyecto que inicia sus primeros pasos y no dispone de mucho presupuesto, pues adelante con la versión bajo plantilla CMS además con el plugin adecuado podremos tener la versión de página AMP incluida.

Finalmente, es muy recomendable dedicar unos minutos a la lectura sobre posicionamiento SEO para dispositivos móviles, entonces ya estará condiciones de decidir como quiere su diseño web para móvil.

Lenguajes de desarrollo web

Lenguajes de desarrollo web

Introducción al desarrollo web

El desarrollo web es el conjunto de técnicas, tecnologías y habilidades, orquestadas por un programador, y aplicadas para la obtención de nuevos sitios web.

Todo desarrollo de aplicaciones web está apoyado con un lenguaje de programación orientado a internet. Dependiendo del lenguaje elegido para el proyecto, éste podrá ser estructurado u orientado a objetos, si bien ambos tipos pueden convivir en su ejecución, es importante definir el proyecto  desde el origen en uno u otro sentido.

Un desarrollo web cuenta con dos zonas distintas y relacionadas entre sí, la parte del servidor y la parte del cliente. La primera se considera la fuente donde se produce la información en formato HTML y a la que el cliente va a acceder a través de un navegador web.

Un factor muy importante a tener en cuenta a la hora de escoger un ‘lenguaje web’ es cómo se produce la información del lado del servidor, y cómo se reproduce en la parte del cliente.

En las reuniones previas a la concepción del proyecto, es indispensable contar con la figura de un desarrollador web con experiencia que analice la clase de información a tratar en el proyecto así como la ‘lógica de negocio’, con el fin de asesorar qué lenguaje y sistema se va a implementar.

Por otro lado se deber realizar un estudio minucioso acerca de qué sistema de bases de datos va a convivir con el lenguaje de programación web elegido, atendiendo siempre a la funcionalidad del proyecto.

Cómo son los lenguajes de desarrollo web para internet

Muchas veces tendemos a enumerar los diferentes lenguajes que usamos tanto en diseño como en programación web confeccionando una lista rápida llena de acrónimos, HTML, JAVASCRIPT, PHP, ASP, C#,… Es importante clasificarlos según la función que realiza cada uno, si son estáticos o dinámicos, interpretados o compilados, etc.

No vamos a decir que unos son más importantes que otros, no obstante el programador web va a dedicar la mayor parte del trabajo, con diferencia, al lenguaje que está del lado del servidor, en lo que se denomina popularmente ‘back-end’. En este lado se realizan las labores para la futura administración del sitio web: altas, bajas, modificaciones, cómo se construye la presentación del contenido y tantas otras como necesite el proyecto.

Básicamente, el lenguaje del servidor genera la información en HTML que viajará por la red hasta llegar al navegador del cliente, y ese proceso tiene que ser lo más seguro y rápido posible con el fin de acercar al usuario final una experiencia positiva.

Lenguaje interpretado o compilado

Cómo ya hemos mencionado, no se trata de valorar si un sistema es mejor que otro, más bien se trata de decidir en función de la información a tratar, cómo se va generar ésta y cómo va a presentarse al cliente o internauta.

En un lenguaje compilado, cada vez que se produzca una actualización de contenido es necesario que el lenguaje genere un nuevo ‘paquete’ que será el que estará accesible al usuario, conlleva un tiempo de espera importante mientras se compila la información, pero una vez generado la máquina lo distribuye en tiempos ínfimos.

Leguajes de internet. Imagen

Encontramos que para un proyecto con numerosas actualizaciones, por ejemplo un periódico, blog, tienda online, no es recomendable. Normalmente este tipo de lenguajes están bajo licencia privada y tienen más demanda en plataformas empresariales.

En un lenguaje interpretado, la información no tiene que producir ningún paquete cada vez que hay una actualización, lo que hace el lenguaje es traducir cada instancia del código,  generando dinámicamente la última información de la que requiere, es ideal para sitios con actualizaciones frecuentes.

La norma general es que el código esté bajo licencia libre ‘Open Source’ con la ventaja de tener acceso a una enorme cantidad de recursos e información.

Autocomplete PHP

A estas alturas y con lo que hemos aprendido podemos deducir la importancia de tener un alojamiento web o hosting de calidad capaz de responder a las exigencias de nuestro proyecto,  que deseamos se ejecute con precisión y rapidez.

Rasmus Lerdorf, creador de PHP

Entrevista con el Creador de PHP Rasmus Lerdorf a cerca del futuro del OpenSource en el marco del sofware libre. El artículo tiene ya un tiempo, pero es muy interesante.

Cualidades ideales de un desarrollador web

Diseño web

  • Ser capaz de generar código limpio
  • Trabajar con programación orientada a objetos
  • Aplicar técnicas de programación seguras para la web
  • Utilizar estándares actuales como son los recomendados por el W3C
  • Está a la última en posicionamiento SEO técnico
  • Tener conocimientos de accesibilidad y usabilidad web
  • Emplear procedimientos que permitan la actualización o evolución del proyecto a futuras versiones del lenguaje empleado

¿Y qué pasa con el diseño web?

Si bien hasta ahora hemos hecho énfasis en la parte de desarrollo web, es cierto que el diseño es la parte que más va a captar la atención del internauta. En el diseño también se integran pequeños fragmentos de programación web con el fin de reproducir la información de forma dinámica.

La correcta distribución de la información así como su construcción es determinante a la hora de facilitar la usabilidad y proporcionar una experiencia satisfactoria al usuario.

En esta fase se destaca la importancia del correcto uso de las hojas de estilo css, que aportarán estética y funcionalidad, sobre todo a la hora de adaptar el contenido a los distintos dispositivos de las  versiones móviles (Smartphone y Tablet).

Lo ideal es contar siempre con un diseño web a medida, concebido desde los principios fundamentales del diseño web, ya que un sitio web mal construido no va a tener una repercusión optima en las analíticas, proporcionando unas tasas de rebote altas que son muy perjudiciales para el posicionamiento SEO, recuerda que una buena web no se consigue en una de esas plataformas que ofrecen crear tu página con solo unos clics, una web eficiente requiere de un trabajo serio.

¿Es importante la accesibilidad web?

El  W3C (World Wide Web Consortium) es el organismo a nivel mundial que define las reglas a aplicar a una web para que sea accesible y tenga un nivel usabilidad como mínimo aceptable.

Lo ideal es llegar al nivel: accesibilidad web AA, una calificación resultado de tener un sitio web que puede ser visitado sin limitaciones por cualquier usuario independientemente de su condición física o discapacidad. Este esfuerzo no queda sin premio, por lo que los buscadores premiarán el trabajo realizado con mejores calificaciones respecto a competidores que no han tenido en cuenta este factor dentro del diseño web.

Imagen del W3C

Si te ha gustado este artículo y buscas un desarrollo web en Madrid profesional, contacta con nosotros, estamos encantados de poder ayudarte, tenemos los conocimientos, pero sobre todo tenemos la experiencia para comprometernos a realizar el proyecto que necesitas.

YouTube responsive video

YouTube responsive video

Video YouTube

En este tutorial te enseñamos a incluir en tu web un video YouTube responsive, con el fin de que se vea correctamente en monitores de escritorio, tablets y dispositivos móviles.

Cada ve más, Google tiene más en cuenta las páginas web que tienen una versión móvil correcta y por lo tanto están siendo premiadas.

Una de las complicaciones con las que un diseñador web se puede encontrar está en cómo adaptar un vídeo de YouTube para que se visualice correctamente en todos los dispositivos. En este tutorial, no vamos a crear una versión móvil sino que vamos de una manera muy sencilla a explicar cómo se puede adaptar un vídeo para que sea líquido, y por lo tanto se ajuste correctamente a cualquier tamaño.

Como todos sabemos la inclusión del vídeo pasa por utilizar una etiqueta llamada <iframe>, que si bien no es buena para la accesibilidad, es necesaria para el funcionamiento de códigos externos, lo más normal es que no tengamos acceso al control de lo que se está ejecutando dentro de ese marco, sin embargo si tenemos la oportunidad de manejar las características de iframe.responsive web para youtube

Definición de etiquetas y CSS

Aunque no es obligatorio, sí es recomendable la inclusión de la etiqueta viewport con el fin de que se vea correctamente en dispositivos Tablet y móviles.

<meta name="viewport" content="width=device-width, user-scalable=no"> 
<!-- opcional -->

El código CSS para este ejemplo es muy simple

<style>#video {	
width: 100%;
height:1%;
min-height:380px;
overflow:hidden;
float:left;
margin-bottom: 30px;
margin-top: 7px;
}
#video iframe {
width: 100%;
min-height:360px;
}
</style>

Para el cuerpo de nuestro código solo nos queda tener la url del  vídeo que queremos incluir, luego cada uno maquetará a su gusto.

<body>
<h1>YouTube responsive video: Demo</h1>
<div id="video">
<iframe src="https://www.youtube.com/embed/ELDTyQj_UL4?autoplay=1" frameborder="0"
allowfullscreen></iframe>
</div>
<p>Tutorial desarrollado por: <a href="https://webreunidos.es"
title="Diseño Web Madrid: WebReunidos" target="_self">WebReunidos</a></p>
</body>

Aquí tenéis una Demo de YouTube responsive video de cómo funciona este código tan simple.

Como siempre os dejo el código completo.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no">
<!-- opcional --><title>Documento sin título</title>
<style>
#video {
width: 100%;
height:1%;
min-height:380px;
overflow:hidden;
float:left;
margin-bottom: 30px;
margin-top: 7px;
}
#video iframe {
width: 100%;
min-height:360px;
}
</style>
</head>
<body>
<h1>YouTube responsive video: Demo</h1>
<div id="video">
<iframe src="https://www.youtube.com/embed/ELDTyQj_UL4?autoplay=1" frameborder="0"
allowfullscreen></iframe>
</div>
<p>Tutorial desarrollado por: <a href="https://webreunidos.es"
title="Diseño Web Madrid: WebReunidos" target="_self">WebReunidos</a></p>
</body>
</html>

Creo que con este tutorial se ha demostrado que tener un YouTube responsive video es simple.