jueves, 5 de noviembre de 2026

10 comandos de Linux que todo usuario de Ubuntu debería conoce

Linux es un sistema operativo muy completo y una de sus herramientas más útiles es el terminal. Aunque al principio pueda parecer complicado, conocer algunos comandos básicos puede facilitarnos muchas tareas del día a día.

Si utilizas Ubuntu o cualquier otra distribución basada en Linux, estos 10 comandos te ayudarán a gestionar archivos, instalar programas, consultar información del sistema y solucionar pequeños problemas.

No necesitas ser un experto para empezar. ¡Vamos allá!

1. Actualizar la lista de paquetes

Uno de los primeros comandos que conviene conocer es apt update.

Este comando permite actualizar la información de los repositorios de software para que Ubuntu conozca las últimas versiones disponibles de los programas.

TERMINAL · LINUX
sudo apt update

Es recomendable ejecutarlo antes de instalar nuevos programas o actualizar el sistema.

2. Actualizar los programas instalados

Una vez actualizada la información de los repositorios, podemos instalar las actualizaciones disponibles con:

TERMINAL · LINUX
sudo apt upgrade

El sistema mostrará los paquetes que pueden actualizarse y solicitará confirmación antes de continuar.

Es una buena práctica mantener el sistema actualizado para disfrutar de mejoras y correcciones de seguridad.

3. Consultar los archivos de una carpeta

El comando ls permite mostrar el contenido de un directorio.

TERMINAL · LINUX
ls

Si queremos obtener información más detallada, podemos utilizar:

TERMINAL · LINUX
ls -lah

De esta forma veremos también los archivos ocultos, los permisos, el tamaño y la fecha de modificación.

4. Cambiar de directorio

Para desplazarnos entre carpetas utilizamos el comando cd.

Por ejemplo:

TERMINAL · LINUX
cd Documentos

Si queremos regresar al directorio anterior podemos utilizar:

TERMINAL · LINUX
cd ..

Y para volver directamente a nuestra carpeta personal:

TERMINAL · LINUX
cd ~

5. Conocer la ruta actual

¿Alguna vez has abierto el terminal y no sabes exactamente en qué carpeta te encuentras?

Para resolverlo tenemos el comando:

TERMINAL · LINUX
pwd

Este comando muestra la ruta completa del directorio en el que estamos trabajando.

6. Crear una carpeta nueva

Crear directorios desde el terminal es muy sencillo. Solo tenemos que utilizar mkdir seguido del nombre que queremos darle.

TERMINAL · LINUX
mkdir nueva_carpeta

También podemos crear varias carpetas dentro de una misma ruta utilizando:

TERMINAL · LINUX
mkdir -p proyectos/linux/tutoriales

7. Copiar archivos

El comando cp sirve para copiar archivos y directorios.

Por ejemplo, para copiar un archivo de texto:

TERMINAL · LINUX
cp documento.txt copia.txt

Si queremos copiar una carpeta completa con su contenido, podemos utilizar:

TERMINAL · LINUX
cp -r carpeta_original carpeta_copia

Conviene comprobar siempre las rutas de origen y destino antes de ejecutar el comando.

8. Mover o cambiar el nombre de archivos

Para mover archivos o cambiarles el nombre utilizamos mv.

Por ejemplo, para cambiar el nombre de un archivo:

TERMINAL · LINUX
mv documento.txt documento_nuevo.txt

Y para moverlo a otra carpeta:

TERMINAL · LINUX
mv documento.txt Documentos/

Es una herramienta muy práctica para organizar nuestros archivos desde el terminal.

9. Consultar el espacio disponible en el disco

Si queremos saber cuánto espacio tenemos libre en nuestras unidades de almacenamiento, podemos utilizar:

TERMINAL · LINUX
df -h

La opción -h muestra los tamaños en un formato fácil de interpretar, como GB o MB.

También podemos consultar cuánto ocupa una carpeta concreta mediante:

TERMINAL · LINUX
du -sh ~/Documentos

10. Consultar los procesos del sistema

Para conocer los procesos que están ejecutándose en nuestro ordenador podemos utilizar:

TERMINAL · LINUX
top

Se mostrará información sobre el uso de la CPU, la memoria RAM y los procesos activos.

Para salir de esta pantalla interactiva basta con pulsar la tecla q.

Si prefieres una herramienta con una presentación más visual, también puedes instalar htop:

TERMINAL · LINUX
sudo apt install htop

Conclusión

Estos 10 comandos son un buen punto de partida para cualquier persona que quiera empezar a utilizar Linux y Ubuntu con mayor soltura.

El terminal puede parecer intimidante al principio, pero con un poco de práctica se convierte en una herramienta muy útil para administrar nuestro ordenador y realizar tareas de forma rápida.

Si estás empezando con Linux, te recomiendo practicar estos comandos poco a poco y consultar siempre la documentación antes de ejecutar instrucciones que puedan modificar archivos importantes o la configuración del sistema.

¿Conoces algún otro comando de Linux que consideres imprescindible? ¡Déjalo en los comentarios!

```

sábado, 30 de noviembre de 2024

Párrafos (etiqueta

) y Formato del Texto:

 La etiqueta <p> define un párrafo. Puedes usar otras etiquetas dentro de los párrafos para dar formato, como negrita, cursiva o subrayado.

Negrita (Etiqueta <strong> o <b>):

  • <strong>: Indica texto importante (semánticamente relevante).
  • <b>: Solo aplica el estilo visual sin semántica.

Ejemplo:

<p>Este es un texto <strong>importante</strong>.</p> <p>Este texto está en <b>negrita</b>.</p>

Cursiva (Etiqueta <em> o <i>):

  • <em>: Indica énfasis en el texto.
  • <i>: Solo aplica el estilo visual.

Ejemplo:

<p>Este texto tiene un <em>énfasis especial</em>.</p> <p>Este texto está en <i>cursiva</i>.</p>

Subrayado (Etiqueta <u>):

Para subrayar texto.

<p>Este texto está <u>subrayado</u>.</p>

Combinación de estilos:

Puedes combinar varias etiquetas para un formato más complejo.

<p>Texto <strong>en negrita</strong> y <em>cursiva</em>, además de estar <u>subrayado</u>.</p>

viernes, 29 de noviembre de 2024

Estructura Básica de un Documento HTML

```html

Estructura básica de HTML: cómo organizar una página web

HTML (HyperText Markup Language) es el lenguaje que utilizamos para definir la estructura y el contenido de una página web. Gracias a sus etiquetas podemos organizar textos, imágenes, enlaces, formularios y otras partes de un sitio.

Un documento HTML sigue una estructura jerárquica. Cada sección tiene una función concreta y ayuda al navegador a interpretar correctamente el contenido.

En este artículo vamos a conocer la estructura básica de un documento HTML y las etiquetas principales que debemos utilizar.

1. Estructura básica de un documento HTML

Toda página HTML comienza con una declaración que indica al navegador que estamos utilizando HTML5. A continuación, encontramos las etiquetas principales que organizan el documento.

Ejemplo de una estructura HTML básica:

HTML · ESTRUCTURA BÁSICA
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mi página web</title>
</head>
<body>

    <header>
        <h1>Bienvenido a mi página</h1>
    </header>

    <main>
        <p>Este es el contenido principal de mi página web.</p>
    </main>

    <footer>
        <p>© 2026 Mi sitio web</p>
    </footer>

</body>
</html>

Aunque al principio pueda parecer mucho código, cada etiqueta cumple una función. Vamos a verlas por separado.

2. La etiqueta <head>: información del documento

La etiqueta <head> contiene información sobre la página que no se muestra directamente en el contenido visible. Incluye datos que ayudan al navegador a interpretar el documento y recursos necesarios para su funcionamiento.

Entre sus elementos más habituales encontramos:

  • <title>: establece el título que aparece en la pestaña del navegador.
  • <meta charset="UTF-8">: indica la codificación de caracteres para mostrar correctamente letras, tildes y símbolos.
  • <meta name="viewport">: ayuda a adaptar la página a diferentes tamaños de pantalla.
  • <link>: permite enlazar archivos externos, como hojas de estilo CSS.
  • <script>: permite incorporar o enlazar código JavaScript.

Ejemplo:

HTML · HEAD
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mi página web</title>
    <link rel="stylesheet" href="estilos.css">
</head>

Es importante recordar que el contenido de <head> no es lo mismo que el contenido visible de la página. Su función es proporcionar información y conectar los recursos del documento.

3. La etiqueta <body>: el contenido visible

La etiqueta <body> contiene los elementos que aparecen en la página y con los que interactúan los visitantes.

Dentro de ella podemos incluir:

  • Textos y encabezados.
  • Imágenes y vídeos.
  • Enlaces y botones.
  • Formularios.
  • Menús de navegación.
  • Secciones y otros elementos de contenido.

Ejemplo:

HTML · BODY
<body>

    <h1>Bienvenido</h1>

    <p>Este es el contenido principal de mi página web.</p>

    <a href="https://www.ejemplo.com">Visitar página</a>

</body>

Todo lo que queramos mostrar directamente al visitante debe encontrarse dentro de esta etiqueta.

4. Etiquetas semánticas de HTML5

HTML5 incorpora etiquetas semánticas que permiten organizar el contenido según la función que desempeña cada sección.

Estas etiquetas hacen que el código sea más fácil de entender y mantener, tanto para los desarrolladores como para las herramientas que interpretan la página.

Las más utilizadas son:

  • <header>: representa la cabecera de una página o sección. Puede contener el logotipo, el título o elementos introductorios.
  • <nav>: agrupa los enlaces de navegación principales.
  • <main>: identifica el contenido principal del documento.
  • <section>: agrupa contenido relacionado dentro de una sección temática.
  • <article>: representa contenido independiente, como una noticia o una entrada de blog.
  • <aside>: contiene información complementaria, como una barra lateral.
  • <footer>: representa el pie de página o el pie de una sección.

Ejemplo de estructura semántica:

HTML · ETIQUETAS SEMÁNTICAS
<body>

    <header>
        <h1>Mi sitio web</h1>
    </header>

    <nav>
        <a href="#inicio">Inicio</a>
        <a href="#articulos">Artículos</a>
        <a href="#contacto">Contacto</a>
    </nav>

    <main>
        <section id="inicio">
            <h2>Bienvenido</h2>
            <p>Contenido de la página.</p>
        </section>

        <article>
            <h2>Mi primer artículo</h2>
            <p>Texto del artículo.</p>
        </article>
    </main>

    <footer id="contacto">
        <p>© 2026 Mi sitio web</p>
    </footer>

</body>

No es obligatorio utilizar todas estas etiquetas en cada página. Debemos elegirlas según el contenido que queramos organizar.

5. ¿Por qué es importante organizar correctamente el HTML?

Una buena estructura HTML aporta varias ventajas:

  • Mejora la accesibilidad: las tecnologías de asistencia pueden interpretar mejor las diferentes partes de la página.
  • Facilita el mantenimiento: el código resulta más sencillo de leer, modificar y ampliar.
  • Ayuda a los buscadores: la estructura semántica aporta contexto sobre el contenido, aunque no garantiza por sí sola un mejor posicionamiento.
  • Favorece el trabajo en equipo: otros desarrolladores pueden comprender más fácilmente cómo está organizada la página.

Conclusión

Conocer la estructura básica de HTML es uno de los primeros pasos para aprender desarrollo web. Las etiquetas <head> y <body> permiten separar la información del documento del contenido visible, mientras que las etiquetas semánticas de HTML5 ayudan a organizar cada sección de forma clara.

No hace falta memorizar todas las etiquetas desde el principio. Lo mejor es practicar creando pequeñas páginas y familiarizarse poco a poco con su estructura.

¡Ahora ya tienes una buena base para empezar a construir tus propias páginas web!

¿Conocías las etiquetas semánticas de HTML5? ¿Qué otras etiquetas utilizas habitualmente? Cuéntanoslo en los comentarios.

```

jueves, 28 de noviembre de 2024

Encabezados HTML

Encabezados (etiquetas <h1> a <h6>):


Los encabezados se utilizan para jerarquizar el contenido, desde el título principal hasta subtítulos menos relevantes.

  • <h1> es el más importante (normalmente único en la página).
  • <h6> es el menos importante.

Ejemplo:

<h1>Título Principal</h1>
<h2>Subtítulo Nivel 2</h2> <h3>Subtítulo Nivel 3</h3> <h4>Subtítulo Nivel 4</h4> <h5>Subtítulo Nivel 5</h5> <h6>Subtítulo Nivel 6</h6>

Los navegadores aplican estilos predeterminados a los encabezados, como tamaños de fuente y negritas, pero puedes personalizarlos con CSS.

miércoles, 27 de noviembre de 2024

Ejemplo Práctico: Receta con HTML, CSS y JavaScript


HTML:

<div id="receta"> <h1>Arroz con Leche</h1> <ul> <li>1kg de arroz blanco</li> <li>3 litros de leche</li> <li>1 limón</li> <li>2 palos de canela</li> </ul> <button onclick="mostrarMensaje()">Ver Consejo</button> </div>

CSS:

#receta { background-color: #fff8e1; border: 1px solid #ddd; padding: 20px; font-family: 'Verdana', sans-serif; }

JavaScript:

function mostrarMensaje() { alert("Recuerda remover la canela antes de servir."); }

Estas ideas no solo enseñan las bases de cada tecnología, sino que también muestran cómo combinarlas para crear páginas funcionales y atractivas.

martes, 26 de noviembre de 2024

JavaScript: Comportamiento e Interactividad

JavaScript es el lenguaje que da vida al HTML. Permite añadir interactividad a las páginas web.

Ejemplo de interacción:

var numClicks = 0; function contarClicks() { numClicks++; if (numClicks > 3) { alert("¡Deja de hacer click!"); } }

Casos de uso:

  • Validar formularios antes de enviarlos.
  • Crear efectos visuales, como animaciones.
  • Cambiar el contenido de la página dinámicamente.

lunes, 25 de noviembre de 2024

CSS: Estilización del Contenido

CSS (Cascading Style Sheets) complementa el HTML definiendo cómo se verá el contenido. Nos permite personalizar colores, tipografía, tamaños, bordes y espacios.

Ejemplo básico:

p { color: red; /* Cambia el color del texto */ }

Aplicaciones comunes:

  • Colores de fondo y texto:
    body { background-color: #f4f4f4; color: #333; }
  • Bordes y márgenes:
    div { border: 2px solid #000; margin: 10px; padding: 5px; }
  • Tipografía:
    h1 { font-family: Arial, sans-serif; font-size: 24px; }