Editores de Texto HTML

¿En Donde se Escribe el Codigo HTML?

En este tutorial les voy a mostrar en donde se puede escribir código HTML, las páginas web se pueden crear y modificar con Editores HTML profesionales.

Pero para empezar a aprender se puede utilizar cualquier editor de texto como el bloc de notas en windows, el editor de texto en Mac o con gedit en Linux.

Lo que tienen que hacer es simplemente escribir el código html en texto plano y guardar el archivo, pueden ponerle cualquier nombre, usualmente suelen nombrarlo index.html pero da igual, lo importante es guardarlo con la extensión ".html".

Lo pueden guardar en el escritorio, en documentos o en donde ustedes prefieran es recomendable guardar el archivo en una carpeta nueva, en la cual se deben guardar los archivos de CSS, Java, PHP, etc, y una carpeta con imágenes para utilizarlas en el proyecto de la creación de una pagina web, esto lo veremos más adelante.

Pero si quieren escribir el código de manera más profesional existen múltiples editores de texto profesionales, como Visual Estudio Code, Brackets, Sublime Text, Notepad++, Apta Estudio, Atom etc, la mayoría es de paga o sea que tiene que comprar la licencia para usarlos, también los hay gratuitos pero más limitados en sus funciones.

Pueden buscar en Google editores de texto y encontrarán múltiples opciones, pueden probar el que mejor les acomode, yo uso y recomiendo el editor de texto "Atom" que es gratuito y de los más completos y más usados al día de hoy además es multiplataforma compatible con Windows, Mac, y Linux, lo pueden descargar gratis desde su pagina oficial aqui ⇨ Atom.io

¿Que es Atom?

Atom es un editor de texto de código libre, creado por GitHub la comunidad más grande de desarrollo de softwer de código libre en internet, Atom es un editor de texto en el cual puedes escribir código para múltiples lenguajes de programación.

El cual pueden personalizar completamente a su antojo, cambiando su apariencia como el tema y la fuente e iconos, pero ese es otro tema pueden encontrar en la página de Atom y en google tutoriales de como personalizar y utilizarlo correctamente.

¿Como Crear y Guardar Documentos con Atom?

Teniendo abierto el editor de texto tienen que dar clic en el menú de navegación del editor en donde dice "File", (Archivo en Español) y les mostrara varias opciones.

Lo normal es que al abrir el editor automáticamente se crea un archivo sin título "untitled" si no les aparece entonces den clic en "New File" y se les creara el archivo sin título,
para guardarlo tienen que dar clic en "Save As" (Guardar como, en Español) en la siguiente imagen pueden ver como encontrar estas opciones.

Al hacer clic en "Save As" se les abrirá una ventana con los directorios de su sistema operativo ya sea Windows, Mac o Linux, para guardar su archivo o documento, puede guardarlo ya sea en el Escritorio o en Documentos, o donde ustedes prefieran, recuerden que es recomendado guardarlo en una carpeta nueva.

El guardar como, lo que nos esta indicando es mas que nada que tipo de documento queremos guardar, más allá del nombre del documento lo importante es la extensión o formato del documento, las extensiones indican el tipo de documento que se está creando.

Ejemplos de Extensiones o Formatos:
.txt (Texto plano o normal), .html, .css, .js, .php, etc, etc.

El nombre de la carpeta como el del documento siempre es recomendable escribirlo en letras minúsculas y si el nombre tiene varias palabras, se deben separar con guiones bajos "_".

Ejemplos: 
Carpetas
mi_pagina_web, proyecto_html 

Documentos
mi_primer_pagina.html, pagina_web.html 

Yo uso el sistema operativo Linux, especificamente la distribucion de Ubuntu, en la siguiente imagen les muestro que voy a guardar mi documento html en el directorio Documentos en una nueva carpeta llamada ejemplos_html con el nombre mi_primer_pagina.html, teniendo listo el nombre y el lugar en donde guardar nuestro documento solo hacemos clic en la parte de abjo en guardar.

Una vez ya guardado nuestro documento nos aparecerá en la parte izquierda del editor la carpeta y el documento guardado y en la parte derecha encontraran la ventana del editor con el documento html abierto y listo para escribir el código html dentro del documento como se muestra en la siguiente imagen.

    

Resumen

Como les he dicho en este tutorial el código HTML se puede escribir en cualquier editor de texto siempre y cuando nos de la posibilidad de guardar documentos o archivos con la extensión .html.

A si como escribir código de una manera más profesional con editores de texto profesionales como Atom, en cualquier editor de texto los pasos que les mostré arriba es igual, con algunas diferencias en la posición de los comandos de los menús en los demás editores.

En el siguiente tutorial les mostrare la estructura básica de un documento HTML y algunos trucos para escribir más rápido el código en Atom.
Saludos y que estén bien, nos leemos en el siguiente tutorial, hasta la proxima Amigos.
   
    

<< Anterior

Siguiente >>