Informe Web - Ranka Wasi

DISEÑO & DESARROLLO WEB
INFORME WEB
HOTEL RANKA WASI
LENIN GOÑAS
THALIA O’CONNOR
FRANK REA
MAURICIO RIVAS
1
ÍNDICE
I. ANÁLISIS DE 10 PAGINAS WEB DE HOTELES 3 - 22
II. E LABORACIÓN DEL PRESUPUESTO 23
III. D ISEÑO DEL MAPA DE IDEAS ( MINDMAP ) 24
IV. D ISEÑO DEL CRONOGRAMA DE ACTIVIDADES 25
V. ELABORACION DEL MOCKUP DE L PROYECTO ( WIREFRAME ) 26 - 30
VI. I NDEX 31 - 32
VII. ALOJAMIENTO
- SIMPLE 33 - 34
- DOBLE 35 - 36
- MATRIMONIAL 37 - 38
- EJECUTIVA 39 - 40
- VIP 41 - 42
VIII. EXPERIENCIAS
- CANOPY EN EL VALLE SAGRADO 43 - 44
- RAFTING EN OLLANTAYTAMBO 45 - 46
- CUATRIMOTOS EN MORAY 47 -48
- TREKKING EN URUBAMBA 49 -50
- PASEOS A CABALLO 51 - 52
IX. RESTAURANTE 53 - 54
- INTERNACIONAL 55 - 56
- NOVOANDINA 57 - 58
X. PROMOCIONES 59 - 60
XI. GALERÍA 61 - 62
- ORQUÍDEAS 63 - 64
- AVENTURAS 65 - 66
XII. RESERVAR 67 - 69
XIII. CONTACTO 70 - 71
XIV. CÓDIGO CSS 3 DEL PROYECTO 72 - 76
XV. PÁGINA DE FACEBOOK 77
2
I. ANÁLISIS DE PÁGINAS WEB

Vamos a analizar 10 páginas escogidas por el tema al que se orientan y que hemos elegido
nosotros.
www.casa-andina.com
Casa Andina Hotels es una cadena hotelera peruana fundada en febrero de 2003, con 28
hoteles en 17 destinos de nuestro país. Éstos están inspirados particularidades regionales
y recogen elementos locales para la decoración, arquitectura, gastronomía, actividades,
música y experiencia general dentro de la estadía.
Fuentes: casa-andina.com/sobre-nosotros/ & facebook.com/casaandina
Objetivo: Crear experiencias auténticas que van más allá de lo que el viajero espera.
Ofrece tres servicios:
1. Classic: Hoteles cómodos en lugares céntricos. (14 hoteles)

2. Select: Hoteles para disfrutar viajes de negocios. (5 hoteles)
3. Private Collection: Hoteles de lujo con vistas espectaculares. (7 hoteles)
Características de los hoteles Casa Andina:
• Cadena peruana que promociona la cultura local

• Tiene hoteles que se adaptan a las costumbres en dieciséis destinos
• Ofrece diversas promociones según los atributos del lugar
• Tiene un buen manejo de redes sociales (community management)
• Tiene una valoración de 4.5 estrellas en TripAdvisor
• Prepara eventos sociales y corporativos
• Sus precios van desde $60
3
El diseño de la página web de Casa Andina maneja una estructura de bloques

sencilla de seguir y una paleta de colores cálidos.
Header1: Chat, contacto, idioma,

redes sociales y buscador
Header2: Logotipo y menú de

navegación
Mini formulario de reservas rápido

para saber disponibilidades
Foto de slider principal con

promociones del momento
Secciones secundarias con el

blog y espacio de suscripción
Formulario de contacto y consulta

o mensaje personal
Footer informativo, contacto, redes

sociales medios de pago e
información legal
4
www.tierravivahoteles.com
Tierra Viva Hoteles es una cadena hotelera fundada en junio de 2010 que ofrece un
servicio de hospedaje que se anticipa a las necesidades del cliente, brindando
asesoramiento experto sobre los lugares de destino de sus hoteles en Perú.
Fuentes: tierravivahoteles.com & facebook.com/tierravivahoteles/
Objetivo: Hacer que la estancia del usuario se vuelva una sensación de estar como en
casa.
Ofrece dos servicios principales:
1. Hospedaje: Hoteles agradables que dan una sensación hogareña.

2. Asesoramiento: Proporciona guías de calidad e información turística confiable.
Características de los hoteles Tierra Viva:
• Cadena peruana que promociona la cultura local

• Cuenta con hoteles económicos debido a su filosofía (el “lujo” está en el lugar)
• Ofrece 10% de descuento al reservar mediante la web oficial
• Tiene un blog informativo para los usuarios
• Los hoteles se adaptan a la región en la que estén
• Fusiona lo moderno y clásico en sus decoraciones
• Ha ganado varios premios por su atención al cliente
• Su enfoque es mantener al cliente cómodo e informado
5
El diseño de la página web de Tierra Viva hoteles tambíen maneja una

estructura de bloques y principalmente los colores anaranjado y verde. No
cuenta con un navegador principal, los links a hoteles se encuentra en el footer.
Header: Logotipo, redes

sociales e idioma
Video como imagen principal
Mini formulario de reservas
Promoción del momento
Información breve acerca

de la cadena
Secciones secundarias con la

mención a premios y varias
promociones actualizadas
Blog y sección de promoción final
Promoción del momento
Footer informativo, selección de

hotels, contacto, redes sociales,
datos legales y creador de la
página.web
6
www3.hilton.com/en/hotels/peru/hilton-lima-miraflores
Hilton Lima Miraflores es un hotel situado en la capital del Perú dentro de cadena hotelera
Hilton Hotels Se encuentra convenientemente ubicado en el corazón del distrito de
Miraflores de Lima. Ofrece una ubicación privilegiada en la vibrante zona de ocio
Larcomar. Está cerca de actividades cercanas como teatros, museos, restaurantes y
parques.
Objetivo: Brindar un servicio de excelente calidad orientado a turistas en Perú
Ofrece tres servicios principales:
1. Hospedaje: Habitaciones lujosas con vista al mar

2. Salón de eventos: Proporciona espacios sociales y de negocio
3. Restaurante: Variedad de platos típicos y de fusión
Características del Hotel Hilton Lima Miraflores:
• Cadena extranjera que promociona la cultura local (Lima, Perú)

• Cuenta con terrazas, gimnasio, salas de fiesta, bar y piscina
• Estructurado en arquitectura limpia y moderna
• Se permiten mascotas
• Hay un servicio de cuidado de niños
• Se alquilan equipos audiovisuales para conferencias
• Se alquilan espacios para video-conferencias
• Ofrece guías para tours en Lima
7
El diseño de la página web de Hilton Hotels & Resorts (en la sección de Lima
Miraflores, se organiza en bloques y cuadros de color azul, celeste y beige.
Header1: Login/registro de
usuario y disclaimer de precios
Header2: Logotipo, dirección y

Menú de mini formulario de reservas
navegación e
idioma
Imagen de slider principal
Información
breve de reglas Slider principal
en el hotel
Reseñas de clientes
(TripAdvisor)
Promoción
Ubicación económica destacada
Honores y Anuncio turístico

facilidades
(impression, Información principal
compartir)
Promoción
Datos destacados de
destacada
los alrededores y el
clima del momento
Términos y
condiciones de
promoción
destacada
Datos destacados de los
alrededores, premios y
sección principal
(habitaciones).
Secciones secundarias
(servicios y restaurante)
Promociones actuales
Footer informativo,
8 auspicios, y contacto
http://hotelforestalima.com/es/hotel-lima-hotel-4-estrellas-san-isidro-lima-
peru/
El Hotel Foresta, categorizado en 4

estrella está ubicado en San Isidro; ofrece
servicios tales como restaurantes,
espacios para eventos, terrazas.
Su objetivo, es ofrecer la mayor

conformidad en la estadía mientras se
alojaba en el hotel.
Ofrece servicios tales como:
1. La acumulación de puntos
mediantes pasos específicos a
seguir, para mejorar los servicios
ofrecidos.
2. Para los clientes o usuarios finales
se ofrecen los servicios de hotel,
eventos y restaurant.
Foresta tiene caracteristicas en si por

ejemplo:
• Ayuda en linea
• Cotización en los servicios, es
decir, que te permite saber en que
habitacion y servicios cuestan en
total.
• Un espacio exclusivos para
eventos, sea festivo o corporativo.
• Servicio de transporte gratuito del
aeropuerto al hotel.
• Cuenta con un diseño en parallax
con estilo fotográfico con toques
de diseño flat.
9
Su diseño como tal es fotografico y nos puede servir como guia al desarrollo y diseño de
nuestro sitio.
La barra de menú
(es la opcion para
dispositivos
móbiles, tablet o
celulares) de
radio acceso
Se muestran
primero el slider
de promociones
para captar la
atencion del
cliente
Barra de
promocion de
foresta donde
muestra los
pasos
Atención en linea
para despejar
dudas a la hora
de inscribirse
Entre cada
sección se
encuentra una
barra donde dice
pequeños extras
en los servicios.
Fotos de la
habitaciones en
alta calidad, para
atraer la atencion
de los clientes.
10
http://www.espanol.marriott.com/hotels/travel/limdt-jw-marriott-hotel-lima/
Marriott es una empresa líder global de alojamiento con cerca de 4.500 hoteles en 87 países y
territorios. Marriott International reportó ingresos de más de 14.000 millones de USD en el año
fiscal 2015, En Perú es unos de los hotel mas concurridos entre personas de clase alta y
extranjeros
Caracteristicas de la página:
• Permite registrarse a los

usuarios para ahorrar los
detalles de inscribción en la
siguiente estadia.
• Cuenta con una barra para

verificar la disponibilidad de la
habitacion deseada (Check
in/Check out).
• Siempre encuentras un boton

donde indican las tarifas o
como reservarlo en cada
servicios que necesitas.
• Tambien cuenta con una barra

lateral, es decir que es
responsive
• Cuenta con un diseño flat, es

decir que predomina los
cuadros de colores sin
volumen.
11
La barra de menú
(es la opcion para Informacion basica del
hotel.
dispositivos
móbiles, tablet o
celulares) de
radio acceso
Barra de disponibilidad de los

habitaciones.
Descripcion del
hotel y
alrededores.
Valoracion de
clientes y
reconocimientos
de Tripadvisor
Sección donde
resaltan las
comodidades
mas solicitadas
del hotel tales
como piscina y
gimnasio.
Sección de las
habitaciones,
donde puede
personalizarse a l
gusto del cliente y
saber cuanto
cuestas las
mejoras.
12
http://www.golfincahotel.com/
Hotel & Spa Golf Los Incas, es conocido también como un excelente lugar para descansar y
concretar negocios. Junta las dos partes para cumplir las necesidades del cliente con ambiente
separados para cada ocasión.
Características de la página:
• Predomina el diseño fotográfico

en toda la pagina web.
• Cuenta con un gran cuadro de

registro en el espacio del slider.
• Remancan para visitar en la

sección de “Blog” de la página, de
ahí cuentan la razón de
escogerlos sobre otros hoteles.
• Enfatizan la facilidad de
registrarse a las actividades que
te ofrece el hotel. mediantes
cuadros que están ubicados en
todas las secciones de la página
web.
• Cuenta con la opcion de

resgistrarse como usuarios de la
página para crear feedback de la
experiencia del hotel.
13
Barra con informacion

básica del hotel, aparte
de la seccion donde
estan ubicadas todas las
pestañas de la página.
Cuadro de registro en la
seccion de plubicidad del
hotel (slider).
Seccion donde se
informan de las
promociones vigentes
Estilo fotografico
(imágenes grandes y de
buena calidad, con texto
con tipografia light sin
alterar la imagen).
Recuadro para solicitar

informacion de eventos
especiales.
Predomina el enfasis de
visitar su blog del hotel.
14
http://www.mountainlodgesofperu.com/
Mountain Lodges of Peru es una empresa que ofrece servicios en la zona del Cusco. Ofrece
alojamiento en cabañas en la zona montañosa de la zona en paquetes turísticos de aventura.
Tienen un enfoque en la apreciación de la naturaleza. Sus hospedajes y tours son anunciados
como ecológicamente amigables.
• Su sitio web es simple en diseño,

haciendo en énfasis en fotos y en
los premios internacionales que
han recibido.
• La página principal tiene una lista

de navegación en la parte superior,
con listas que se expanden al
poner el cursor sobre cada
palabra. Hay un número telefónico
que al ser presionado lanza un
app. Si la ventana de explorador
se reduce mucho, o si se esta
usando la versión móvil, esta lista
se contrae a un símbolo de tres
rayas horizontales paralelas.
Después sigue una galería de
imágenes de gran tamaño. Más
abajo vemos dos secciones sobre
dos de las aventuras que ofrecen
con una foto una pequeña
descripción y un link para ir a una
página con todos los detalles. El
pie de la página incluye links a sus
redes sociales y una caja para
subscribirse a una lista de correo.
Además, links a prensa, socios en
negocios y un link para
profesionales para entrar a un
intranet. Más abajo hay imágenes
de varios reconocimientos a su
actividad turística seguidas por
información para contactar a la
empresa.
• La página de cada aventura tiene

la misma cabecera y pie, excepto
que la parte superior es una sola
foto del paquete turístico y no una
galería. El cuerpo principal tiene
una lista de links a más páginas
con más información. A la derecha
hay una descripción acompañada
con un video insertado. AL final del
texto hay links para hacer
reservas.
15
Menu desplegable que

permite acceder a las
secciones de la pagina.
Foto principal en slider

que muestran distintos
contenidos de interés.
En esta seccion se
encuentran los tours a
los cuales el visitante
puede acceder.
Los iconos que enlazan

a las redes sociales.
La seccion de
suscripcion al newletter
de la empresa.
En esta seccion se
muestran los distintos
reconocimientos
recibidos.
Numeros y correo de
contacto
16
http://www.explorersinn.com/es/
Explorer’s Inn es una empresa que ofrece alojamiento y turismo en la Reserva Nacional de
Tambopata. Son una iniciativa de ecoturismo que también realiza investigación científica en la
zona.
• Su sitio web presenta en la parte superior una

lista de navegación (Programas,
Instalaciones, Tambopata, Galería, Ubicación,
Contacto), además de dos iconos pequeños
para cambiar entre las versiones en español e
inglés del sitio. En el medio está el logo
redondo de la empresa, que además es un
link para volver a la página principal. Debajo
de la navegación hay una galería de fotos de
las instalaciones y de los paisajes naturales
que rota automáticamente. El cuerpo presenta
rectángulos con fotos de diferentes paquetes
turísticos, con un link para realizar una
reserva. Después de los paquetes turísticos,
hay una presentación del concepto, junto a
tres cuadros y párrafos que son links a
páginas con información más detallada de
diferentes aspectos de la iniciativa. AL pie hay
una nueva lista de links de navegación, igual
a la que está en la parte superior de la página.
Además aparece una pequeña ventana de
chat. En la esquina inferior derecha.
• La mayoría de páginas sigue el modelo de

conservar la parte superior de navegación y
todo desde la presentación de la iniciativa
para abajo. En las paginas de cada paquete
turístico vemos una descripción en texto del
itinerario y precios. A la derecha vemos una
ventana para empezar una reservación y un
inserto de Trip Advisor.
17
Menu en la parte
superior
Lista de paquetes, se
mencionan el nombre,
imagen, breve
descripcion y la
posibilidad de reservar.
En esta seccion se
describe el lugar y la
labor que se realiza,
cada uno de estos
acompañdo de imágenes
e informacion breve.
En footer contiene el
sitemap asi como
medios de pago y
enlaces a redes sociales
18
http://es.intinanhotel.com/
Explorer’s Inn es una empresa que ofrece alojamiento y turismo en la Reserva Nacional de
Tambopata. Son una iniciativa de ecoturismo que también realiza investigación científica en la
zona.
• El Hotel Inti Ñan es un hotel

en Urubamba, Cusco,
ganador de premios
internacionales.
• El sitio web del hotel

presenta un diseño mínimo
orientado más a las galerías
de fotos.
• La parte superior hay

símbolos para cambiar
entre versiones en español
e inglés. Sigue una galería
de fotos que rota
automáticamente pero que
puede ser explorada
manualmente también.
Dentro de la galería hay una
lista de links de navegación,
con un logo que también es
un link para volver a la
página principal. Al pie del
recuadro de la galería hay
un campo para empezar
una reserva.
• El cuerpo empieza con tres

recuadros con fotos con
links a los tres sectores
principales del sitio. Estas
páginas son mayormente
galerías que son links a
páginas con pequeñas
descripciones y más
ilustraciones. En la página
principal después de lo
recuadros siguen un
mensaje de bienvenida y su
lado una sección de
Noticias. Al pie de la página
se encuentra de nuevo la
lista de navegación. El color
de fondo a través de todo el
sitio es blanco.
19
Menu de secciones en la
parte superior, ademas
de las opciones de
idioma.
Fotos de portada
acompañadas de titulos
y a manera de sliders
La posibilidad de hacer
una reservacion a traves
de un miniformulario
Cuadro de secciones en
las cuales se puede
apreciar informacion
sobre el hotel, las
habitaciones y el entorno
Boletin de noticias y Recuadro de

texto de bienvenida al premios y
cliente reconocimientos
logrados
Footer con el
sitemap de la
pagina
20
http://www.hotellaspalmas.com/
El Hotel Las Palmas se encuentra en pleno centro de Miraflores. Muy cerca a los principales
centros turísticos, artesanías y centros comerciales. Cuenta con habitaciones que dan a la calle
y también interiores, todas ellas totalmente alfombradas y con las amenidades necesarias para
pasar un buen viaje.
• La página se posee una estructura en bloques, el

logo centrado en la cabecera debajo el menú.
• Las fotografías no tienen algún tratamiento y

ocupan pequeños bloques, la tipografía en negro
que se utiliza posee serif lo que le da cierto toque
de elegancia, en cuanto a la paleta de colores
tenemos el rojo ocre para algunos detalles y el
blanco como fondo.
• En la parte superior se añade una descripción del

hotel, otros lugares de interés alrededor,
habitaciones, localización, valoración de clientes,
ya en el footer las redes sociales y contacto.
21
BESE
El menu es desplegable
ademas de la opcion
para hacer una
reservación.
Foto principal mostrando

los ambientes del hotel,
asi como un texto
descriptivo dando la
bienvenida
En esta seccion se
muestran mediante
imágenes el entorno asi
como otras actividades
de interes, cada una
acompañda de una breve
descripcion.
Aquí se aprecian los tipos

de habitaciones con las
que se cuenta, al dar
click en una de ellas
conduce a una seccion
donde se brinda mayor
informacion
Contamos con un mapa

de localizacion para
ubicar con precision el
establecimeinto.
Esta seccion permite

apreciar las valoraciones
y comentarios de los
clientes.
En el footer se encuentra
la informacion de
contacto, direccion y
redes sociales.
22
II. PRESUPUESTO
23
III. DISEÑO DEL MAPA DE IDEAS (MINDMAP)
24
IV. CRONOGRAMA DE ACTIVIDADES
25
V. WIREFRAME (Home + 4 internas)
INDEX
26
INTERNA 1
27
INTERNA 2
28
INTERNA 3
29
INTERNA 4
30
VI. INDEX (Diseño)
31
VI. INDEX (HTML)
32
VII. ALOJAMIENTO - SIMPLE (Diseño)
33
VII. ALOJAMIENTO - SIMPLE (HTML)
34
VII. ALOJAMIENTO - DOBLE (Diseño)
35
VII. ALOJAMIENTO - DOBLE (HTML)
36
VII. ALOJAMIENTO - MATRIMONIAL (Diseño)
37
VII. ALOJAMIENTO - MATRIMONIAL (HTML)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
5 <title>Alojamiento</title>
6 <link rel="stylesheet" type="text/css" href="estilos.css"/>
7 </head>
8 <body>
9 <main>
10 <header><img src="imagenes/header_alojamiento.png" width="1024" height="500" />
11 </header>
12 <nav>
13 <ul>
14 <li> <a href="alojamiento.html">ALOJAMIENTO</a></li>
15 <li> <a href="experiencias.html">EXPERIENCIAS</a></li>
16 <li> <a href="restaurante.html">RESTAURANTE</a></li>
17 <li> <a href="promociones.html">PROMOCIONES</a></li>
18 <li> <a href="galeria.html">GALERÍA</a></li>
19 <li> <a href="reservar.html">RESERVAR</a></li>
20 <li> <a href="contacto.html">CONTACTO</a></li>
21 </ul>
22 </nav>
23 <br />
24 <br />
25 <br/>
26 <section>
27 <h1><a href="alojamiento.html">HABITACIONES</a></h1>
28 <hr>
29 <br />
30 <br>
31 <menu id="tipos">
32 <ul>
33 <li><a href="alojamiento.html">Simple</a></li>
34 <li><a href="doble.html">Doble</a></li>
35 <li><a href="matrimonial.html">Matrimonial</a></li>
36 <li><a href="ejecutiva.html">Ejecutiva</a></li>
37 <li><a href="vip.html">VIP</a></li>
38 </ul>
39 </menu>
40 <br />
41 <br />
42 <article class="slider">
43 <aside class="info">
44 <h4>Hermosa habitación para pareja. Incluye una cena de cortesía en nuestro restaurante.
45 <br />
46 <br />
47 Equipada con una excelente cama Queen, mesa para dos y baño con jacuzzi.
48 <br />
49 <br />
50 Cuenta con sistemas de calefacción y aire acondicionado para ofrecer la mayor comodidad durante su estadía.</h4>
51 <br />
52 <div class="servicios"><img src="imagenes/servicios.png" width="280" height="45" /></div>
53 <h5>$200
54 <button class="botonreservar">RESERVAR</button>
55 </h5>
56 </aside>
57 <div class="fotos"/>
58 <img src="imagenes/hab3.jpg" width="650" height="500" />
59 </div>
60 </article>
61 </section>
62 <footer>
63 <ul>
64 <li><a href="alojamiento.html">ALOJAMIENTO</a><br />
65 <span><a href="alojamiento.html">Habitaciones</span></a><br /></li>
66 <li><a href="experiencias.html">EXPERIENCIAS</a><br />
67 <span><a href="experiencias.html">Club</span></a><br />
68 <span><a href="experiencias.html">Deportes</span></a><br />
69 <span><a href="experiencias.html">Asesoría</span></a></li>
70 <li><a href="restaurante.html">RESTAURANTE</a><br />
71 <span><a href="restaurante.html">Nacional</span></a><br />
72 <span><a href="restaurante.html">Internacional</span></a></li>
73 <li><a href="promociones.html">PROMOCIONES</a><br />
74 <span><a href="promociones.html">Paquetes</span></a></li>
75 <li><a href="galeria.html">GALERÍA</a><br />
76 <span><a href="galeria.html">Fotos</span></a><br />
77 <span><a href="galeria.html">Videos</span></a></li>
78 <li><a href="reservar.html">RESERVAR</a><br />
79 <span><a href="reservar.html">Formulario</span></a><br />
80 <span><a href="reservar.html">Términos</span></a></li>
81 <li><a href="contacto.html">CONTACTO</a><br />
82 <span><a href="contacto.html">¿Quiénes somos?</a></span><br />
83 <span><a href="contacto.html">Mapa</span></a></li>
84 </ul>
85 <div class="idioma1"><a href="#"><img src="imagenes/esp.gif" /></a></div>
86 <div class="idioma2"><a href="#"><img src="imagenes/eng.png" /></a></div>
87 <footer class="logo"><a
88 href="index.html"><img src="imagenes/RANKA-WASI-logo-08.fw.png" width="179" height="109"/></a>
89 <address>5to Paradero Yanahuara, Valle Sagrado, Cusco, PE <br />
90 Teléfono: 51 984765501 | 51 984765502 | 51 984765503 </br>
91 GPS: -13.271698, -72.175430</address>
92 <br />
93 <div id="redes"><a href="facebook.html"><img src="imagenes/fb.png" width="25" height="25" /></a><a href="#"><img src="imagenes/tw.png" width="
25" height="25" /></a></div>
94 <p> 2016 - Todos los derechos reservados. </p></footer>
95 </main>
96 </body>
97 </html>
98
Macintosh HD:Users:Thalia:Desktop:HOTEL:matrimonial.html: 1/1
38
VII. ALOJAMIENTO - EJECUTIVA (Diseño)
39
VII. ALOJAMIENTO - EJECUTIVA (HTML)
40
VII. ALOJAMIENTO - VIP (Diseño)
41
VII. ALOJAMIENTO - VIP (HTML)
42
VIII. EXPERIENCIAS - CANOPY (Diseño)
43
VIII. EXPERIENCIAS - CANOPY (HTML)
44
VIII. EXPERIENCIAS - RAFTING (Diseño)
45
VIII. EXPERIENCIAS - RAFTING (HTML)
46
VIII. EXPERIENCIAS - CUATRIMOTOS (Diseño)
47
VIII. EXPERIENCIAS - CUATRIMOTOS (HTML)
48
VIII. EXPERIENCIAS - TREKKING (Diseño)
49
VIII. EXPERIENCIAS - TREKKING (HTML)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
5 <title>Experiencias</title>
6 <link rel="stylesheet" type="text/css" href="estilos.css"/>
7 </head>
8 <body>
9 <main>
10 <header><img src="imagenes/header_experiencias.png" width="1024" height="500" />
11 </header>
12 <nav>
13 <ul>
14 <li> <a href="alojamiento.html">ALOJAMIENTO</a></li>
15 <li> <a href="experiencias.html">EXPERIENCIAS</a></li>
16 <li> <a href="restaurante.html">RESTAURANTE</a></li>
17 <li> <a href="promociones.html">PROMOCIONES</a></li>
18 <li> <a href="galeria.html">GALERÍA</a></li>
19 <li> <a href="reservar.html">RESERVAR</a></li>
20 <li> <a href="contacto.html">CONTACTO</a></li>
21 </ul>
22 </nav>
23 <br />
24 <br />
25 <br />
26 <section>
27 <h1><a href="experiencias.html">EXPERIENCIAS</a></h1>
28 <hr>
29 <br />
30 <br>
31 <menu id="tipos">
32 <ul>
33 <li><a href="experiencias.html">Canopy en el Valle Sagrado</a></li>
34 <li><a href="rafting.html">Rafting en Ollantaytambo</a></li>
35 <li><a href="cuatrimotos.html">Cuatrimotos en Moray</a></li>
36 <li><a href="trekking.html">Trekking en Urubamba</a></li>
37 <li><a href="caballo.html">Paseos a caballo</a></li>
38 </ul>
39 </menu>
40 <br />
41 <br />
42 <article class="slider">
43 <aside class="info">
44 <h4>Disfruta del paisaje recorriendo alguno de los 20 Treks del Valle Sagrado del Urubamba.
45 <br />
46 <br />
47 Escoge el que más se acomode a tu disponibilidad y comodidad. ¡Hay tours de 2,000 hasta 6,500 msnm!
48 <br />
49 <br />
50 Recomendamos tomar alguno de nuestros cursos para aclimatación y salud.</h4>
51 <br />
52 <div class="servicios"><img src="imagenes/equipo4.png" width="280" height="45" /></div>
53 <h5>$60
54 <button class="botonreservar">RESERVAR</button>
55 </h5>
56 </aside>
57 <div class="fotos"/>
58 <img src="imagenes/trekking.png" width="650" height="500" />
59 </div>
60 </article>
61 </section>
62 <footer>
63 <ul>
64 <li><a href="alojamiento.html">ALOJAMIENTO</a><br />
65 <span><a href="alojamiento.html">Habitaciones</span></a><br /></li>
66 <li><a href="experiencias.html">EXPERIENCIAS</a><br />
67 <span><a href="experiencias.html">Club</span></a><br />
68 <span><a href="experiencias.html">Deportes</span></a><br />
69 <span><a href="experiencias.html">Asesoría</span></a></li>
70 <li><a href="restaurante.html">RESTAURANTE</a><br />
71 <span><a href="restaurante.html">Nacional</span></a><br />
72 <span><a href="restaurante.html">Internacional</span></a></li>
73 <li><a href="promociones.html">PROMOCIONES</a><br />
74 <span><a href="promociones.html">Paquetes</span></a></li>
75 <li><a href="galeria.html">GALERÍA</a><br />
76 <span><a href="galeria.html">Fotos</span></a><br />
77 <span><a href="galeria.html">Videos</span></a></li>
78 <li><a href="reservar.html">RESERVAR</a><br />
79 <span><a href="reservar.html">Formulario</span></a><br />
80 <span><a href="reservar.html">Términos</span></a></li>
81 <li><a href="contacto.html">CONTACTO</a><br />
82 <span><a href="contacto.html">¿Quiénes somos?</a></span><br />
83 <span><a href="contacto.html">Mapa</span></a></li>
84 </ul>
85 <div class="idioma1"><a href="#"><img src="imagenes/esp.gif" /></a></div>
86 <div class="idioma2"><a href="#"><img src="imagenes/eng.png" /></a></div>
87 <footer class="logo"><a
88 href="index.html"><img src="imagenes/RANKA-WASI-logo-08.fw.png" width="179" height="109"/></a>
89 <address>5to Paradero Yanahuara, Valle Sagrado, Cusco, PE <br />
90 Teléfono: 51 984765501 | 51 984765502 | 51 984765503 </br>
91 GPS: -13.271698, -72.175430</address>
92 <br />
93 <div id="redes"><a href="facebook.html"><img src="imagenes/fb.png" width="25" height="25" /></a><a href="#"><img src="imagenes/tw.png" width="
25" height="25" /></a></div>
94 <p> 2016 - Todos los derechos reservados. </p></footer>
95 </main>
96 </body>
97 </html>
Macintosh HD:Users:Thalia:Desktop:HOTEL:trekking.html: 1/1
50
VIII. EXPERIENCIAS - CABALLOS (Diseño)
51
VIII. EXPERIENCIAS - CABALLOS (HTML)
52
IX. RESTAURANTE (Diseño)
53
IX. RESTAURANTE (HTML)
54
IX. RESTAURANTE - INTERNACIONAL (Diseño)
55
IX. RESTAURANTE - INTERNACIONAL (HTML)
56
IX. RESTAURANTE - NOVOANDINA (Diseño)
57
IX. RESTAURANTE - NOVOANDINA (HTML)
58
X. PROMOCIONES (Diseño)
59
X. PROMOCIONES (HTML)
60
XI. GALERÍA (Diseño)
61
XI. GALERÍA (HTML)
62
XI. GALERÍA - ORQUÍDEAS (Diseño)
63
XI. GALERÍA - ORQUÍDEAS (HTML)
64
XI. GALERÍA - AVENTURAS (Diseño)
65
XI. GALERÍA - AVENTURAS (HTML)
66
XIII. RESERVAR (Diseño)
67
XIII. RESERVAR (HTML)
68
XIII. RESERVAR (HTML)
69
XIV. CONTACTO (Diseño)
70
XIV. CONTACTO (HTML)
71
XIV. CÓDIGO CSS3
72
XIV. CÓDIGO CSS3
73
XIV. CÓDIGO CSS3
74
XIV. CÓDIGO CSS3
75
XIV. CÓDIGO CSS3
76
XV. PÁGINA DE FACEBOOK
77

Informe Web - Ranka Wasi

Caricato da

Informazioni sul documento

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

Informe Web - Ranka Wasi

Caricato da

Copyright:

Formati disponibili

DISEÑO & DESARROLLO WEB

I. ANÁLISIS DE PÁGINAS WEB

Fuentes: casa-andina.com/sobre-nosotros/ & facebook.com/casaandina

Ofrece tres servicios:

1. Classic: Hoteles cómodos en lugares céntricos. (14 hoteles)

Características de los hoteles Casa Andina:

• Cadena peruana que promociona la cultura local

El diseño de la página web de Casa Andina maneja una estructura de bloques

Header1: Chat, contacto, idioma,

Header2: Logotipo y menú de

Mini formulario de reservas rápido

Foto de slider principal con

Secciones secundarias con el

Formulario de contacto y consulta

Footer informativo, contacto, redes

Fuentes: tierravivahoteles.com & facebook.com/tierravivahoteles/

Ofrece dos servicios principales:

1. Hospedaje: Hoteles agradables que dan una sensación hogareña.

Características de los hoteles Tierra Viva:

• Cadena peruana que promociona la cultura local

El diseño de la página web de Tierra Viva hoteles tambíen maneja una

Header: Logotipo, redes

Video como imagen principal

Mini formulario de reservas

Promoción del momento

Información breve acerca

Secciones secundarias con la

Blog y sección de promoción final

Promoción del momento

Footer informativo, selección de

Objetivo: Brindar un servicio de excelente calidad orientado a turistas en Perú

Ofrece tres servicios principales:

1. Hospedaje: Habitaciones lujosas con vista al mar

Características del Hotel Hilton Lima Miraflores:

• Cadena extranjera que promociona la cultura local (Lima, Perú)

Header2: Logotipo, dirección y

Honores y Anuncio turístico

El Hotel Foresta, categorizado en 4

Su objetivo, es ofrecer la mayor

Ofrece servicios tales como:

Foresta tiene caracteristicas en si por

• Permite registrarse a los

• Cuenta con una barra para

• Siempre encuentras un boton

• Tambien cuenta con una barra

• Cuenta con un diseño flat, es

Barra de disponibilidad de los

• Predomina el diseño fotográfico

• Cuenta con un gran cuadro de

• Remancan para visitar en la

• Cuenta con la opcion de

Barra con informacion

Recuadro para solicitar

• Su sitio web es simple en diseño,

• La página principal tiene una lista

• La página de cada aventura tiene

Menu desplegable que

Foto principal en slider

Los iconos que enlazan

• Su sitio web presenta en la parte superior una

• La mayoría de páginas sigue el modelo de

• El Hotel Inti Ñan es un hotel

• El sitio web del hotel

• La parte superior hay