Html
realizado por : Mariana Palacio
Katerine Marin
Colegio: Gonzalo Restrepo Jaramillo
Año:2016
Modalidad: sistemas
HTML
HTML, sigla en inglés de HyperText Markup Language (lenguaje de
marcas de hipertexto), hace referencia al lenguaje de marcado para la
elaboración de páginas web. Es un estándar que sirve de referencia del
software que conectacon la elaboración de páginas web en sus diferentes
versiones, define una estructura básica y un código (denominado código
HTML) para la definición de contenido de una página web, como texto,
imágenes, videos, juegos, entre otros. Es un estándar a cargo del World
Wide Web Consortium (W3C) o Consorcio WWW, organización dedicada
a la estandarización de casi todas las tecnologías ligadas a la web, sobre
todo en lo referente a su escritura e interpretación. Se considera el lenguaje
web más importante siendo su invención crucial en la aparición, desarrollo
y expansión de la World Wide Web (WWW). Es el estándar que se ha
impuesto en la visualización de páginas web y es el que todos los
navegadores actuales han adoptado.
PROGRAMAS USADOS PARA PROGRAMAR HTML
CoffeeCup Free Editor
Un editor multiplataforma (Windows, Mac) y gratuito con soporte para multitud de
características: ayuda contextual a la escritura de código, vista previa del resultado a
medida que escribimos,etc.La versión gratuita se ve recortada frente a la de pago, pero
aún así es una buena opción también.
TextWrangler
Editor gratuito para Mac especializado en escritura de código HTML, CSS y
JavaScript. Se asemeja mucho a Notepad++ o a Sublime (ver más abajo en el
ranking), pero es más limitado. Es uno de los más conocidos y utilizados en Mac.
TextMate
Editor especializado de código para Mac. Es similar a Notepad++ y a Sublime. Al igual
que el anterior es muy utilizado por programadores en el sistema de la manzana.
Kompozer
Archiconocido editor de HTML y CSS que es gratuito y multiplataforma (Windows Mac
y Linux). Ofrece vista previa de la página mientras se escribe código, múltiples
pestañas, edición específica de CSS, etc...
Aptana Studio
Otro editor multiplataforma de carácter gratuito. Ofrece una excelente ayuda contextual
a la hora de escribir código HTML, que incluye también el soporte de los diferentes
navegadores para cada característica. Sólo por esto ya merece la pena. Tiene
características avanzadas para programación con JavaScript y soporta además
múltiples lenguajes de servidor, como PHP, Python y Ruby on Rails. Está basado en
Eclipse, y por lo tanto en Java, por lo que tenlo en cuenta si no te gusta instalar esa
plataforma en tu equipo (por sus muchos problemas de seguridad y lentitud).
Notepad++
Es gratuito y además Open Source aunque solo funciona bajo Windows. Dispone de
multitud de plugins para extender su funcionalidad, y como es muy popular hay
muchos donde elegir. Va mucho más allá que el bloc de notas ya que ofrece sintaxis
coloreada, estructuración de código (para poder plegar y desplegar zonas cubiertas
por etiquetas), soporte de otros muchos lenguajes de programación, etc... Está bien
tenerlo a mano para pruebas o ediciones rápidas. Es uno de mis favoritos.
BlueGriffon
Este excelente editor WYSIWYG utiliza por debajo el motor de renderizado de Firefox
para visualizar las páginas a medida que las vamos editando. Cuenta con ayudas a la
escritura de código (como las “miguitas de pan” de la parte de abajo o el acceso a la
estructura jerárquica de la página), y ofrece incluso la posibilidad de probar en tiempo
real transformaciones 3D de CSS3 sin abandonar el editor (ventajas de utilizar el
motor Gecko de Mozilla). Es gratuito, Open Source y multiplataforma (Windows, Mac y
Linux) y está disponible en Español entre otros muchos idiomas. La última versión es
de hace casi un año, pero el proyecto sigue activo.
Sublime Text
Un editor de texto avanzado para programadores, multiplataforma. Aunque es
bastante espartano lo cierto es que todo el que invierte tiempo en aprender a
dominarlo luego no lo quiere dejar, ya que aumenta mucho la productividad a la hora
de escribir código. No ofrece muchas de las características de ayuda al programador
web que sí ofrecen la mayoría de los otros entornos, por lo que es recomendable
sobre todo si vamos a trabajar mucho directamente con código, especialmente
JavaScript. Lo podemos descargar y utilizar gratuitamente, pero si lo vamos a usar a
menudo para trabajar sus creadores nos solicitan que les paguemos una licencia (es lo
justo). Ésta tiene un precio muy razonable.
JetBrains WebStorm
Este es sin duda uno de los mejores editores de código del mercado, y no solo para el
trinomio HTML/CSS/JavaScript. De hecho soporta otros lenguajes como CoffeeScript,
TypeScript y Node.js, y multitud de librerías de JavaScript, sistemas de control de
código, testeo unitario, etc.... Es muy espectacular la capacidad de editar y ver en
tiempo real los cambios en un Chrome, incluso en aplicaciones de tipo SPA/AJAX. La
lista de características es tan larga que mejor te enlazo a la misma en su página. Lleva
un rato aprender todas sus posibilidades, pero merece la pena.
Es multiplataforma. No es gratuito, pero su precio (solamente 44€ para uso individual)
es un regalo para todo lo que ofrece. Muy recomendable.
Microsoft Visual Studio Expressfor Web
Está disponible en varios idiomas (incluyendo el Español) y su única limitación es que
sólo funciona bajo Windows. Es decir, que si trabajas en Mac o Linux no podrás
utilizarlo. Por lo demás es un entorno integrado de desarrollo (IDE) espectacular.
Aunque, al igual que el anterior, es una herramienta técnica orientada a
programadores y con muchas otras posibilidades avanzadas, ofrece un soporte
estupendo para diseño de páginas Web, con editores avanzados de HTML, CSS y
JavaScript, capacidad de depuración, ayuda contextual para todos los lenguajes,
validadores de código, validadores de accesibilidad, visualización real de cómo van a
quedar las páginas, etc... Echarás de menos muy pocas cosas (aunque algunas sí,
sobre todo si usas Sublime). Es totalmente gratuito.
Bloc denotas
Bloc de notas (en inglés notepad) es un editor de texto simple incluido en los sistemas
operativos de Microsoft desde 1985. Su funcionalidad es muy simple. Algunas
características propias son:
 Inserción de hora y fecha actual pulsando F5, en formato "HH:MM DD/MM/AA".
 Inserción de hora y fecha actual si el documento comienza por ".LOG".
 Ajuste de línea.
 Posibilidad de exportar a cualquier formato de texto no formateado (muy útil
como recurso de emergencia para programar)
Es el equivalente en Windows del editor de MS-DOS edit.
La extensión predeterminada de este editor es *.txt.
Para qué sirve el bloc de notas
El Bloc de notas nos permite hacer tareas sencillas de edición de texto cómo: Escribir,
copiar, pegar, cortar texto, buscar y reemplazar texto; es decir, lo que normalmente
hacemos en el Word de Office o WordPad. Pero el Bloc de notas se diferencia de los
otros editores porque permite abrir de manera rápida los archivos de texto, que
además ocupan poco espacio.
¿Sabías qué?
Sabías que el Bloc de notas fue un programa fallido de edición de textos que presentó
muchas limitaciones y que Bill Gates decidió ponerlo fuera del programa Office. Sin
embargo, el popular programa de edición Word decidió adoptarlo, es decir, que
Microsoft lo incluyó el sistema operativo de Windows.
Navegador web
Un navegador web (en inglés, web browser) es un software, aplicación o programa
que permite el acceso a la Web, interpretando la información de distintos tipos de
archivos y sitios web para que estos puedan ser visualizados.
La funcionalidad básica de un navegador web es permitir la visualización de
documentos de texto, posiblemente con recursos multimedia incrustados. Además,
permite visitar páginas web y hacer actividades en ella, es decir, enlazar un sitio con
otro, imprimir, enviar y recibir correo, entre otras funcionalidades más.
Ejemplos de navegadoresweb
-internet explorer
-google chrome
-mozilla firefox
-opera
-safari
Comandoshtml
 < HTML > ... < /HTML > : Indica el comienzo y fin de un archivo HTML
 < HEAD > ... < /HEAD > : Indica el comienzo y fin de un encabezado (aquí se
coloca generalmente el título).
 < TITLE > ... < /TITLE > : Indica el título.
 < BODY> ... < /BODY > : Indica el comienzo y fin del cuerpo de la página.
 < P > ... < /P > : Indica comienzo y fin de un párrafo.
 < BR > : Permite saltarse una línea (se llama quiebre de línea).
 < Hn > ... < Hn > : Para n entre 1 y 6, hacen que el texto encerrado aparezca
como encabezado (un subtítulo). Se recomienda usar sólo 1,2 y 3.
 Tipos de letras:
< B > ... < /B > : Negrita.
< L > ... < /L > : Cursiva.
< BLINK > ... < /BLINK > : Parpadeante.
< STRONG > ... < /STRONG > : Enfatizada.
 < UL > ... < /UL > : Indica comienzo y fin de una lista no ordenada (puntos).
Dentro de ellos, cada ítem empieza por < LI > y termina al terminar la línea.
 < OL > ... < /OL > : Indica comienzo y fin de una lista ordenada (números).
Dentro de ellos, cada ítem empieza por < LI > y termina al terminar la línea.
 Ejemplo:
 < OL >
< LI > Primer ítem
< LI > Segundo item
< UL >
< LI > Primer subitem
< LI > Segundo subitem
< /UL >
< LI > Tercer ítem
< /OL >
Y esto se ve
1. Primer ítem
2. Segundo item
 Primer subitem
 Segundo subitem
3. Tercer ítem
COLORES
Azul : Blue
Azul Marino : Navy blue
Negro : Black
Marrón : Brown
Fucsia :Fuchsia
Dorado : Golden
Gris :Gray
Verde : Green
Naranja : Orange
Morado : Purple
Rojo : Red
Violeta : Violet
Amarillo : Yellow
Plata : Silver
Rosa : Pink
TIPOS DE LETRAS
- Algerian
- Arial Black
-Arial Narrow
-Book Antiqua
-Bookman Old Style
-Braggadocio
-Brittanic
-Bursh Script MT
-Century Gothic
-Century Schoolbook
-Colonna
-Desdemona
-Footlight MT Light
-Garamond MT
-Impact

Mariana palacio katerine marin html

  • 1.
    Html realizado por :Mariana Palacio Katerine Marin Colegio: Gonzalo Restrepo Jaramillo Año:2016 Modalidad: sistemas HTML
  • 2.
    HTML, sigla eninglés de HyperText Markup Language (lenguaje de marcas de hipertexto), hace referencia al lenguaje de marcado para la elaboración de páginas web. Es un estándar que sirve de referencia del software que conectacon la elaboración de páginas web en sus diferentes versiones, define una estructura básica y un código (denominado código HTML) para la definición de contenido de una página web, como texto, imágenes, videos, juegos, entre otros. Es un estándar a cargo del World Wide Web Consortium (W3C) o Consorcio WWW, organización dedicada a la estandarización de casi todas las tecnologías ligadas a la web, sobre todo en lo referente a su escritura e interpretación. Se considera el lenguaje web más importante siendo su invención crucial en la aparición, desarrollo y expansión de la World Wide Web (WWW). Es el estándar que se ha impuesto en la visualización de páginas web y es el que todos los navegadores actuales han adoptado. PROGRAMAS USADOS PARA PROGRAMAR HTML CoffeeCup Free Editor Un editor multiplataforma (Windows, Mac) y gratuito con soporte para multitud de características: ayuda contextual a la escritura de código, vista previa del resultado a
  • 3.
    medida que escribimos,etc.Laversión gratuita se ve recortada frente a la de pago, pero aún así es una buena opción también. TextWrangler Editor gratuito para Mac especializado en escritura de código HTML, CSS y JavaScript. Se asemeja mucho a Notepad++ o a Sublime (ver más abajo en el ranking), pero es más limitado. Es uno de los más conocidos y utilizados en Mac. TextMate Editor especializado de código para Mac. Es similar a Notepad++ y a Sublime. Al igual que el anterior es muy utilizado por programadores en el sistema de la manzana.
  • 4.
    Kompozer Archiconocido editor deHTML y CSS que es gratuito y multiplataforma (Windows Mac y Linux). Ofrece vista previa de la página mientras se escribe código, múltiples pestañas, edición específica de CSS, etc... Aptana Studio Otro editor multiplataforma de carácter gratuito. Ofrece una excelente ayuda contextual a la hora de escribir código HTML, que incluye también el soporte de los diferentes navegadores para cada característica. Sólo por esto ya merece la pena. Tiene características avanzadas para programación con JavaScript y soporta además múltiples lenguajes de servidor, como PHP, Python y Ruby on Rails. Está basado en
  • 5.
    Eclipse, y porlo tanto en Java, por lo que tenlo en cuenta si no te gusta instalar esa plataforma en tu equipo (por sus muchos problemas de seguridad y lentitud). Notepad++ Es gratuito y además Open Source aunque solo funciona bajo Windows. Dispone de multitud de plugins para extender su funcionalidad, y como es muy popular hay muchos donde elegir. Va mucho más allá que el bloc de notas ya que ofrece sintaxis coloreada, estructuración de código (para poder plegar y desplegar zonas cubiertas por etiquetas), soporte de otros muchos lenguajes de programación, etc... Está bien tenerlo a mano para pruebas o ediciones rápidas. Es uno de mis favoritos.
  • 6.
    BlueGriffon Este excelente editorWYSIWYG utiliza por debajo el motor de renderizado de Firefox para visualizar las páginas a medida que las vamos editando. Cuenta con ayudas a la escritura de código (como las “miguitas de pan” de la parte de abajo o el acceso a la estructura jerárquica de la página), y ofrece incluso la posibilidad de probar en tiempo real transformaciones 3D de CSS3 sin abandonar el editor (ventajas de utilizar el motor Gecko de Mozilla). Es gratuito, Open Source y multiplataforma (Windows, Mac y Linux) y está disponible en Español entre otros muchos idiomas. La última versión es de hace casi un año, pero el proyecto sigue activo. Sublime Text
  • 7.
    Un editor detexto avanzado para programadores, multiplataforma. Aunque es bastante espartano lo cierto es que todo el que invierte tiempo en aprender a dominarlo luego no lo quiere dejar, ya que aumenta mucho la productividad a la hora de escribir código. No ofrece muchas de las características de ayuda al programador web que sí ofrecen la mayoría de los otros entornos, por lo que es recomendable sobre todo si vamos a trabajar mucho directamente con código, especialmente JavaScript. Lo podemos descargar y utilizar gratuitamente, pero si lo vamos a usar a menudo para trabajar sus creadores nos solicitan que les paguemos una licencia (es lo justo). Ésta tiene un precio muy razonable. JetBrains WebStorm Este es sin duda uno de los mejores editores de código del mercado, y no solo para el trinomio HTML/CSS/JavaScript. De hecho soporta otros lenguajes como CoffeeScript, TypeScript y Node.js, y multitud de librerías de JavaScript, sistemas de control de código, testeo unitario, etc.... Es muy espectacular la capacidad de editar y ver en tiempo real los cambios en un Chrome, incluso en aplicaciones de tipo SPA/AJAX. La lista de características es tan larga que mejor te enlazo a la misma en su página. Lleva un rato aprender todas sus posibilidades, pero merece la pena. Es multiplataforma. No es gratuito, pero su precio (solamente 44€ para uso individual) es un regalo para todo lo que ofrece. Muy recomendable.
  • 8.
    Microsoft Visual StudioExpressfor Web Está disponible en varios idiomas (incluyendo el Español) y su única limitación es que sólo funciona bajo Windows. Es decir, que si trabajas en Mac o Linux no podrás utilizarlo. Por lo demás es un entorno integrado de desarrollo (IDE) espectacular. Aunque, al igual que el anterior, es una herramienta técnica orientada a programadores y con muchas otras posibilidades avanzadas, ofrece un soporte estupendo para diseño de páginas Web, con editores avanzados de HTML, CSS y JavaScript, capacidad de depuración, ayuda contextual para todos los lenguajes, validadores de código, validadores de accesibilidad, visualización real de cómo van a quedar las páginas, etc... Echarás de menos muy pocas cosas (aunque algunas sí, sobre todo si usas Sublime). Es totalmente gratuito.
  • 9.
    Bloc denotas Bloc denotas (en inglés notepad) es un editor de texto simple incluido en los sistemas operativos de Microsoft desde 1985. Su funcionalidad es muy simple. Algunas características propias son:  Inserción de hora y fecha actual pulsando F5, en formato "HH:MM DD/MM/AA".  Inserción de hora y fecha actual si el documento comienza por ".LOG".  Ajuste de línea.  Posibilidad de exportar a cualquier formato de texto no formateado (muy útil como recurso de emergencia para programar) Es el equivalente en Windows del editor de MS-DOS edit. La extensión predeterminada de este editor es *.txt. Para qué sirve el bloc de notas El Bloc de notas nos permite hacer tareas sencillas de edición de texto cómo: Escribir, copiar, pegar, cortar texto, buscar y reemplazar texto; es decir, lo que normalmente hacemos en el Word de Office o WordPad. Pero el Bloc de notas se diferencia de los otros editores porque permite abrir de manera rápida los archivos de texto, que además ocupan poco espacio. ¿Sabías qué? Sabías que el Bloc de notas fue un programa fallido de edición de textos que presentó muchas limitaciones y que Bill Gates decidió ponerlo fuera del programa Office. Sin embargo, el popular programa de edición Word decidió adoptarlo, es decir, que Microsoft lo incluyó el sistema operativo de Windows. Navegador web Un navegador web (en inglés, web browser) es un software, aplicación o programa que permite el acceso a la Web, interpretando la información de distintos tipos de archivos y sitios web para que estos puedan ser visualizados.
  • 10.
    La funcionalidad básicade un navegador web es permitir la visualización de documentos de texto, posiblemente con recursos multimedia incrustados. Además, permite visitar páginas web y hacer actividades en ella, es decir, enlazar un sitio con otro, imprimir, enviar y recibir correo, entre otras funcionalidades más. Ejemplos de navegadoresweb -internet explorer -google chrome -mozilla firefox -opera -safari Comandoshtml  < HTML > ... < /HTML > : Indica el comienzo y fin de un archivo HTML  < HEAD > ... < /HEAD > : Indica el comienzo y fin de un encabezado (aquí se coloca generalmente el título).  < TITLE > ... < /TITLE > : Indica el título.  < BODY> ... < /BODY > : Indica el comienzo y fin del cuerpo de la página.  < P > ... < /P > : Indica comienzo y fin de un párrafo.  < BR > : Permite saltarse una línea (se llama quiebre de línea).
  • 11.
     < Hn> ... < Hn > : Para n entre 1 y 6, hacen que el texto encerrado aparezca como encabezado (un subtítulo). Se recomienda usar sólo 1,2 y 3.  Tipos de letras: < B > ... < /B > : Negrita. < L > ... < /L > : Cursiva. < BLINK > ... < /BLINK > : Parpadeante. < STRONG > ... < /STRONG > : Enfatizada.  < UL > ... < /UL > : Indica comienzo y fin de una lista no ordenada (puntos). Dentro de ellos, cada ítem empieza por < LI > y termina al terminar la línea.  < OL > ... < /OL > : Indica comienzo y fin de una lista ordenada (números). Dentro de ellos, cada ítem empieza por < LI > y termina al terminar la línea.  Ejemplo:  < OL > < LI > Primer ítem < LI > Segundo item < UL > < LI > Primer subitem < LI > Segundo subitem < /UL > < LI > Tercer ítem < /OL > Y esto se ve 1. Primer ítem 2. Segundo item
  • 12.
     Primer subitem Segundo subitem 3. Tercer ítem COLORES Azul : Blue Azul Marino : Navy blue Negro : Black Marrón : Brown Fucsia :Fuchsia Dorado : Golden Gris :Gray Verde : Green Naranja : Orange Morado : Purple Rojo : Red Violeta : Violet Amarillo : Yellow Plata : Silver Rosa : Pink TIPOS DE LETRAS - Algerian - Arial Black -Arial Narrow -Book Antiqua -Bookman Old Style -Braggadocio -Brittanic -Bursh Script MT -Century Gothic -Century Schoolbook -Colonna -Desdemona -Footlight MT Light -Garamond MT -Impact