hecho con NvuCurso básico de creación de páginas web
Programa de formación docente UAM 2005-2006
Página de inicio > Módulo avanzado

Módulo avanzado

A continuación he recogido algunos materiales que pueden ser de utilidad de cara al módulo avanzado del curso como software, plantillas, código para algunos "trucos", etc.

Atención: este apartado está parcialmente desactualizado

Programas

Nvu - Editor de páginas web opensource
Página principal de descarga | Versión traducida al castellano | Versión "portable" | También en castellano

Atención!! Nvu evolucionó a ser Kompozer / ver información en Wikipedia

Firefox - Navegador web que cumple los estándares
Página principal de descarga | Versión "portable"

Filezilla - Programa de transferencia de archivos por FTP
Página principal de descarga (recuerda que para windows debes descargarte la versión .exe)
Versión "portable"

Hojas de estilo en cascada - CSS

Las hojas de estilo en cascada (Cascading Style Sheets, CSS) son el lenguaje formal usado para definir la presentación de un documento HTML o XML (y por extensión en XHTML). El W3C (World Wide Web Consortium) es el encargado de formular la especificación de las hojas de estilo que servirá de estándar para los agentes de usuario o navegadores.

Estas hojas de estilo que se encuentran descritas a través de un archivo de texto (con extensión css) o incluido su cáodigo dentro del HTML de la propia página web, han permitido el desarrollo de estilos para personalizar las apariencias de las páginas web que van desde el control del tipo de letra y los colores de fondo, a la configuración de cuadros de texto dinámicos. 

Más información en la Wikipedia

El propio editor Nvu mantiene un módulo para la manipulación y creación de estas hojas de estilos. En el maunual de lprograma existe poca documentación. Para más detalles consultar el manual en línea en inglés aquí

Plantillas

Plantilla básica - Esta propia página en blanco

Plantilla con estilo 1

Plantilla con estilo 2

Más plantillas en Opensource Web Design

Complementos útiles para la página web

Contador y estadísticas

Contador simple suministrado por el propio servidor de la UAM.  Más información

Otros servicios gratuitos (algunos incluyen publicidad): Google Analytics | Webstat4u | Otros

Añadir dirección a buscadores

Google | Yahoo | Open Directory Project

Recursos multimedia

Imágenes y otros archivos de uso libre en Wikicommons
Ejemplos de interés: Nuvola Icons | Categoría de iconos 

Videos en red: Google Videos | YouTube

Valid HTML 4.01 TransitionalValidar el código

Validar el código fuente de tu página web
W3C Markup Validation Service

Algunos códigos de interés

Buscador interno gracias a Google
Código original desde aquí

<!-- Google search-->
  <form method="get" action="http://www.google.com/search" target="_blank">
    <font size="-1">
    <input name="ie" value="UTF-8" type="hidden">
    <input name="oe" value="UTF-8" type="hidden">
    <img src="http://www.google.com/logos/Logo_25wht.gif" alt="Google" border="0">
    <input autocomplete="off" name="q" size="20" maxlength="255" value="" type="text">
    <input name="btnG" value="Buscar" type="submit">
    <input name="domains" value="Cotapata" type="hidden">
    <br>
    <input name="sitesearch" value="www.uam.es/carpetapersonal/" checked="checked" type="radio">
    en esta web <br>
    <input name="sitesearch" value="" type="radio">
    en internet </font>
  </form>
  <!-- Google search-->
    <input name="ie" value="UTF-8" type="hidden">
    <input name="oe" value="UTF-8" type="hidden">
    <img src="http://www.google.com/logos/Logo_25wht.gif" alt="Google" border="0">
    <input autocomplete="off" name="q" size="20" maxlength="255" value="" type="text">
    <input name="btnG" value="Buscar" type="submit">
    <input name="domains" value="Cotapata" type="hidden">
    <br>
    <input name="sitesearch" value="www.uam.es/
carpetapersonal/" checked="checked" type="radio">
    en esta web <br>
    <input name="sitesearch" value="" type="radio">
    en internet </font>
  </form>
<!-- Google search-->


Fecha de actualización automática

<!-inicio código -->
<script language="JavaScript">
<!--
document.write("<font face=arial size=2>Última actualización : "+document.lastModified+"</font>")
// -->
</script>
<!-fin código -->

Recargar contenidos
Incluir el siguiente código entre las etiquetas HEAD

<!-inicio código -->
<meta http-equiv="refresh" content="25l">
<!-fin código -->

Redirigir la página a otra dirección (1)
Incluir el siguiente código entre las etiquetas HEAD

<!-inicio código -->
<script language="JavaScript">
<!--
function MM_goToURL() { //v3.0
  var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
  for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
<!-fin código -->

Redirigir la página a otra dirección (2)
Incluir el siguiente código entre las etiquetas HEAD

<!-inicio código -->
<meta http-equiv="refresh" content="25;URL=prueba1.html">
<!-fin código -->

Abrir enlace en ventana emergente

<!-inicio código -->
<a href="javascript:openPopup('archivo.html','Legend','left=20,top=20,width=400,height=300')"> texto con enlace</a>
<!-fin código -->


[arriba]

 Creative Commons License
Esta obra está bajo una licencia de Creative Commons.

Miguel Sevilla Callejo - 2006 - Departamento de Geografía · Universidad Autónoma de Madrid