-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcomencemos.html
199 lines (198 loc) · 9.88 KB
/
comencemos.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="author" content="Ana" />
<meta name="copyright" content="2024" />
<meta name="description" content="Sitio práctica bootstrap" />
<meta name="keywords" content="html,css,bootstrap" />
<link rel="shortcut icon" href="/img/favicon.png" />
<!-- BOOTSTRAP CSS-->
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous" />
<!-- BOOTSTRAP ICONOS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
<!-- GOOGLE FONTS -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&display=swap" rel="stylesheet" />
<!-- MI CSS -->
<link rel="stylesheet" href="./css/styles.css" />
<title>Comencemos tu nuevo proyecto | STUDIO BAD DOG</title>
</head>
<body>
<header class="sticky-top">
<nav class="navbar navbar-expand-lg bg-dark" data-bs-theme="dark" role="navigation">
<div class="container">
<a class="navbar-brand" href="index.html"><img src="./img/bad-dog-studio-logo.png" alt="Logo bad dog" /></a>
<button
class="navbar-toggler border-0"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarNavDropdown"
aria-controls="navbarNavDropdown"
aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavDropdown">
<ul class="navbar-nav ms-lg-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">Inicio</a>
</li>
<li class="nav-item dropdown">
<a
class="nav-link dropdown-toggle"
href="sitios.html"
role="button"
data-bs-toggle="dropdown"
aria-expanded="false">
Sitios
</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="sitios.html#ultimosproyectos">Últimos proyectos</a>
</li>
<li>
<a class="dropdown-item" href="sitios.html#singlepage">SinglePage</a>
</li>
<li>
<a class="dropdown-item" href="sitios.html#multipage">MultiPage</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="clientes.html">Clientes</a>
</li>
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="comencemos.html">Comencemos</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contacto.html">¿Interesado?</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<main class="container-fluid gris-claro">
<section class="row p-5" aria-label="sección principal">
<article class="col-12 text-center">
<h1>Comencemos tu nuevo proyecto</h1>
<p>Me encanta la colaboración mutua entre <strong>profesional-cliente</strong>, prefiero la frase:</p>
<p class="fw-bold fs-3">"Trabajo contigo".</p>
<p class="fs-4">En vez de: <b>Trabajo para ti</b>.</p>
</article>
<article class="col-12">
<p>
Me gusta tener contacto directo con el cliente, lo que permite una comunicación clara y actualizaciones periódicas del
proyecto, haciendo todo lo posible para no causar demoras. Intento definir las características y experiencias más
adecuadas que brinden la máxima satisfacción.
</p>
<p>
Me parece importante ofrecer a mis clientes una comprensión clara de lo que pueden y deben esperar de mí. Si
trabajamos juntos en su sitio web, el proceso será como se describe a continuación:
</p>
</article>
<div class="d-lg-flex align-items-lg-center">
<article class="col-12 col-lg-6 text-lg-end">
<h2>Paso 1</h2>
<h3>Concepto y Presupuesto</h3>
<p>
Discutimos las primeras ideas durante una breve reunión en sitio, por correo electrónico o video llamada. Siguiendo
las ideas iniciales, te presentaré un presupuesto oficial para el proyecto.
</p>
</article>
<article class="col-12 col-lg-6">
<img src="./img/workflow-step-1.png" alt="imagen de paso a paso 1" class="img-fluid" />
</article>
</div>
<div class="d-lg-flex align-items-lg-center">
<article class="col-12 col-lg-6 order-lg-1">
<h2>Paso 2</h2>
<h3>Propuesta de Diseño</h3>
<p>
Una vez que se firme y/o acepte la cotización, recibirás la primera factura (50% del monto total acordado). Después
del pago iniciaré el proyecto. Estudiaré tu empresa, producto o servicio. Para acelerar el proceso, es necesario que
me entregues todo el material del proyecto en este momento (Logo, Textos, Fotos, Mapa del sitio, etc.). En 7 días te
presentaré un diseño profesional y apropiado para tu sitio web.
</p>
</article>
<article class="col-12 col-lg-6">
<img src="./img/workflow-step-2.png" alt="imagen de paso a paso 2" class="img-fluid" />
</article>
</div>
<div class="d-lg-flex align-items-lg-center">
<article class="col-12 col-lg-6 text-lg-end">
<h2>Paso 3</h2>
<h3>Retroalimentación</h3>
<p>
Después de la primera presentación del diseño, puedes dar tu opinión y compartir comentarios. Tendrás un máximo de 2
rondas de comentarios*. De esta manera no nos detenemos en un círculo sin fin de cambios menores. Esto evita perder
tiempo y presupuesto. Es importante compartir buenos comentarios.
</p>
</article>
<article class="col-12 col-lg-6">
<img src="./img/workflow-step-3.png" alt="imagen de paso a paso 3" class="img-fluid" />
</article>
</div>
<div class="d-lg-flex align-items-lg-center">
<article class="col-12 col-lg-6 order-lg-1 ps-4">
<h2>Paso 4</h2>
<h3>Acabado de Diseño y Contenido</h3>
<p>
Después de la última ronda de comentarios, haré los cambios finales y terminaré el diseño completamente. En consulta
contigo, también se procesa el contenido final, como textos y fotos.
</p>
</article>
<article class="col-12 col-lg-6">
<img src="./img/workflow-step-4.png" alt="imagen de paso a paso 4" class="img-fluid" />
</article>
</div>
<div class="d-lg-flex align-items-lg-center">
<article class="col-12 col-lg-6 text-lg-end">
<h2>Paso 5</h2>
<h3>Fin del Proyecto</h3>
<p>
Dependiendo de la complejidad del proyecto, se terminará de 2 a 8 semanas. Una vez finalizado, recibirás la factura
final (a menos que se acuerde de otra manera). Después del pago, te enviaré una copia de todos los archivos
originales y pondré en línea tu sitio. Después de esta etapa, los cambios menores y los errores se procesarán de
forma gratuita. Los cambios mayores tendrán costos adicionales*.
</p>
</article>
<article class="col-12 col-lg-6">
<img src="./img/workflow-step-5.png" alt="imagen de paso a paso 5" class="img-fluid" />
</article>
</div>
<article class="col-12 text-center">
<small>* Todo cambio adicional generará cargos extras. Tarifa por hora: <b>150usd + impuestos.</b></small>
</article>
</section>
</main>
<footer class="bg-dark py-3 text-white" aria-label="pie de página">
<div class="container">
<nav class="d-flex justify-content-around mb-3 fs-3">
<a href="https://www.twitter.com" target="_blank"><i class="bi bi-twitter" aria-label="link twitter"></i></a>
<a href="https://www.github.com" target="_blank"><i class="bi bi-github" aria-label="link github"></i></a>
<a href="https://www.facebook.com" target="_blank"><i class="bi bi-facebook" aria-label="link facebook"> </i></a>
<a href="https://www.youtube.com" target="_blank"><i class="bi bi-youtube" aria-label="link youtube"></i></a>
<a href="https://www.instagram.com" target="_blank"><i class="bi bi-instagram" aria-label="link instagram"></i></a>
<a href="https://m.me/user" target="_blank"><i class="bi bi-messenger" aria-label="link messenger"></i></a>
<a href="https://api.whatsapp.com/send?phone=541111111111" target="_blank"><i class="bi bi-whatsapp" aria-label="link whatsapp"></i></a>
</nav>
<p class="d-flex justify-content-center">
©2024 Ana Galvez. Tomado del sitio  
<a href="https://www.studiocorvus.com" target="_blank">Studio Corvus</a>
</p>
</div>
</footer>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
crossorigin="anonymous"></script>
</body>
</html>