Archivo Index.html: para qué sirve y cómo se crea

Por Felipe

Publicado en:

Si eres novato en diseño o desarrollo web es posible que te preguntes qué es index.html y el motivo por el que aparece en la mayoría de webs. No te preocupes, vamos a darte respuesta a todas tus dudas.

¿Qué es index?

Index.html es la página por defecto dentro de los directorios de los servidores de los sitios webs que se carga siempre que se solicita un dominio y no se especifica el nombre de un archivo específico. En este caso el propio servidor web se encarga de buscar el archivo index.html y mostrarlo al visitante. Así, si por ejemplo tecleamos en nuestro navegador https://www.mipagina.com, nuestro servidor podría estar sirviendo realmente https://www.mipagina.com/index.html.

La palabra index viene del inglés, que significa índice. Si extrapolamos el significado al desarrollo web, index sería la página principal o el home de nuestra web. No obstante, es importante señalar que nuestra página principal puede llamarse de otro modo, ya que podemos configurar el servidor para que busque por defecto otro archivo concreto. Del mismo modo, no es necesario que la extensión sea HTML, que es la extensión más utilizada en sitios estáticos. Si por ejemplo programamos nuestra web en PHP, lo lógico será que tengamos un archivo index.php.

Ten en cuenta que si tenemos un archivo index.php, index.asp, etc., es necesario que el servidor sea capaz de trabajar con estos archivos.

¿Cómo crear un index.html para mi web?

Para crear un index en HTML es necesario utilizar un editor de texto o un entorno de desarrollo. Nuestra página index tendrá la misma estructura que las páginas creadas en HTML:

 

<html>

<head></head>
<body>
         <h1>Esta es mi página index.html</h1>
         <p>Aquí va todo mi contenido de la página inicial que debe cargar mi dominio</p> </body>
</html>

Es necesario tener conocimientos de HTML y de maquetación web para crear la página correctamente. Una vez la tengamos hecha, será necesario dejarla en el directorio raíz del servidor al que apunte nuestro dominio.

¿Cómo sustituir index.html por otra página con .htaccess?

Como mencionábamos anteriormente, es posible configurar nuestro servidor para que cargue una página diferente a index.html por defecto. No obstante, también podemos hacerlo de una forma más sencilla, con un archivo .htaccess.

Es una buena práctica crear un archivo .htaccess en nuestro directorio para crear una configuración, especialmente si tenemos hosting compartido.

El archivo .htaccess se coloca en la raíz del directorio de nuestra web y para cambiar la página de inicio debemos añadir la siguiente línea.

DirectoryIndex mi-index.html index.html index.php

Con esta línea lo que estamos ordenando es que la página de inicio por defecto que se debe tratar de mostrar al usuario final es mi-index.html, en caso de que, por algún motivo no se pueda cargar esta página, lo intentará con index.html y si también hay problemas para cargar esta página, se intentará una vez más mostrando index.php.

 

Ahora ya sabes qué es index.html y para qué sirve, una información muy útil a la hora de comenzar en el desarrollo web. El siguiente paso es aprender a codificar en HTML, así como aprender a aplicar estilos con CSS. ¡Mucho ánimo con tu aprendizaje!