El documento presenta información sobre las herramientas para el desarrollo de sitios web. Define qué es una web, Web 2.0 y Web 3.0, e identifica tres herramientas comunes: colores, guías de estilo y animación con HTML5/CSS3. También analiza las aplicaciones Prezi y códigos QR, proporcionando ejemplos de sus funciones.

1. UNIVERSIDAD DE PANAMÁ
CENTRO REGIONAL UNIVERSITARIO DE
COLÓN
FACULTAD DE INFORMÁTICA ELECTRÓNICA
Y COMUNICACIÓN
LIC. COMERCIO ELECTRÓNICO
NOMBRE
Karen Arrocha Rivera
CEDULA:
3-729-1771
GRUPO:
I AÑO C
ASIGNATURA:
HERRAMIENTAS PARA EL DESARROLLO DE SITIOS WEB
PROFA:
CELIA HALL

2. -¿QUE ES WEB?
WWW (WORLD WIDE WEB)
• Una web es aquella que consiste en un documento
electrónico que contiene información, cuyo formato
se adapta para estar insertado en la World Wide
Web, de manera que los usuarios a nivel mundial
puedan entrar a la misma por medio del uso de un
navegador, visualizándola con un dispositivo móvil
como un smartphone o un monitor de computadora.

3. ¿DEFINIR WEB 2.0 Y
WEB 3.0 DAR LA
DIFERENCIAS
ENTRE AMBAS?

4. ¿QUE SON
HERRAMIENTAS DE
DISEÑOS WEB?
Es una asociación de aplicaciones
web que facilita la comunicación, el
diseño, el usuario y la colaboración
con el WWW Word wide web),
además permite a los usuarios
interactuar y colaborar con la
creación de contenidos, tanto lo
mismo usuarios como la
información dada.

5. ¿DE TRES EJEMPLO
DE HERRAMIENTAS
WEB Y EXPLIQUE
LA FUNCIÓN DE LAS
HERRAMIENTAS?
• Colores
Buscamos la identidad de una web en base a su color, por
medio de la elección de una paleta.
• Guías de estilo
Son documentos gráficos o mixtos entre gráficos y textuales,
en los que se define cada uno de los elementos que
podremos encontrar en una web y el aspecto que deberá
tener. Está definiendo cómo se deben mostrar titulares de
diversos niveles, botones de diversos tipos, menús, tooltips y
todo aquello que se utilizará en una web, para que los
maquetadores sepan cómo maquetar, y con qué estilo, cada
parte de la web.
• Animación con HTML5 / CSS3
Si quieres que tu web se mueva, que sea dinámica e
interactiva, puedes usar también herramientas interesantes para
realizar en web características parecidas a las que podrías
hacer en Flash. Adobe ha estado rellenando el hueco que ha
dejado Flash, que por diversas razones ya no es aconsejable
para la web.

6. ¿INVESTIGAR LAS
SIGUIENTES
APLICACIONES:
PREZI Y CÓDIGOS
QR?
Prezi: es un programa de presentaciones
para explorar y compartir ideas sobre un
documento virtual basado en la informática
en nube (software como servicio).[] La
aplicación se distingue por su interfaz gráfica
con zoom, que permite a los usuarios
disponer de una visión más acercada o
alejada de la zona de presentación, en un
espacio 2.5D.[ ]
El programa se utiliza como plataforma
puente entre la información lineal y la no
lineal, y como una herramienta de
presentación para el intercambio de ideas, ya
sea de forma libre o estructurada.

7. CÓDIGO QR
Es un código de barras bidimensional cuadrada que
puede almacenar los datos codificados. La mayoría del
tiempo los datos es un enlace a un sitio web (URL).
Hoy en día, los códigos QR se pueden ver en folletos,
carteles, revistas, etc. Usted puede detectar fácilmente
estos códigos de barras de dos dimensiones a tu
alrededor. Los códigos QR permiten interactuar con el
mundo a través de su Smartphone.
Específicamente, un QR Code extiende los datos a
disposición de cualquier objeto físico y crean una
medida digital para las operaciones de marketing. Esta
tecnología permite y acelera el uso de servicios web
para móviles: se trata de una herramienta digital muy
creativa.

8. WEBGRAFIA
• https://www.mastermagazine.info/termino/7216.php
• http://3.bp.blogspot.com/-DEYNUikiNoU/UmQkNMnERvI/AAAAAAAAAfo/dwmDtf2UIT8/s1600/ofirmatica.png
• https://www.google.com/search?rlz=1C1CHBD_esPA753PA753&biw=1366&bih=662&tbm=isch&sa=1&q=%E2%80%A2%09Colores+Buscamos+la+identidad+de+
una+web+en+base+a+su+color%2C+por+medio+de+la+elecci%C3%B3n+de+una+paleta.++%E2%80%A2%09Gu%C3%ADas+de+estilo++Son+documentos+gr%
C3%A1ficos+o+mixtos+entre+gr%C3%A1ficos+y+textuales%2C+en+los+que+se+define+cada+uno+de+los+elementos+que+podremos+encontrar+en+una+web+y
+el+aspecto+que+deber%C3%A1+tener.+Est%C3%A1+definiendo+c%C3%B3mo+se+deben+mostrar+titulares+de+diversos+niveles%2C+botones+de+diversos+t
ipos%2C+men%C3%BAs%2C+tooltips+y+todo+aquello+que+se+utilizar%C3%A1+en+una+web%2C+para+que+los+maquetadores+sepan+c%C3%B3mo+maquet
ar%2C+y+con+qu%C3%A9+estilo%2C+cada+parte+de+la+web.+++%E2%80%A2%09Animaci%C3%B3n+con+HTML5+%2F+CSS3+++Si+quieres+que+tu+web+
se+mueva%2C+que+sea+din%C3%A1mica+e+interactiva%2C+puedes+usar+tambi%C3%A9n+herramientas+interesantes+para+realizar+en+web+caracter%C3%
ADsticas+parecidas+a+las+que+podr%C3%ADas+hacer+en+Flash.+Adobe+ha+estado+rellenando+el+hueco+que+ha+dejado+Flash%2C+que+por+diversas+raz
ones+ya+no+es+aconsejable+para+la+web.&oq=%E2%80%A2%09Colores+Buscamos+la+identidad+de+una+web+en+base+a+su+color%2C+por+medio+de+la+
elecci%C3%B3n+de+una+paleta.++%E2%80%A2%09Gu%C3%ADas+de+estilo++Son+documentos+gr%C3%A1ficos+o+mixtos+entre+gr%C3%A1ficos+y+textual
es%2C+en+los+que+se+define+cada+uno+de+los+elementos+que+podremos+encontrar+en+una+web+y+el+aspecto+que+deber%C3%A1+tener.+Est%C3%A1+
definiendo+c%C3%B3mo+se+deben+mostrar+titulares+de+diversos+niveles%2C+botones+de+diversos+tipos%2C+men%C3%BAs%2C+tooltips+y+todo+aquello
+que+se+utilizar%C3%A1+en+una+web%2C+para+que+los+maquetadores+sepan+c%C3%B3mo+maquetar%2C+y+con+qu%C3%A9+estilo%2C+cada+parte+de
+la+web.+++%E2%80%A2%09Animaci%C3%B3n+con+HTML5+%2F+CSS3+++Si+quieres+que+tu+web+se+mueva%2C+que+sea+din%C3%A1mica+e+interacti
va%2C+puedes+usar+tambi%C3%A9n+herramientas+interesantes+para+realizar+en+web+caracter%C3%ADsticas+parecidas+a+las+que+podr%C3%ADas+hac
er+en+Flash.+Adobe+ha+estado+rellenando+el+hueco+que+ha+dejado+Flash%2C+que+por+diversas+razones+ya+no+es+aconsejable+para+la+web.&gs_l=psy-
ab.3...218202.218686.0.219524.2.2.0.0.0.0.144.144.0j1.1.0....0...1.1.64.psy-ab..1.0.0.0.loXuezFSUfs#imgrc=93a7vQJ5AjNNgM: