Analizando un sitio web para encontrar las directivas a utilizar al hacer un web scrapping

Contenido del curso

Introducción

Web scraping

Pandas

Intro a Sistemas de Datos

Contenido Bonus

38
¿Por qué usar la nube?
04:05 min

Tomar examen

Cursos Empresas Blog Live Conf Eventos Precios

0:005:54

Analizando un sitio web para encontrar las directivas a utilizar al hacer un web scrapping

Curso de Ingeniería de Datos con Python

Clase 14 de 38

Clase 14 / 38

Recursos

Aprende a identificar y extraer la información clave de páginas de noticias con selectores de CSS. A partir de HTML como fuente de datos semiestructurados, verás cómo localizar los vínculos, el título y el cuerpo del artículo usando el inspector del navegador y queries simples, tomando como ejemplo El Universal.

¿Qué es lo esencial para crear scrapers con selectores CSS?

Para construir scrapers efectivos, lo primero es entender la estructura intrínseca del HTML. No todo el contenido importa por igual: imágenes, columnas y resúmenes son secundarios si tu objetivo es capturar enlaces reales a noticias y, dentro de cada nota, su H1 y el texto del artículo.

Datos semiestructurados: HTML con jerarquías y clases útiles para consultas.
Queries: selecciones específicas que devuelven solo lo que necesitas.
Selectores de CSS: el “lenguaje” para consultar la estructura HTML.
Inspector del navegador: usa Inspect para ver etiquetas, clases y jerarquías.
Generalización: la estructura cambia entre periódicos, hay que adaptarse.

¿Cómo identificar vínculos reales en la homepage?

El truco es observar dónde viven los enlaces dentro del HTML. Al inspeccionar un vínculo, se ve que está dentro de un H1 con la clase “field content”. Otro enlace puede estar dentro de un H2 con la misma clase. Lo importante: la clase se repite y el enlace es la etiqueta a dentro de ella. Así, una query CSS apunta a esos a anidados.

¿Qué queries extraen los enlaces de interés?

Según la observación, puedes seleccionar los enlaces con una clase repetida y el elemento a descendiente.

.field content a

Selecciona los vínculos dentro de contenedores con clase “field content”.
Funciona para H1 y H2 si comparten la misma clase contenedora.
Útil para listar enlaces de la página de inicio.

Nota práctica: si cambias de periódico, la estructura puede variar. Es normal repetir el análisis y ajustar los selectores.

¿Cómo obtener el título y el cuerpo del artículo?

Dentro de una noticia, el H1 no siempre trae clase propia. La clave está en el contenedor que lo envuelve. Además, el cuerpo aparece como una lista de párrafos dentro de un div con una clase específica.

¿Qué selector usar para el título H1?

El H1 está dentro de un div con clase “pain content”. La estrategia: seleccionar el contenedor por clase y luego el H1 que contiene.

.pain content H1

Encuentra el título principal de la nota.
Se apoya en el contenedor en lugar del H1 directamente.

¿Cómo capturar el texto del artículo completo?

El contenido de la nota aparece dentro de un div con clase “field name body”. Seleccionarlo te da acceso al texto completo del artículo.

field name body

Devuelve los párrafos que conforman el cuerpo.
Ideal para extraer y limpiar el contenido final.

¿Cómo validar, adaptar y pedir ayuda?

Cada sitio organiza su HTML de forma diferente. La práctica recomendada es probar tus queries y verificar que devuelvan exactamente lo que buscas. Si no te sientes cómodo con selectores, las clases de desarrollo web ayudan, porque en la web los estilos y la selección por CSS son fundamentales.

¿Cómo confirmar que tus queries funcionan?

Prueba los selectores en el inspector del navegador.
Revisa que los resultados coincidan con los vínculos y textos deseados.
Ajusta y vuelve a probar hasta aislar los elementos correctos.

¿Qué compartir para mejorar tus resultados?

Indica qué periódico trabajas y cómo varía su estructura.
Comparte las queries que usas para la front page, el título y el cuerpo.
Deja dudas y comentarios en el sistema de comentarios para recibir ayuda.

¿Tienes avances u obstáculos con tus selectores de CSS? Cuéntanos qué periódico usas, qué queries intentaste y qué obtuviste. Así podemos ayudarte a mejorar tu scraper paso a paso.

Resumen

¿Qué es lo esencial para crear scrapers con selectores CSS?

Datos semiestructurados: HTML con jerarquías y clases útiles para consultas.
Queries: selecciones específicas que devuelven solo lo que necesitas.
Selectores de CSS: el “lenguaje” para consultar la estructura HTML.
Inspector del navegador: usa Inspect para ver etiquetas, clases y jerarquías.
Generalización: la estructura cambia entre periódicos, hay que adaptarse.

¿Cómo identificar vínculos reales en la homepage?

¿Qué queries extraen los enlaces de interés?

Según la observación, puedes seleccionar los enlaces con una clase repetida y el elemento a descendiente.

.field content a

Selecciona los vínculos dentro de contenedores con clase “field content”.
Funciona para H1 y H2 si comparten la misma clase contenedora.
Útil para listar enlaces de la página de inicio.

Nota práctica: si cambias de periódico, la estructura puede variar. Es normal repetir el análisis y ajustar los selectores.

¿Cómo obtener el título y el cuerpo del artículo?

¿Qué selector usar para el título H1?

El H1 está dentro de un div con clase “pain content”. La estrategia: seleccionar el contenedor por clase y luego el H1 que contiene.

.pain content H1

Encuentra el título principal de la nota.
Se apoya en el contenedor en lugar del H1 directamente.

¿Cómo capturar el texto del artículo completo?

El contenido de la nota aparece dentro de un div con clase “field name body”. Seleccionarlo te da acceso al texto completo del artículo.

field name body

Devuelve los párrafos que conforman el cuerpo.
Ideal para extraer y limpiar el contenido final.

¿Cómo validar, adaptar y pedir ayuda?

¿Cómo confirmar que tus queries funcionan?

Prueba los selectores en el inspector del navegador.
Revisa que los resultados coincidan con los vínculos y textos deseados.
Ajusta y vuelve a probar hasta aislar los elementos correctos.

¿Qué compartir para mejorar tus resultados?

Indica qué periódico trabajas y cómo varía su estructura.
Comparte las queries que usas para la front page, el título y el cuerpo.
Deja dudas y comentarios en el sistema de comentarios para recibir ayuda.

¿Tienes avances u obstáculos con tus selectores de CSS? Cuéntanos qué periódico usas, qué queries intentaste y qué obtuviste. Así podemos ayudarte a mejorar tu scraper paso a paso.

Introducción

Pipelines automatizados con Python para ingeniería de datos

Archivos del curso y Slides

¿Qué es la ciencia de datos?

Por qué fallan los equipos de ciencia de datos

Configuración del ambiente

Jupyter Notebooks

Tipos de datos en ciencia de datos

Tipos de datos

Fuentes de datos

ETL: extract, transform y load explicado

Web scraping

Web scraping para data engineers: HTML y metadatos

Cómo hacer solicitudes HTTP con Python Requests

¿Cómo trabajar con un documento HTML?

Analizando un sitio web para encontrar las directivas a utilizar al hacer un web scrapping

Page Object Pattern para web scrapers

Implementando nuestro web scrapper: Configuración

Page Objects para extraer vínculos de noticias

Implementando nuestro web scrapper: Obteniendo artículos

Obtención de datos del Artículo

Persistiendo la información "scrapeada"

Pandas

Series vs DataFrame en Pandas

Qué es Series en Pandas y cómo crearlas

Estructura de datos: DataFrames

Índices y selección

Data wrangling con Pandas

Creación de la receta: preparando la automatización

Cómo rellenar datos faltantes en Pandas con regex

Pandas .loc y regex para títulos faltantes

Limpiando detalles adicionales

Generar UUIDs con MD5 en pandas

Enriquecimiento de los datos

Eliminación de duplicados con drop_duplicates en Pandas

Creando tu receta de limpieza de datos

Visualización de datos

Intro a Sistemas de Datos

Introducción a los sistemas de datos

Automatización del Pipeline

Carga de CSV a SQL con SQLAlchemy y pandas

Contenido Bonus

¿Por qué usar la nube?

Analizando un sitio web para encontrar las directivas a utilizar al hacer un web scrapping