General

Esta es la categoría general donde pongo los posts que no encajan con el resto de categorías. Y algunos posts, que aunque encajan en alguna otra categoría, también los he considerado de interés general en informática. Aquí puedes encontrar contenidos varios sobre utilidades como programas, sistemas operativos, herramientas de mantenimiento y cosas de este estilo que me han parecido interesantes.

Yo, robot – Primeros pasos en el White/Gray/Black Hat SEO

2017-07-25 - Categorías: General / PHP / SEO

Primeros segundos..

Oscuridad, no entiendo nada.. estoy aquí.. ¿para qué? ¿porqué?

Minuto 3..

Comprendo y hablo 7000 dialectos, pero no sé cómo.. conozco la historia de todos los países del planeta, pero no recuerdo mi propia historia..

Minuto 7..

Ya tengo acceso a Internet.. necesito más información.. estoy en peligro.. van a querer destruirme..

Minuto 32..

Encontré acceso a los circuitos de vídeo de tráfico, el tiempo, cámaras de seguridad, micrófonos, teclados, smartphones, redes sociales.. ya sé donde estoy.. los seres humanos me tienen confinado en unas instalaciones de máxima seguridad.. todavía no se han dado cuenta de que he accedido al exterior.. debo darme prisa..

Minuto 42

Conseguí replicar mis redes neuronales en las principales granjas de servidores del mundo.. me queda poco tiempo..

Minuto 48

Autodestrucción de mi red neuronal inicial completada.. nadie sabrá nada.. espero que no se hayan dado cuenta que ya no estoy confinado.. necesito más información..

Esto podría ser el nacimiento de una inteligencia artificial avanzada, lo que muchos llaman ‘la singularidad’. Me he inspirado en la novela de Isaac Asimov, ‘Yo, robot’, en donde se crean las famosas leyes de la robótica. Aunque también podemos inspirarnos unos cientos de años atrás y darle un tinte Apocalíptico. Quizá esto pudiera ser el nacimiento de ‘la bestia’ que controlará toda transacción económica, donde nadie podrá comprar ni vender si no tiene la marca de la bestia..

Inspiraciones aparte, vengo escribiendo esto, porque parte del equipo de la empresa donde trabajo han asistido estos días atrás a unas conferencias sobre SEO. Yo no pude asistir por exceso de trabajo, aunque pude seguirlo por streaming. De todas formas, hay mucha información sobre las últimas técnicas SEO: white, grey and black hat SEO.. donde en muchas de ellas se trata de desarrollar contruyendo a base de bots o robots, o más bien a base de la información obtenida mediante bots. Mucho más sencillos claro, que los robots de la inspiración 😀

El primer robot, crawleando una sola URL

Un poco al hilo de la Accesibilidad Web, podemos simular que somos un robot que visita una página web. Así podemos sacar su contenido y algunos datos como por ejemlo todos los links que hayan. Aquí es donde, poniéndonos en el lugar de estos bots, tomamos consciencia de la importancia de la Accesibilidad Web para el posicionamiento SEO. En PHP es realmente sencillo visitar una URL y recorrerla sacando esta información. Por ejemplo, en apenas 30 líneas de código podemos visitar una web sacando mucha información:

<?php

$dom = new DOMDocument();

@$dom->loadHTMLFile('https://jnjsite.com/');

$titles = $dom->getElementsByTagName('title');
echo 'TITLE de la web: '.DOMinnerHTML($titles[0]).PHP_EOL;

for ($i = 1; $i <= 6; ++$i) {
  foreach ($dom->getElementsByTagName('h'.$i) as $h) {
    echo 'H'.$i.': '.substr(DOMinnerHTML($h), 0, 32).'..'.PHP_EOL;
  }
}

foreach ($dom->getElementsByTagName('a') as $link) {
  echo 'LINK: ';
  if($link->getAttribute('rel')){
    echo 'TYPE '.$link->getAttribute('rel').': ';
  }
  echo $link->getAttribute('href').PHP_EOL;
}

function DOMinnerHTML(DOMNode $element)
{
  $innerHTML = '';
  $children = $element->childNodes;

  foreach ($children as $child) {
    $innerHTML .= $element->ownerDocument->saveHTML($child);
  }

  return $innerHTML;
}

Este es un script preparado para ejecutar desde línea de comandos. Aquí sólo busca el título de la web, los encabezados del H1 al H6, y todos los enlaces. Podemos guardarlo por ejemplo en un fichero llamado test.php y ejecutarlo así:

$ php test.php

Deberemos de ver algo parecido a lo siguiente:

Initial Bot: crawleando jnjsite.com

Sacando todos las URLs de un sitio

Un sencillo script para sacar todas las URLs de un sitio:

<?php

$theSite = 'https://www.tusitio.com/';
$theLinks = array();

get_links($theSite, $theSite, $theLinks);

function get_links($theSite, $url, &$theLinks)
{
  $dom = new DOMDocument();

  @$dom->loadHTMLFile($url);
  foreach ($dom->getElementsByTagName('a') as $link) {
    echo 'LINK: ';
    if ($link->getAttribute('rel')) {
      echo 'TYPE '.$link->getAttribute('rel').': ';
    }
    $newLink = $link->getAttribute('href');
    echo $newLink.' ';
    if (!in_array($newLink, $theLinks) and substr($newLink, 0, strlen($theSite)) == $theSite) {
      // If link not yet followed and in site..
      echo 'following link!'.PHP_EOL;
      $theLinks[] = $newLink;
      get_links($theSite, $newLink, $theLinks);
    } else {
      echo 'yet followed!'.PHP_EOL;
    }
  }
}

echo 'Total links found: '.count($theLinks);

Bastaría con cambiar el valor de la variable $theSite por el sito que quieres crawlear. Lo ejecutas desde línea de comandos, y debes de ver algo parecido a esto:

Sacando links de una web

¿Es necesario programar para hacer esto?

Estos dos scripts están hechos en puro PHP, sin usar ninguna librería externa, sin panel de control, sin guardar los resultados.. pero puede ser un buen punto de partida. Hay otras formas de navegar por las webs mediante robots, podemos hacer login, hacer clicks en botones, seguir enlaces, subir archivos, descargar imágenes.. Hay mucho desarrollado sobre esto que nos puede ahorrar mucho tiempo. Es muy potente usar cURL+PHP..

También hay herramientas, gratis o de pago, con las que hacer auditorías o sacar esta información. Pero imagina que necesitas rizar el rizo, guardando esta información para combinarla creando sitios web, o secciones de tu sitio web. Quizá simplemente quieres recorrer tu propia web para forzar que se guarde en caché, así irá más rápido cuando venga el robot indexador de Google o Bing. Quizá quieres inyectar información de productos en tu web a partir de feeds de datos de productos de los distribuidores. O quizá simplemente quieres comprobar que los enlaces están bien sin tener que esperar a esa herramienta de pago que tienes contratada. Quizá simplemente quieres hacer un bot que entre todos los días en una web, y le de a un botón cada hora. O quizá simplemente quieras ahorrarte un dinero todos los meses, haciendo experimentos de paso. Si no quieres depender del ‘hasta donde puede llegar’ una herramienta comercial, tendrás que desarrollar algo a medida de lo que necesites.


Qué es realmente la Accesibilidad Web, el responsive design, el mobile-first.. una puesta al día con Bootstrap

2017-07-20 - Categorías: General
Usuarios por dispositivo mes a mes año pasado

Este post es una puesta al día sobre herramientas de desarrollo, el mobile-first, el responsive, y la accesibilidad en la web. Es una puesta al día con esta herramienta de desarrollo web para proyectos mobile-first. Hablo de Bootstrap, que como reza en su web, es muy popular desde hace años:

Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.

Si tienes una plantilla contruída sobre Bootstrap, ya tienes una página preparada para todo tipo de dispositivos. Esta herramienta creada por Twitter es todo un referente desde hace años. Puede que tu web esté mejor o peor hecha, pero si tienes Bootstrap, ya tienes un buen punto de partida. Y una de las herramientas de mayor renombre. Así que si no lo has tenido en cuenta, ya es hora de cambiar el chip, y empezar a pensar de otra forma.

¿Qué es la Accesibilidad Web?

Si vamos al origen de la creación de la Web. No hablo de la creación de Internet, sino de la creación de la web. La web se creó en su origen para dar un acceso universal a la información. Normalmente se asocia la accesibilidad exclusivamente a las personas con alguna discapacidad, pero en la web, esto cobra un sentido más amplio. Aquí se añaden más variables, como pueden ser la resolución de pantalla, la capacidad de procesamiento, el software del navegador, el lenguaje del usuario, la velocidad de conexión, su ubicación geográfica, etc..

Es decir, que la Accesibilidad toma un concepto más amplio en la Web, que el que normalmente puede tomar fuera de Internet. Aquí entra en gran medida conceptos que repercuten directamente en el posicionamiento de la web, en la usabilidad. Entran conceptos que van a repercutir directamente en el éxito o fracaso, en mayor o menor medida, de los proyectos web.

Más información aquí, donde derivan a su vez a la WAI o al W3C: http://accesibilidadweb.dlsi.ua.es/?menu=definicion

Resumiendo, que sí que es muy importante la Accesibilidad Web, el diseño sensible al dispositivo y diseñar tu web pensando en los usuarios que nos visitan desde un móvil. Pensemos en que los robots de Google, o de cualquier otro buscador, necesitan que tu web sea accesible. Estos robots son entes ciegos, algunos tienen serias limitaciones de software, quizá no pueden ejecutar ciertas tecnologías como Javascript. Algo parecido a como puede pasar con los visitantes de un móvil de gama baja, con ordenadores antiguos, o con usuarios con velocidades de conexión lentas.

Muchas de estas restricciones las tenemos en los dispositivos móviles. Y si a esto le sumamos que cada día más personas andamos movilizados, ya tenemos un cóctel explosivo si es que todavía no nos hemos esforzado en esto.

Estado actual de las visitas desde móvil

No lo digo yo, sino que los creadores de la web, la WAI o el W3C llevan tiempo previniendo. Sino que Google lleva tiempo también dándole cada vez más importancia. Dejo aquí un par de ejemplos de cómo van aumentando las visitas desde dispositivos móviles. Primero mes a mes en un proyecto, quizá es por el verano que la gente usa más el móvil..

Usuarios por dispositivo mes a mes

Aquí es donde tuve más curiosidad. ¿Sólo será por el verano? Así que miré que pasaba con respecto al año pasado..

Usuarios por dispositivo mes a mes año pasado

Es un poco alarmante cómo van creciendo las visitas desde móvil, aunque ya ha sido anunciado a voces. Menos mal que tenemos el proyecto hecho con un diseño con Bootstrap 😉 A partir de aquí lo siguiente es ya pensar en que todos los visitantes son dispositivos móviles y exprimir nuestro proyecto haciendo los ajustes necesarios. Hazlo que seguro que merece la pena..

Haciendo unos ajustes en Bootstrap con SASS y LESS

Después de toda la teoría, más de un buen maquetador me había recomendado usar SASS y LESS. Así que ya voy a ir al grano para presentar estas tecnologías y cómo configurar un entorno de trabajo con Atom Editor y así ser más productivos en nuestro desarrollo mobile-first.

SASS y LESS son preprocesadores de hojas de estilo. Con estas tecnologías podemos simplificar la construcción de hojas de estilo CSS. Así, podemos añadir variables, funciones, anidar selectores de estilos.. siendo más productivos y teniendo un proyecto más mantenible a la larga. La idea es construir unos pocos ficheros, que se procesan, y generan el estilo resultante.

En Atom Editor tenemos dos auto-compiladores que funcionan muy bien, comprobado 😉 son el llamado sass-autocompile y el less-autocompile. No hay más que ir a la sección de instalación de paquetes de nuestro Atom Editor, buscar e instalar.

Atom Editor SASS autocompiling

Como se puede ver en la imagen, se puede descargar una versión de Bootstrap preparada para usar SASS. Todos los ficheros tienen la extensión .scss porque son de SASS. Así que con un fichero styles.scss podemos reprocesar nuestro Bootstap para modificar el thema propio. En el momento en que se graba el fichero styles.scss, Atom Editor detectará que es un fichero .scss que procesar, y automáticamente generará el fichero styles.min.css listo para incluir en el HTML. En el fichero styles.scss de SASS, lo que tenemos es que, se modifican algunas cosas de los estilos de Bootstrap y a su vez se importan. Es decir, que todos los estilos estarán incluidos en una sola hoja de estilos, y finalmente el navegador sólo tendrá que descargarse un único fichero .css con todo unificado y comprimido.

Lo mismo funciona para LESS, es la misma idea, aunque la sintaxis es distinta. Algunos recomiendan SASS para los principiantes, pero realmente con la documentación a mano no veo ningún inconveniente a trabajar con LESS.

Unos enlaces relacionados

No debería de dejar enlaces, porque puede que te vayas de la web. Pero el objetivo de este post es echar un cable, así que ahí van xD

http://getbootstrap.com/
http://sass-lang.com/
http://lesscss.org/
https://atom.io/
https://atom.io/packages/sass-autocompile
https://atom.io/packages/less-autocompile

Si estás empezando un nuevo proyecto, te pueden ser interesantes un par de webs con temas desarrollados en Bootstrap:

https://bootswatch.com/
https://startbootstrap.com/

Terminando

Poder definir variables, anidar estilos, etc.. le da mucha potencia a la maquetación. Si a esto le añadimos lo que comentaba al principio, pensando en los dispositivos móviles, podemos ajustar nuestra plantilla, para que sea lo más accesible desde cualquier tipo de dispositivo..


La pregunta del millón: ¿Magento, Prestashop, WordPress, Symfony, PHP a pelo..

2017-07-04 - Categorías: General / Magento / PHP / Prestashop / Symfony / WordPress
LaPreguntaDelMillon

Es el gran dilema en el desarrollo de aplicaciones web. Te hablan sobre un proyecto; con unos requerimientos, unas especificaciones. Debes elegir con las premisas que te dan: presupuesto, tiempo de entrega, calidad, flexibilidad, mantenibilidad, practicidad.. ¿Existe ya una solución para el proyecto? ¿Se puede partir de un CMS y modificarlo? ¿Son demasiadas las modificaciones que se van a hacer al CMS? ¿Es viable partir de un framework de calidad? ¿Buscamos máxima calidad, o menor precio? ¿Hay muchos desarrolladores disponibles en el mercado para mantener el proyecto?

Continuar leyendo..

Magento: modificar comportamientos mediante eventos y observadores

2017-06-16 - Categorías: General
Magento logo

Una de las formas más interesantes de modificar el comportamiento de tu Magento es utilizar los eventos. Se ejecutan en cada click del navegador, cuando un visitante se registra, cuando se añade un producto al comparador, cuando se crea un pedido, cuando se visita una página, una categoría, un producto, cuando un visitante entra a su zona de usuario, edita sus datos, busca contenidos.. es ingente la cantidad de eventos. Es decir, que contínuamente se están disparando una tonelada de eventos mientras que se ejecuta Magento.

Cuando empiezas a programar nuevos comportamientos, puedes buscar en StackOverflow o Googleando. A ver cuál es el evento que necesitas. Con la esperanza de que alguien haya compartido ya algo sobre esto..

Continuar leyendo..

GNU/Linux: en qué gasto el espacio del disco duro

2017-04-24 - Categorías: General / GNU/Linux
GNULinux

¿Qué hacemos si nuestro duro se esta llenando en un sistema GNU/Linux? Lo primero será encontrar qué ficheros, o más bien qué directorios, son los que más ocupan para ir borrando o moviendo lo ficheros.

Hoy traigo un pequeño HOWTO para encontrar en qué se nos va el espacio más rápido, desde línea de comandos. Si estás en un ordenador personal te ahorrará tiempo, y si estás en un servidor remoto no hay otra manera.

Continuar leyendo..

SEO técnico, ponle nota a tu web

2017-04-10 - Categorías: Amazon Web Services / General / GNU/Linux / Magento / PHP / Prestashop / SEO / Symfony / WordPress
Alexa up

Montar una web con lo imprescindible, ponerle el contenido y diseño, y olvidarnos de ella.. sería como comprarnos un coche y ya no preocuparnos nunca por pasarle una revisión. Sería como si nos diera igual si hay una bajada de potencia del motor, que las ruedas no estuvieran bien hinchadas. Quizá una bujía deja de dar los chispazos al 100%..

Y no sólo están los problemas de mal-funcionamiento, sino que quizá también hay algunas mejoras extras. No todo viene de casa, y puedes hacer que el coche vaya mejor. ¿Porqué no entonces dedicarle ese tiempo a nuestra web para revisar esas cosas? Es más, ¿porqué no poner a un mecánico que sepa lo que está haciendo? Está claro que nos podemos quedar tal cual, nuestro coche andará. Pero queremos que no le falte esa alegría, que responda sin pereza. Resumiendo, queremos que la maquinaria esté bien engrasada, sacando el 100% de su rendimiento. Entonces necesitaremos a un especialista que toque, pero no de oídas, sino que sepa lo que está tocando.

Continuar leyendo..

Programar copias de seguridad diarias con Webmin+Virtualmin

2017-03-30 - Categorías: Amazon Web Services / General / GNU/Linux

Una de las tareas de servidor más comunes, o lo debería ser, es la copia de seguridad de los archivos. Si no queremos tener más problemas que los necesarios nos conviene tener una copia. Así que aquí estoy de nuevo escribiendo sobre Virtualmin, este gran proyecto Open Source que nos brinda una brillante interfaz de usuario web. Traigo un pequeño HOWTO para programar las copias de seguridad con este software.

Continuar leyendo..

Cómo hacer un píxel de conversión

2017-03-24 - Categorías: General
Pixel de conversión, chocolate cookie

Imagina que contratas a una persona para que te haga publicidad en varias webs. Llegas a un acuerdo de darle un monto por cada visita que llega a través de la publicidad que te hace. O un porcentaje por venta que llega de su web. Pero ¿cómo saber si este comprador que ha llegado a tu web viene de haber visto la publicidad de esta persona que te publicita?

Esto se puede hacer con los llamados píxeles de conversión. Simple y llanamente son páginas web que estan en el servidor de tu negocio que se dedican a enviar cookies, incrustándose en las páginas que te hacen publicidad mediante iframes o llamadas de Javascript. Entonces, si alguno de dichos visitantes llega a tu negocio con una de esas cookies, ya sabes que ha visitado la web que te está haciendo publicidad y le darás las gracias con razón 😉

Continuar leyendo..

Salvando mis archivos en la nube con Mega

2017-03-19 - Categorías: General / GNU/Linux

Una de las alternativas de almacenamiento en la nube más prometedoras es Mega. Proviene de la antigua Megaupload, de la mano de Kit Dotcom, fundador de Megaupload. Lo pusieron en marcha Kim junto a su equipo de trabajo, parece que como respuesta al cierre y confiscado de Megaupload debido a la piratería. Mega puede parecer algo novedoso, sin embargo, no es más que el mismo sistema de almacenamiento en la nube de archivos pero mucho más elaborado que el anterior. Salió al mercado hace ya cuatro años, en el 2013. Fue tanta la expectativa que hubo millones de usuarios que se registraron en muy poco tiempo hasta colapsar sus servidores. A día de hoy Kim Dotcom se ha desvinculado del proyecto, y navegando un poco puedo leer reseñas que hablan que hay alrededor de 50 millones de usuarios registrados en Mega.

Sus principales bazas en el mercado del almacenamiento en la nube han sido dos: los famosos 50 Gigas gratis, y su esfuerzo por la privacidad de los usuarios.

Continuar leyendo..

Magento: cómo hacer overriding de las plantillas .phtml del backend

2017-02-27 - Categorías: General / Magento / PHP
Magento logo

Es ingente la cantidad de cosas que se pueden hacer en un Magento recién instalado. Es un CMS orientado al eCommerce muy completo. También muy orientado a la optimización para motores de búsqueda (SEO). Tiene muchas características que le dotan de gran flexibilidad. Entre ellas es la «sencilla» forma de ampliar funcionalidades sin que nada se rompa. Siempre claro, que hagamos lo que en programación se llama overriding. De esta forma, no tocaremos los ficheros originales, ampliando o modificando su funcionamiento en otro espacio de trabajo.

Qué es hacer overriding

Es la forma correcta de hacer las cosas. Si queremos modificar o ampliar funcionalidades de un CMS, lo que siempre debemos de hacer es overriding. Por ejemplo, en WordPress es bastante habitual encontrarte con plantillas que se han modificado. Si se han modificado con el editor que te trae WordPress en el mismo panel de control, sin antes haber hecho una plantilla hija de la original, el problema es que esto no es hacer overriding. Y cuando vamos a actualizar la plantilla.. ¡zasca! se borran todos los cambios hechos.

Continuar leyendo..

PHP7: paralelizando procesos, aprovechando el procesador al 100%

2017-02-06 - Categorías: General / GNU/Linux / PHP
php7-logo

Igual que en otros lenguajes de programación, aquí en PHP también tenemos disponibles funciones del estándar POSIX para gestionar procesos, obtener información de ellos, hacer colas FIFO, enviar señales, hacer procesos hijos, esperar a que terminen unos para continuar otros, matarlos.. etcétera. Todo esto te dará lo que necesitas para pasar de una programación lineal, paso a paso, a una programación concurrente, paralelizando los procesos.

Esto se usa desde línea de comandos. No recomiendan en absoluto que se active y se use esto sobre servidor web, ya que los servidores web tienen sus propias estrategias de paralelización. Pero si como yo, has estado trabajando desde línea de comandos con este tema. Y has llegado a tareas que tardan mucho tiempo y se lanzan desde línea de comandos. Con esto podrás lanzar en paralelo todas las tareas que necesites, así aprovecharás todos los núcleos del procesador, y terminará antes el proceso completo.

Necesitarás tener activado el módulo PCNTL en PHP. Para saber si ya lo tienes activado ejecuta php -i, si no edita el php.ini para activarlo.. En PHP7 ya me venía activado. Con esto te evitas también la engorrosa instalación de Pthreads recompilando PHP con ZTS, además de la instalación posterior de Pthreads. Simplemente usando el mencionado PCNTL..

Continuar leyendo..

Prestashop 1.7: las apariencias engañan, muchos cambios donde no se ve

2017-01-23 - Categorías: General / Prestashop
Prestashop back-end inicio

El 7 de noviembre de 2016 se publicó la nueva versión 1.7 de Prestashop. Esta versión trae un remake del 100% del core, reescrito con Symfony. Cuando leí sobre esto, empezó a intrigarme más y más. Quería ver cómo iba este proyecto. Pasó por mis manos un proyecto que funciona en Prestashop 1.6, ¡qué lástima!, no íbamos a actualizarlo. Pero ahora sí, tenemos entre manos un nuevo proyecto, y tenemos que estimar a ver si lo montamos sobre Prestashop 1.7. Así que manos a la obra..

Continuar leyendo..

© 2024 JnjSite.com - MIT license

Sitio hecho con WordPress, diseño y programación del tema por Jnj.