miércoles, 24 de octubre de 2012
Capitulo 2
Al ver el código HTML de una página Web funcional
La mayoría de los editores de
texto no le permiten abrir una página web directamente desde Internet. Para
hacerlo, tendrían que ser capaces de enviar una solicitud a través de Internet
a un servidor web, que es un trabajo mejor dejar a un navegador web. Sin
embargo, los propios navegadores te dan la oportunidad de ver el HTML puro de
una página web. Esto es lo que debe hacer:
1. Abra su navegador preferido.
2. Vaya a la página Web que desea
examinar.
3. En el explorador, haga clic en
la página y haga clic en Ver código fuente (en Internet Explorer) o Ver código
fuente de página (en Firefox y Chrome).
Una vez realizada la selección, aparecerá una nueva ventana,
mostrando el HTML puro que crea la página web que usted ve.
Creación de un archivo HTML
Aquí está uno de los secretos
mejor guardados de la escritura de la página web: Usted no necesita un sitio en
línea para comenzar a crear sus propias páginas web. Eso es porque fácilmente
se puede construir y probar las páginas utilizando sólo tu propio ordenador. De
hecho, usted ni siquiera necesita una conexión a Internet.
El enfoque básico es simple:
1. Use su editor de texto
favorito.
2. Comience a escribir el
contenido HTML.
Por supuesto, esta parte es un
poco complicada, ya que no han explorado el estándar HTML todavía. Espera ayuda,
está en camino en las siguientes secciones. Por ahora, puede utilizar el
siguiente código HTML muy simple. Sólo tienes que escribir exactamente como
aparece, texto, barras, soportes puntiagudos, y todas:
<h1>United
Popsicle Workers Union</h1>
<p>We
fight for your rights.</p>
Técnicamente, este documento de dos
líneas le falta algunos detalles estructurales que las páginas web deben tener
respectivamente. Sin embargo, todos los navegadores pueden leer este fragmento
de código HTML e interpretar correctamente lo que quiere: las dos líneas de
texto con formato se muestra en la Figura 2-2.
3. Cuando termine su página web,
guardar el documento.
En Bloc de notas, comience eligiendo
Archivo ➝ Guardar. En la parte inferior de la ventana de diálogo Guardar como, en la lista Codificación, elija UTF-8. (Su página web
funcionará incluso si usted no se toma este
paso, pero sigue validadores feliz.)
En TextEditor de texto, tiene que
elegir primero Formato ➝ Convertir en texto normal para
asegurarse de que el programa guarda la página como
un archivo de texto normal (y no es un documento rico, binario). A
continuación, puede utilizar Archivo ➝ Guardar para guardar el archivo. En
el cuadro de texto sin formato de codificación,
seleccione Unicode (UTF-8).
Cuando se nombre al archivo, utilice la extensión. Htm o. Html
(véase la nota siguiente). Por ejemplo, un nombre típico archivo HTML es
LimeGreenPyjamas.html. Si utiliza TextEdit, el programa puede preguntar si
usted realmente desea utilizar la extensión htm o html en lugar de txt, el
estándar de archivo de texto,.... ". Uso htm" click Ningún paso se
requiere tal en el Bloc de notas. Sin embargo, en la opción "Guardar como
tipo" caja de texto, usted tendrá que elegir todos los archivos (*. *) En
lugar de documentos de texto (*. Txt) si desea ver los archivos HTML en la
lista de archivos.
Etiquetas
HTML
Ahora que sabes cómo mirar en los
archivos HTML existentes y cómo crear su propio, el siguiente paso es entender
lo que sucede dentro del archivo HTML normal. Todo gira en torno a un único concepto-tags.
Etiquetas HTML está formateando
instrucciones que indican a un navegador como transformar texto ordinario en
algo visualmente atractivo. Si usted fuera a tomar todas las etiquetas de un
documento HTML, la página resultante consistiría nada más de texto plano, sin
formato.
La
estructura básico
Ahora que
usted ha elegido el tipo de documento, usted está listo para llenar el resto de
su página web.
Para crear
un documento HTML verdadero, se inicia con tres elementos contenedores:
<html>, <head>, y <body>. Estos tres elementos trabajan en
conjunto para describir la estructura básica de su página:
<html>
Este
elemento envuelve todo (que no sea el tipo de documento) en su página web.
<head>
Este
elemento designa la parte del encabezado del documento. El encabezado puede
incluir alguna información opcional acerca de su página web, incluyendo el
título requerido (que su navegador muestra en la barra de título), las palabras
clave de búsqueda opcionales, y una hoja de estilos opcional (que usted
aprenderá acerca de en el capítulo 6).
<body>
Este
elemento contiene la carne de su página web, incluyendo el contenido real que
se desea mostrar al mundo.
Sólo hay
una manera correcta de combinar estos tres elementos. Aquí está su correcta
disposición, con el doctype HTML5 al comienzo de la página:
<!DOCTYPE html>
<html>
<head>
...
</head>
<body>
...
</body>
</html>
Cada
página web utiliza esta estructura básica. Los puntos suspensivos (...)
muestran dónde insertar información adicional. Los espacios entre las líneas no
son necesaria-están ahí para ayudarle a ver la estructura del elemento con
mayor facilidad.
Una vez
que tenga el esqueleto HTML en el lugar, es necesario agregar dos elementos
contenedores a la mezcla. Cada página web requiere un elemento <title>,
que va en la sección de encabezado. Después, usted necesita para crear un
contenedor de texto en la sección <body> de la página. Una para todo uso
contenedor de texto es el elemento <p>, que representa un párrafo.
He aquí un
vistazo más de cerca a los elementos que necesita para agregar:
<title>
Este
elemento establece el título de su página web. El título juega varios papeles.
En primer lugar, los navegadores web mostrar el título en la parte superior de
la ventana del navegador. En segundo lugar, cuando una página web de su
visitante de la página, el navegador utiliza el título de etiquetar el marcador
en el marcador (o favoritos) del menú. En tercer lugar, cuando la página se
convierte en una búsqueda en la Web, el motor de búsqueda por lo general
muestra este título como la primera línea en los resultados de búsqueda,
seguido de un fragmento de contenido de la página.
<p>
Esto
indica un párrafo. Exploradores Web no sangrar los párrafos, pero sí añadir un
poco de espacio entre párrafos consecutivos para mantenerlos separados.
Aquí está
la página web con estos dos ingredientes nuevos:
<!
DOCTYPE html>
<html>
<head>
<title>
todo lo que sé acerca de diseño web </ title>
</ head>
<body>
</ p>
</ body>
</ html>
Suscribirse a:
Entradas (Atom)