PC-CUADERNOS

Aquí puedes encontrar los suplementos de cada cuaderno.
Imágenes, código suplementario... todo lo que necesitas para seguir los ejercicios de los cuadernos.
Además, podrás encontrar aquí información adicional que el autor ha escrito después de la publicación del cuaderno, o recursos adicionales como comentarios sobre nuevas versiones de un programa.

Suplemento "Cree su página Web (I)"

Notas adicionales al cuaderno e información de interés

A continuación presentamos información de interés y notas del autor posteriores a la publicación del cuaderno Cree su página Web (I).

Descarga de HomeSite 1.2

Al final del cuaderno se hace referencia al software gratuito HomeSite 1.2. Desde aquí puedes descargar el programa para utilizarlo siguiendo las instrucciones del cuaderno.

Haz clic aquí para descargar el programa en formato .exe.

Encontrarás más enlaces al software que aparece en el cuaderno en el apartado de enlaces de interés.

Enlaces a proveedores gratuitos

Aquí podrás obtener espacio gratuito para tu página personal:

http://www.gratisweb.com/, http://www.geocities.com, http://www.demasiado.com, http://espacio.ya.com, http://www.tripod.es, http://come.to

Proveedores gratuitos de acceso a Internet:

EresMas, Navegalia, JazzFree, Terra, Wanadoo

Recursos gratuitos para tu página Web

Desde aquí te recomendamos algunos servicios gratuitos. Puedes encontrar más buscando lo que interese en cualquier motor de búsqueda.

Contadores:

http://contador.hispalab.net/, http://www.contadorwap.com/, http://www.aaddzz.com/pages/counters

Estadísticas:

http://es.nedstat.net/, http://www.ipstat.com/, http://www.ciberstats.com/

Libros de visitas:

http://www.guestbook.de/, http://www.theguestbook.com/, http://www.lpage.com/

Código para copiar y pegar

¿Estás cansado de copiar el código que aparece en el cuaderno a mano? Aquí encontrarás el código correspondiente a los ejemplos más largos y pesados. Sencillamente, cópialo y pégalo en tu editor para modificarlo como desees.

Cuestionario

<html>
<head>
<title>Cuestionario</title>
</head>
<body>
<h1>Bienvenidos a nuestro cuestionario</h1>
<form action="mailto:info@lexi.es" method="post">
<p>Por favor, introduzca su nombre y apellidos:</p>
<p><input type="text" name="Nombre" /></p>
<p>¿Dónde preferiría vivir?</p>
<p><input type="radio" name="residencia" value="Cataluña" /> Cataluña<br />
<input type="radio" name="residencia" value="Madrid" />Madrid<br />
<input type="radio" name="residencia" value="Andalucía" />Andalucía<br /></p>
<p>¿Cuál es su plato preferido? Puede marcar varias
opciones</p>
<p><input type="checkbox" name="comida" value="Pasta" />Pasta<br />
<input type="checkbox" name="comida" value="Pizza" />Pizza<br />
<input type="checkbox" name="comida" value="Combinados" />Combinados<br /></p>
<p>Seleccione un destino para sus vacaciones:</p>
<p>
<select name="Viajes" size="4">
<option>España</option>
<option>Islas canarias</option>
<option>Grecia</option>
<option>Alemania</option>
</select>
</p>
<p>Marque como mínimo dos de sus flores preferidas:</p>
<p>
<select multiple="multiple" name="flores" size="4">
<option>Rosas</option>
<option>Tulipanes</option>
<option>Crocus</option>
<option>Primaveras</option>
</select>
</p>
<p><input type="submit" value="Enviar datos" />
<input type="reset" value="Borrar datos" /></p>
</form>
</body>
</html>

Ticker

<html>
<head>
<title>Texto que cambia</title>
<script language="JavaScript" type="text/javascript">

</script>
</head>
<body bgcolor="white" onLoad="typewriter()">
<h1>Máquina de escribir</h1>
<form name="form1" id="form1">
<input type="text" name="campo de texto" id="campo de texto" size="50" />
</form>
</body>
</html>

Ejemplo de META-tags

Preguntas más frecuentes - FAQ

No se muestran los gráficos de mi página. En lugar de ello, aparecen pequeños puntos.
En ese caso, no has colocado bien los enlaces. Tienen que ser enlaces relativos, y en la situación ideal los gráficos deberían encontrarse en la misma carpeta que el archivo HTML. Consulta la página 11 del cuaderno. Comprueba también si el nombre del gráfico está escrito igual que el enlace al mismo. Los servidores UNIX distinguen entre mayúsculas y minúsculas, mientras que los ordenadores con Windows no lo hacen.

El diseño de mi página en el navegador no es tal como lo esperaba.
No olvides que el lenguaje HTML normalmente no permite organizar la página con una precisión de píxeles. Originariamente, este lenguaje se pensó únicamente para mostrar la estructura lógica de un documento. Puedes "hacer trampas" colocando tablas y estableciendo la anchura y la altura con toda precisión mediante width y height. Consulta el capítulo que habla en detalle sobre las tablas. Sin embargo, no esperes que todos los navegadores muestren el resultado a la perfección.

Los enlaces no funcionan
Vuelvo a remitirme a la distinción entre mayúsculas y minúsculas. En Windows, no es importante si escribimos en mayúsculas o minúsculas. En el caso de los servidores Unix de la red, sí que importa si el archivo se llama index.html o Index.html o index.Html. En caso de duda, no se mostrará el documento. Por eso te recomiendo que, en general, utilices siempre minúsculas. Además, procura no colocar enlaces absolutos del tipo C:/Homepage/index.html.

El MARQUEE (marquesina) no funciona.
Desgraciadamente, esta etiqueta solamente es compatible con Microsoft Internet Explorer, desde la versión 2. Netscape Navigator (incluso la última versión del navegador) se niega a ejecutar el comando. Y eso a pesar de que la etiqueta MARQUEE llegó a pertenecer al estándar HTML oficial.

¿Cómo puedo hacer que el texto de la marquesina se desplace de izquierda a derecha?
Puedes hacerlo utilizando esta instrucción: direction=right. Si no se indica lo contrario (de forma predeterminada), el texto se desplaza de derecha a izquierda. He aquí un ejemplo para la marquesina con cambio de dirección:
<marquee direction=right>Este texto se desplaza de izquierda a derecha</marquee>

¿Cómo se puede incluir una breve información en los enlaces de texto?
Es posible incluir una pequeña información a tus enlaces de texto: ¿Quieres llegar a la página de Terra? Utiliza el atributo title. Puedes escribir el enlace así:
<a href="http://www.terra.es" title="¡Haz clic aquí!">¿Quieres llegar a la página de Terra?</a>
Aquí he marcado el atributo esencial en negrita. Sin embargo, este truco no funciona con el navegador Netscape, a menos que utilices la versión 6.

¿Qué puedo hacer para que, al hacer clic en un enlace de una dirección de e-mail, se rellene automáticamente el campo de asunto?
Deberás incluir lo siguiente en el enlace de la dirección de e-mail (he marcado la parte importante en negrita):
<a href="mailto:info@pc-cuadernos.com?subject=Consulta sobre el pedido"</a>
Si quieres probar si funciona, haz clic en Consulta sobre el pedido.

¿Cómo se incluye un sonido de fondo para el navegador Netscape?
Existe un comando que funciona tanto con MS IE como con Netscape. Debe colocarse entre las etiquetas <body> y </body> y tiene este aspecto:
<EMBED SRC="ejemplo.mid" AUTOSTART=true HIDDEN=true LOOP=true VOLUME=50 WIDTH=144 HEIGHT=60>
o
<EMBED SRC="ejemplo.mid" AUTOSTART=true HIDDEN=false LOOP=true VOLUME=50 WIDTH=144 HEIGHT=60>
En el primer caso, no se mostrará ningún panel de control (HIDDEN=TRUE). AUTOSTART significa que la reproducción comenzará automáticamente y LOOP determina si la canción tiene que sonar de forma indefinida (TRUE) o solamente una vez (FALSE). Gracias a Jens Lang por este consejo.

¿Dónde puedo conseguir un chat para mi página Web?
¿Has probado en Inforchat? También puedes introducir las palabras clave "chat gratis" en cualquier buscador para encontrar más opciones.

¿Cómo puedo hacer que los enlaces no aparezcan subrayados?
Para ello, sólo tienes que definir una hoja de estilo y establecer los parámetros necesarios para mostrar los enlaces sin subrayado. Existen cuatro "estados" posibles para los enlaces, de los cuales seguro que a:hover es el más interesante (hace referencia a cuando pasamos por encima del enlace con el ratón). a:link es el enlace en estado "normal", a:active es el link mientras hacemos clic en él y a:visited hace referencia a un enlace ya visitado. He aquí el código necesario:

a:link { text-decoration: none }
a:hover { text-decoration: none }
a:active { text-decoration: none }
a:visited { text-decoration: none }

¿Cómo puedo aplicar formato al texto de las tablas sin tener que establecer el estilo de cada celda?
Puedes hacerlo usando hojas de estilo. Observa el siguiente ejemplo prestando especial atención a las etiquetas th (encabezado de la tabla) y td (celda).

<HTML>
<HEAD>
<TITLE>Tablas</TITLE>

<STYLE TYPE="TEXT/CSS">

</STYLE>

</HEAD>

<BODY BGCOLOR="#FFFFFF">

<TABLE BORDER>
<TR>
<TH> Celda 1 (encabezado)</TH>
<TH> Celda 2 (encabezado)</TH>
<TH> Celda 3 (encabezado)</TH>
</TR>
<TR>
<TD> Celda 1 en fila 2</TD>
<TD> Celda 2 en fila 2</TD>
<TD> Celda 3 en fila 2</TD>
</TR>
<TR>
<TD> Celda 1 en fila 3</TD>
<TD> Celda 2 en fila 3</TD>
<TD> Celda 3 en fila 3</TD>
</TR>
</TABLE>

</BODY>
</HTML>

Etiquetas finales: ¿sí o no?

Se suele decir que, a pesar de algunas excepciones, en general es necesario colocar etiquetas finales (end-tags). Algunos validadores (programas que comprueban el código HTML en la WWW) también aplican este principio, y si nos olvidamos de ponerlas lo consideran un error. Sin embargo, yo no cierro las etiquetas finales en las tablas; por ningún lugar aparece un </th>, </tr> o </td>. Un lector me criticó una vez por ese motivo, diciendo que mi cuaderno era una "chapuza" y que estaba enseñando mal el lenguaje HTML.

Naturalmente, no me he sacado el conocimiento de la manga. Para justificar mi acción, quiero hacer referencia al libro "Raggett on HTML 4" de Addison-Wesley, publicado en 1998, cuyo autor es Dave Raggett. Capítulo 10.2.2, "Escribir sus propias tablas":

"Si escribe documentos HTML a mano, puede obviar las etiquetas finales </tr>, </th> o </td>, ya que el navegador deduce a partir de las etiquetas siguientes que las filas de la tabla o el elemento están cerrados. Por ese motivo, también podemos escribir la tabla AMEX de la siguiente manera..." (Nota: todos los demás ejemplos de código fuente de tablas del libro no utilizan estas etiquetas finales.)

Yo tampoco cierro la etiqueta <p>, aunque según la opinión de algunos autores Web esto también podría conllevar problemas. Sin embargo, tampoco soy el único que piensa así: precisamente <p> no necesita ninguna etiqueta final. Y presento una justificación "fundada", citando el libro "HTML: The Definitive Guide", de Chuck Musciano & Bill Kennedy, O Reilly, 2ª edición 1999, apartado 4.1.2: "La etiqueta <p>":

...En la práctica, también puede olvidarse de la etiqueta <p> al inicio del primer párrafo así como todas las etiquetas finales </p>, ya que se deducen de las demás etiquetas del documento y por lo tanto se pueden obviar sin ningún tipo de problema... En general, comprobará que los autores HTML de carne y hueso a menudo se olvidan de estas etiquetas, mientras que los generadores automáticos de documentos siempre las incluyen. Es posible que esto se deba a que los programadores no se quieran exponer a la burla de la competencia por el hecho de no cumplir los estándares HTML, aunque eso ya son sutilezas. Sea desobediente: no incluya la etiqueta inicial <p> en el primer párrafo y olvídese de las etiquetas finales </p>...

Tengo también otras obras sobre estándares HTML que expresan una opinión parecida y, en muchos casos (aunque no siempre), favorecen la no inclusión de las etiquetas finales. En el primer título que he nombrado, el de Dave Raggett, por lo general no se incluyen las etiquetas </p>.

Quizás desees ser absolutamente estricto y colocar etiquetas finales en todas partes, a excepción de los saltos de línea. Eso supone tener que teclear un poco más, pero estarás seguro de que todo es correcto y ejemplar.

Volver al cuaderno