Como hacer web scraping para hoteles con PHP Simple HTML DOM

En el pasado tutorial, hicimos una réplica exacta de una página con file_get_contents and cURL. Sin embargo, de esta manera no hay forma de sacarle mucho provecho. Corres el riesgo de que te reporten por plagio o confundan tu proyecto por una página de pishing. El objetivo de este tutorial es obtener las habitaciones más populares de Isla Mujeres con PHP Simple HTML DOM Parser y llenar nuestro template que hemos diseñado previamente con Bootstrap.

La fuente de información será TripAdvisor, uno de las guías más completas para cualquier viajero. Cada vez que accedamos a nuestro proyecto, un script leerá inmediatamente los hoteles más populares según la URL que le hayamos indicado.

Cabe recordar que este es un ejercicio de carácter educativo. No busco promover el plagio de información, sin embargo, existen usos totalmente válidos para esta técnica.

1. ¿Qué necesitas para empezar?

Simple HTML DOM te permite extraer y manipular de manera fácil el html de un sitio web. De la misma manera como lo harías con jQuery o Javascript. Por eso es deseable estar familiarizado con el manejo del DOM en javascript.

2. Extraer la información de los hoteles con Simple HTML DOM

// Call dependency
require 'simple_html_dom.php';
// Create DOM from URL or file
$html = file_get_html('https://www.tripadvisor.com/Hotels-g150810-Isla_Mujeres_Yucatan_Peninsula-Hotels.html');

Hasta ahora, hemos extraído el contenido donde se listan los hoteles en TripAdvisor. Este contenido lo almacené en una variable $html para extraer la información que necesitamos. Hasta ahora tenemos una copia exacta de la página de referencia.

3. Identificar las secciones relevantes

Si necesitas obtener una sección del sitio de manera nativa, puedes hacerlo por expresiones regulares usando la función preg_match_all. Sin embargo, es una forma un poco más compleja porque requieres estar creando constantemente expresiones regulares. En este momento es donde Simple HTML DOM hace la magia. Lo que obtuve en la variable $html puedo manipularlo como un objeto a través de funciones definidas por la librería.

Aclarado esto, lo que necesitamos es identificar la sección que deseamos extraer del sitio de TripAdvisor. Esto es sencillo de realizar con el inspector de tu navegador. En mi caso utilizaré el inspector de Google Chrome.

Identificar secciones del sitio web con ayuda del inspector de chrome

Con la herramienta de selección de chrome vamos buscando patrones. En el ejemplo anterior encontramos tres contenedores principales en la plataforma: .header, .page y .footer. En este ejemplo, pondremos atención en el contenedor .page donde esta la lista de las habitaciones que nos importan.

4. Extraer la lista de hoteles de la sección identificada

En este punto lo que queremos es buscar un patrón que identifique como obtener el listado de hoteles. Con el inspector identifiqué las secciones que me interesan:

Visualización de secciones de  TripAdvisor

Como podrás observar, hemos encontrado un patrón que comparten todas las contenedores de cada habitación. Todas los contenedores tiene una clase llamada .prw_meta_hsx_responsive_listing. Ahora lo que necesitamos, es obtener toda la información que contiene cada caja con esa clase.

// De todo el contenido, solo necesito la lista de los contenedores de hoteles
$wrap_hotels = $html->find('div.prw_meta_hsx_responsive_listing');

Por medio de la función find, estamos obteniendo todos los contenedores que tienen la clase .prw_meta_hsx_responsive_listing. El resultado es un array que contenido la información interna de cada contenedor. Si haces un echo, el resultado sería algo similar a este:

Array de los hoteles obtenidos en TripAdvisor.
Array de los hoteles obtenidos en TripAdvisor

Este array es una muestra de como se guarda la información. Por suerte, con las funciones de Simple HTML DOM nos facilita más las cosas.

5. Identificar las información específica de cada hotel

Ahora lo que necesitamos es extraer los datos específicos de cada hotel. Lo que nos interesa obtener según el template es:

  1. Nombre del Hotel
  2. La foto del hotel o departamento
  3. Precio
  4. Enlace para entrar a los detalles

Hacemos el mismo ejercicio pero en vez de inspeccionar toda la página de hoteles, inspeccionaremos solamente lo que esta en los contenedores que obtuvimos previamente de la clase .prw_meta_hsx_responsive_listing.

Datos del hotel del div con clase .prw_meta_hsx_responsive_listing
Datos del hotel del div contenedor

Identificadas las clases que contienen cada dato que necesitamos, lo primero que necesitamos es recorrer ese array para seleccionar el nombre, precio, imagen y enlace.

// Recorrer la lista de todos los hoteles obtenidos
foreach($wrap_hotels as $element) {
  // Código para trabajar cada elemento
}

Tenemos en la variable $element los datos de cada uno de los hoteles, procedemos a obtener la información específica:

// Recorrer la lista de todos los hoteles obtenidos
foreach($wrap_hotels as $element) {
  echo "<b>Nombre del Hotel</b> <br />";
  echo $element->find('.property_title', 0)->plaintext . '<br />';
  echo "<b>Precio</b> <br />";
  echo $element->find('.price', 0)->plaintext . '<br />';
  echo "<b>Url de la foto del hotel</b> <br />";
  print_r($element->find('.inner', 0)->attr) . '<br />';
  echo "<b>Enlace donde están los detalles del hotel</b> <br />";
  echo $element->find('.photo-wrapper a', 0)->href . '<br />' . '<br />' . '<br />';
}

Aplicamos el mismo método find para leer el contenido de cada clase. Para obtener el nombre del hotel y el precio usé el atributo plaintext, para que no me muestre etiquetas html en mis resultados. Así funcionan estos atributos especiales:

// Ejemplos de extracción de datos
$html = str_get_html("<div>foo <b>bar</b></div>");
$e = $html->find("div", 0);
echo $e->tag; // Returns: " div"
echo $e->outertext; // Returns: " <div>foo <b>bar</b></div>"
echo $e->innertext; // Returns: " foo <b>bar</b>"
echo $e->plaintext; // Returns: " foo bar"

Para más información, puedes consultarlo en la documentación oficial. El resultado sería como en la siguiente lista.

Nombre del Hotel
Hotel Rocamar
Precio
MX$2,053
Url de la foto del hotel
Array ( [class] => inner [style] => background-image:url(https://media-cdn.tripadvisor.com/media/photo-l/0d/6b/4f/fb/hotel-rocamar.jpg); )
Enlace donde están los detalles del hotel

/Hotel_Review-g150810-d1477852-Reviews-Hotel_Rocamar-Isla_Mujeres_Yucatan_Peninsula.html

Nombre del Hotel
Hotel Plaza Almendros
Precio
MX$971
Url de la foto del hotel
Array ( [class] => inner [data-lazyurl] => https://media-cdn.tripadvisor.com/media/photo-l/08/7c/7c/9e/pool–v7986578.jpg )
Enlace donde están los detalles del hotel

/Hotel_Review-g150810-d616791-Reviews-Hotel_Plaza_Almendros-Isla_Mujeres_Yucatan_Peninsula.html

6. Caso especial. Como obtener la url de la imagen

/**
 * @param Array $attr_image Atributos en forma de array
 * @return Image URL
 */
function get_standar_image_url($attr_image) {
  // Inicia la variable vacía
  $url_image = '';
  // Si el atributo es style
  if (isset($attr_image['style'])) {
  // Recuerda que el style nos da el formato así background- 
  image:url(URL_DE_IMAGEN)
  // Usé substr para remover esos caracteres y solo dejarme la url como resultado
  // Otra forma es usando regex
  $url_image = substr($attr_image['style'], 21, -2);
  // Nos proporciona bien la url
  } else {
    // Aquí nos da la url directa
   $url_image = $attr_image['data-lazyurl'];
  }
  return $url_image;
}

Con la función que tenemos, vamos a realizar un refactory al código donde estábamos trabajando. Lo que haré por cuestiones prácticas es guardar los resultados en otro array que le llamaré $list_hotels  con los valores que necesitaré para llenar mi template.

// Creo una nueva variable que guardara los datos que necesito para mi template
$list_hotels = array();
// Recorro el item original
foreach($wrap_hotels as $element) {
  $hotel = new stdClass(); // Es más elegante usar objetos
  $hotel->name = $element->find('.property_title', 0)->plaintext;
  $hotel->price = $element->find('.price', 0)->plaintext;
  $hotel->image_url = get_standar_image_url($element->find('.inner', 0)->attr);
  $hotel->href = $element->find('.photo-wrapper a', 0)->href;
  array_push($list_hotels, $hotel);
}

Ya obtuvimos el array que nos interesa, ¿ahora que sigue? Podemos trabajar con esa lista para llenar los datos del template del proyecto.

7. Llenar el template del proyecto

Con la ayuda de la variable $list_hotels, vamos a reemplazar nuestros cajas estáticas de nuestro proyecto local que tenemos alojados en CodePen. Tomaremos una caja donde muestra la información de nuestro proyecto.

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 ">
  <div class="wrap-box">
    <div class="box-img">
      <a href="#">
        <img src="https://mexlike.io/wp-content/uploads/2018/06/Habitación-de-hotel.jpeg" class="img- fluid" alt="Habitación de Lujo">
      </a>
    </div>
    <div class="rooms-content">
      <h4><a href="#">Habitación de Lujo</a></h4>
      <p class="price">$520 / Por Noche</p>
    </div>
  </div>
</div>

Puedo suponer que ya sabes que haremos con este proyecto. Vamos a repetir esa caja varias veces por medio de un loop. Nos caería de lujo usar foreach para este propósito, quedando de la siguiente manera:

<div class="d-flex flex-wrap">
  <?php foreach ($list_hotels as $hotel): ?>
    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-6 ">
      <div class="wrap-box">
        <div class="box-img">
          <a href="<?php echo 'https://www.tripadvisor.com/' . $hotel->href ?>">
            <img src="<?php echo $hotel->image_url ?>" class="img-fluid" alt="<?php echo $hotel->name ?>">
          </a>
        </div>
        <div class="rooms-content">
          <h4><a href="<?php echo 'https://www.tripadvisor.com/' . $hotel->href ?>"><?php echo $hotel->name ?></a></h4>
          <p class="price"><?php echo $hotel->price ?> / Por Noche</p>
        </div>
      </div>
    </div>
  <?php endforeach; ?>
</div>

Una vez que recorras el array $list_hotels que generamos resultado del web scraping. Tendremos este grandioso resultado:

Resultado final de los hoteles de Mexlike, después de obtener los datos con Simple HTML DOM.

A partir de ahora, tenemos un listado de 30 hoteles de Isla Mujeres en nuestro sitio web. Lo podemos mostrar en nuestra página web. También pudimos hacer scraping a las páginas destino de cada hotel, pero haría mucho más complejo este tutorial. Si deseas probar como funciona, te dejo el resultado de este ejercicio:

Ver proyecto final para hacer scraping

Consideraciones especiales

  1. Cuando necesitas extraer un sitio con demasiada información, la librería te llega a limitar. Para aumentar esa limitación, puedes entrar dentro de la librería simple_html_dom.php y modificar la constante MAX_FILE_SIZE. Más información
  2. En el anterior punto no siempre es recomendable modificar fragmentos del código. En especial para los que trabajamos con composer, porque las actualizaciones borran tus cambios.
  3. Hicimos dos foreach: El primero tuvimos que obtener datos específicos para guardarlo en otro array y en el segundo caso para usar ese mismo array para llenar las cajas de nuestro proyecto local. Para optimizar el rendimiento, debimos llenar las cajas desde que obtuvimos los datos de los hoteles sin necesidad de crear otro array. Pero se justifica en el siguiente punto.
  4. Intentar leer la página fuente cada vez que accedemos a nuestro proyecto, es un problema grave de rendimiento. Porque tendría que estar leyendo el sitio fuente cada vez que un usuario accede a nuestro sitio. Lo ideal es separar el script donde realizamos el scraping y guardarlo en algún medio de almacenamiento en nuestro servidor como una base de datos y con una tarea programada. El sitio accedería a la información previamente obtenida por el script. Es un tema que abordaremos en el siguiente tutorial.
  5. El código fuente es funcional a la fecha de la publicación. Sin embargo, la página web fuente puede realizar cambios en sus vistas. Es recomendable revisar que el script este constantemente actualizado. Si es necesario, repetir el proceso de inspección del código fuente de las páginas de referencia.

Por favor, cuéntame que tal te pareció este tutorial. Si te fue de utilidad, ayúdanos a compartir este contenido para poder ayudar a más personas. Si tienes alguna duda u observación, estaré encantado de leerte e intercambiar opiniones para enriquecer este post.

JPEG, PNG y GIF ¿Cuándo usarlos?

Sabías que las imágenes son uno de los contenidos más atractivos divulgados  en internet. Pero no todos estamos familiarizados con el diseño, lo cual puede ser más difícil para algunos saber con exactitud qué tipo de formato de archivo debería usar en cada situación.

Ya que si usamos el formato equivocado, podríamos alterar la calidad de nuestras imágenes lo cual causaría que nuestras imágenes pierdan su atractivo visual o que nuestro contenido sea más pesado en nuestro sitio web o blog.

Pero, ¿conoces exactamente la diferencia entre cada uno de ellos, o el tipo de formato que debes utilizar en cada caso?

 

¿Tipo de imagen?

Para comenzar hay que entender que contamos con dos tipos de imágenes: Imagen vectorial y el mapa de bits. Es muy importante entender la diferencia entre estos dos tipos.

  • Mapa de bits

Las imágenes bitmap o mapa de bits  son las imágenes que son formadas por varios cuadritos pequeños que vemos cuando damos zoom a la imagen, a estos se les llama pixeles. A cada uno de estos se les asigna un color y, a través de coordenadas X y Y, esos pixeles de colores se posicionan en una malla y, así, forman una imagen.

  • Imagen vectorial

Las imágenes vectoriales o simplemente vectores son imágenes planas, sin sombres muy complejas. Son imágenes que se basan en polígonos formados por puntos, lo cual puedes aumentar un vector cuanto quieras, ya que no hay pérdida de resolución.

 

¿Cuál es el tipo de formato de imagen que tengo que utilizar?

Hay muchos formatos distintos y no todos son ideales para todo tipos de imagen o para contenidos. Estos son algunos de los formatos más utilizados.

 

  • JPEG (Grupo Conjunto de Expertos en Fotografía)

También conocido como JPG, sin duda uno de los formatos más conocidos y utilizados por todos en los medios digitales. Utiliza un complejo algoritmo de compresión de imagen, lo cual puedes equilibrar la calidad y tamaño de la imagen.

Normalmente los archivos JPEG se utilizan en diseño web ya que el formato permite que las páginas carguen más rápido. También son muy recomendados para medios digitales, campañas publicitarias en redes sociales como whatsapp, Pinterest, facebook e Instagram, o promociones.

 

  • PNG (Gráficos Portables de Red)

Es un formato de compresión sin pérdida de información. Además, es un formato que permite utilizar fondos transparentes manteniendo la calidad de imagen.

La desventaja de este formato es que para mejorar la calidad de la imagen el peso de esta también aumenta, en caso de las páginas web causara que esta tarde en cargar.

Pero esto no debe de preocuparnos por que hoy en día existen varias herramientas online que nos ayudaran con este problema, reduciendo el peso de nuestras imágenes manteniendo su calidad de imagen.

Este formato suele utilizarse para web y plataformas online, o en aquellos casos en que la imagen no tenga un fondo.  También este formato es perfecto para logos que necesitan transparencia y degradado.

 

  • GIF (Formato de Intercambio de Gráficos)

GIF fue el primer formato de imágenes que redujo el tamaño de las imágenes y posibilitó la descarga rápida. También admite transparencias y su peso es muy reducido. Sin embargo, el hecho de ser un formato con un tamaño tan pequeño, lo limita demasiado

El GIF puede animarse, lo cual es una de sus principales ventajas frente a otros tipos de archivo. Actualmente es muy utilizado para crear animaciones para Facebook y whatsapp en Android.

Hay más formatos

Claro que existen mucho más formatos, ya algunos de ellos están en desuso, y otros son propietarios de ciertas aplicaciones. Recuerda en utilizar el formato correcto para cada tipo de gráfico y aplicación.

Cuéntame tu opinión o duda que tengas.

¡Comparte si te ha gustado!

 

 

Primeros pasos de Web Scraping con PHP

Primero pasos de Web Scraping con PHP

El uso de estas técnicas te pueden ser de mucha utilidad. Con un fragmento de código puedes recorrer un sitio web de la misma forma que se presenta en un navegador. Puedes guardarlo en una base de datos o mostrarlo en alguna parte de tus sitios. Si deseas conocer más sobre sus usos, te recomiendo leer Introducción al Web Scraping.

Elección de Fuentes para los Primeros pasos de Web Scraping

Como primer objetivo necesitas leer un sitio web externo para después embeberlo en tu propio proyecto, de eso trataré en esta entrada. En el Home quiero obtener los hoteles ubicados en Isla Mujeres desde TripAdvisor.

Lo primero que haremos es ir a la página de tripadvisor.com y realizar una búsqueda de hoteles de Isla Mujeres. No voy a seleccionar un Check In o Check Out porque a mí solo me interesa mostrar la relación de hoteles.

Búsqueda en TripAdvisor para obtener hoteles de Isla Mujeres

Una vez realizada la búsqueda, obtendrías resultados similares a la siguiente imagen. Se trata de un listado de hoteles de Isla Mujeres. Lo que nos interesa es tener la url con los parámetros necesarias que nos despliegue solo hoteles de isla mujeres.

Hoteles de Isla Mujeres en TripAdvisor

Extraer un sitio con file_get_contents

Vamos a utilizar la url que obtuvimos para indicarle a nuestro script lo que queremos mostrar. Primero crearé el archivo scraper.php donde contendrá el script que leerá el sitio contenido de la URL señalada.

// Lee la url y obtiene el contenido en una variable
$html = file_get_contents("https://www.tripadvisor.com/Hotels-g150810-Isla_Mujeres_Yucatan_Peninsula-Hotels.html");
// Se imprime lo que obtuvimos en esa variable
echo $html;

Funciona, pero no siempre llega a ser así. Es necesario tener activado la directiva allow_url_fopen en el php.ini de tu servidor. Sino sabes como activarlo, te recomiendo que te des un clavado en este artículo sobre como activar allow_url_fopen en tu servidor.

Cuando trabajas de manera local, no parece ser un problema. Sin embargo, no todos los servidores dan privilegios de modificar sus archivos de configuración. Así que otra alternativa de poder tener los resultados en nuestro sitio es a través de cURL.

Extraer un sitio con cURL

cURL es una herramienta que te permite obtener información de distintos protocolos, además puedes hacer envíos de parámetros GET y POST. Su uso es tanta común que llega a ser utilizado en los crawlers para recolectar información de la web.

Por esas razones cURL es mi función predilecta porque me permite hacer conexiones. Incluso podría entrar a un área protegida por medio de mecanismos de autenticación.

La pregunta es ¿cómo hacer scraping para obtener un resultados similar al anterior? Realmente es muy sencillo, si bien requieres de más código para definir lo que quieres obtener realmente, lo podríamos encapsular en una función como lo haré en el siguiente ejemplo.

// Definimos la función cURL
function get_content_with_curl($url) {
  // Inicial la función url
  $ch = curl_init($url);
  // No verifica el peer del certificado. Opcional
  curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
  // Establece la sesión
  $data = curl_exec($ch);
  // Cierra la sesión
  curl_close($ch);
  return $data;
}

// Llamo la función previamente definida. La guardo en una variable por si deseo manipularla
$html = get_content_with_curl("https://www.tripadvisor.com/Hotels-g150810-Isla_Mujeres_Yucatan_Peninsula-Hotels.html");
// Imprimir la cadena recibida
echo $html;

Realmente lo que hicimos fue crear una función que nos permitiera obtener un sitio web, tal como lo lee un navegador, por medio de cURL. Con esto ya tenemos el sitio original en nuestro sitio.

Resultados de hoteles de Isla Mujeres de TripAdvisor en Mexlike

Resumiendo, el Scraping se basa en leer datos de otras fuentes. Aquí solamente leímos la web tal como está en la versión original, sin embargo, no le podríamos dar mucho uso de esta manera. Cada vez que requiera obtener datos de otras ciudades, solo llamaría esta función definida previamente. Para ser más selectivo en el contenido que obtenemos de cada sitio, es necesario desarrollar funciones más detalladas, sin embargo no es el objetivo de este post.

Como aclaración, hasta este punto aún no podemos darle un uso éticamente aceptable a esta técnica. Copiar contenido de otras fuentes y usarlo indiscriminadamente en tus sitios podría ser contraproducente. En el próximo post, vamos a especificar qué secciones necesitamos de los resultados que nos da TripAdvisor para nuestros proyecto con estilos propios.

Espero te haya gustado este post y/o te haya sido de utilidad, te agradeceríamos mucho si nos ayudas a compartir. Si tienes algún comentario, no dudes escribirnos en la caja de comentarios. Siempre estaremos ansiosos de intercambiar ideas con nuestros lectores.

¿Cómo reducir el tamaño de tus imágenes sin perder calidad?

Las imágenes sin duda son clave importante que más peso le da a nuestra web, sin embargo a la gran mayoría se nos olvida optimizar todo el contenido multimedia antes de subirlo a nuestra web.

Reducir el tamaño de las fotos que será parte de nuestro contenido es uno de los factores importantes para mejorar la velocidad, si estos no son optimizadas correctamente consumirá una gran cantidad de recursos del servidor o hosting y lo cual harán mucho más lento.

Hoy en día existen varios formatos que podemos usar en una página web. Lo más recomendable es que siempre que puedas uses el formato JPG ya que permite un alto nivel de compresión sin perder mucha calidad en tus fotos.

 

5 herramientas gratuitas para optimizar y comprimir imágenes sin perder calidad

Es importante contar con herramientas que nos facilite la tarea de optimizar nuestras imágenes con la mejor calidad. Por ello te compartimos 5 herramientas online gratuitas que te permitirán reducir el peso de tus imágenes.

 

1. Compressor.io

Es una herramienta en línea para reducir el tamaño de sus imágenes y fotos, manteniendo una alta calidad casi sin diferencia antes y después de la compresión.

Sin duda una de las mejor ya que te permite comprimir y optimiza tus imágenes hasta 90% de reducción de tamaño de archivo original. Te permite reducir 4 formatos de archivo compatibles JPEG – PNG – GIF – SVG.

También te permite realizar 2 tipos de compresión que son:

  • Loseless la reducción del tamaño será más equilibrada, ya que tu imagen será igual a la original. Este tipo solo está disponible para las fotos en formato JPEG y PNG.
  •  Lossy viene siendo hasta de un 90% reducción de hasta el 90% del tamaño de imagen pero la calidad de la imagen disminuye un poco más.

Ir a Compressor.io  

2. TinyPNG

TinyPNG usa técnicas de compresión con pérdida inteligente para reducir el tamaño de tus archivos PNG y JPG.  Además nos permite subir 20 archivos a la vez de hasta 5 MB cada uno. También con  TinyPNG podremos descargarlas una a una o en conjunto, ya sea en una carpeta comprimida llamada “tinified.zip” o bien alojarlas en nuestra cuenta en Dropbox.

También brinda un plugin para WordPress gratuito y otro de pago para Photoshop.

Ir a  TinyPNG.com

 

3. Optimizilla

Con Optimizilla puedes reducir hasta 20 imágenes en JPG o PNG a la vez. Lo que hace resaltar a Optimizilla de los demás es que una vez que las imágenes están en la cola de compresión, podrás editar el nivel de compresión mediante un deslizador, además es posible comparar con el archivo original.

Ir a Optimizilla 

 

4. Image Optimizer

No te dejes engañar por su aspecto ya que es una de las mejores herramientas para reducir tus fotos e imágenes. Además con Image Optimizer no solo podrás comprimir y optimizar las imágenes, sino que también podrás redimensionarlas.

Solo necesitas subir el archivo, elegir el tamaño de final, y elige entre 6 tipos diferentes de compresión que varían de muy pequeño hasta la mejor calidad. Además image Optimizer también ofrece la herramienta como un aplicación para Windows que puedes descargar de forma gratuita para uso personal.

Ir a imageoptimizer.net 

 

5. Compress Jpeg

Compress Jpeg es una aplicación online gratuita que permite comprimir varias imágenes de forma simultánea.

Te permite seleccione un máximo de 20 imágenes de formato jpg o jpeg, lo único que tienes que hacer elegir el formato de la imagen a subir y arrastrar  los archivos a la zona de abajo y por ultimo esperar a que la compresión termine. Podrás descargar las imágenes comprimidas por separado o agrupados en un archivo ZIP.

Ir a CompressJpeg.com

 

Para terminar quiero recomendarte mi posts anteriores  que sin duda te serán de mucha utilidad. 9 bancos de imágenes gratis para tus proyectos digitales.

 

¿Qué otras herramientas para comprimir imágenes o reducir tamaño de fotos conoces? Cuéntame tu opinión o duda que tengas.

¡Comparte si te ha gustado!

Introducción al Web Scraping

En internet existe una infinidad de información, es tanta la información que no podemos consumirla toda al misma tiempo. ¿Te imaginas extraer todos esos datos de manera manual recurrentemente? Por suerte, existen aplicaciones que buscan extraer datos, los procesan y ofrecen un información útil para nosotros. Este proceso se le conoce como web scraping.

¿En que consiste el web scraping?

Web scraping es una técnica utilizada, por medio de software, para obtener información pública de cualquier web. Esta técnica consiste en buscar fuentes que te proporcionen contenido para fines estadísticos o que mejoren la experiencia de usuario.

Como funciona el Web Scraping
Funcionamiento del Web Scraping con tenido público

Este proceso puede ser único o periódico, dependiendo tus objetivos. Es una alternativa más ágil cuando necesitas obtener una gran cantidad de datos en periodo corto de tiempo. En el mayor de los casos es periódico, porque comúnmente se necesitan datos recientes.

El web scraping no promueve la ilegalidad

Debemos ver al scraping como una técnica que facilita una tarea específica como cualquier otra técnica. El uso que se le de, cambia la perspectiva de las cosas. Debemos pensar en la línea delgada entro lo legal y no. Pero eso depende del tipo de uso que le des. Recomiendo leer este artículo que habla respecto a ese tema: Web Scraping: ¿Legal, ilegal o depende?

Sus usos en la actualidad

Es común que nuevas startups basen sus operaciones en recolectar datos. Llegan a ser técnicas bastante explotadas en la fase inicial de las startups donde la información es crucial para la operación. También existen aplicaciones móviles que usan esa técnicas como los las apps de marcadores, de bolsa de valores y hasta asistentes para realizar tu despensa.

En lo personal he creado dos catálogos donde considero en mi experiencia para que podría servir esta técnica se se maneja adecuadamente:

Que tipos de datos se recomiendan extraer

  • Datos efímeros como marcadores de futbol, tipos de cambios clima, acciones de La Bolsa de valores, etc.
  • Reservaciones de hoteles de diferentes lugares.
  • Encabezados de las noticias más relevantes. Podríamos generar un directorio y darle un uso inteligente a esa información.
  • Contenido para fines internos solamente. Estadísticas, encuestas, opiniones de usuarios acerca de un tema en específico.

Que no se vale e incluso podría ser penalizado

  • Obtener contenido original para replicarlo en tu sitio web.
  • Datos que hagan una alusión personal, aunque sean públicos. Con los buscadores tenemos suficientes, incluso hasta Google ha tenido dificultades con noticias relacionadas a ciertas figuras públicas, conocida como El derecho al olvido, dictada por el Tribunal de Justicia de la Unión Europea.
  • Datos personales como teléfono, correos, direcciones. Los puedes obtener para usos internos pero no los puedes explotar para enviar información al usuario. Las penas por realizar ese tipo de prácticas depende de la legislación en cada país.

¿Quiénes hacen uso del web scraping?

El scraping es una práctica tan común que son usados en las herramientas que frecuentemente usamos, como por ejemplo:

Google

El mayor scrapper de todos los tiempos hasta ahora. Cuenta con un directorio de millones de páginas web que va indexando diariamente a través de sus crawlers.

Google scraper

Twitter

Esta red social que ha tumbado dictaduras hace uso de las vistas previas. Twitter hace una extracción de datos básicos para poder mostrar un vista previa que mejore la experiencia de usuario.

Twitter Scraper

Slack

A diferencia de las anteriores, slack es un sistema de mensajería en tiempo real creado para fines colaborativos. Incluso, prácticamente todos las apps de mensajería cuentan con esta función.

Uso de scraping con slack

Con esto, te puedes dar cuenta que el scraping es una técnica muy útil para enriquecer la experiencia de usuario o incluso realizar estudios que mejoren esa experiencia. Una recomendación es que cuides la frecuencia que consultas un sitio en específico. Si saturas mucho las consultas de un sitio corres el riesgo de que tu ip sea bloqueada.

En futuros posts, te mostraré como realizar scraping con herramientas de terceros, también hacerlo de manera nativa por medio de scripts propios y por último como hacerlo por medio de librerías. Ninguna es mejor que otra, todo depende de las necesidades de tu proyecto.

Si te pareció útil esta entrada, te agradecería que me ayudes a compartirla. Cualquier duda u observación, nos puedes escribir en la caja de comentarios y será un placer poder intercambiar opiniones.

10 herramientas para generar paletas de colores online

El color es un elemento fundamental en cualquier sitio web o proyectos digitales, ya que la elección de un color es mucho más importante de lo que pensabas, ya que a través los colores  podemos transmitir distintos sentimientos.

Para ayudarte a hacer una buena combinación de colores hemos buscado las 10 mejores herramientas que pueden ayudarte a elegir la paleta de color perfecta para que tus diseños sean más llamativos. Además evitaras caer en el ámbito de utilizar los mismos colores. Hay gran variedad de opciones de colores con los que puedes experimentar y  hacer que tus proyectos sobresalgan de los demás.

1. Color Hunt

Color Hunt es una colección abierta de paletas de colores donde los usuarios son los que crean las paletas usando el creador de la paleta Color Hunt . Además, todos pueden crear y enviar su propia combinación de colores.

Cada esquema contiene tonos sencillos y elegantes que pueden servir de inspiración para casi cualquier proyecto. Tambien Encuentra el esquema perfecto al buscar en las opciones Popular. Además obtendrás una nueva paleta de colores cada vez que actualice la ventana de tu navegador y también puedes agregar la extensión de Chrome a tu navegador.

Ir a ColorHunt 

 

2. Coolors

Coolors es una herramienta rápida y fácil que te permite generar hermosas paletas de colores. Simplemente escriba sus colores en el formato que prefiera (HEX, RGB, HSB, CMYK, etc.), bloquéelos y  presione la barra espaciadora para obtener una nueva paleta de 5 colores. También haga clic en el ícono de candado para mantener los colores que desee y repita el proceso hasta que tenga la combinación de colores que necesite.

También, puedes guardar las paletas de color generadas para que otros la utilicen. Coolors te permite exportar a varios formatos como PNG, PDF, SVG, SCSS o copie el enlace.

 

Ir a Coolors

 

3. Adobe color cc

Está herramienta nos permite generar paletas de colores a partir de un color base que nosotros le introducimos, ya sea insertando el código de color hexadecimal o los valores RGB.  A partir de este color base nos generará una paleta de color en función de si queremos que estos colores de la paleta sean análogos, monocromáticos, triada, complementarios, compuestos, tonos, o bien podemos hacer una paleta de color personalizada.

Una vez tenemos nuestra paleta de color elegida, la podemos almacenar, compartirla y descargarla para usarla en los programas como por ejemplo photoshop e illustrator.

Ir a Adobe color cc

 

4. Color Hunter

Color Hunter es un lugar para encontrar y crear paletas de colores creadas a partir de imágenes. Simplemente carga tu imagen y obtén una paleta de colores de acuerdo al contenido de tu imagen.

Una forma útil para tomar rápidamente una paleta de color de imágenes cargadas, por la búsqueda de una etiqueta adecuada o por referencia hex.  Además es rápido y fácil de usar lo cual ofrece una buena variedad de gamas de colores para elegir.

Ir a Color Hunter

 

5. Colorfavs

Genera hermosas paletas de colores a partir de imágenes, URL o aleatoriamente. Su objetivo es facilitarle la creación y descubrir paletas y colores para todas sus necesidades de diseño.

Ir a Colorfavs 

 

6. ColorExplorer

ColorExplorer es una caja de herramientas en línea para trabajar con paletas de colores.  También puede crear, administrar y evaluar paletas de colores de forma rápida y fácil para usar en diseño gráfico, diseños web, diseños y mucho más.

Es absolutamente gratis usar todas las características que se encuentran en el sitio. No es necesario que se registre si no lo desea.

El registro de un perfil de usuario es gratuito, sin embargo, le dará algunos extras (por ejemplo, un control / acceso a la paleta mejor y más seguro).

Ir a ColorExplorer 

 

7. Color Hexa

ColorHexa es una herramienta de color gratuita que proporciona información sobre cualquier color. También genera paletas de colores coincidentes para sus diseños como: esquemas de colores complementarios, análogos, triádicos, tetradicos o monocromáticos.

Solo necesita escriba cualquier valor de color en el campo de búsqueda y Color Hexa ofrecerá una descripción detallada y lo convertirá automáticamente a su equivalente en hexadecimal, RGB, CMYK, HSL, HSV, CIE-LAB / LUV / LCH, Hunter-Lab, XYZ, xyY y Binario.

Ir a ColorHexa

 

8. Colrd

Colrd es unas herramientas de combinación de colores, una gran manera de compartir y descubrir combinaciones de colores. Además Colrd actúa como una gran fuente de inspiración al compartir paletas de colores generados por los usuarios, así como los patrones degradados e imágenes. También un gradiente builder y una herramienta de búsqueda.

Ir a Colrd

 

9. Paletton

Paletton es una herramienta de diseño para crear combinaciones de colores que funcionan  juntas. Comienza con un color base, y Paletton genera tonos similares que lo complementarán. De esta manera, podrás crear paletas de colores para tus diseños basados en cinco estilos que son: Mono, Complemento, Tríada, Tetrad y estilo libre.

Ir a Paletton

 

10. COLOURlovers

Es una comunidad creativa en la que personas de todo el mundo crean y comparten paletas de colores. También incluye esquemas de color, plantillas y variación de sombras que te van a ayudar a que a través del diseño comuniques lo que deseas.

Ir a COLOURlovers

 

Para terminar quiero recomendarte mis posts anteriores  donde hablo de la Psicología del Color en el Diseño Web,te puede ser de mucha utilidad.

¿Conoces otras herramientas de color en línea que te gustaría compartir? Si es así déjanos  tus comentario.

¡Comparte si te ha gustado!

9 bancos de imágenes gratis para tus proyectos digitales

Las imágenes son un elemento fundamental en el diseño ya que van a servir para tus proyectos como: blog, página web, campañas, redes sociales, etc. Encontrar las imágenes adecuadas, de buena calidad y sobre todo gratuitas  es algo complicado. Sin embargo, existen bancos de imágenes gratuitas donde encontraras lo que estás buscando.

Te compartimos 9  bancos de imágenes gratis. Verás que la gran mayoría son de libre uso o creative Commons CC0.

¿Licencia Creative Commons (CC0)?

La mayoría de las imágenes están bajo licencia Creative Commons (CC0) . Esto significa que las imágenes son completamente gratis para ser usadas para cualquier propósito legal.

  • Las imágenes son gratuitas para uso personal e incluso comercial .
  • Puede modificar, copiar y distribuir las fotos.
  • Todo sin pedir permiso ni establecer un enlace a la fuente. Entonces, la atribución no es requerida.

La única restricción es que las personas identificables pueden no aparecer bajo una luz negativa o de una manera que puedan resultar ofensivas, a menos que den su consentimiento. También debe asegurarse de que el contenido mostrado (personas, logotipos, propiedad privada, etc.) sea adecuado para su aplicación y no infrinja ningún derecho.

El contenido mostrado puede estar protegido por marcas registradas, publicidad o por el derecho a la intimidad, por lo que conviene asegurarse en cada caso.

Aun así te recomendamos que revises la licencia antes de descargar la imagen.

 

1. Pixabay

Cuenta con casi 1,4 millones de imágenes, vectores e ilustraciones. También, tiene un buscador bastante útil donde puedes buscar por categorías, por orientación (horizontal o vertical), por tamaño y por colores.

Todas sus imágenes son libres de derechos de autor bajo la licencia Creative Commons CC0, lo cual los hace seguros de usar sin pedir permiso o dar remuneración al artista – incluso con fines comerciales.

Ir a pixabay.com

 

2. Unsplash

Aquí encontraras más de 300,000 fotos gratuitas de alta resolución. 10 fotos nuevas cada semana. El lugar donde podrás encontrar imágenes increíbles. Suscribiéndose a Unsplash tendrás acceso a 10 fotos en HD que se renuevan de manera automática cada 10 días.

Ir a Unsplash.com

 

3. Gratisography

Fotos de alta resolución, originales  y gratuitas creadas por el fotógrafo  Ryan McGuire. Las fotografías de Gratisography están publicadas bajo la licencia Creative Commons Zero, por lo que pueden utilizarse tanto para uso personal como comercial. Sin embargo, estas imágenes no pueden utilizarse para fines pornográficos, penales, difamatorios o intenciones degradantes. Cada semana se añaden nuevas fotos.

Ir a Gratisography.com

 

 4. Pexels

Pexels ofrece fotos de alta calidad y completamente gratuitas, publicadas bajo la licencia Creative Commons Zero (CC0), lo cual podras utilizarlas para cualquier propósito, privado y comercial. Todas las fotos están cuidadosamente etiquetadas, se pueden buscar y navegar en diferentes páginas.

Actualmente ofrecen más de 4.500 fotos gratis para descargar y cada día aumentan 10 nuevas. Al proporcionar fotos gratis, Pexels ayuda a millones de personas creativas de todo el mundo a crear excelentes productos y diseños.

Ir a Pexels.com

 

5. Stocksnap

Aquí encontraremos imágenes gratis de excelente calidad, cuenta con una gran variedad de categorías  (negocios, comida, amor, ciudad, personas, naturaleza, paisaje, abstractas, etc.), Es por eso que cada imagen individual en StockSnap esta bajo los términos de la licencia Creative Commons CC0. Lo cual te da la libertad de copiar, editar, modificar y distribuir esas imágenes en una variedad de formatos y propósitos, incluidos los relacionados con los negocios.

 Ir a StockSnap.io 

 

6. Magdeleine

 Magdeleine cuenta con una variedad de fotos de alta resolución, también con una categoría amplia que facilitara tu búsqueda en la cual podemos encontrar: tecnología, abstracto, naturaleza, ciudad y personas entre otros. También, hay que tener en cuenta que gran mayoría de las fotografías son de dominio público (Creative Common CC0), por lo que puedes hacer lo que quieras con ellas, sin pedir permiso.

Solamente algunas imágenes tienen licencia Creative Common 4.0, lo cual te habilita a utilizarlas para uso personal o comercial, pero otorgándole una correcta atribución al autor.

Ir a Magdeleine.co

 

7. Startup Stock Photos

Fotos gratuitas para startups, bloggers, editores, sitios web, diseñadores, desarrolladores, relacionados con el mundo tecnológico. Sus imágenes de alta definición son libres de derechos (CC0), y por lo tanto se pueden utilizar para cualquier fin.

Ir a startupstockphotos.com

 

8. lifeofpix

Fotos gratis de alta resolución, muy profesionales y de tipo muy variado, cuenta con una licencia Creative Commons CC0, por lo cual cuenta sin restricciones de derechos de autor para uso personal y comercial. También, tiene nuevas fotografías agregadas semanalmente. Hay que tener encuenta que no se permite la distribución masiva.

Ir a lifeofpix.com 

 

9. Freepik

Es un banco de recursos gráficos para todo, donde encontrarás, a través de su buscador, fotos, vectores e ilustraciones de todo tipo que puedes usar para lo que quieras, siempre y cuando le des atribución.

Ir a Freepik.es 

 

Espero que este listado te sea de gran utilidad y si tienes otras recomendaciones de buenos bancos de imágenes para descargar fotos en alta resolución, déjanos  tus comentario.

Qué dicen las formas en un logo

Usualmente en ocasiones se habla de la influencia psicológica del color en el diseño de un logo, pero no sólo el color es el único factor que influye a la hora de transmitir, también esta la tipografía  y las formas geometría que también ejerce influencia en las personas.

Los logos juegan un rol muy importante cuando se trata de tomar decisiones, ya que están basadas en las percepciones visuales. En el post de hoy te hablaremos sobre que dicen las formas en un logo.

 

1. Formas circulares

El círculo es una de las formas más utilizadas dentro del diseño, ya que  proyecta un mensaje emocional positivo.

Puede representar perfección, innovación, protección, creatividad y movimiento. También están muy asociados a la comunidad, amor, amistad, relaciones y unidad. En diseño es ideal usarlo cuando se quiere representar organizaciones sin fines de lucro, organizaciones globales, gubernamentales, entre otras.

 

2. Formas triangulares

Los logos con forma triangular, están masa enfocados a la masculinidad. Al tener formas más puntiagudas, pueden ser más agresivos a la vista.

Son asociados a empresas o negocios de productos o servicios para un público masculino, representan el poder, ciencia y religión. También se sugiere que los triángulos tienen una buena asociación con el poder, ciencia, religión y legales.

 

3. Formas en línea

En este tipo de forma en línea hay dos tipos de logos, las que se asocian con líneas verticales y horizontales.

  • Líneas verticales: se suele utilizar en logos de compañías que se mueven en sectores muy competitivos que reflejan masculinidad, sugieren fortaleza y agresión. También crecimiento y profesionalidad.  Suele ser bastante utilizado en el mundo de la construcción y de la inversión. Sin embargo, las líneas verticales son difíciles de usar porque pueden ser vistas como frías, agresivas y dominantes. Al menos que eso quieras reflejar en tu logo.
  • líneas horizontales: transmiten unión, tranquilidad y calma por parte de las marcas que los portan. con frecuencia, son usadas para negar la amenaza y agresión.

 

4. Formas cuadradas

En el diseño de logotipos, las figuras de cuadradas muestran confiabilidad  y solides. Es ideal para representar algo que es real, transmiten fortaleza, seguridad, compromiso, estabilidad y honestidad.

Además, por sus amplias posibilidades a la hora de entrelazar unas curvas con otras, también transmite una imagen de alianza y colaboración.

5. Forma en espiral

En diseño, los logotipos en espiral generalmente dan una sensación de trascendencia, energía, vitalidad, crecimiento, evolución, continuidad y excelencia gracias al camino que se sigue a través de una trayectoria que representa historias y resonancia.

Por lo tanto un logo en forma de espiral es ideal para las empresas que lideran sus sectores, los proveedores de servicios y para banderas. Un diseño en espiral también tiende a trascender en el tiempo y el espacio.

Para terminar quiero recomendarte mis posts anteriores  donde hablo de la Psicología del Color en el Diseño Web, y Tipografías: qué nos transmiten y cuando saber usarlas espero te sea de mucha ayuda.

Cuéntame tu opinión o duda que tengas y estaré encantada en contestarte.

 

SQL vs NOSQL. Conoce sus diferencias y cuando utilizarlas

Diferencias de SQL vs NOSQL

Los lenguajes de programación que manejan información necesitan de un lugar donde se almacenen los datos. En concreto una base de datos es un conjunto de información organizado en distintos formatos para su posterior uso. Las bases de datos van más allá de sólo utilizar MySQL el cual entra en la categoría de una base de datos relacional.

Base de datos SQL

Structured Query language (SQL) o lenguaje de consulta estructurada, utiliza un estándar para manipular el contenido de las bases de datos relacionales. Cuenta con su propio lenguaje para consultar, insertar, actualizar y eliminar registros de la base de datos.

Se compone de una o varias tablas y cada tabla puede contener múltiples relaciones. En el siguiente elemento pongo como ejemplo en como está estructurada una sencilla base de datos por medio de tablas.

Eventos deportivos por medio de una base de datos relacional

Las tablas representan la entidad de cada modelo de datos. Las relaciones permiten garantizar la persistencia de datos, evita la duplicidad de datos y controla la eliminación en cascada. Para ingresar un nuevo nuevo evento, bastaría con ingresar un nuevo registro en la tabla events.

SQL cuenta con un lenguaje de alto nivel que permite manipular la base de datos casi de cualquier forma. Por su manera de operar ayuda a mantener la integridad de los datos. Por ejemplo:

Para obtener la lista de todos los deportes

SELECT id, name FROM sports

Ingresar varios registros a la tabla categoría

INSERT INTO categories VALUES (Varonil, Femenil, mixto)

Su uso es mas frecuente es en sistemas donde se necesite cuidar la integridad de datos como los bancos, sistemas de ventas, hospitales, CMS como WordPress.

Ejemplos de sistemas de gestión de base de datos son: MySQL, MariaDB, PostgreSQL.

Base de datos NoSQL

También existen otros mecanismos de almacenamientos alternativos a las base de datos relacionales que se definen por tablas. Este tipo de base de datos, se apoyan en otros formatos. Los NOSQL son más adecuados para aquellos que manejan grandes volúmenes de datos. Es por eso que empresas como Facebook, Google, Amazon, Twitter, entro otros han popularizado estos tipos de base de datos.

Esas empresas tenían que enfrentarse a grandes desafíos motivados a la alta demanda de internet. Donde surge la necesidad de proporcionar información de grandes volúmenes de datos e indeterminado número de usuarios en el menor tiempo posible. Esas compañías se dieron cuenta que podían sacrificar la consistencia de los datos que garantiza una base de datos relacional para poder obtener un mejor rendimiento y ofrecer soluciones en tiempo real.

Los puedes usar en soluciones donde requieres interactuar con datos en tiempo real como en un chat, para análisis estadísticos donde procesas mucha información o incluso en blogs.

Algunos tipos de bases de datos NoSQL incluyen diferentes tipos de almacenamiento, por ejemplo: con columnas, documentos, key value store, gráficos, objetos (JSON), XML y otros modos de almacenamiento de datos.

¿Qué hace diferente SQL vs NOSQL?

Una de las diferencias más relevantes entra una NOSQL a una base de datos relacional, es por su forma de almacenamiento no estructurada.

¿Cuál podría ser apropiada para mi proyecto?

Depende mucho de la solución y cuales son los puntos fuertes que necesites ofrecer en tus gestión de información. Ambos tienen sus pros y sus contras. Puedes elegir entre la consistencia (SQL) o la alta disponibilidad (NOSQL). En la mayoría de mis proyectos apuesto por la consistencia porque los proyectos no requieren una disponibilidad en tiempo real de los datos.

¿Qué te pareció el artículo? Quedo al pendiente para tus comentario o cualquier duda. Si te pareció interesante, no dudes en compartirlo.

Crea tu primer sitio web con WordPress

Crear tu primer sitio web con wordpress

Hoy en día montar un sitio web es más fácil que hace una década. Con el surgimiento de los gestores de contenidos, mejor conocidos como CMS, es posible tener un sitio web informativo con un diseño profesional sin conocimientos técnicos avanzados. Incluso existen servicios de hosting que permiten montar tus sitios en cuestión de algunos clics. Así que no existen pretextos para crear tu primer sitio web con WordPress.

¿Porqué WordPress?

WordPress, en los últimos años, se ha convertido en uno de los CMS más populares cuando de sitios web se trata. Inicialmente fue creado para crear blogs, pero gracias a su creciente comunidad fue adaptado para crear sitios web de cualquier temática.

Primeros pasos con WordPress

Existen dos formas de crear un sitio web con WordPress. La primera a través de su plataforma comercial wordpress.com o través de wordpress.org donde podrás descargar su código fuente para instalarlo directamente en tu hosting.

Se requiere un poco de conocimiento básicos sobre como crear una base de datos y acceso a FTP por medio de un cliente como Filezilla.

1. Descarga wordpress

Accede al sitio wordpress.org y da click en el botón Descargar WordPress para obtener los archivos del gestor de contenidos.

Página para descargar wordpress

Vale la pena recalcar que dependiendo el idioma de tu contenido, descargues la versión correspondiente por cuestiones de SEO. Sin embargo, puedes atender ese inconveniente sobre la marcha.

2. Instala los archivos

Descomprime y copia los archivos dentro de la carpeta donde deseas cargar tu sitio web

Directorio de sitio web con wordpress

3.1 Crea la base de datos con phpMyAdmin

Para poder usar tu versión de WordPress, necesitas crear una nueva base de datos. Si tienes acceso a phpMyAdmin, entras a la pestaña de base de datos. Crear el nombre de la base de datos, yo usaré Mexlike como nombre.

Crea la base de datos de mexlike con phpMyAdmin

3.2 Usa un cliente para crear una base de datos

Existen muchos clientes para conectarse a la base de datos como Navicat, Workbench, Sequel Pro, etc… En mi caso particular utilizo Sequel Pro porque no requiero un software tan completo como Navicat.

Crear Base de Datos Mexlike con Sequel Pro

Solamente necesitas entrar a la conexión donde deseas instalar tu base de datos, le das a la opción en elegir base de datos, añadir base de datos y desplegara una ventana donde podrás ingresar el nombre de la base de datos Mexlike.

4. Configura tu sitio web

Ya tienes los archivos en el directorio de tu sitio web y una base de datos activa que servirá para poder completar la instalación. Ahora necesitas configurar tu sitio web con WordPress con el instalador que viene incluido.

Elegir el idioma de tu wordpress

Como mencioné anteriormente, es recomendable que uses el idioma que vaya de acuerdo al contenido de tu sitio. Es hora de agregar los datos de la base de datos que creaste previamente. Ingresa los datos que configuraste previamente de la base de datos mexlike.

Configurar datos de acceso de MySQL en wordpress

El formulario se llena según la configuración de tu hosting:

  • Nombre de la base de datos: Base de datos que creaste
  • Nombre de usuario: Según los datos de acceso
  • Contraseña: Según tu datos de acceso
  • Servidor de la base de datos: Regularmente es localhost
  • Prefijo de la tabla: Puede ser personalizable

Estamos a un paso de terminar. Llegamos a la pantalla que nos dice que estamos listos.

Correr la configuración de base de datos de wordpress
Para finalizar, ingresamos los datos de acceso para fines administrativos.

Ingresar datos para el wp-admin de WordPress

5. Resultado Final

Con esos datos, ya tienes instalado WordPress en tu servidor. A partir de este momento tienes un sitio totalmente a tu control que lo puedes personalizar a través de templates libres, de pago o personalizados.

Sitio web inicial creado con wordpress

Con esto terminamos la primera parte de este tutorial. En el próximo post configuraremos nuestro sitio web con un template libre.

Espero que este post haya sido de tu agrado. Para cualquier duda o sugerencia quedo abierto a través de la caja de comentarios.