Arteaga Corona Rocio
6-1
SUBMODULO III
ELABORACION DE PAGINAS WEB
Evaluación diagnostica:
Que es una red: Una red de computadoras, también llamada red de ordenadores, red de comunicaciones de datos o red informática, es un conjunto de equipos informáticos y software conectados entre sí por medio de dispositivos físicos que envían y reciben impulsos eléctricos, ondas electromagnéticas o cualquier otro medio para el transporte de datos, con la finalidad de compartir información, recursos y ofrecer servicios.[]
LAN: Son las siglas de Local Area Network, Red de área local. Una LAN es una red que conecta los ordenadores en un área relativamente pequeña y predeterminada (como una habitación, un edificio, o un conjunto de edificios).
WAN: Son las siglas de Wide Area Network, red de área amplia, una red de ordenadores que abarca un área geográfica relativamente grande. Normalmente, un WAN consiste en dos o más redes de área local (LANs). Los ordenadores conectados a una red de área ancha normalmente están conectados a través de redes públicas, como la red de teléfono. También pueden estar conectados a través de líneas alquiladas o de satélites. El WAN más grande que existe es Internet.TOPOLOGIA FISICA: Topologías Físicas Los cables son generalmente de dos tipos: UTP par trenzado y coaxil. La manera en que están conectadas no es arbitraria, sino que siguen estándares físicos llamados topologías. La manera en que están conectadas no es arbitraria, si no que siguen estándares físicos llamados topologías.
RED HIBRIDA: En la terminología de redes, una red híbrida (también llamada topología de red híbrida) combina las mejores características de dos o más redes diferentes. De acuerdo con "Auditoría y Control de la Tecnología de la Información", las topologías híbridas son confiables y versátiles. Estas proporcionan un gran número de conexiones y caminos de transmisión de datos para los usuarios. Las redes más reales son las híbridas, de acuerdo con "Lecturas sobre telecomunicaciones y redes”.
RED ESTRELLA: Una red en estrella es una red en la cual las estaciones están conectadas directamente a un punto central y todas las comunicaciones se han de hacer necesariamente a través de este. Los dispositivos no están directamente conectados entre sí, además de que no se permite tanto tráfico de información. Dada su transmisión, una red en estrella activa tiene un nodo central activo que normalmente tiene los medios para prevenir problemas relacionados con el eco.
RED DE BUS LINEAL: Una red en estrella es una red en la cual las estaciones están conectadas directamente a un punto central y todas las comunicaciones se han de hacer necesariamente a través de este. Los dispositivos no están directamente conectados entre sí, además de que no se permite tanto tráfico de información. Dada su transmisión, una red en estrella activa tiene un nodo central activo que normalmente tiene los medios para prevenir problemas relacionados con el eco.
SERVIDOR: En informática, un servidor es un nodo que forma parte de una red, provee servicios a otros nodos denominados clientes. También se suele denominar con la palabra servidor a: Una computadora en la que se ejecuta un programa que realiza alguna tarea en beneficio de otras aplicaciones llamadas clientes, tanto si se trata de un ordenador central (mainframe), un miniordenador, una computadora personal, una PDA o un sistema embebido; sin embargo, hay computadoras destinadas únicamente a proveer los servicios de estos programas: estos son los servidores por antonomasia.
QUE ES UN NAVEGADOR: Un navegador o navegador web (del inglés, web browser) es una aplicación que opera a través de Internet, interpretando la información de archivos y sitios web para que éstos puedan ser leídos (ya se encuentre esta red mediante enlaces o hipervínculos).
QUE ES UN BUSCADOR: Un buscador es una página de internet que permite realizar búsquedas en la red. Su forma de utilización es muy sencilla, basta con introducir una o más palabras clave en una casilla y el buscador generará una lista de páginas web que se supone guardan relación con el tema solicitado. Digo se supone porque como veremos más adelante, esto no es siempre así.
Aunque el modo de utilización es muy fácil a nivel básico, los buscadores permiten opciones avanzadas para refinar la búsqueda, cuyo resultado puede ser en muchas ocasiones de miles de páginas. Mediante estas opciones avanzadas se puede acotar la búsqueda y obtener un número de páginas más manejable.
Aunque el modo de utilización es muy fácil a nivel básico, los buscadores permiten opciones avanzadas para refinar la búsqueda, cuyo resultado puede ser en muchas ocasiones de miles de páginas. Mediante estas opciones avanzadas se puede acotar la búsqueda y obtener un número de páginas más manejable.
SIGLAS WWW: World Wide Web esto sería en español una manera de decir que estamos hablando de una Red ("Web" telaraña o red) Que une al mundo entero ("World wide") podemos imaginar que al hablar de una pagina de internet esto es una referencia para anticiparnos que es un sitio del ciberespacio unido a la red mundial de comunicación.
SIGNIFICADO DE WEB: [se pronuncia aproximadamente 'ueb'] s. f. Documento de Internet que puede contener texto, gráficos, sonidos o animaciones, generalmente escrito en lenguaje HTML y que permite la relación con otros documentos, mediante enlaces.
NOTA También página web.
SIGNIFICA MODEM: Dispositivo de un ordenador que convierte una señal digital en analógica o viceversa y que permite la comunicación con otro ordenador por vía telefónica.
OBS Plural: módemes.
HIPERTEXTO: En informática, es el nombre que recibe el texto que en la pantalla de un dispositivo electrónico, permite conducir a otros textos relacionados, pulsando con el ratón o el teclado en ciertas zonas sensibles y destacadas. La forma más habitual de hipertexto en informática es la de hipervínculos o referencias cruzadas automáticas que van a otros documentos (lexias). Si el usuario selecciona un hipervínculo el programa muestra el documento enlazado. Otra forma de hipertexto es el stretchtext que consiste en dos indicadores o aceleradores y una pantalla. El primer indicador permite que lo escrito pueda moverse de arriba hacia abajo en la pantalla
HIPERMEDIO: Término con el que se designa al conjunto de métodos o procedimientos para escribir, diseñar o componer contenidos que integren soportes tales como: texto, imagen, video, audio, mapas y otros soportes de información emergentes, de tal modo que el resultado obtenido, además tenga la posibilidad de interactuar con los usuarios.
HIPERVINCULO: Vínculo existente en un documento con hipertexto, que apunta o enlaza a un elemento de otro texto o elemento multimedia
URL: Un localizador de recursos uniforme, más comúnmente denominado URL (sigla en inglés de uniform resource locator), es una secuencia de caracteres, de acuerdo a un formato modélico y estándar, que se usa para nombrar recursos en Internet para su localización o identificación, como por ejemplo documentos textuales, imágenes, vídeos, presentaciones digitales, etc. Los localizadores uniformes de recursos fueron una innovación en la historia de la Internet.
HTML: HTML, siglas de HyperText Markup Language («lenguaje de marcado de hipertexto»), hace referencia al lenguaje de marcado predominante para la elaboración de páginas web que se utiliza para describir y traducir la estructura y la información en forma de texto, así como para complementar el texto con objetos tales como imágenes. El HTML se escribe en forma de «etiquetas», rodeadas por corchetes angulares (<,>). HTML también puede describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.[1]
PHP: PHP es un lenguaje de programación de uso general de script del lado del servidor originalmente diseñado para el desarrollo web de contenido dinámico. Fue uno de los primeros lenguajes de programación del lado del servidor que se podían incorporar directamente en el documento HTML en lugar de llamar a un archivo externo que procese los datos
HEAD: Para ser visualizados en Internet, los documentos son salvados en formato texto y contienen las marcas necesarias para informar al navegador (Netscape, MsIe o Explorer) al respecto. En otras palabras, el navegador visulizará en cualquier caso los documentos con texto salvados en formato .htm, pero si éstos carecen de marcas HTML aparecerán sin formato de ningún tipo: sin separación de líneas o párrafos, sin texto alineado, sin negritas, cursivas, etc.
LEFT: SIGNIFICA CORRECTO.
ELLOS LO USAN SOBRETODO CUANDO QUIEREN CONFIRMAR ALGO.RIGHT: SIGNIFICA CORRECTO.
ELLOS LO USAN SOBRETODO CUANDO QUIEREN CONFIRMAR ALGO.
POR EJEMPLO, YOUR NAME IS SARAH, RIGHT?
LO QUE SERIA: TE LLAMAS SARAH, NO?
CENTER: El comando "center" me centraliza el texto que aparece entre ambos comandos.Existen dos maneras en las cuales se puede programar en HTML: la manera rápida o la técnica del "marrón". Por ejemplo: Si tienes una cantidad mayor de un objeto que deseas centralizar lo puedes hacer de las siguientes dos maneras: ELLOS LO USAN SOBRETODO CUANDO QUIEREN CONFIRMAR ALGO.RIGHT: SIGNIFICA CORRECTO.
ELLOS LO USAN SOBRETODO CUANDO QUIEREN CONFIRMAR ALGO.
POR EJEMPLO, YOUR NAME IS SARAH, RIGHT?
LO QUE SERIA: TE LLAMAS SARAH, NO?
Ej. <center>Mi Página Personal<br>
Jorge Rivera Algarín</center>
WIDTH:
Establece la anchura de los elementos de bloque
|
HEIGHT: Un problema muy común cuando se trabaja con bloques div, es el de especficar una altura mínima para ellos. Esta situación se da generalmente cuando se tiene una imagen que flota junto a un texto que lo acompaña; si el texto no tiene la altura de la imagen, el contenido de la página que esté bajo el texto, también se mostrará a la derecha de la imagen, debido a que el div que los contiene toma la altura del texto.
BOTTOM: La propiedad
bottom especifica parte de la posición de un elemento (posicionado - es decir, con una posición determinada por código). Para los elementos con una posición absoluta (aquellos que tienen la propiedad position: absolute o position: fixed), la propiedad bottom determina la distancia entre el borde inferior del elemento y el borde inferior de su bloque contenedor. Para los elementos con una posición relativa (los que tienen la propiedad position: relative), la propiedad bottom determina la distancia que el elemento se mueve hacia arriba desde su posición normal. Sin embargo, la propiedad top se antepone a la propiedad bottom, por lo que si top no es auto, el valor computado de bottom es el valor negativo del valor computado de top.
TOP: Prenda de vestir femenina que va ajustada al cuerpo y cubre solamente el pecho.
Que ocupa el lugar más alto en una gradación.
Modelo profesional de alta costura que está muy cotizado.
Se pronuncia 'top módel'. Plural invariable.
Se aplica al secreto que no se puede revelar bajo ningún concepto.
Plural: tops.
Se pronuncia 'top sécret'
COMMON: El sistema de common-rail o conducto común es un sistema de inyección de combustible electrónico para motores diésel de inyección directa en el que el gasóleo es aspirado directamente del depósito de combustible a una bomba de alta presión y ésta a su vez lo envía a un conducto común para todos los inyectores y por alta presión al cilindro.
INSERT: inserta nuevas filas en una tabla existente. Los formatos INSERT ... VALUES e INSERT ... SET, insertas filas basándose en los valores especificados explícitamente. El formato The INSERT ... SELECT inserta filas seleccionadas de otra tabla o tablas. El formato INSERT ... VALUES con una lista de múltiples valores está soportada por MySQL desde la versión 3.22.5. La sintaxis INSERT ... SET está soportada por MySQL desde la versión 3.22.10.
LAGOUT:L ayout es un término de la lengua inglesa que no forma parte del diccionario de la Real Academia Española (RAE). El concepto puede traducirse como “disposición” o “plan” y tiene un uso extendido en el ámbito de la tecnología.
FRAMES: Se denomina frame en inglés, a un fotograma o cuadro, una imagen particular dentro de una sucesión de imágenes que componen una animación. La continua sucesión de estos fotogramas producen a la vista la sensación de movimiento, fenómeno dado por las pequeñas diferencias que hay entre cada uno de ellos.
FRAMES: Se denomina frame en inglés, a un fotograma o cuadro, una imagen particular dentro de una sucesión de imágenes que componen una animación. La continua sucesión de estos fotogramas producen a la vista la sensación de movimiento, fenómeno dado por las pequeñas diferencias que hay entre cada uno de ellos.
TEMPLOTES: Dentro del marco de la programación orientada a objetos, el patrón Template Method (Método Plantilla o Método Modelo en español) es un patrón de diseño enmarcado dentro de los llamados patrones de comportamiento, que se caracteriza por la definición, dentro de una operación de una superclase, de los pasos de un algoritmo, de forma que todos o parte de estos pasos son redefinidos en las subclases herederas de la citada superclase.
APPLICATION: Application es el objeto raiz del mundo de Flex. De donde se desprenden las interfaces hechas con el Flex Framework. No está relacionado con Flash. ¿Y cómo que lo has visto del lado del servidor? Flex hace años que no está de ese lado. Coméntanos más para poder ayudarte mejor.
TABLES: Table (pronunciado /ˈteɪbəl dæns/), también conocido como bartop dancing es el nombre popular que recibe el tipo de espectáculo que se caracteriza por la presentación de danzas eróticas sobre una plataforma, normalmente una mesa, una pista o una barra.
FILE: FTP (siglas en inglés de File Transfer Protocol, 'Protocolo de Transferencia de Archivos') en informática, es un protocolo de red para la transferencia de archivos entre sistemas conectados a una red TCP (Transmission Control Protocol), basado en la arquitectura cliente-servidor. Desde un equipo cliente se puede conectar a un servidor para descargar archivos desde él o para enviarle archivos, independientemente del sistema operativo utilizado en cada equipo.
MODIFY: Especifica el nombre del archivo para el programa que se va a abrir o crear. Si no especifica una extensión para un nuevo archivo de programa, Visual FoxPro asigna automáticamente la extensión .prg. MODIFY COMMAND admite una estructura de archivo que contenga los caracteres comodín asterisco (*) e interrogación (?). Se abrirá una ventana de edición de texto para cada programa cuyo nombre coincida con la estructura de archivos.
SITE: Sites es una aplicación online gratuita ofrecida por la empresa estadounidense Google. Esta aplicación permite crear un sitio web o una intranet de una forma tan sencilla como editar un documento. Con Google Sites los usuarios pueden reunir en un único lugar y de una forma rápida información variada, incluidos vídeos, calendarios, presentaciones, archivos adjuntos y texto. Además, permite compartir información con facilidad para verla y editarla por un grupo reducido de colaboradores o con toda su organización, o con todo el mundo.Gestione todos sus proyectos empresariales a través de Google Sites compartiendo documentos, publicando información y subiendo reportes, todo en un solo sitio y con la seguridad y los permisos que usted defina. A continuación las características principales de Google Sites:
WINDOWS: Windows (esta última palabra literalmente "ventanas", lo que examinaremos más adelante) es el nombre de los sistemas operativos desarrollados por Microsoft, la afamada corporación multinacional dedicada a todo lo relacionado con la computación. Si bien para quienes no sean versados en temas relacionado con el software no dice mucho, la verdad es que hoy muchas personas pueden decir que Windows es uno de sus más preciados amigos, por lo menos en lo que respecta al uso de la computadora. Ya que su uso es la manera mediante la cual, una persona puede manejar su computadora sin la necesidad de saber programar o comunicarse directamente con la máquina en su lenguaje interno.
DESIGN: Expression Design (antes llamado Expression Graphic Designer, cuyo nombre en código era Acrylic) es una herramienta desarrollada por Microsoft, para los profesionales creativos y desarrolladores que quieran crear gráficos para su aplicación en interfaces de usuario, la web, o cualquier otro medio, ofreciendo potentes funciones que ayudarán a expresar la creatividad.
CODE: Existía un GRAN bug llamado el Code/Decode no se qué. Afecta a viejísimas versiones del Internet Information Server, y permitía ejecutar comandos de la shell directamente poniendolos en la dirección de un browser. Un bug bastante grave... pero que ya pasó a la historia (creo).
UNTITLED: (Untitled) es una película cómica/dramática de 2009 dirigida y escrita por Jonathan Parker y co-escrita por Catherine DiNapoli y protagonizada por Adam Goldberg, Marley Shelton y Vinnie Jones.
INVESTIGACION DEL PROGRAMA DREAMWEAVER:
Adobe Dreamweaver es una aplicación en forma de suite (basada en la forma de estudio de Adobe Flash) que está destinada a la construcción, diseño y edición de sitios, videos y aplicaciones Web basados en estándares. Creado inicialmente por Macromedia (actualmente producido por Adobe Systems) es el programa más utilizado en el sector del diseño y la programación web, por sus funcionalidades, su integración con otras herramientas como Adobe Flash y, recientemente, por su soporte de los estándares del World Wide Web Consortium.Sus principales competidores son Microsoft Expression Web y BlueGriffon (que es de codigo abierto) y tiene soporte tanto para edición de imágenes como para animación a través de su integración con otras. Hasta la versión MX, fue duramente criticado por su escaso soporte de los estándares de la web, ya que el código que generaba era con frecuencia sólo válido para Internet Explorer y no validaba como HTML estándar. Esto se ha ido corrigiendo en las versiones recientes.
Se vende como parte de la suite Adobe Creative Suite. A partir de la compra de Macromedia por parte de Adobe. Las letras CS significan Creative Suite
La gran ventaja de este editor sobre otros es su gran poder de ampliación y personalización del mismo, puesto que en este programa, sus rutinas (como la de insertar un hipervínculo, una imagen o añadir un comportamiento) están hechas en Javascript-C, lo que le ofrece una gran flexibilidad en estas materias. Esto hace que los archivos del programa no sean instrucciones de C++ sino rutinas de Javascript que hace que sea un programa muy fluido, que todo ello hace, que programadores y editores web hagan extensiones para su programa y lo ponga a su gusto.
Las versiones originales de la aplicación se utilizaban como simples editores WYSIWYG. Sin embargo, versiones más recientes soportan otras tecnologías web como CSS, JavaScript y algunos frameworks del lado servidor.
Dreamweaver ha tenido un gran éxito desde finales de los años 1990 y actualmente mantiene el 90% del mercado de editores HTML. Esta aplicación está disponible tanto para la plataforma MAC como para Windows, aunque también se puede ejecutar en plataformas basadas en UNIX utilizando programas que implementan las API's de Windows, tipo Wine.
Como editor WYSIWYG que es, Dreamweaver permite ocultar el código HTML de cara al usuario, haciendo posible que alguien no entendido pueda crear páginas y sitios web fácilmente sin necesidad de escribir código.
Algunos desarrolladores web criticaban esta propuesta ya que crean páginas HTML más largas de lo que solían ser al incluir mucho código inútil, lo cual va en detrimento de la ejecución de las páginas en el navegador web. Esto puede ser especialmente cierto ya que la aplicación facilita en exceso el diseño de las páginas mediante tablas. Además, algunos desarrolladores web han criticado Dreamweaver en el pasado porque creaba código que no cumplía con los estándares del consorcio Web (W3C).
No obstante, Adobe ha aumentado el soporte CSS y otras maneras de diseñar páginas sin tablas en versiones posteriores de la aplicación, haciendo que se reduzca el exceso de código.
Dreamweaver permite al usuario utilizar la mayoría de los navegadores Web instalados en su ordenador para previsualizar las páginas web. También dispone de herramientas de administración de sitios dirigidas a principiantes como, por ejemplo, la habilidad de encontrar y reemplazar líneas de texto y código por cualquier tipo de parámetro especificado, hasta el sitio web completo. El panel de comportamientos también permite crear JavaScript básico sin conocimientos de código.
Con la llegada de la versión MX, Macromedia incorporó herramientas de creación de contenido dinámico en Dreamweaver. En lo fundamental de las herramientas HTML WYSIWYG, también permite la conexión a Bases de Datos como MySQL y Microsoft Access, para filtrar y mostrar el contenido utilizando tecnología de script como, por ejemplo, ASP, ASP.NET, ColdFusion, JSP (JavaServer Pages) y PHP sin necesidad de tener experiencia previa en programación.
Un aspecto de alta consideración de Dreamweaver es su funcionalidad con extensiones. Es decir, permite el uso de "Extensiones". Las extensiones, tal y como se conocen, son pequeños programas, que cualquier desarrollador web puede escribir (normalmente en HTML y Javascript) y que cualquiera puede descargar e instalar, ofreciendo así funcionalidades añadidas a la aplicación. Dreamweaver goza del apoyo de una gran comunidad de desarrolladores de extensiones que hacen posible la disponibilidad de extensiones gratuitas y de pago para la mayoría de las tareas de desarrollo web, que van desde simple efectos rollover hasta completas cartas de compra.
También podría decirse que, para un diseño más rápido y a la vez fácil, podría complementarse con Fireworks en donde se podría diseñar un menú u otras creaciones de imágenes (gif web, gif websnap, gif adaptable, jpeg calidad superior, jpeg archivo más pequeño, gif animado websnap) para un sitio web y después exportar la imagen creada y así utilizarla como una sola en donde ya llevará los vínculos para dicho sitio.
PROGRAMA DE LA ASIGNATURA SUBMODULO III:
ELABORACION DE PAGIONAS WEB, CICLO ESCOLAR 2013.
Objetivo de la asignatura:
1.- Diseñar y programar páginas web.
2.-Conocer las tecnologías HTLM.
COMPETENCIAS GENERICAS:
1.- Sustentar una postura de interés y relevancia sobre temas considerados otros puntos de vista de manera crítica y reflexiva.
2.-Aprender iniciativa e interés propio a lo largo de la vida.
3.-Participar y colaborar de manera efectiva en equipos diversos.
COMPETENCIAS DISCIPLNARES:
1.-Identifica, ordena e interpreta las ideas, los datos y conceptos explícitos e implícitos de un texto considerado el contexto en que se genero y en que se recibe
2.-Expresa ideas y conceptos en condiciones coherentes y creativas con introducción, desarrollo y conclusiones claras.
BLOQUE 1: Utilizar los elementos fundamentales del diseño
Objetivo:
1.- Identifica los elementos básicos de una página web.
2.-Identifica la terminología de las páginas web.
Act. 1: Conocer el programa de la asignatura
Act. 2: Recopilar la terminología de la asignatura
Act. 3: Descripción de los elementos, recursos, tipos y programas para elaborar páginas web.
Act. 4: Conocer la estructura básica de la página.
BLOQUE 2: Manejar los elementos básicos del lenguaje HTLM:
Objetivo: Describir la estructura de una página web.
Act. 1: Proyectar los elementos llamados marcadores de cabeza y párrafos.
Act. 2: De los elementos
Act. 3: Empleo de encabezados estilos, párrafos, etiquetas de caracteres tipos de letra, formatos, bloques y colores.
Act. 4: Vinculación con documentos locales; vinculación con un punto de especifico del documento (enlaces internos) creación de listas.
BLOQUE 3: Diseñar unas páginas web con software de aplicación
Objetivo: crear archivos electrónicos de paginas web por medio de deamweaver.
Act. 1: Proyectar el entorno de dreamweaver.
Act. 2: Descripción de la configuración de deamwearver.
Act. 3: Elaboración de una página web en el entorno de dreamweaner.
Act. 4: Generar páginas, contenido básico encabezado titulo y fondo.
Act. 5: Inserción de listas, tablas e hipervínculos.
Act. 6: Inserción de sonidos y video.
BLOQUE 4: Publicar páginas web
Objetivo: Crear direcciones electrónicas de arrojamiento de páginas web, servidor práctico.
Act. 1: ventajas y desventajas de servidor web
Act. 2: Procedimiento de configuración.
Act. 3: Utilizar las paginas creadas para arrojarlas en un sitio web.
.
. Al conjunto de valores de 
que no escapan al infinito mediante esta operación se le denomina conjunto de Julia relleno, y a su frontera, simplemente conjunto de julia.