7.0 Crear entornos digitales a través del diseño de una red de aprendizaje para la comunicación y el intercambio de información mediante el uso de herramientas de procesamiento de información en la nube.

Diseño de una página web.

·         Conocimiento tecnológico de Internet 

 ¿Qué es Hipertexto?Sistema de organización y presentación de datos que se basa en la vinculación de fragmentos textuales o gráficos a otros fragmentos, lo cual permite al usuario acceder a la información no necesariamente de forma secuencial sino desde cualquiera de los distintos ítems relacionados.

·         ¿Cuál es la estructura básica de un documento Web o HTML?

 Para crear una página web se necesita un documento HTML utilizando tres elementos o tags principales que cualquier sitio Web usa: html, head y body.

·         ¿Qué programas podemos utilizar para el diseño de una página web?

·         Wix

·         SQUARESPACE

·         WEEBLY

·         SITE123

·         GODADDY

  

       

·         ¿Qué es un Administrador de sitios en la Web?

·         Administrador de sitios web. Los administradores de sitios web son los responsables de los sitios web de internet. Se aseguran de que la información del sitio web es correcta, segura y está actualizada. Trabaja estrechamente con diseñadores y programadores y con los departamentos de ventas y marketing.

·         ¿Que son los Enlaces (vínculos) y cuantos tipos hay?

·          

Hipervínculo de texto: Un hipervínculo de texto es un enlace que se encuentra asociado a un texto, de forma que si hacemos clic sobre ese texto, navegamos dónde indique el hipervínculo. Por defecto, cuando creamos un hipervínculo de texto, el texto aparece subrayado y en un color distinto al del texto normal, de forma que el visitante sepa que existe ese enlace. Si volvemos a la página después de visitar el enlace, este aparecerá con otro tono también. Aunque es interesante diferenciar el hiperenlace, es posible que no queramos que aparezca así. Hipervínculo de imagen: Un hipervínculo de imagen es un enlace que se encuentra asociado a una imagen, de forma que si hacemos clic sobre esa imagen, navegamos dónde indique el hipervínculo. Por defecto cuando creamos un hipervínculo de imagen, la imagen aparece rodeada de un borde con un color llamativo para que el visitante sepa que existe ese enlace. Por otra parte, los hipervínculos pueden referirse a páginas del mismo sitio web o de otros sitios web. Hipervínculo local o interno: Un hipervínculo local o interno es un vínculo a una página que se encuentra en el mismo sitio web (sitio local). Así, para referirnos a ella tan solo basta con poner la ruta o dirección en el disco duro. Si se encuentra en la misma carpeta, basta con poner su nombre. Por ejemplo, supongamos que tenemos un vínculo desde esta página a otra llamada curso que está en la carpeta access . El vínculo sería: access/curso.htm Hipervínculo externo : Un hipervínculo externo es un vínculo a otro sitio web en Internet (sitio externo). Es un vínculo a cualquier otro lugar fuera del sitio actual. Cuando ponemos un vínculo externo, escribimos la dirección completa de la página incluido http://www.... Hipervínculo a una dirección de correo electrónico: Un hipervínculo a una dirección de correo electrónico es un vínculo que contiene una dirección de correo. Al pulsar en él, automáticamente se abre el programa de correo que tenga el usuario instalado para poder escribir a esa dirección de correo. Existen diferentes clases de rutas de acceso a la hora de definir los vínculos. Referencia absoluta: Conduce a una ubicación externa al sitio en el que se encuentra el archivo. La ubicación es en Internet, es decir toda la url identificativa del archivo en la red. Los hipervínculos externos siempre deben tener una referencia absoluta. Por ejemplo: "http://www.ecomur.com". Los hipervínculos internos pueden tener referencia absoluta o relativa. Por ejemplo: "http://www.deciencias.net/disenoweb/elaborar/graficos.htm" o "graficos.htm" Referencia relativa (al sitio o al documento): La referencia relativa al sitio conduce a un archivo situado dentro del mismo sitio que el documento actual partiendo del directorio raiz y al documento conduce a un archivo situado dentro del mismo sitio que el archivo actual, pero partiendo del directorio en el que se encuentra el actual. Se emplea más por ser menos engorrosa la relativa al documento. Pero hay que tener muy presente la estructura del sitio en carpetas y subcarpetas y los niveles de organización de los archivos: Ejemplo: (al documento): " ../index.htm "; (al sitio): " disenoweb/index.htm" Referencia a una parte de un documento: Conduce a un punto dentro de un documento, ya sea dentro del actual o de otro diferente. Primero debemos definir un punto de fijación, anclaje o marcador. El punto se define dentro de un documento con el cursor en el lugar exacto a través del menú Insertar , opción Anclaje con nombre (DW) o Marcador (FP). Después colocar el vínculo:" #nombre_anclaje" (misma página) " nombre_documento#nombre_anclaje" (distinta página).                          Por ejemplo: Ir al principio de página

·         ¿Cuáles son los tipos formatos de Imágenes compatibles con la Web? ·         Los formatos Para la web existen 4 formatos de imágenes: jpg, png, gif y svg. Cada uno tiene sus caracterísitcas y ventajas propias que voy a detallar. Optimizar una imagen significa guardarla en el formato más conveniente y logrando el menor peso posible del archivo final. El peso de los archivos en la web es importantísimo ya que influye en la velocidad de descarga del sitio, una variable que puede decidir si el usuario se queda o se va. Formato JPG: El formato JPG es el indicado para guardar imágenes fotográficas o con degradados. Este formato admite millones de colores (24 bits) y mantiene el modo de color en RGB de la imagen original. Al guardar en JPG se debe elegir una calidad de compresión. Conviene comprimir lo más posible, mientras la calidad de la imagen sea aceptable (generalmente entre 40 y 60). Cuanto menos contraste de luces tenga la imagen, más compresión se logra. Si a una imagen se le aplica el efecto desenfoque (blur), el archivo resulta mucho más liviano. Las galerías de fotos se hacen con imágenes JPG. Si en mi boceto tengo planteada una galería de fotos que presento en miniaturas y al cliquear se amplían, esas imágenes no las exporto desde el boceto, sino que simplemente ahi decido el tamaño y la ubicación, pero el recorte definitivo lo hago desde Photoshop, con todas las imágenes abiertas, recortando y optimizando cada una en los dos tamaños (miniatura y ampliada). Formato PNG: La extensión PNG es la más usada para iconos o marcas. No pudo ser aprovechada durante muchos años ya que IExplorer no reconocía su mayor ventaja: la transparencia. Desde que los diseñadores dejamos de preocuparnos por las versiones anteriores al IE8, lo estamos aprovechando realmente. La transparencia de PNG a diferencia del GIF no tiene halo, logrando una calidad de imagen mucho mayor y simplificando el maquetado, permitiendo independizar las imágenes de sus fondos. El PNG tiene dos opciones: PNG8 (con paleta de color reducida hasta 256 colores) y el PNG24 ideal para transparencias. Formato GIF: El GIF comprime mejor las imágenes con plenos de color originados en dibujos vectoriales. Este formato reduce la paleta a 256 colores como máximo. En el momento de guardar una imagen como gif, los más importante es decidir la cantidad de colores porque de esto depende el peso del archivo: cuanto menos colores, más liviano. Las imágenes gif además pueden ser transparentes y animadas. Los archivos GIF permiten seleccionar áreas transparentes en el momento de exportar. La imágenes transparentes necesitan un tratamiento especial: los bordes de la imagen deben ser suavizados hacia el color sobre el que irá colocado en el HTML, de lo contrario la imagen resultará con bordes duros (serruchados) o suavizados con halos de color diferente al fondo. Para esto se utiliza la opción Mate que permite seleccionar el color similar al fondo. Actualmente este formato sólo se usa para animaciones simples. Formato SVG: Es el único formato vectorial y por lo tanto escalable para web con la enorme ventaja que eso significa para hacer un sitio adaptable. Se está empezando a usar recién ahora ya que el IE8 no lo reconoce. El archivo SVG se guarda directamente desde Illustrator y el resultado es un archivo que se puede ver en el navegador, pero que también se puede abrir en el Sublime porque es puro código. Esto le da infinitas posibilidades de uso para web, especialmente combinado con el lenguaje javascript. ·        ¿Qué entiendes por nube? La nube o computación en la nube concepto conocido también bajo los términos informática en la nube, nube de cómputo o nube de conceptos, del inglés Cloud computing, es un paradigma que permite ofrecer servicios de computación a través de Internet ·         ¿Como puedes crear una red social y que es?  ·      1. Elgg Elgg es una de las herramientas más recomendadas por sus múltiples funcionalidades y soporte multilenguaje. Permite a las empresas, escuelas, universidades y asociaciones crear sus propios entornos sociales con todas las características y aplicaciones más comunes. Elgg es de código abierto. Integra RSS, perfiles para usuarios, soporte para celulares, personalización mediante plantillas y plugins y usa Open ID. La ONG internacional Oxfam, el gobierno australiano, entre otros, la usan. 2. Budypress BuddyPress también es un software libre y open source. Su comunidad de programadores se encarga de dar soporte a su código, crear plugins y temas. A diferencia de los servicios alojados, BuddyPress permite mantener el control de tu sitio y crear una experiencia única, totalmente personalizada. Pueden crearse perfiles para usuarios, grupos, integrar un sistema de mensajería, blogs, foros y chat. 3. Pligg Pligg es una plataforma de red social con la que puedes generar sitios como Digg y Menéame. Una red colaborativa con sistemas de votación en donde los usuarios comparten sus contenidos y los valoran. Integra perfiles de usuarios, correo, sistema de comentarios, RSS, soporte multilenguaje, entre otros. Para hacer uso de esta herramienta se requieren PHP y MySQL. 4. AroundMe AroundMe es un proyecto que nace para brindar software libre para ayudar a que las organizaciones sociales en todo el mundo se comuniquen y comparten en comunidad. Permite crear sitios web de colaboración social (como Ning, MySpace, Yahoo o Google groups). Cada grupo puede crear una página web, libro de visitas, blog, foro y wiki. Es multilenguaje y soporta personalización mediante temas. Cada grupo es totalmente personalizable utilizando XHTML, CSS, JavaScript y PHP. Se puede interactuar con otras redes sociales y actualizarlas o revisar sus últimas noticias. 5. SocialEngine SocialEngine es la herramienta de pago mas usada para crear redes sociales, esta desarrollada en PHP. La secuencia de comandos le permite crear fácilmente su propia red social o comunidad en línea. Incluye grupos personalizados, álbumes de fotos, mensajes, perfiles de miembros, videos, noticias. Usa arrastrar y soltar como funcionalidad para administrar el CMS, y mucho más. 6. Mahara Mahara es un sistema de código abierto que permite crear comunidades en línea y redes sociales a través de grupos, blogs y foros. Los usuarios pueden crear sus portafolios con carpetas y subcarpetas y cargar múltiples archivos, gestionar un blog, crear listas de amigos, incluye un constructor de currículum vitae. 7. CrowVine CrowVine ofrece un entorno social muy fácil de crear para fines más específicos. Ayuda a organizadores de conferencias y seminarios a generar una comunidad alrededor de su evento. Los usuarios pueden crearse perfiles. Integra un sistema de preguntas y comentarios, búsqueda mediante etiquetas, un sistema de mensajería y contacto, grupos de interés. Además pueden compartir un calendario con las fechas del evento y agregar un sistema de puntuación. Permite exportar contactos y usa OpenID. 8. SocialGO SocialGo te permite crear una red social totalmente gratis. Es altamente personalizable con plugins y temas. Puedes crear para tu comunidad perfiles de usuarios, Blogs, foros, moderación de contenidos, compartir imágenes y vídeos, chat, correo interno, boletines informativos y calendarios. Ofrece integración con Facebook y Twitter. 9. Lovdbyless: Lovbyless es otra solución de código abierto escrito en Ruby on Rails. Los usuarios pueden seguir a otros usuarios, realizar comentarios en los perfiles, enviar mensajes internos, crear blogs, galería de fotos, buscar amigos y ver su actividad reciente. Ofrece integración con Flickr y YouTube. 10. iSocial iSocial es una forma rápida y fácil para crear una red social. Incluye soporte para OpenID y autenticación abierta, así como Facebook Connect. Una vez que la red esté en funcionamiento, los usuarios pueden compartir archivos multimedia como fotos y vídeos y añadir eventos.