Desde la primera versión de este MANUAL, escrito durante mis horas libres entre agosto y setiembre de 1996, fue pensado como una aportación personal desinteresada a la comunidad bebecera y de Internet en general y no está ligada a ningún interés comercial. Está permitido copiar o modificar este manual, siempre que hagas referencia al autor del documento original, osea yo :-)
Escribir este MANUAL no me fue nada fácil. Lo primero que se me ocurrió fue buscar algún libro al respecto, no encontré ni uno solo. Internet fue más bondadoso en cuanto a información, pero está dispersa, repetida, es muy básica y para rematarla en inglés : -(
Casi cuando ya tenía listo este MANUAL es que me entero de la existencia de Wilbur las especificaciones HTML 3.2 que aparecieran en ENE-1997, es por ello que en Abril publiqué la versión 2 de este trabajo.
Actualmente, ya más canchero en el tema, trato de ponerme al día con el Cougar las especificaciones HTML 4.0 que posiblemente veremos para ENE-1998, pero no me es fácil... un poquito de paciencia por favor.
Mi intención es mantener actual este trabajo, para que sirva como un verdadero manual de consulta para mis alumnos de primer año de Ingeniería de Sistemas de la Universidad ALAS Peruanas, donde se enseña el arte de crear páginas web y cuyos resultados puedes ver en Páginas web de alumnos de UAP.
Este MANUAL pretende ser una introducción básica al lenguaje HTML, para ayudarte a escribir tu página Web. Su orientación es más bien práctica y solo reflejan mis escasas experiencias en el campo.
A continuación me permito darte unas pocas referencias, para que el interesado en profundizar consulte directamente y por qué no: me haga llegar sugerencias, opiniones, correcciones, consejos y aportes a este trabajo.
Referencias
Libros:
Como crear pagina de la Web - Guia visual - MaranGraphics
Hay 3 niveles en los que puedes trabajar con códigos HTML:
Editor texto:
Puedes usar el EDIT de DOS o el NOTEPAD de Windows, aunque también WORD y EXCEL pueden convertir documentos desde su formato hasta el HTML, solo que tendrás que depurarlos manualmente. Si no quieres hacer tanta chamba puedes usar un editor especializado aqui varios:
Editores HTML basados en texto
Basicamente te presentan la pantalla con el texto y los códigos HTML (resaltados de diferente color), te ayudan con menús, barras de botones y asistentes que te guían en la tarea.
Pretenden hacerlo todo por ti y eso siempre es peligroso. Introducen etiquetas basura haciendo tu página más grande de lo necesario. Debo reconocer que no requiere que sepas ni un solo etiqueta HTML para hacer una página Web, ya que ni siquiera verás los códigos HTML.
Si quieres crear algunos efectos especiales como: contador de visitas, contadores descendentes, libro de visita, imágenes aleatorias, banners, gif animados, máquinas de búsqueda etc, puedes buscar en...:
Bimsan's Web Graphics Cientos de fondos, botones, barras divisoras y gráficos de bienvenida para utilizar gratis.
Web Graphics & Links Collection Letras del alfabeto, animales, animaciones, flechas, fondos, bolas, banners, barras divisoras, fondos con bordes, botones, íconos y mucho más.
The Graphic Station Cientos de íconos, barras, líneas, gráficos, bolas y animaciones.
Heráldica Más de 1000 Escudos de apellidos españoles.
Cris Web Una de las mejores colecciones de gráficos originales para páginas web, disponible en castellano, en continua actualización.
Medium Ice Graphics Botones, gráficos y todo 3D. Prohibido el uso comercial de los gráficos.
Color Vivo Gráficos para tu web: 305 gráficos, entre fondos, barras, íconos y animaciones.
Dimpres Gratis Página donde encontrarás gran cantidad de material gráfico: Banderas, Fondos, Botones, Pastillas, Ilustraciones, Fotos, Animaciones, etc...
WebStore Aquí encontrarás una colección de elementos gráficos y sonoros con los que podrás ilustrar tus páginas del Web (bolas, botones, fondos, líneas, GIFs animados y sonidos). Encontrás también enlaces a otros sitios similares, para poder navegar por la red y ampliar así la búsqueda de estos elementos. Además tutoriales para aprender a usar las imágenes, los fondos, los gifs animados, los sonidos y otras cosas más.
Home Page de Rafa Página personal con varios fondos, íconos y logos divisores.
Gi Wizard Servicio para reducir hasta en un 90% el tamaño de sus archivos GIF.
ABCtec Muchas fonts para elegir y usar libremente.
Divide by Zero Fonts Colección de fuentes Truetype, que pueden ser usadas personalmente y no en forma comercial.
Art Gallery Gráficos 3D, barras, números, letras y más gráficos.
Jim's Cool Icons GIF pequeños de planetas, nombres, bolas o luces.
Web Graphics Colección de fondos, animaciones, fotos, enlaces, gráficos 3D y chat.
Being Seen Colección de bolas, botones 3D, bolas con texturas, divisores de páginas y animaciones.
Bonsais Colección de pequeños gráficos sobre bonsais.
Giveaways Colección de fondos, botones, flechas y líneas, entre otras cosas.
Glyph Web Colección de fondos, íconos, botones, reglas, separadores, animaciones y logos.
Andy's Art Attack Este sitio contiene más de 100 animaciones originales, botones, flechas y fondos.
Fairy Suryana High Quality GIFs Cientos de GIFs (algunos animados) de excelente calidad para elegir y poner libremente en tu página
Beat Factory Galería 3D, GIFs animados, íconos gratis, efectos neón y espejo, letras y botones 3D.
La Güeb del fondo Recopilación de más de 162 fondos para usar en tu página. Permite probar los fondos antes de grabarlos.
3DS y GIFs animados Varios archivos 3DS y GIFs animados muy buenos para usar.
Adan Art's & Design Este sitio está dedicado a recopilar los mejores gráficos de Internet y explicar de forma específica cada una de las formas de diseño y creación de estos (Imágenes para web, tutoriales de PhotoShop, CorelDraw, 3D Studio, GIFs animados y fuentes).
Albertos Digital Esta página contiene gráficos animados, sonidos e imágenes interactivas realizadas con Macromedia Flash. Para ver esta página es necesario cargar el plug-in de Macromedia.
GIFs Animados Aquí encontrarás todos los GIFs animados que desees usar para tu página web.
Grupo S.K.CyBeRDReaMS Gráficos GIFs, GIFs animados, Frames, HTML, Javascript, aplicaciones para Internet, documentación sobre HTML, Java, CGI's y manuales.
Cybernettix 150 GIFs animados y más de 100 textos 3D.
Animation Creations Sitio muy completo con más de 1500 GIFs animados y animaciones de Shockwave Flash.
Rose's Everything Links Más de 700 enlaces a sitios con fondos, 400 GIFs animados, Java Applets y Software.
3D_Spain Lista de correo para mantenerse informado sobre modelaje y animación en 3D. Además el sitio posee un chat propio, imágenes y enlaces a sitios similares.
Página Personal de Angie Enlaces a sitios gratuitos, gráficos, contadores, graficoses, música, software y más.
Página QWERTY Aqui encontrarás GIFs animados, MIDIs y muchas más cosas útiles para la navegación.
CardoWeb Creación gratis de logos 2D y 3D para empresas y particulares. Creación a gusto del solicitante en menos de 15 dias.
Sebasfont - Fuentes TrueType Freeware Página donde se recogen una serie de fuentes TrueTyep Freeware, disponibles par utilizar en cualquier trabajo de impresión tanto gráfica, como escrita.
Fondos Cerca de 20 fondos para tu página personal y un código Java para incluir en tu página que permite a tus visitantes la posibilidad de cambiar el color de fondo del sitio.
Zona Multimedia GIFs animados clasificados en varias categorias para todos los gustos: objetos, líneas, textos, signos, animales, gráficos y muchos más.
Demos VRML Demos 3D VRML que, gracias a la nueva tecnología de Realidad Virtual, permiten ver animaciones en tres dimensiones.
Gráficos de Albino Cientos de gráficos de todas clases: animales, personas, gráficos para paginas web varios más.
Diseño Gratis Diseño gratuito de un logo o banner a cambio de insertar un enlace a este sitio.
FontFace Algunas fuentes muy buenas para usar en Windows.
Create 8 Gran variedad de fuentes, freeware y shareware.
Un Poco de Todo Página de diversos contenidos, con recursos para crear tu propia web, ayuda en el proceso de creación, gráficos, MIDIs, GIFs animados y fondos.
GraficsTodos los gráficos que quieras utilizar en tu web puedes encontrarlos aqui.
Biblioimagen Biblioteca de imágenes en formatos eps, jpg y gif.
Intercambio de Banner
Banners de todo tipo que alegraran tu pagina.
Vincles Intercambio de banners en español. Los banners deben ser de 400x45 pixels de tamaño y de no más de 256 colores.
JopiBanner Los banners deben ser formato GIF, con un tamaño de 400x50 pixels y no ocupar más de 8k (1k=1024 bytes). Se permiten gifs animados. En español.
Galeria de Banners Es un intercambio de banners entre sitios. Ellos ponen tu banner en su sitio y el banner de ellos lo debes poner en tu sitio. Tu banner debe ser de un tamaño de 400x40, no ser animados y no sobrepasar los 7k.
BannerVen Por cada 2 veces que un banner es visualizado en tu sitio, una vez es tu banner visualizado en otra página. Los banners deben ser de 400x40, no animados y de no más de 10k
Minibanner Permite tener en una misma página hasta cuatro banners para aumentar las posibilidades de visitas a tu sitio. Los banners son de 105x50 y pueden ser animados y transparentes.
La Borsa del Banner Sistema de Intercambio de banners en italiano. Los banners tiene que ser de 460x55 pixels y pueden ser animados.
CyberLink Exchange En inglés. Los banners deben ser de 400x40 y no superar los 7k.
SmartClicks En inglés. Los banners tiene que ser de 400x50, en formato GIF, de no más de 10k de tamaño, pudiendo ser animados o no.
Net-On's Banner Exchange El único sistema de intercambio de banners en varios idiomas, incluído el español. Los banners tiene que ser de 468x60, pueden ser animados y no hay límite de tamaño aunque si es más chico se carga más rápido.
Spanishbanner El sistema de intercambio en español más popular y utilizado. Los banner deben ser de 400x50, pueden ser animados y transparentes, y no deben superar los 8k de tamaño.
BannerSwap En inglés. Los banners deben ser de 400x50, en formato GIF, y de no más de 8k.
LinkExchange Es uno de los sistemas de intercambio de banners más difundidos en Internet. Los banners son de 400x40, en formato GIF, no transparentes, pueden ser animados y de no más de 7k.
InterSites En portugués. Los banners son de 400x40, no más de 10k de tamaño, no transparentes y pueden ser animados.
Elos Lusitanæ En portugués. Los banners deben ser en formato GIF o JPEG, de 400x60 o 460x55 y de no más de 10k.
Banner World Página con cientos de banners para elegir y utilizar en tu pagina. Prediseñados, sólo hay que agregarles el nombre de tu página.
Atajos-Intercambio Servicio de intercambio de banners. Los banners deberán tener un tamaño de 400x45, no ser más grandes de 6k y no pueden ser transparentes ni animados.
Pegatinas Servicio de intercambio de banners. Los banners tienen que tener el tamaño 400x45 y ser formato GIF.
Banner Generator Creación de banners personalizados de cualquier tamaño en menos de 1 minuto.
El InterCambio Servicio de intercambio de banners. Los banners deben tener el tamaño de 468x60 y no más de 9k.
Publi-Banner Sistema de intercambio de banners, de tamaño 450x50 y menos de 10k.
Banner 100x100 Sistema de intercambio de banners en español. Dan un ratio de 1:1 y el banner debe ser de 100x100.
Avanzados:
Los efectos de alto nivel solo los consigues con JAVA, JAVA Script, Visual BASIC Script, ActiveX, VRML o CGI's, pero son algo más complicados que el simple HTML:
JAVA:
Lenguaje de programación de Sun Microsystem independiente de la plataforma (Win, Mac o Unix), descendiente del C++, que se ejecuta en el cliente. Nombres comerciales: Café de Symantec, Visual J++ de Microsoft o Jamba de AimTech. Pero también puedes conseguir algunas APPLETS gratis y usarlos no es nada del otro mundo como podrás ver en el capítulo sobre JAVA de este mismo manual o ir aqui o a JAVA SUN home page.
JAVA Script:
Lenguaje orientado a objetos, que reacciona a eventos en tiempo real, para el desarrollo de aplicaciones en páginas HTML. Originalmente denominado Live Script, fue desarrollado por Netscape, e implementado en el Navigator 2.0. La aparición del JAVA Script produjo una importante revolución, ya que dio al usuario la posibilidad de crear aplicaciones "on-line" osea modificar páginas web en tiempo real, sin usar CGI´s. Para más información consulta mi manual de JavaScript.
Visual BASIC Script:
El VBScript de Microsoft, aparece un poco después que el JAVA Script y resulta un buen competidor de éste.
ActiveX:
Se puede crear aplicaciones en cualquier lenguaje como Visual Basic, C++ o Delphi, también son multiplataforma.
VRML:
El Virtual Reality Modeling Language crea mundos tridimensionales, que no requieren de saber programar porque son herramientas gráficas.
CGI's:
Common Gateway Interface, permite procesar programas escritos en cualquier lenguaje, aunque los más usados en Internet son el Perl y el C. Estos programas corren en el servidor y tienen la ventaja de no cargar al cliente ya que lo que se transfiere son solo los parámetros y esta aplicación devuelve los resultados.
Matt's Script Archive Varios CGIs gratuítos, además de programas y ayuda con los scripts.
FreeCode Página en inglés con informacion y scripts, clasificados en chat, libros de visitas, e-mail, lista de correo, graficos, HTML y contadores.
The CGI Resources Más de 1100 recursos e información relacionada con CGIs, clasificados en secciones como programas, scripts, documentos y articulos en revistas o libros.
Formularios vía web Tiene un programa CGI que te permitirá que los formularios en tu web vayan vía web, sin necesidad de que tu proveedor te autorice los CGIs.
Librería de CGIs Libreria con CGIs gratuitos, tal como Libro de Visitas, Base de Datos, Estadisticas o Contadores.
Remote Software Algunos CGIs gratuitos: lista de correo, formularios, autoresponder, etc.
OrbitCycle OrbitCycle te permite tener un servicio de intercambio de banners como SpanishBanner o LinkExchange dentro de tu sitio. Lo único que debes hacer es insertar el código que te ofrecen en tus páginas. Con este CGI podrás tener varios banners rotativos en tus páginas.
FAQ de CGIs Todas las preguntas que te pudieras imaginar están en esta página. Totalmente en español.
Sonido:
La mejor forma de poner sonido es así: <A HREF=uap.wav>Escucha nuestro himno (90K)</A> pero también puedes asociar un sonido a un área de tu mapa de bits, pero nuevamente sea breve. Una buena ayuda es usar un compresor WAV gratis como: ToolVox de Voxware un compresor de WAV de 53:1, lo malo es que hay que enlazar al sitio para el que el visitante jale el ToolVox Player.
Lanzadera ******
Es un servicio de redireccionamiento de páginas web en español. Posee servicios como el Top40 para promover tu pagina.
VisitWeb *****
Permite registrar gratuitamente tu sitio para que tenga la dirección "http://visitweb/lo-que-quieras", sin necesidad de escribir "http://www" ni la terminacion ".com" del dominio.
CBJ.NET ****
Servicio de redireccionamiento de páginas web en formato: "http://lo-que-quieras.cbj.net"
Homepage.Nu ****
Otro servicio de redireccionamiento con el formato: "http://lo-que-quieras.homepage.nu"
Easy.to/REMEMBER **
Permite llamar a tu página "http://pagina.de/lo-que-quieras" o "http://lo-que-quieras.pagina.de" o "http://hello.tolo-que-quieras" o "http://i.amlo-que-quieras".
Bounce.to ***
Actualmente esta reformando su sitio, por lo que no acepta miembros nuevos, pero es buy popular, hay que estar atento.
V3 Redirect Services
Permite varias opciones como: "http://surf.to/lo-que-quieras", "http://fly.to/lo-que-quieras", etc..
Come.to ***
Se permite la clasificacion del sitio en distintas categorias. Te propone dominio como: "http://come.to.lo-que-quieras" y muchos otros mas.
InternetJump ***
Servicio de redireccionamiento con dos formatos a elección: "http://Fast.to/lo-que-quieras " o "http://www.internetjump.com/lo-que-quieras"
CyberLink **
Servicio de redireccionamiento de páginas web en formato: "http://CyberLink.To/lo-que-quieras"
WebFront **
Este servicio redirecciona tu página web a la dirección "http://www.onesky.com/lo-que-quieras"
Telef.com **
Redireccionamiento para su página en Internet en formato: "http://www.telef.com/lo-que-quieras"
Redireccionamiento Salman.Nu **
Servicio de redireccionamiento de páginas web, con el formato: "http://salman.nu/lo-que-quieras"
Mega Url **
Servicio de redireccionamiento de URLs a la dirección que deseas. Por ejemplo: "http://raul-khalil.com/lo-que-quieras.htm"
Monolith *
Tiene algunos problemas porque hay veces que no puede conectarse con la pagina, no por lentitud, sino por problemas en Monolith. No es aconsejable ya que si sucede algo con este servidor la paginas personales incluidas aqui no podran ser visitadas.
Servicos DNS:
The Public DNS Service (http://soa.granitecanyon.com)
Este servicio ofrece servidor primario y secundario de DNS gratis.