Cómo editar archivos html

Si prefiere llamar a los sitios web a mano, puede editar archivos HTML en un editor de texto básico como Bloc de notas (Windows) o TextEdIt (MacOS). Si prefiere poder mover elementos en la pantalla y ver las vistas previas en vivo, puede usar un WYSIWYG (lo que ve es lo que obtiene) Editor como Dreamweaver o Kompozer. Thysteaches, cómo abrir y editar un archivo HTML en una aplicación estándar o de edición visual.

Pasos

Método 1 de 4:
Usando un bloc de notas en Windows
  1. Imagen titulada Editar archivos HTML Paso 1
1. Haga clic en el botón de inicio de Windows
Imagen titulada WindowsStart.jpg
. Es el botón que tiene un logotipo de Windows en la barra de tareas. Por defecto, está en la esquina inferior izquierda. Esto muestra el menú de inicio
  • Imagen titulada Editar archivos HTML Paso 2
    2. Tipo Bloc. Esto muestra el bloc de notas en el menú de inicio.
  • Imagen titulada Editar archivos HTML Paso 3
    3. Hacer clic Bloc. Tiene un icono que se asemeja a una libreta con una cubierta azul.
  • Imagen titulada Editar archivos HTML Paso 4
    4. Hacer clic Archivo. Está en la parte superior de la barra de menú en el bloc de notas. Esto muestra un menú desplegable. Esto muestra un navegador de archivos que puede usar para abrir archivos en el Bloc de notas.
  • Imagen titulada Editar archivos HTML Paso 5
    5. Hacer clic Abierto. Es la segunda opción en el menú desplegable del archivo.
  • Imagen titulada Editar archivos HTML Paso 6
    6. Seleccione "Todos los archivos" En el menú desplegable Tipo de archivo. Haga clic en el menú desplegable que dice "Documentos de texto (.TXT)" y seleccione "Todos los archivos" En el menú desplegable. Esto muestra todos los tipos de documentos (incluidos los archivos HTML) en el navegador de archivos.
  • Imagen titulada Editar archivos HTML Paso 7
    7. Seleccione un archivo HTML y haga clic en Abierto. Esto abre el documento HTML en el Bloc de notas. Puede editar el código HTML en el Bloc de notas.
  • Alternativamente, puedes Crea un nuevo documento HTML en el bloc de notas.
  • Imagen titulada Editar archivos HTML Paso 8
    8. Editar el código HTML. Para editar HTML en el Bloc de notas, deberá aprender html para que puedas editarlo a mano. Elementos comunes que puede editar incluyen los siguientes.
  • : Esto va en la parte superior del documento HTML. Esto le dice al navegador web que este es un documento HTML.
  • : Estas etiquetas van en la parte superior e inferior del documento HTML. Esto indica dónde se inicia y se detiene el código HTML.
  • : Estas etiquetas van en la parte superior del documento HTML. Indican dónde se inicia y se detiene la cabeza del documento HTML. La cabeza del documento HTML contiene información que no se ve en la página web. Esto incluye el título de la página, los metadatos y la CSS
  • Título de la página: Estas etiquetas indican el título la página. El título va en la cabeza del documento HTML. Escriba el título de la página entre estas dos etiquetas.
  • : Estas etiquetas indican dónde comienza y se detiene el cuerpo del documento HTML. El cuerpo es donde se escribe todo el contenido de la página web. El cuerpo viene después de la cabeza en el documento HTML.
  • Texto de titular

    : Estas etiquetas crean etiquetas de titulares. El texto entre el "

    " y "

    " Las etiquetas aparecen como un texto en negrita grande. El texto va en el cuerpo del documento HTML.
  • Texto de párrafo

    : Estas etiquetas se utilizan para crear texto de párrafo en un documento HTML. El texto que va entre "

    " y "

    " Aparece como texto de tamaño normal. El texto va en el cuerpo del documento HTML.
  • Texto en negrita: Estas etiquetas se utilizan para crear un texto en negrita. El texto que va entre "" y "" Aparece como texto en negrita.
  • Texto en cursiva: Estas etiquetas se utilizan para crear texto en cursiva. El texto que va entre "" y "" Aparece como texto estatal.
  • Texto del enlace: Esta etiqueta se usa para enlazar a otro sitio web. Copie la dirección web que desea enlazar y pegarla donde dice "Url" (entre las comillas). El texto para el enlace donde dice "Texto del enlace" (No se necesitan cotizaciones).
  • : Esta etiqueta se usa para publicar una imagen usando HTML. Reemplace el texto que dice "URL de la imagen" Con la dirección web de la imagen.
  • Imagen titulada Editar archivos HTML Paso 9
    9. Hacer clic Archivo. Está en la barra de menú en la parte superior de la pantalla.
  • Imagen titulada Editar archivos HTML Paso 10
    10. Hacer clic Guardar como. Esto abre un cuadro de diálogo que puede usar para guardar su archivo.
  • Para guardar el archivo, ya que es el nombre existente y el tipo de archivo, simplemente haga clic en Ahorrar En el menú desplegable a continuación "Archivo".
  • Imagen titulada Editar archivos HTML Paso 11
    11. Seleccione "Todos los archivos". Use el menú desplegable SIGUIENTE para guardar como tipo" para seleccionar "Todos los archivos".
  • Imagen titulada Editar archivos HTML Paso 12
    12. Escriba un nombre para el archivo. Usa la caja junto a "Nombre del archivo" Para escribir un nombre para el archivo.
  • Imagen titulada Editar archivos HTML Paso 13
    13. Tipo .html al final del archivo. Después de escribir un nombre para el archivo en el "Nombre del archivo" caja, agregue la extensión ".html" al final del nombre del archivo. Sin esta extensión, guardará el archivo como un .archivo TXT, en lugar de un archivo HTML.
  • Imagen titulada Editar archivos HTML Paso 14
    14. Hacer clic Ahorrar. Esto guarda el archivo.
  • Método 2 de 4:
    Usando textedit en mac
    1. Imagen titulada Editar archivos HTML Paso 15
    1. Haga clic en el icono de la lupa
    Imagen titulada MacSpotlight.jpg
    . Está en la esquina superior derecha del escritorio MAC. Esto muestra una barra de búsqueda.
  • Imagen titulada Editar archivos HTML Paso 16
    2. Tipo Textedit En la barra de búsqueda. Esto muestra una lista de aplicaciones que coinciden con su resultado de búsqueda.
  • Imagen titulada Editar archivos HTML Paso 17
    3. Hacer clic Textedit.app. Está en la cima de los resultados de búsqueda. Es al lado de un icono que se asemeja a una hoja de papel y una pluma.
  • Imagen titulada Editar archivos HTML Paso 18
    4. Hacer clic Archivo. Está en la barra de menú en la parte superior de la pantalla cuando TextEdit está abierto.
  • Imagen titulada Editar archivos HTML Paso 19
    5. Hacer clic Abierto. Esto abre un navegador de archivos que puede usar para navegar por su Mac y abrir archivos.
  • Imagen titulada Editar archivos HTML Paso 20
    6. Haga clic en un archivo HTML y haga clic en Abierto. Los archivos HTML tienen una extensión que dice ".html" Después del nombre del archivo. Use el navegador de archivos para navegar a un archivo HTML y haga clic en él para seleccionarlo. Luego haga clic Abierto Para abrir el archivo HTML en TextEdit.
  • Imagen titulada Editar archivos HTML Paso 21
    7. Editar el código HTML. Puede usar TextEdit para editar el código HTML en HACER. Necesitas aprender html para que puedas editarlo a mano. Elementos comunes que puede editar incluyen los siguientes.
  • : Esto va en la parte superior del documento HTML. Esto le dice al navegador web que este es un documento HTML.
  • : Estas etiquetas van en la parte superior e inferior del documento HTML. Esto indica dónde se inicia y se detiene el código HTML.
  • : Estas etiquetas van en la parte superior del documento HTML. Indican dónde se inicia y se detiene la cabeza del documento HTML. La cabeza del documento HTML contiene información que no se ve en la página web. Esto incluye el título de la página, los metadatos y la CSS
  • Título de la página: Estas etiquetas indican el título la página. El título va en la cabeza del documento HTML. Escriba el título de la página entre estas dos etiquetas.
  • : Estas etiquetas indican dónde comienza y se detiene el cuerpo del documento HTML. El cuerpo es donde se escribe todo el contenido de la página web. El cuerpo viene después de la cabeza en el documento HTML.
  • Texto de titular

    : Estas etiquetas crean etiquetas de titulares. El texto entre el "

    " y "

    " Las etiquetas aparecen como un texto en negrita grande. El texto va en el cuerpo del documento HTML.
  • Texto de párrafo

    : Estas etiquetas se utilizan para crear texto de párrafo en un documento HTML. El texto que va entre "

    " y "

    " Aparece como texto de tamaño normal. El texto va en el cuerpo del documento HTML.
  • Texto en negrita: Estas etiquetas se utilizan para crear un texto en negrita. El texto que va entre "" y "" Aparece como texto en negrita.
  • Texto en cursiva: Estas etiquetas se utilizan para crear texto en cursiva. El texto que va entre "" y "" Aparece como texto estatal.
  • Texto del enlace: Esta etiqueta se usa para enlazar a otro sitio web. Copie la dirección web que desea enlazar y pegarla donde dice "Url" (entre las comillas). El texto para el enlace donde dice "Texto del enlace" (No se necesitan cotizaciones).
  • : Esta etiqueta se usa para publicar una imagen usando HTML. Reemplace el texto que dice "URL de la imagen" Con la dirección web de la imagen.
  • Imagen titulada Editar archivos HTML Paso 22
    8. Hacer clic Archivo. Está en la barra de menú en la parte superior de la pantalla.
  • Imagen titulada Editar archivos HTML Paso 23
    9. Hacer clic Ahorrar. Está en el menú desplegable a continuación "Archivo". Esto guarda el archivo HTML.
  • Para cambiar el nombre del archivo, haga clic en Rebautizar en el "Archivo" Menú desplegable. Escriba un nuevo nombre para el archivo en la parte superior de la pantalla. Asegúrate de incluir el ".html" Extensión en la parte superior de la página.
  • Método 3 de 4:
    Usando Dreamweaver
    1. Imagen titulada Editar archivos HTML Paso 24
    1. Abre Dreamweaver. Dreamweaver tiene un icono que se parece a un cuadrado verde que dice "Dw" en el medio. Haga clic en el icono en el menú Inicio de Windows, o carpeta de aplicaciones en Mac para abrir Dreamweaver.
    • Adobe Dreamweaver requiere un suscripción. Puede comprar una suscripción a partir de $ 20.99 al mes.
  • Imagen titulada Editar archivos HTML Paso 25
    2. Hacer clic Archivo. Está en la barra de menú en la parte superior para la pantalla.
  • Imagen titulada Editar archivos HTML Paso 26
    3. Hacer clic Abierto. Está en el menú desplegable a continuación "Archivo".
  • Imagen titulada Editar archivos HTML Paso 27
    4. Seleccione un documento HTML y haga clic en Abierto. Use el navegador de archivos para seleccionar un documento HTML en su computadora y haga clic en él para seleccionarlo. Luego haga clic Abierto En la esquina inferior derecha.
  • Imagen titulada Editar archivos HTML Paso 28
    5. Hacer clic Separar. Es la pestaña central en la parte superior de la página. Esto muestra una pantalla dividida que contiene un editor HTML en la pantalla inferior y una vista previa en la parte superior.
  • Imagen titulada Editar archivos HTML Paso 29
    6. Editar el documento HTML. Utilice el editor HTML para editar HTML. La forma en que edita HTML en Dreamweaver no es demasiado diferente de la edición HTML en Notepad o TextEdit. A medida que escribe una etiqueta HTML, aparecerá un menú de búsqueda con las etiquetas HTML coincidentes. Puede hacer clic en la etiqueta HTML para insertar sus etiquetas de apertura y cierre. Dreamweaver revisará para asegurarse de que hay etiquetas de apertura y cierre para todos sus elementos HTML.
  • Alternativamente, puede hacer clic donde desea insertar un elemento HTML en el editor HTML y haga clic en Insertar En la barra de menú en la parte superior de la pantalla. Haga clic en el elemento que desea insertar en el menú desplegable para agregar el código HTML automáticamente.
  • Imagen titulada Editar archivos HTML Paso 30
    7. Hacer clic Archivo. Cuando haya terminado de editar el documento HTML, haga clic en Archivo En la barra de menú en la parte superior de la pantalla.
  • Imagen titulada Editar archivos HTML Paso 31
    8. Hacer clic Ahorrar. Está en el menú desplegable a continuación Archivo. Esto guarda su documento HTML.
  • Método 4 de 4:
    Usando kompozer
    1. Imagen titulada Editar archivos HTML Paso 32
    1. Ir https: // sourceforge.red / proyectos / kompozer / En un navegador web. Puede usar cualquier navegador web en PC o Mac. Esta es la página de descarga para Kompozer. Es un editor HTML (WYSIWYG) gratuito que funciona tanto en Windows como en Mac.
  • Imagen titulada Editar archivos HTML Paso 33
    2. Hacer clic Descargar. Es el botón verde cerca de la parte superior de la página. Esto lo lleva a una página de descarga separada. Después de un retraso de 5 segundos, su descarga comenzará.
  • Imagen titulada Editar archivos HTML Paso 34
    3. Haga doble clic en el archivo de instalación. De forma predeterminada, sus archivos descargados se pueden encontrar en su "Descargas" Carpeta en PC o Mac. También puede hacer clic en ellos en su navegador web para iniciar el instalador de KompoZer. Use las siguientes instrucciones para instalar KompoZer:
  • Windows:
  • Si se le pregunta, si desea permitir que el instalador realice cambios en su sistema, haga clic en .
  • Hacer clic próximo En las ventanas introductas.
  • Haga clic en el botón radial junto a "acepto el acuerdo" y haz clic próximo.
  • Hacer clic próximo Para usar la ubicación de instalación predeterminada o haga clic en Navegar Para seleccionar una ubicación de instalación diferente.
  • Hacer clic próximo y luego haga clic próximo de nuevo
  • Hacer clic Instalar en pc
  • Hacer clic Terminar
  • Mac:
  • Haga doble clic en el archivo de instalación de Kompozer.
  • Hacer clic Kompozer.app
  • Haga clic en el icono de Apple en la esquina superior izquierda.
  • Hacer clic Preferencias del Sistema
  • Hacer clic Seguridad y privacidad
  • Haga clic en el General pestaña.
  • Hacer clic Abierto de todos modos cerca de la parte inferior de la ventana.
  • Hacer clic Abierto En la ventana emergente.
  • Arrastre el icono de Kompozer a su escritorio.
  • Abrir el buscador.
  • Haga clic en el Aplicaciones carpeta.
  • Arrastre el icono de Kompozer desde el escritorio a la carpeta de aplicaciones.
  • Imagen titulada Editar archivos HTML Paso 35
    4. Abierto kompozer. Utilice los siguientes pasos para abrir KompoZER en PC o Mac
  • Windows:
  • Haga clic en el Inicio de Windows menú.
  • Tipo "Kompozer"
  • Haga doble clic en el icono de Kompozer.
  • Mac:
  • Haga clic en el icono de la lupa en la esquina superior derecha.
  • Tipo "Kompozer" En la barra de búsqueda.
  • Haga doble clic Kompozer.app.
  • Imagen titulada Editar archivos HTML Paso 36
    5. Hacer clic Archivo. Está en la barra de menú en la parte superior de la aplicación.
  • Imagen titulada Editar archivos HTML Paso 37
    6. Hacer clic Abrir documento. Es la segunda opción en el menú desplegable a continuación "Archivo". Esto abre un navegador de archivos que puede usar para seleccionar un archivo HTML abierto.
  • Imagen titulada Editar archivos HTML Paso 38
    7. Haga clic en un archivo HTML y haga clic en Abierto. Esto abre el archivo HTML en Kompozer.
  • Imagen titulada Editar archivos HTML Paso 39
    8. Hacer clic Separar. Es la pestaña central en la parte superior de la página. Esto muestra una pantalla dividida que contiene un editor HTML en la pantalla inferior y una vista previa en la parte superior.
  • Es posible que deba ampliar la aplicación para que tenga más espacio para trabajar.
  • Imagen titulada Editar archivos HTML Paso 40
    9. Editar el documento HTML. La pantalla del código fuente HTML está en la parte inferior, puede usar esta pantalla para editar HTML de la misma manera que lo haría en el bloc de notas o textEdit. También puede usar la pantalla de vista previa para editar su HTML utilizando los siguientes pasos:
  • Use el menú desplegable en la esquina superior derecha para seleccionar el tipo de texto (i.e encabezado, párrafo, ect}
  • Haga clic y escriba para agregar texto.
  • Use los botones en el panel en la parte superior de la pantalla para agregar negrita, cursiva, alineación de texto, sangrías o listas a su texto.
  • Haga clic en el cuadrado de color en el panel en la parte superior de la pantalla para cambiar el color del texto.
  • Haga clic en el Imagen Icono en la parte superior de la pantalla para agregar una imagen a su documento HTML.
  • Haga clic en el icono que se asemeja a un enlace de cadena para agregar un enlace a su documento HTML.
  • Imagen titulada Editar archivos HTML Paso 41
    10. Haga clic en el Ahorrar icono. Una vez que haya terminado de realizar cambios en su documento, haga clic en el Ahorrar Icono en la parte superior de la pantalla. Está por debajo de un icono que se asemeja a un disquete. Esto ahorra tu trabajo.
  • Advertencias

    Recuerde guardar su documento mientras edita. Algo podría ir mal en cualquier momento.
    Artículos Relacionados