MANUAL 1 HTML VICTOR

451 views

Published on

Manuales de html básico para prácticar.

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
451
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
9
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

MANUAL 1 HTML VICTOR

  1. 1. IESTP “SAN PEDRO DEL VALLE DE MALA” UNIDAD DIÁCTICA TALLER DE PROGRAMACIÓN DISTRIBUÍDA ACTIVIDAD DE APRENDIZAJE Nº 1 Introducción a Internet vs World Wide Web (HTML).HISTORIA:Internet se ha convertido en algo omnipresente que es difícil imaginarse la vida sin ella.Al mismo tiempo, es difícil imaginarse la vida también si la www. Pero solo porque Internet y laWWW estén fuertemente entrelazados no significa que sean lo mismo.Se ha dicho que la guerra ha contribuido a desarrollar invenciones que luego resultaron útilespara la Humanidad. En el caso de la Guerra Fría (el periodo de tensiones entre Estados Unidosy el bloque soviético que siguió a la 2ª Guerra Mundial) es bastante cierto. Recordemos lasituación: las dos superpotencias participaban en la escalada atómica. Al tiempo, la carreraespacial no podía esconder, bajo sus llamadas a la aventura, el interés estratégico de laocupación del espacio. En toda guerra la información es vital, y precisamente el origen deInternet fue la necesidad de un sistema de comunicaciones que sobreviviera a un conflicto.Para explicarlo todo mejor, volvamos a los comienzos. Todo se inicio en 1958 en la agencia deproyectos de investigación avanzada, más conocida como ARPA para aumentar los avancestecnológicos de EEUU en la sombra tras el lanzamiento por parte de Rusia del Sputnik.A principio de los años 60, la idea flotaba entre diversas instituciones americanas, como elMassachussetts Institute of Technology y la corporación RAND. Leonard Kleinrock del MITpublicó en julio de 1961 el primer trabajo sobre "conmutación de paquetes" (la tecnología quepermitía dividir los datos y que recorrieran rutas distintas). El Pentágono, a través de suAgencia de Proyectos de Investigación Avanzada (ARPA en sus siglas inglesas) financió lapuesta en marcha de una prueba práctica. En 1969, el año que el hombre llegó a la Luna, seabría el primer nodo de la red ARPANET, en la Universidad de California en Los Angeles.La primera conexión exitosa se dio el 29 de Octubre de 1969 con una conexión de redARPANET entre 2 equipos. Con el tiempo se fueron agregando más y mas ordenadores.APUNTE:  ARPANET desapareció como tal en 1989, pero muchas instituciones (de la NASA al Departamento de Energía) ya habían creado sus propias redes, que podían comunicarse entre sí. El número de servidores en la red superaba los 100.000.DOCENTE: VICTOR CHUMPITAZ AVALOS. Página[1]MODULO: DESARROLLO DE SOFTWARE Y GESTIÓN DE BASE DE DATOS
  2. 2. IESTP “SAN PEDRO DEL VALLE DE MALA” UNIDAD DIÁCTICA TALLER DE PROGRAMACIÓN DISTRIBUÍDA ACTIVIDAD DE APRENDIZAJE Nº 1  En 1992 - con más de un millón de servidores en la red - se creó la Internet Society, la "autoridad" de la red. WORLD WIDE WEB Creación del Sistema de Hipertexto (HTML: “Hypertext Marcup Language” o “Lenguaje de marcación de Hipertexto”)En informática, la World Wide Web es un sistema de documentos de hipertexto ohipermedios enlazados y accesibles a través de Internet. Con un navegador web, unusuario visualiza sitios web compuestos de páginas web que pueden contener texto,imágenes, videos u otros contenidos multimedia, y navega a través de ellas usandohiperenlaces.La Web fue creada alrededor de 1989 por el inglés Tim Berners-Lee y el belga RobertCailliau mientras trabajaban en el CERN en Ginebra, Suiza, y publicado en 1992. Desdeentonces, Berners-Lee ha jugado un papel activo guiando el desarrollo de estándaresWeb (como los lenguajes de marcado con los que se crean las páginas web), y en losúltimos años ha abogado por su visión de una Web Semántica.APUNTE:  En 1992 - con más de un millón de servidores en la red - se creó la Internet Society, la "autoridad" de la red.  Con la extensión de los ordenadores personales y el lanzamiento del primer navegador de la WWW popular, Mosaic, en 1993, ya había llegado el momento de "surfear la Web" (la expresión se registró por primera vez ese mismo año).URL(Uniform Resource Locator - Localizador Uniforme de Recursos). Forma de organizar lainformación en la web.Una URL es una dirección que permite acceder a un archivo o recurso como ser páginashtml, php, asp, o archivos gif, jpg, etc. Se trata de una cadena de caracteres que identificacada recurso disponible en la WWW.Las URL fueron usadas por primera vez por Tim Berners-Lee en 1991 con el fin de podercrear enlaces entre distintas páginas en la WWW. Desde 1994 el término URL seincorpora a un concepto más general, el URI, pero igualmente se sigue utilizando URL.Las URL de protocolo HTTP son las típicas direcciones a una página web, por ejemplo: Carpeta Archivo Protocolo Nombre DominioDOCENTE: VICTOR CHUMPITAZ AVALOS. Página[2]MODULO: DESARROLLO DE SOFTWARE Y GESTIÓN DE BASE DE DATOS
  3. 3. IESTP “SAN PEDRO DEL VALLE DE MALA” UNIDAD DIÁCTICA TALLER DE PROGRAMACIÓN DISTRIBUÍDA ACTIVIDAD DE APRENDIZAJE Nº 1  El protocolo HTTP es el conjunto de normas para la que archivos y otros datos se transfieran entre equipos.  Nombre de Dominio es el que ayuda a identificar y localizar computadoras en Internet. Para evitar confusiones, cada nombre de dominio es único y se puede considerar como un rótulo o un atajo. Detrás de este atajo hay una serie de números, llamada dirección IP, que corresponde a la dirección específica del lugar en donde está localizado el Sitio que está buscando en Internet.  Carpeta es la el Directorio que contiene el Archivo o Página Web.  Archivo es el que contiene una serie de Códigos HTML. Que mas adelante vamos a explicar. Nota: Aunque muchos URL comienzan con WWW, esto no es indispensable Originalmente se usó para identificar a la Word Wide Web en el URL, pero ahora se ha convertido en una Práctica Común. Los caracteres antes del primer punto en el URL no son parte del dominio registrado y pueden ser casi cualquier cosa.Servidores WebLos Sitio y las páginas Web también necesitan un servidor Web. En términos muy sencillos unservidor Web es una Computadora que funciona con un software que siempre está conectadoa Internet.Cuando usted escribe un URL en su Navegador de la Web, o hace clic en un enlace que seencuentra en una página Web, envía una solicitud al servidor que recibe la información. Elproceso es similar cuando marca un número Telefónico en su teléfono.Su solicitud “llama” a la computadora que contiene todos los archivos necesarios paramostrarle la página Web que usted solicita. Entonces, la computadora le “Sirve” y presenta enpantalla todas las páginas, usualmente en su navegador.SitiosEn general, un URL se asocia con un sitio Web. Usted puede haber visto multitud de ejemplosen carteleras y en publicidad que se presentan por televisión www.yahoo.com es el URL delsitio Web de Yahoo! www.cbs.com es el URL del sitio Web de la CBS.Lo más habitual es que estos sitios estén localizado en directorios o carpetas en el servidor, talcomo podrían estarlo en el drive C: de su computadora personal. Luego, dentro de este sitioprincipal, puede haber varias carpetas, las cuales alojan otras secciones del sitio Web.Por ejemplo, Chop Point es un campamento de verano y una escuela de educación media,ubicado en Maine. Tiene varias secciones en su sitio Web, pero las más conocidas son “camp”y “school”. Si observa el URL de la sección del campamento de Chop Point, puede ver elnombre de la carpeta después del nombre del sitio:www.choppoint.org/campSi se dirige a la página principal de la escuela, el URL cambia a:www.choppoint.org/schoolDOCENTE: VICTOR CHUMPITAZ AVALOS. Página[3]MODULO: DESARROLLO DE SOFTWARE Y GESTIÓN DE BASE DE DATOS
  4. 4. IESTP “SAN PEDRO DEL VALLE DE MALA” UNIDAD DIÁCTICA TALLER DE PROGRAMACIÓN DISTRIBUÍDA ACTIVIDAD DE APRENDIZAJE Nº 1Primeros pasos para aprender a hacer una página web1. Planteamiento de objetivos para tu página webEsta etapa es muy importante y con frecuencia se pasa por alto. Se trabaja en el papel paraplantearnos el proyecto y qué queremos conseguir al realizar nuestra web. La planificación detu web debe incluir: Breve descripción de los contenidos de la página, su título principal, etc. Finalidad que persigo al hacerla (informar, hacer negocio, entretener, etc.) Páginas parecidas a la mía, qué puedo ofrecer yo que no tengan ellas para atraer a mi público objetivo, etc. Hardware, software, documentación que necesito para realizarla y de qué dispongo realmente. Describir cuál es mi publico objetivo, nivel informático, idiomas, intereses, problemas físicos, etc. para adaptar la página a sus características. Dónde se va a visualizar la web; navegadores más utilizados, plugins, elementos específicos, etc.2. Estructurar el contenido de la PáginaEs conveniente que dibujemos un organigrama con todas las partes del sitio web,distribuyendo el texto, los gráficos, los vínculos a otros documentos y otros objetosmultimedia que se consideren pertinentes, mediante el cual ir creando la estructura de lapágina web. Antes de empezar a desarrollar tu página web en el ordenador, debes tener muyclaro cuáles serán sus contenidos, su estructura, el nombre de la página, etc. cosas que no sedeben hacer sobre la marcha para evitar rectificaciones innecesarias, trabajo inútil y pérdidasde tiempo. Hay varias maneras de estructurar el contenido de una web:  En árbol: Esta estructura está compuesta por una página principal que enlaza con otras páginas, las cuales, a su vez, enlazan con otras páginas de nivel inferior. De esta manera se agrupan las páginas web en niveles, de tal modo que para llegar del primero al último se debe pasar por todos los intermedios. Esta estructura es poco navegable si tenemos una web con muchas páginas, porque para ver las páginas de otra rama tenemos que retroceder hasta la página principal, haciendo la navegación muy pesada.DOCENTE: VICTOR CHUMPITAZ AVALOS. Página[4]MODULO: DESARROLLO DE SOFTWARE Y GESTIÓN DE BASE DE DATOS
  5. 5. IESTP “SAN PEDRO DEL VALLE DE MALA” UNIDAD DIÁCTICA TALLER DE PROGRAMACIÓN DISTRIBUÍDA ACTIVIDAD DE APRENDIZAJE Nº 1  En lista: Esta estructura es la opuesta a la anterior. En ella no existe página principal ya que todas están en el mismo nivel. Para llegar a la última página hay que recorrer todas las anteriores. Es una estructuración muy adecuada para la presentación de manuales o aplicaciones donde el usuario deba recorrer forzosamente una serie de páginas web para conseguir su objetivo.  Mixta: Esta estructura es una combinación de las dos anteriores. Las páginas están jerarquizadas en niveles, los cuales a su vez están conectados entre sí en forma de lista. Esta estructura es mucho más navegable y práctica, puesto que permite poder desplazarse de rama en rama sin necesidad de volver a la página principal para hacerlo.  En red: Esta estructura supone que todas las páginas de la web están conectadas entre sí, por lo que es una estructura más compleja y menos ordenada. Su ventaja es que desde cada página podemos ir a cualquier otra del sitio. No obstante, requiere mucha planificación para evitar ofrecer al visitante un caos de enlaces innecesarios.Una vez tengas claro lo que quieres hacer y su estructura básica puedes empezar a recopilarinformación para confeccionar cada sección de tu página web. Conforme vayas investigandosobre el tema de la web, casi con seguridad irás realizando modificaciones tanto en suestructura como en sus contenidos para adaptarla mejor a lo que has aprendido, por lo que esconveniente que trabajes sobre borradores, no con versiones definitivas, te ahorrarás muchotrabajo. Por ejemplo, puedes haber decidido hacer una web sobre Ferrari, y en cuanto a sudiseño querer colocar un menú a la izquierda con las secciones principales, un cuerpo centralcon el contenido de la sección y una última columna a la derecha donde insertar tu publicidad.No obstante, puede ocurrir fácilmente que al buscar información sobre su escuderíaencuentres tanta y tan diversa que llegues a la conclusión de que es más cómodo para losvisitantes colocar un menú de navegación específico de la sección en la izquierda y el principalen la derecha para que puedan navegar por la sección con rapidez. Por lo que si ya hiciste lapágina definitiva de la sección llamada escudería, tendrás que retocarla para adaptarla a tusnuevas necesidades, lo que supone un gasto de tiempo y esfuerzo innecesario.DOCENTE: VICTOR CHUMPITAZ AVALOS. Página[5]MODULO: DESARROLLO DE SOFTWARE Y GESTIÓN DE BASE DE DATOS
  6. 6. IESTP “SAN PEDRO DEL VALLE DE MALA” UNIDAD DIÁCTICA TALLER DE PROGRAMACIÓN DISTRIBUÍDA ACTIVIDAD DE APRENDIZAJE Nº 13. Diseñar la página web Una vez tengas hecha la estructura, recopilada bastante información y completado el contenido de varias secciones, tienes suficiente material como para saber con más precisión lo que quieres, por lo que puedes empezar a diseñar gráficamente cada una de las páginas de tu web, indicando los elementos interactivos y gráficos que van a intervenir en cada una. Para esto, y fundamentalmente para manejar los vínculos entre documentos, se creó el lenguaje HTML. El HTML es un lenguaje de marcación diseñado para estructurar textos y presentarlos en forma de hipertexto, que es el formato estándar de las páginas web. A la hora de empezar con el diseño, ten en cuenta que:  La estructura de la página debe ser lo más lógica posible facilitando la navegación a tus visitantes (es importante en este punto la usabilidad). Ninguna página puede quedar huérfana, es decir, todas las páginas deben de tener enlaces a otras páginas. Si esto ocurre, es probable que el usuario cierre nuestra página y entre en otra en la que le sea más fácil navegar por los contenidos.  Aunque no es un requisito necesario, sí que es muy aconsejable que aprendas HTML, ya que así podrás hacer todo lo que quieras sin depender de editores gráficos como Dreamweaver (ver manual Dreamweaver), tendrás más flexibilidad y opciones a la hora de realizar tus diseños, podrás corregir tu código y saber qué es lo que falla cuando te de errores, entenderás cómo funcionan las páginas de otros webmasters, etc. En esta misma página, hay un manual HTML muy completo que puedes mirar.  Aprender a usar otras técnicas, como las hojas de estilo (CSS) te será muy útil para crear una página atractiva y bien diseñada. Con las hojas de estilo puedes crear un archivo que te sirva para dar una mejor apariencia a todas tus páginas a la vez, y siempre que quieras cambiar el aspecto de tu web, sólo tendrás que modificar ese archivo en lugar de ir una por una revisando cada página de la misma. Si quieres aprender a usar este lenguaje, en esta misma web hay un manual completo de hojas de estilo o CSS.DOCENTE: VICTOR CHUMPITAZ AVALOS. Página[6]MODULO: DESARROLLO DE SOFTWARE Y GESTIÓN DE BASE DE DATOS

×