La cabecera de una página web es quizá uno de los partes más importantes, en ella podremos definir parámetros que nos ayudarán a configurar y optimizar nuestra página.
Todos los parámetros de la cabecera deberán estar dentro de las etiquetas
<head> </head>
Dentro de la cabecera podemos distinguir tres partes importantes
- Metatags (definición de la página)
- Estilos (apariencia de la página)
- Scripts (código)
Metatags
Podemos definir los metatags como una serie de información que ofrecemos sobre nuestra página, normalmente no tendrían por qué ser necesarios, pero si es muy recomendable usarlos en nuestras páginas ya que los buscadores se apoyan bastante en ellos.
Accede al listado completo de metatags.
Estilos
Los estilos, mediante el uso de css, nos permitirán modificar la apariencia de nuestra esctructura HTML, para ello tenemos dos formas de cargarlos.
Integrarlos con el código
Es la opción más rápida pero la menos aconsejable ya que nuestro código se volvería un poco difícil de entender.
<p style="color: #0000FF; font-size: 12pt">Este párrafo es de tamaño 12</p>
Definirlos en la página
Para definirlo en nuestra página, haremos uso de la etiqueta style de la siguiente forma:
<style type="text/css">;
H1 {border-width: 1; border: solid; text-align: center}
</style>
Definirlos en un fichero externo
Primero tendríamos que crearnos un fichero con extensión .css (lo veremos más adelante) y después importarlo mediante la etiqueta:
<link href="estilos.css" rel="stylesheet" media="screen" type="text/css">
Este último caso es el más recomendado ya que separamos totalmente la presentación del contenido, creando una página mucha más optimizada y fácil de mantener.
Esta sentencia es usada para importar cualquier fichero, no sólo para los estilos, por lo que su parámetro type podrá variar en función del tipo de fichero que se quiera importar.
- href: Ruta al fichero
- rel: relación entre documentos, le indicamos que es una hoja de estilos
- type: tipo de fichero a importar (
text/css, JavaScript, text/jscript, vbscript, php…) - [media]: Indica para que medio se va a importar, normalmente screen
Scripts
De la misma forma que ocurría con las hojas de estilos, podemos incluir ficheros con clases/funciones ya implementadas o bien podemos definirlas en nuestra página.
Normalmente el lenguaje que más suele acompañar a las páginas web es javascript, por ello vamos a hacer todos los ejemplos para este lenguaje.
Crear código en nuestra página
Para crear código javascript en nuestra página deberemos introducirlo dentro de las etiquetas
<script language="javascript" type="text/javascript"></script>
Importar fichero con código
Sin duda alguna esta es la forma más recomendable de incluir código en nuestras páginas, principalmente por que de esta manera podemos reutilizar los ficheros, en este caso .js, para diferentes aplicaciones.
<script type="text/javascript" src="ruta_fichero.js"></script>
ahora ya estamos listos para trabajar con javsacript!
Muy bueno el título! veo que estas hecho todo un maestro…saludos
Jajajaja gracias