martes, 19 de mayo de 2015
lunes, 11 de mayo de 2015
Actividad
18
·
Dreamweaver
CS5:
Dreamweaver CS5 es un software fácil
de usar que permite crear páginas web profesionales.Las
funciones de edición visual de Dreamweaver CS5 permiten agregar rápidamente
diseño y funcionalidad a las páginas, sin la necesidad de programar manualmente
el código HTML.Se puede crear tablas, editar marcos, trabajar con capas,
insertar comportamientos JavaScript, etc.., de una forma muy sencilla y
visual.Además incluye un software de cliente FTP completo, permitiendo entre
otras cosas trabajar con mapas visuales de los sitios web, actualizando el
sitio web en el servidor sin salir del programa.
§ CSS
(Cascading Style Sheets, u Hojas
de Estilo en Cascada) es
la tecnología
desarrollada por el World Wide Web Consortium (W3C) con el fin de separar la estructura de la presentación.
desarrollada por el World Wide Web Consortium (W3C) con el fin de separar la estructura de la presentación.
§ Plantilla
de Dreamweaver
Una
plantilla es un tipo especial de documento que sirve para crear un diseño de
página “fijo”; puede crear documentos basados en la plantilla que heredan su
diseño de página. Al diseñar una plantilla, usted especifica como “editables”
aquellos contenidos de un documento basado en dicha plantilla que los usuarios
pueden editar. Las plantillas permiten a los autores controlar qué elementos de
la página pueden editar los usuarios de la plantilla (como los redactores, los
diseñadores gráficos y otros desarrolladores Web). El autor de una plantilla
puede incluir varios tipos de regiones de plantilla en un documento.
§ Contenedor
de Dreamweaver
Se trata de la caja en la que va el contenido de la web (texto
,asi como la imágenes , etc , que dicho “ container “ nos encontramos con el menu de la izuierda en este ejemplo , que
se conoce por “ sidebar “
§ Comportamiento
de Dreamweaver
Son acciones, programadas normalmente en código JavaScript, que
suceden cuando los usuarios realizan algún evento sobre un objeto (en
lenguaje Dreamweaver) ya sea imagen, texto, capa, ... Los comportamientos de
Dreamweaver introducen en los documentos código JavaScript que permite a los
visitantes interactuar con la página Web para modificarla de diversas maneras
o para que se realicen determinadas tareas. Un comportamiento es una
combinación de un evento con una acción que desencadena ese evento.
|
§
Sitio
local
Un sitio es un emplazamiento donde se almacenan todos los documentos y archivos pertenecientes a un determinado sitio web . Construye un conjunto de documentos vinculados con atributos compartidos , tales como temas relacionados , un diseño similar o un objetivo comun.
Al definir un sitio local:
Un sitio es un emplazamiento donde se almacenan todos los documentos y archivos pertenecientes a un determinado sitio web . Construye un conjunto de documentos vinculados con atributos compartidos , tales como temas relacionados , un diseño similar o un objetivo comun.
Al definir un sitio local:
- Se establece la estructura del sitio que se está creando
- Se indica a Dreamweaver dónde se desea almacenar todos los archivos del
sitio.
§ Sitio
dinamico
Una fuente de contenido dinámico es un almacén de información desde el
que se puede recuperar y mostrar contenido dinámico para utilizar en una página
Web. Las fuentes de contenido dinámico no sólo incluyen información almacenada
en una base de datos, sino también valores enviados por formularios HTML,
valores contenidos en objetos de servidor y otras fuentes de contenido.
§ Sitio
ineractivo
Un sitio web interactivo permite a los
usuarios participar y aportar
contenido. Un sitio interactivo es básicamente un sitio dinámico al que se le
han añadido prestaciones interactivas.
Son
interactivos los foros, los blogs, los comentarios de los usuarios, y todas
aquellas aplicaciones en las que el usuario puede interactuar con otros
usuarios o con los administradores del sitio.
§ Region
editable
Las
regiones de plantilla editables controlan qué áreas de una página basada en
plantilla puede editar el usuario. Antes de insertar una región editable,
guarde como plantilla el documento en el que está trabajando.
§ Maquetacion
La maquetación es la distribución de los elementos en
nuestra página. Piensa en una página web cualquiera. Seguro que distingues
algunos elementos claramente diferenciados, como un encabezado, columnas, y un
pie de página.
§ Etiqueta
Div
La etiqueta <div> se emplea para definir un bloque de
contenido o sección de la página, para poder aplicarle diferentes estilos e
incluso para realizar operaciones sobre ese bloque específico.
§ Tabla
Las tablas estan formadas por un conjunto de celdas , distribuidas en filas y columnas
§ Formulario
Los formularios se utilizan para recoger datos de los
usuarios . Nos pueden servir para realizar un pedido en una tienda virtual ,
crear una encuesta , conocer las
opciones de los usuarios , recibir preguntas . etc
§ Formulario
de contacto
Los formulariuos permiten interactuar
con los visitantes del sitio o recopilar infomacion de ellos .
jueves, 7 de mayo de 2015
Actividad 1-3
Elementos básicos de HTML
1.
Bloc
notas
Es un editor
de texto muy básico, que no soporta formatos de texto.
Es
muy útil cuando queremos apuntar algo, ya que es más ágil que abrir un
procesador de texto más potente.
Por
otro lado, puede abrir prácticamente todos los tipos de archivos. Claro que
esto no quiere decir que todos sean comprensibles para nosotros.
2. Buscador
También conocidos bajo el nombre de
Motor de Búsqueda, pero preferentemente conocidos como Buscador, consisten
básicamente en un Sistema Informático que es capaz de realizar una búsqueda lo
más rápido posible de un Archivo que esté alojado en cualquiera de los servidores
http://www.mastermagazine.info/termino/4118.php
http://www.mastermagazine.info/termino/4118.php
3. Compatible
La compatibilidad es la condición que
hace que un programa y un sistema, arquitectura o aplicación logren comprenderse correctamente tanto directamente o
indirectamente (mediante un algoritmo). A este algoritmo que hace que un programa logre
ser comprendido por un sistema, arquitectura o aplicación se lo denomina emulador por el hecho de que es un intérprete entre el programa y el sistema, arquitectura o
aplicación.
4. Estructura
de página web
Una vez que se ha hecho el
trabajo de identificación de contenidos, se debe avanzar hacia las definiciones
relacionadas con la forma que tendrá el sitio que se está desarrollando. Ello
implicará trabajar en tres áreas concretas, a través de las cuales se definirá
la estructura del sitio, el árbol de contenidos y los sistemas de navegación
que se ofrecerá a los usuarios para que avancen a través de sus contenidos.
Las tres áreas mencionadas se
explican a continuación:
Creación de la Estructura
Se refiere al proceso de
identificar la forma que tendrá el Sitio Web que se está desarrollando. En este
sentido es importante hacer una diferencia entre estructura y diseño (que será
explicada gráficamente más adelante en este capítulo).
Estructura:
se refiere a la forma que tendrá
el Sitio Web en términos generales con sus secciones, funcionalidades y
sistemas de navegación. No considera ni incluye elementos gráficos (logotipos,
viñetas, etc.).
Diseño:
Se refiere a la solución gráfica
que se creará para el sitio, en la cual aparecen colores, logotipos, viñetas, y
otros elementos de diseño que permiten identificar visualmente al sitio.
Dado lo anterior, cuando hablamos
de la estructura nos estamos refiriendo básicamente a cuál será la experiencia que tendrá un usuario
cuando accede al sitio. De esta manera podremos determinar dónde estarán
ubicados los servicios interactivos (buscador, sistemas de encuestas, áreas de
contenidos).
Gracias a la realización de esta
etapa es posible discutir en términos muy prácticos cuál será la oferta de
elementos de información e interacción que tendrá el usuario. Al no incluir
elementos de diseño, se permite que la discusión sobre la estructura se desarrolle
en aspectos concretos, sin que intervengan aún consideraciones estéticas que
habitualmente atrasan la aprobación de esta etapa del desarrollo.
5. Etiqueta
Como
metadato, una etiqueta o tag, es un tipo de información que describe o define algún
aspecto de recursos de información (como un documento, una imagen, una página web,
etc.)
6. Hipertexto
El
término hipertexto se ha convertido en un lugar común para designar una serie
de entidades de signo muy dispar. Como afirman Pastor y
Saorín, "se ha producido una inflación del término
'hipertexto', de modo que su contenido se ha reducido prácticamente al de
"salto entre dos puntos" o "relación". Además, su presencia
en la World Wide Web, ha
contribuido a la confusión terminológica y conceptual.
Se
dice que son hipertextos las páginas web, las enciclopedias en CD-ROM,
algunos programas muy difundidos como la Ayuda de Windows, otros programas
propietarios que sirven para elaborar hipertextos independientes, y también
se dice que son hipertextos los documentos creados con dicho software o los generados mediante un simple
procesador de textos que permita la creación de enlaces intra e inter documentos.
7. Lenguaje
HTML
TML es un lenguaje de programación
que se utiliza para el desarrollo de páginas de Internet. Se trata de la sigla que corresponde a HyperText Markup Lenguaje,
es decir, Lenguaje de Marcas de Hipertexto, que podría ser traducido como Lenguaje de Formato de Documentos para Hipertexto.
Se trata de un formato abierto que surgió a partir de las etiquetas SGML (Standard Generalized Markup Lenguaje). Concepto traducido generalmente como “Estándar de Lenguaje de Marcado Generalizado” y que se entiende como un sistema que permite ordenar y etiquetar diversos documentos dentro de una lista. Este lenguaje es el que se utiliza para especificar los nombres de las etiquetas que se utilizarán al ordenar, no existen reglas para dicha organización, por eso se dice que es un sistema de formato abierto.
Se trata de un formato abierto que surgió a partir de las etiquetas SGML (Standard Generalized Markup Lenguaje). Concepto traducido generalmente como “Estándar de Lenguaje de Marcado Generalizado” y que se entiende como un sistema que permite ordenar y etiquetar diversos documentos dentro de una lista. Este lenguaje es el que se utiliza para especificar los nombres de las etiquetas que se utilizarán al ordenar, no existen reglas para dicha organización, por eso se dice que es un sistema de formato abierto.
EL HTML se encarga de desarrollar una descripción sobre los contenidos que
aparecen como textos y sobre
su estructura, complementando dicho texto con diversos objetos (como
fotografías, animaciones, etc)
8. Marcas
(tag)
Marca o marcas que se dejan en texto para que luego sean interpretadas,
generalmente para realiza alguna acción sobre el mismo texto marcado. Por
ejemplo, el lenguaje HTML se basa en la aplicación de múltiples etiquetas para
dar forma y darle características a un texto. Ese texto es interpretado y mostrado
por un navegador
9. Navegador
Un
navegador web es un tipo de software que permite la visualización de documento y sitios en hipertexto, comúnmente
agrupados bajo la denominación de web o internet.
10. Página
web
Se
conoce como página web al documento que forma parte de un sitio web y que suele contar con enlaces (también
conocidos como hipervínculos o links) para facilitar la
navegación entre los contenidos.
http://definicion.de/pagina-web/#ixzz3ZTAh5MDx
http://definicion.de/pagina-web/#ixzz3ZTAh5MDx
11. Sitio
web
Sitio es un lugar que sirve para algo o un espacio ocupado (o
que puede llegar a serlo). La noción de Web, por su
parte, hace referencia a Internet, una red de redes
que permite la interconexión de computadoras mediante
un conjunto de protocolos denominado TCP/IP.
http://definicion.de/sitio-web/#ixzz3ZTBCjwVR
http://definicion.de/sitio-web/#ixzz3ZTBCjwVR
12. Plataforma
Entre sus diversos usos y significados, el más usual hace
referencia a un suelo superior o
tablero horizontal que se encuentra elevado sobre el suelo y que funciona como soporte de personas o cosas.
http://definicion.de/plataforma/#ixzz3ZTCtLeaw
http://definicion.de/plataforma/#ixzz3ZTCtLeaw
13. Servidor
web
Un servicio web (en
inglés, Web Servicie o Web services) es una tecnología que utiliza un conjunto de protocolos y
estándares que sirven para intercambiar datos entre aplicaciones. Distintas
aplicaciones de software desarrolladas en lenguajes de programación diferentes,
y ejecutadas sobre cualquier plataforma, pueden utilizar los servicios web para
intercambiar datos en redes de ordenadores como Internet.
14. Vínculos
Link.
Apuntadores hipertexto que sirve para saltar de una información a otra, o de un
servidor web a otro, cuando se navega por internet.
Actividad 1-2: Introducción
HTML
¿Qué entiendes por una página HTML?
Una página web
es un documento de texto con marcas. Las marcas permiten modificar la
presentación del documento, incluir elementos no contenidos en el texto (por
ejemplo, imágenes), crear hiperenlaces, añadir significado al texto (todavía de
forma limitada), etc. A las marcas se les llaman también etiquetas.
Tim Bernés – Lee HTML
Hyper Text Markup Lenguaje
¿Quién invento HTML?
¿Cuál
era el objetivo de crear HTML?
El HTML se
creó en un principio con objetivos divulgativos de información con texto y
algunas imágenes. No se pensó que llegara a ser utilizado para crear área de
ocio y consulta con carácter multimedia (lo que es actualmente la web), de modo
que, el HTML se creó sin dar respuesta a todos los posibles usos que se le iba
a dar y a todos los colectivos de gente que lo utilizarían en un futuro.
Características de HTML
·
El
Web tenía que ser distribuido: La información repartida en páginas no muy
grandes enlazadas entre sí.
·
El
Web tenía que ser hipertexto y debía ser fácil navegar por él.
·
Tenía
que ser compatible con todo tipo de ordenadores (PCs, Macintosh, estaciones de
trabajo...) y con todo tipo de sistemas operativos (Windows, MS-DOS, UNIX,
MAC-OS,...).
·
Debía
ser dinámico: el proceso de cambiar y actualizar la información debía ser ágil
y rápido.
Estas
características son las que marcaron el diseño de todos los elementos del WWW
incluida la programación de páginas Web. Como respuesta a todos estos
requisitos se creó el lenguaje HTML (HiperText Markup Lenguaje), cuyas siglas
significan "lenguaje hipertexto de marcas".
Este
lenguaje será el encargado de convertir un inocente archivo de texto inicial en
una página web con diferentes tipos y tamaños de letra, con imágenes
impactantes, animaciones sorprendentes, formularios interactivos, etc.
7
Reglas básicas para diseñar paginas web
A
continuación te presentamos una serie de recomendaciones que puedes tener en
mente al momento de construir desde 0 una nueva página de internet:
1.-
Reunir información: Investigar el historial de
la marca, su giro, sus servicio y la competencia.
2.-
Plantear un objetivo: El objetivo debe plantearse
de acuerdo a la función que hará el sitio en la red.
3.-
Conocer los objetivos del cliente: Nunca se debe de olvidar la
opinión del cliente, aunque tu como diseñador o creativo presentes una idea,
ésta debe de ir acorde a los objetivos deseados del cliente, sin tu perder
estilo.
4.-
Conocer el público objetivo: Se tiene que tomar en
cuenta todo tipo de datos demográficos sobre las personas que estarán frente a
un monitor visitando la página. La edad, el sexo, gustos, estilo de vida,
cultura y hasta lugar de residencia.
5.-
Crear un mapa del sitio: Es importante antes de
ponerse a diseñar y programar, bocetar las ideas y hacer distintas pruebas.
6.-
Crea o reúne un contenido atractivo: El contenido tanto
tipográfico como visual, debe llamar la atención de la audiencia.
7.-
Planifica: Empezar con las ideas básicas y crear
un calendario de avances y metas.
8.-
Propón ideas frescas y nuevas al cliente: Puede que el cliente tenga
una idea muy definida para su sitio, pero si éstas no funcionan, se pueden
pulir con una buena propuesta de diseño, quedando todos conformes.
9.-
Crear: Definir el concepto de la página y no
entregar un trabajo que no se entienda y sin ningún estilo.
10.-
Has pruebas: Antes de dar por terminado el proyecto,
se debe realizar pruebas de que todo funcione, desde códigos, botones, textos,
videos y animaciones para que el cliente no tenga quejas sobre el trabajo
entregado.
11.-
Crear una web que se mantenga: Decir no a los 404s y a los
actualízala.
Para
verlo de forma más clara, te dejamos este creativo video con las 11 reglas del diseño web, no dejes que se pase
ninguna.
Actividad.-1
Actividad
integradora parte 1
1.
¿Cuáles
son tus posibles temas a tratar en tu página web?
Música
Artes
Ensenada
2.
Clasifica
tus temas
Música
Artes
3.
Escoge
el tema para tu página web.
Música
4.
Define
la información que va a conectar tu página.
Esta
diseño de pagina web contendrá en un listado en la primera entrada es: lo que
provoca la música en mi, mi gusto por la música & tipos de música.
En
la parte centrada contendrá un esquema donde los principales nombres serán
Rock, Reggae & otros en cada una de ellas tendrá la letra y la canción para
reproducirse.
Del
lado izquierdo tendrá la imagen donde tendrá I Love Rap, Rock, Reggae, Banda,
Hip Hop.
5.
¿Cuáles
fuentes de información tienes para tu página?
6.
Escalabilidad
7.
Planificación:
(objetivos, publico y estructura): Contar una página principal y dos páginas
secundarias , que contenga una lista y una tabla .
8.
Definición
del diseño :
ü Esquema
ü Incluye la información de
imágenes de correspondan al sitio en Word o PowerPoint
Suscribirse a:
Entradas (Atom)