HTML/CSS
Mi primera página

Qué es HTML
• Es un lenguaje de marcas para formatear y
estructurar un documento, que puede leerse en
cualquier navegador.
… …

• Estandarizado en la norma ISO de SGML
(Standard Generalized Markup Lenguage).
• El W3C desarrolla especificaciones técnicas y
directrices, de forma que se pueda asegurar una
alta calidad técnica y editorial.

EstructuraHTML
Un documento HTML tiene tres etiquetas que describen la
estructura general de un documento y dan una información sencilla
sobre él. , y
Las etiquetas pueden escribirse tanto en mayúsculas como en
minúsculas, pero se recomienda el uso de minúsculas: o
, o
Editor

Visualización en el navegador

Estructura HTML
declara un documentoHTML5 para que se
visualice correctamente.
Doctype comienza a utilizarse en HTML4.01 y XHTML
http://validator.w3.org/



Estructura HTML
para identificar que esta codificado en este lenguaje y
Limitar, el principio y el fin del documento.


Estructura HTML
la cabecera, que contiene información y recursos sobre el
propio documento y que no aparece en eldocumento, destacando
el titulo

Estructura HTML
La etiqueta meta define varios tipos de metadatos.
El atributo charset especifica la codificación usada en nuestra
página.

Estructura HTML
Charset utf-8 es la Unicode Transformation Format 8-bit representa
el código de caracteres UNICODE. Es compatible con ASCII.
Permite visualizar los caracteres de todos los idioma.

Estructura HTML
Caracteres especiales: para incluir en el texto caracteres que son propias del
lenguaje HTML es necesario usar su anotación codificada:
http://dev.w3.org/html5/html-author/charref
Espacio enblanco (non-breaking space)

 

<

Menor que

<

>

Mayor que

>

&

Ampersand

&

“

Comillas

"

‘

apóstrofo

'

Estructura HTML
El cuerpo contiene los elementos visibles en la página.
Las imágenes, los encabezados, los párrafos de texto, las listas, las
tablas, los hipervínculos…


Editores HTML
Antes de comenzar a trabajar con un editorespecífico, es recomendable conocer
el código.
Podemos usar programas que trabajen con texto plano, sin añadir sus propias
marcas de edición, en Windows el Bloc de Notas y en Macintosh el TextEdit.
TextEdit está por defecto en Rich Text es necesario configurarlo para que guarde
tu trabajo como archivos de texto plano.
Los documentos HTML deben tener la extensión html o htm.
Usar un editor wysiwyg como elAdobe Dreamweaver o el BlueGriffon
(http://www.bluegriffon.org/) o un editor con ayudas visuales como el sublime
(http://www.sublimetext.com/) nos facilitará las cosas.
Ver comparativa: http://en.wikipedia.org/wiki/Comparison_of_HTML_editors

Estructura HTML
Mi primera página vista en el programa Bloc de Notas

Estructura HTML
Mi primera página vista en el programa Sublime.

Estructura HTML
Miprimera página vista en el programa Dreamweaver.

Lenguaje HTML
Un documento HTML inserta en el texto etiquetas que controlan
los diferentes aspectos de la presentación y la semántica del
contenido.
Los textos habituales están formados por encabezados

,
párrafos

, texto importante , enfatizado , listas

• ...
  
  Selectores CSS
  Para aplicar un estilo de presentación, elselector de elemento
  puede ser una etiqueta HTML:
  p, h1, ul, li
  El estilo afecta a todo el contenido incluido dentro de esa etiqueta
  
  ,
  ,
  .
  El selector puede aplicarse a más de una etiqueta HTML:
  elemento, elemento
  h1,h2, h3
  Afecta a los elementos

  ,

  y

  .
  
  CSS
  El estilo puede estar en la cabecera de la página, debe expresarse
  en un elemento