Comencemos<\/title>\r\n <style>\r\n * ,*:before, *:after{\r\n padding: 0;\r\n margin: 0;\r\n box-sizing: border-box;\r\n}\r\n\r\n:root {\r\n --color-bg-1: #f0f5f5;\r\n --color-btn:#07284A;\r\n --color-header-step: #07284A; \r\n --color-border-input: #080808;\r\n --color-shadow: #2e2e2e;\r\n}\r\n\r\n\/*Contenedor Principal*\/\r\n.root {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n min-height: 90vh;\r\n font-size: 16px;\r\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\r\n overflow: hidden;\r\n}\r\n\r\n\/*Formulario*\/\r\n.form-register {\r\n padding: 20px 15px;\r\n width: 100%;\r\n max-width: 450px;\r\n\r\n}\r\n\r\n\/*barra*\/\r\n.progressbar {\r\n display: flex;\r\n list-style: none;\r\n margin-bottom: 15px;\r\n counter-reset: step;\r\n \r\n \r\n}\r\n\r\n.progressbar_option {\r\n width: 100%;\r\n text-align: center;\r\n font-size: .7rem;\r\n text-transform: uppercase;\r\n position: relative;\r\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\r\n \r\n}\r\n\r\n.progressbar_option:before {\r\n display: flex;\r\n content: counter(step);\r\n counter-increment: step;\r\n width: 20px;\r\n height: 20px;\r\n background-color: #f9ffd1 ;\r\n margin: 0 auto 5px;\r\n border-radius: 50%;\r\n justify-content: center;\r\n align-items: center;\r\n position: relative;\r\n z-index: 2 ;\r\n}\r\n\r\n.progressbar_option:after {\r\n display: block;\r\n content: '';\r\n width: 100%;\r\n height: 2px;\r\n background-color: white;\r\n position: absolute;\r\n top: 10px;\r\n left: -50%;\r\n z-index: 1;\r\n}\r\n\r\n.progressbar_option:first-child:after {\r\n content: none;\r\n \r\n}\r\n\r\n.progressbar_option.active:before, .progressbar_option.active:after{\r\n background-color: #07284A;\r\n \r\n\r\n}\r\n\r\n\/*Titulo del formulario*\/\r\n.form-register_title{\r\n font-size: 1.4rem;\r\n text-align: center;\r\n margin-bottom: 15px;\r\n\r\n}\r\n\r\n\/*body del formulario*\/\r\n.form-register_body {\r\n display: flex;\r\n align-items: flex-start;\r\n\r\n}\r\n\r\n.step {\r\n background-color: rgb(247, 246, 246);\r\n box-shadow: 5px 5px 5px 2px var(--color-shadow);\r\n border-radius: 5%;\r\n min-width: 100%;\r\n opacity: 0;\r\n transition: all .2s linear;\r\n}\r\n.step.active {\r\n opacity:2;\r\n\r\n}\r\n.step.to-left{\r\n margin-left: -100%;\r\n}\r\n.step.inactive {\r\n animation-name: scale;\r\n animation-duration: .2s;\r\n animation-direction: alternative;\r\n animation-iteration-count: 2;\r\n}\r\n@keyframes scale {\r\n from {\r\n transform: scale(1);\r\n }\r\n to {\r\n transform: scale(1.1)\r\n }\r\n}\r\n\r\n\/*header de step*\/\r\n.step_header {\r\n padding: 20px 15px;\r\n background-color: var(--color-header-step);\r\n border-radius: 3px 3px 0 0;\r\n}\r\n\r\n.step_title {\r\n font-size: 1.1rem;\r\n text-align: center;\r\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\r\n \r\n}\r\n\r\n\/*body de step*\/\r\n\r\n.step_body{\r\n padding: 20px 30px 0;\r\n\r\n}\r\n\r\n.step_input{\r\n display: block;\r\n width: 100%;\r\n padding: 10px;\r\n margin-bottom: 10px;\r\n border-radius: 3px;\r\n border: 1px solid var(--color-border-input);\r\n}\r\n\r\n\r\n.step_footer{\r\n padding: 20px 15px;\r\n text-align: center;\r\n}\r\n\r\n.step_button{\r\n display: inline-block;\r\n padding: 10px;\r\n background-color: var(--color-btn);\r\n border: none;\r\n color: white;\r\n border-radius: 15%;\r\n cursor: pointer;\r\n}\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"root\">\r\n <form method=\"POST\" action=\"https:\/\/bechaprastudio.com\/disenioanswers.php\" class=\"form-register\">\r\n <div class=\"form-register_header\">\r\n <h1 class=\"form-register_title\"> REGISTRO<\/h1> <br>\r\n <ul class=\"progressbar\">\r\n <li class=\"progressbar_option active\"><\/li>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br> \r\n <\/ul>\r\n <br> <br>\r\n <\/div>\r\n <div class=\"form-register_body\"> \r\n <div class=\"step active\" id=\"step-1\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b><FONT COLOR=\"white\">INFORMACI\u00d3N GENERAL <small> (Paso 1)<\/small><\/FONT><\/b><\/small><\/h2>\r\n <\/div> <br>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\"> Nombre de la empresa o marca: <\/h5> \r\n <input type=\"text\" class=\"step_input\" name=\"nombre\"> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">Breve descripci\u00f3n de la empresa<\/h5> \r\n <input type=\"text\" class=\"step_input\" name=\"descripci\u00f3n\"> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">Objetivos principales de la p\u00e1gina web<\/h5> \r\n <input type=\"text\" class=\"step_input\" name=\"objetivos\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCuenta con un manual de marca?<\/h5>\r\n <input type=\"text\" class=\"step_input\" name=\"manual\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"2\" data-step=\"1\">Siguiente <\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step\" id=\"step-2\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <FONT COLOR=\"white\">P\u00daBLICO OBJETIVO Y COMPETENCIA<small> (Paso 2)<\/small><\/FONT><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfA qui\u00e9n est\u00e1 dirigida la p\u00e1gina web?<\/h5>\r\n <input type=\"text\" placeholder=\"(edad,g\u00e9nero, ubicaci\u00f3n, etc.)\"class=\"step_input\" name=\"dirigida\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\"> \u00bfHay alg\u00fan segmento espec\u00edfico que quieran alcanzar?<\/h5>\r\n <input type=\"text\" class=\"step_input\" name=\"segmento\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfPuede proporcionar ejemplos de sitios web de la competencia que le gusten o que considere efectivos?<\/h5>\r\n <input type=\"text\" placeholder=\"\" class=\"step_input\" name=\"ejemplos\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"1\" data-step=\"2\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"3\" data-step=\"2\">Siguiente<\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step\" id=\"step-3\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">FUNCIONALIDADES <small> (Paso 3)<\/small><\/font><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfQu\u00e9 funcionalidades espec\u00edficas le gustar\u00eda tener en su p\u00e1gina web?<\/h5>\r\n <input type=\"text\" placeholder=\"(Formularios, tienda en l\u00ednea, blog, etc.)\" class=\"step_input\" name=\"funcionalidades\"> \r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"2\" data-step=\"3\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"4\" data-step=\"3\">Siguiente<\/button>\r\n <\/div>\r\n <\/div> <br> <br>\r\n <div class=\"step\" id=\"step-4\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">DISE\u00d1O Y ESTILO <small>(Paso 4)<\/small><\/font><\/b><\/h2> \r\n <\/div>\r\n <div class=\"step_body\">\r\n <div class=\"contenedor\">\r\n a)<img decoding=\"async\" src=\"https:\/\/www.webolto.com\/es\/wp-content\/uploads\/sites\/2\/2021\/07\/Airbnb-1536x673.jpg\" class=\"my-4\" style=\"max-width: 27%;\">\r\n b)<img decoding=\"async\" src=\"https:\/\/www.webolto.com\/es\/wp-content\/uploads\/sites\/2\/2021\/07\/Etsy-homepage-1536x770.jpg\" class=\"my-4\" style=\"max-width: 27%;\">\r\n c)<img decoding=\"async\" src=\"https:\/\/www.webolto.com\/es\/wp-content\/uploads\/sites\/2\/2021\/07\/Udemy-1536x704.jpg\" class=\"my-4\" style=\"max-width: 27%;\">\r\n <\/div> <br>\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l de estos dise\u00f1os de home le gusta m\u00e1s?<\/h5>\r\n <\/div>\r\n <div class=\"col\"> <center>\r\n <select class=\"form-select\" style=\"width: 80%;\">\r\n <option value=\"null\">Seleccione...<\/option>\r\n <option value=\"a\">\r\n a \r\n <\/option>\r\n <option value=\"b\">\r\n b \r\n <\/option>\r\n <option value=\"c\">\r\n c\r\n <\/option>\r\n <\/select> <\/center>\r\n <\/div> <br><hr>\r\n <div class=\"step_body\">\r\n <div class=\"contenedor\">\r\n a)<img decoding=\"async\" src=\"https:\/\/www.creativosonline.org\/wp-content\/uploads\/2018\/04\/formulari-minimalista.jpg.webp\" class=\"my-4\" style=\"max-width: 27%;\">\r\n b)<img decoding=\"async\" src=\"https:\/\/www.creativosonline.org\/wp-content\/uploads\/2018\/04\/vintage.jpg.webp\" class=\"my-4\" style=\"max-width: 27%;\">\r\n c)<img decoding=\"async\" src=\"https:\/\/www.creativosonline.org\/wp-content\/uploads\/2018\/04\/formulario-contacto-expansivo.jpg.webp\" class=\"my-4\" style=\"max-width: 27%;\">\r\n <\/div> <br> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l de estos dise\u00f1os de formulario le gusta m\u00e1s?<\/h5>\r\n <\/div>\r\n <div class=\"col\"><center>\r\n <select class=\"form-select\" style=\"width: 90%;\">\r\n <option value=\"null\">Seleccione...<\/option>\r\n <option value=\"a\">\r\n a \r\n <\/option>\r\n <option value=\"b\">\r\n b \r\n <\/option>\r\n <option value=\"c\">\r\n c\r\n <\/option>\r\n <\/select><\/center>\r\n <\/div> <br><hr>\r\n <div class=\"step_body\">\r\n <div class=\"contenedor\">\r\n a)<img decoding=\"async\" src=\"https:\/\/www.hostinger.es\/tutoriales\/wp-content\/uploads\/sites\/7\/2019\/10\/arial.png\" class=\"my-4\" style=\"max-width: 27%;\">\r\n b)<img decoding=\"async\" src=\"https:\/\/www.hostinger.es\/tutoriales\/wp-content\/uploads\/sites\/7\/2019\/10\/courier-new-fuente.png\" class=\"my-4\" style=\"max-width: 27%;\">\r\n c)<img decoding=\"async\" src=\"https:\/\/www.hostinger.es\/tutoriales\/wp-content\/uploads\/sites\/7\/2019\/10\/brush-script-mt-fuente.png\" class=\"my-4\" style=\"max-width: 27%;\">\r\n <\/div> <br> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l de estos estilos tipogr\u00e1ficos le gusta m\u00e1s?<\/h5>\r\n <\/div>\r\n <div class=\"col\"><center>\r\n <select class=\"form-select\" style=\"width: 90%;\">\r\n <option value=\"null\">Seleccione...<\/option>\r\n <option value=\"a\">\r\n a \r\n <\/option>\r\n <option value=\"b\">\r\n b \r\n <\/option>\r\n <option value=\"c\">\r\n c\r\n <\/option>\r\n <\/select><\/center>\r\n <\/div> <br><hr>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfHay alg\u00fan sitio web en particular cuyo dise\u00f1o le llame la atenci\u00f3n?<\/h5>\r\n <input type=\"text\" class=\"step_input\" name=\"sitio\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"3\" data-step=\"4\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"5\" data-step=\"4\">Siguiente<\/button>\r\n <\/div> <br>\r\n <\/div>\r\n \r\n <div class=\"step\" id=\"step-5\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">CONTENIDO (PASO 5) <\/font><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1ntos servicios tiene?<\/h5>\r\n <input type=\"Servicio\" class=\"step_input\" name=\"servicios\"> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfNecesita ayuda con la redacci\u00f3n del sitio?<\/h5>\r\n <input type=\"Ayuda\" class=\"step_input\" name=\"redacci\u00f3n\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l cre\u00e9 que es el nivel de implementaci\u00f3n de su sitio web?<\/h5> \r\n <select class=\"form-select\" style=\"width: 100%;\">\r\n <option value=\"null\">Seleccione ...<\/option>\r\n <option value=\"1\" >B\u00e1sica<\/option>\r\n <option value=\"2\">Informativa<\/option>\r\n <option value=\"3\">Pagina Web E-commerce B\u00e1sica<\/option>\r\n <option value=\"4\">Personalizada<\/option>\r\n <\/select>\r\n \r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"4\" data-step=\"5\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"6\" data-step=\"5\">Siguiente<\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step\" id=\"step-6\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">MANTENIMIENTO Y ACTUALIZACIONES (PASO 6) <\/font><\/b><\/h2>\r\n <\/div>\r\n \r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfQui\u00e9n se encargar\u00e1 del mantenimiento y las actualizaciones futuras de la p\u00e1gina web? <\/h5>\r\n <input type=\"Mantenimiento\" class=\"step_input\" placeholder=\"Empleado capacitado, administrador, no cuento con personal\" name=\"mantenimiento\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"5\" data-step=\"6\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"7\" data-step=\"6\">Siguiente<\/button>\r\n <\/div> <\/div>\r\n <div class=\"step\" id=\"step-7\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">PLAZOS Y PRESUPUESTOS (PASO 7) <\/font><\/b><\/h2>\r\n <\/div>\r\n \r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l es el plazo esperado para la finalizaci\u00f3n del proyecto?<\/h5>\r\n <select class=\"form-select\" style=\"width: 100%;\">\r\n <option value=\"null\">Selecciona...<\/option>\r\n <option value=\"3 a 6 meses\">\r\n 3 a 6 meses\r\n <\/option>\r\n <option value=\"7 a 9 meses\">\r\n 7 a 9 meses\r\n <\/option>\r\n <option value=\"10 a 12 meses\">\r\n 10 a 12 meses\r\n <\/option>\r\n <\/select>\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfTiene un presupuesto estimado para el proyecto?<\/h5>\r\n <input type=\"Presupuesto\" class=\"step_input\" name=\"presupuesto\">\r\n <\/div> <br>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"6\" data-step=\"7\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"8\" data-step=\"7\">Siguiente<\/button>\r\n <\/div> \r\n <\/div>\r\n <div class=\"step\" id=\"step-8\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">SEO Y MARKETING ( PASO 8)<\/font><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfTiene requisitos espec\u00edficos en t\u00e9rmino de optimizaci\u00f3n para motores de b\u00fasqueda (SEO)?<\/h5>\r\n <input type=\"Requisitos\" class=\"step_input\" name=\"optimizaci\u00f3n\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"7\" data-step=\"8\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"9\" data-step=\"8\">Siguiente<\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step\" id=\"step-9\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\"> COMUNICACI\u00d3N Y APROBACIONES (PASO 9)<\/font><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1les la mejor manera de comunicarse durante el proceso de dise\u00f1o?<\/h5>\r\n <input type=\"comunicacion\" class=\"step_input\" name=\"comunicar\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfC\u00f3mo prefiere dar su aprobaci\u00f3n en las etapas claves del proyecto?<\/h5>\r\n <input type=\"text\" class=\"step_input\" name=\"Etapas\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"8\" data-step=\"9\">Regresar<\/button>\r\n <button type=\"submit\" class=\"step_button\">Registrar<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/form>\r\n \r\n <\/div>\r\n <script>\r\n let form = document.querySelector('.form-register');\r\nlet progressOptions = document.querySelectorAll('.progressbar_option');\r\n\r\nform.addEventListener('click', function(e) {\r\n let element = e.target;\r\n let isButtonNext = element.classList.contains('step_button--next');\r\n let isButtonBack = element.classList.contains('step_button--back');\r\n if (isButtonNext || isButtonBack) {\r\n let currentStep = document.getElementById('step-' + element.dataset.step);\r\n let jumpStep = document.getElementById('step-' + element.dataset.to_step);\r\n currentStep.addEventListener('animationend', function callback() {\r\n currentStep.classList.remove('active');\r\n jumpStep.classList.add('active');\r\n if (isButtonNext) {\r\n currentStep.classList.add('to-left');\r\n progressOptions[element.dataset.to_step - 1].classList.add('active');\r\n } else {\r\n jumpStep.classList.remove('to-left');\r\n progressOptions[element.dataset.step - 1].classList.remove('active');\r\n }\r\n currentStep.removeEventListener('animationend', callback);\r\n });\r\n currentStep.classList.add('inactive');\r\n jumpStep.classList.remove('inactive');\r\n }\r\n});\r\n <\/script> \r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Comencemos REGISTRO INFORMACI\u00d3N GENERAL (Paso 1) Nombre de la empresa o marca: Breve descripci\u00f3n de la empresa Objetivos principales de la p\u00e1gina web \u00bfCuenta con un manual de marca? Siguiente P\u00daBLICO OBJETIVO Y COMPETENCIA (Paso 2) \u00bfA qui\u00e9n est\u00e1 dirigida la p\u00e1gina web? \u00bfHay alg\u00fan segmento espec\u00edfico que quieran alcanzar? \u00bfPuede proporcionar ejemplos de sitios web de la competencia que le gusten o que considere efectivos? Regresar Siguiente FUNCIONALIDADES (Paso 3) \u00bfQu\u00e9 funcionalidades espec\u00edficas le gustar\u00eda tener en su p\u00e1gina web? Regresar Siguiente DISE\u00d1O Y ESTILO (Paso 4) a) b) c) \u00bfCu\u00e1l de estos dise\u00f1os de home le gusta m\u00e1s? Seleccione… a b c a) b) c) \u00bfCu\u00e1l de estos dise\u00f1os de formulario le gusta m\u00e1s? Seleccione… a b c a) b) c) \u00bfCu\u00e1l de estos estilos tipogr\u00e1ficos le gusta m\u00e1s? Seleccione… a b c \u00bfHay alg\u00fan sitio web en particular cuyo dise\u00f1o le llame la atenci\u00f3n? Regresar Siguiente CONTENIDO (PASO 5) \u00bfCu\u00e1ntos servicios tiene? \u00bfNecesita ayuda con la redacci\u00f3n del sitio? \u00bfCu\u00e1l cre\u00e9 que es el nivel de implementaci\u00f3n de su sitio web? Seleccione …B\u00e1sicaInformativaPagina Web E-commerce B\u00e1sicaPersonalizada Regresar Siguiente MANTENIMIENTO Y ACTUALIZACIONES (PASO 6) \u00bfQui\u00e9n se encargar\u00e1 del mantenimiento y las actualizaciones futuras de la p\u00e1gina web? Regresar Siguiente PLAZOS Y PRESUPUESTOS (PASO 7) \u00bfCu\u00e1l es el plazo esperado para la finalizaci\u00f3n del proyecto? Selecciona… 3 a 6 meses 7 a 9 meses 10 a 12 meses \u00bfTiene un presupuesto estimado para el proyecto? Regresar Siguiente SEO Y MARKETING ( PASO 8) \u00bfTiene requisitos espec\u00edficos en t\u00e9rmino de optimizaci\u00f3n para motores de b\u00fasqueda (SEO)? Regresar Siguiente COMUNICACI\u00d3N Y APROBACIONES (PASO 9) \u00bfCu\u00e1les la mejor manera de comunicarse durante el proceso de dise\u00f1o? \u00bfC\u00f3mo prefiere dar su aprobaci\u00f3n en las etapas claves del proyecto? Regresar Registrar<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-434","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/pages\/434"}],"collection":[{"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/comments?post=434"}],"version-history":[{"count":22,"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/pages\/434\/revisions"}],"predecessor-version":[{"id":544,"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/pages\/434\/revisions\/544"}],"wp:attachment":[{"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/media?parent=434"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t $\"\"$ \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Comencemos<\/title>\r\n <style>\r\n * ,*:before, *:after{\r\n padding: 0;\r\n margin: 0;\r\n box-sizing: border-box;\r\n}\r\n\r\n:root {\r\n --color-bg-1: #f0f5f5;\r\n --color-btn:#07284A;\r\n --color-header-step: #07284A; \r\n --color-border-input: #080808;\r\n --color-shadow: #2e2e2e;\r\n}\r\n\r\n\/*Contenedor Principal*\/\r\n.root {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n min-height: 90vh;\r\n font-size: 16px;\r\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\r\n overflow: hidden;\r\n}\r\n\r\n\/*Formulario*\/\r\n.form-register {\r\n padding: 20px 15px;\r\n width: 100%;\r\n max-width: 450px;\r\n\r\n}\r\n\r\n\/*barra*\/\r\n.progressbar {\r\n display: flex;\r\n list-style: none;\r\n margin-bottom: 15px;\r\n counter-reset: step;\r\n \r\n \r\n}\r\n\r\n.progressbar_option {\r\n width: 100%;\r\n text-align: center;\r\n font-size: .7rem;\r\n text-transform: uppercase;\r\n position: relative;\r\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\r\n \r\n}\r\n\r\n.progressbar_option:before {\r\n display: flex;\r\n content: counter(step);\r\n counter-increment: step;\r\n width: 20px;\r\n height: 20px;\r\n background-color: #f9ffd1 ;\r\n margin: 0 auto 5px;\r\n border-radius: 50%;\r\n justify-content: center;\r\n align-items: center;\r\n position: relative;\r\n z-index: 2 ;\r\n}\r\n\r\n.progressbar_option:after {\r\n display: block;\r\n content: '';\r\n width: 100%;\r\n height: 2px;\r\n background-color: white;\r\n position: absolute;\r\n top: 10px;\r\n left: -50%;\r\n z-index: 1;\r\n}\r\n\r\n.progressbar_option:first-child:after {\r\n content: none;\r\n \r\n}\r\n\r\n.progressbar_option.active:before, .progressbar_option.active:after{\r\n background-color: #07284A;\r\n \r\n\r\n}\r\n\r\n\/*Titulo del formulario*\/\r\n.form-register_title{\r\n font-size: 1.4rem;\r\n text-align: center;\r\n margin-bottom: 15px;\r\n\r\n}\r\n\r\n\/*body del formulario*\/\r\n.form-register_body {\r\n display: flex;\r\n align-items: flex-start;\r\n\r\n}\r\n\r\n.step {\r\n background-color: rgb(247, 246, 246);\r\n box-shadow: 5px 5px 5px 2px var(--color-shadow);\r\n border-radius: 5%;\r\n min-width: 100%;\r\n opacity: 0;\r\n transition: all .2s linear;\r\n}\r\n.step.active {\r\n opacity:2;\r\n\r\n}\r\n.step.to-left{\r\n margin-left: -100%;\r\n}\r\n.step.inactive {\r\n animation-name: scale;\r\n animation-duration: .2s;\r\n animation-direction: alternative;\r\n animation-iteration-count: 2;\r\n}\r\n@keyframes scale {\r\n from {\r\n transform: scale(1);\r\n }\r\n to {\r\n transform: scale(1.1)\r\n }\r\n}\r\n\r\n\/*header de step*\/\r\n.step_header {\r\n padding: 20px 15px;\r\n background-color: var(--color-header-step);\r\n border-radius: 3px 3px 0 0;\r\n}\r\n\r\n.step_title {\r\n font-size: 1.1rem;\r\n text-align: center;\r\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\r\n \r\n}\r\n\r\n\/*body de step*\/\r\n\r\n.step_body{\r\n padding: 20px 30px 0;\r\n\r\n}\r\n\r\n.step_input{\r\n display: block;\r\n width: 100%;\r\n padding: 10px;\r\n margin-bottom: 10px;\r\n border-radius: 3px;\r\n border: 1px solid var(--color-border-input);\r\n}\r\n\r\n\r\n.step_footer{\r\n padding: 20px 15px;\r\n text-align: center;\r\n}\r\n\r\n.step_button{\r\n display: inline-block;\r\n padding: 10px;\r\n background-color: var(--color-btn);\r\n border: none;\r\n color: white;\r\n border-radius: 15%;\r\n cursor: pointer;\r\n}\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"root\">\r\n <form method=\"POST\" action=\"https:\/\/bechaprastudio.com\/disenioanswers.php\" class=\"form-register\">\r\n <div class=\"form-register_header\">\r\n <h1 class=\"form-register_title\"> REGISTRO<\/h1> <br>\r\n <ul class=\"progressbar\">\r\n <li class=\"progressbar_option active\"><\/li>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br>\r\n <li class=\"progressbar_option\"><\/li> <br> \r\n <\/ul>\r\n <br> <br>\r\n <\/div>\r\n <div class=\"form-register_body\"> \r\n <div class=\"step active\" id=\"step-1\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b><FONT COLOR=\"white\">INFORMACI\u00d3N GENERAL <small> (Paso 1)<\/small><\/FONT><\/b><\/small><\/h2>\r\n <\/div> <br>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\"> Nombre de la empresa o marca: <\/h5> \r\n <input type=\"text\" class=\"step_input\" name=\"nombre\"> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">Breve descripci\u00f3n de la empresa<\/h5> \r\n <input type=\"text\" class=\"step_input\" name=\"descripci\u00f3n\"> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">Objetivos principales de la p\u00e1gina web<\/h5> \r\n <input type=\"text\" class=\"step_input\" name=\"objetivos\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCuenta con un manual de marca?<\/h5>\r\n <input type=\"text\" class=\"step_input\" name=\"manual\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"2\" data-step=\"1\">Siguiente <\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step\" id=\"step-2\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <FONT COLOR=\"white\">P\u00daBLICO OBJETIVO Y COMPETENCIA<small> (Paso 2)<\/small><\/FONT><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfA qui\u00e9n est\u00e1 dirigida la p\u00e1gina web?<\/h5>\r\n <input type=\"text\" placeholder=\"(edad,g\u00e9nero, ubicaci\u00f3n, etc.)\"class=\"step_input\" name=\"dirigida\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\"> \u00bfHay alg\u00fan segmento espec\u00edfico que quieran alcanzar?<\/h5>\r\n <input type=\"text\" class=\"step_input\" name=\"segmento\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfPuede proporcionar ejemplos de sitios web de la competencia que le gusten o que considere efectivos?<\/h5>\r\n <input type=\"text\" placeholder=\"\" class=\"step_input\" name=\"ejemplos\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"1\" data-step=\"2\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"3\" data-step=\"2\">Siguiente<\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step\" id=\"step-3\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">FUNCIONALIDADES <small> (Paso 3)<\/small><\/font><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfQu\u00e9 funcionalidades espec\u00edficas le gustar\u00eda tener en su p\u00e1gina web?<\/h5>\r\n <input type=\"text\" placeholder=\"(Formularios, tienda en l\u00ednea, blog, etc.)\" class=\"step_input\" name=\"funcionalidades\"> \r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"2\" data-step=\"3\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"4\" data-step=\"3\">Siguiente<\/button>\r\n <\/div>\r\n <\/div> <br> <br>\r\n <div class=\"step\" id=\"step-4\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">DISE\u00d1O Y ESTILO <small>(Paso 4)<\/small><\/font><\/b><\/h2> \r\n <\/div>\r\n <div class=\"step_body\">\r\n <div class=\"contenedor\">\r\n a)<img decoding=\"async\" src=\"https:\/\/www.webolto.com\/es\/wp-content\/uploads\/sites\/2\/2021\/07\/Airbnb-1536x673.jpg\" class=\"my-4\" style=\"max-width: 27%;\">\r\n b)<img decoding=\"async\" src=\"https:\/\/www.webolto.com\/es\/wp-content\/uploads\/sites\/2\/2021\/07\/Etsy-homepage-1536x770.jpg\" class=\"my-4\" style=\"max-width: 27%;\">\r\n c)<img decoding=\"async\" src=\"https:\/\/www.webolto.com\/es\/wp-content\/uploads\/sites\/2\/2021\/07\/Udemy-1536x704.jpg\" class=\"my-4\" style=\"max-width: 27%;\">\r\n <\/div> <br>\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l de estos dise\u00f1os de home le gusta m\u00e1s?<\/h5>\r\n <\/div>\r\n <div class=\"col\"> <center>\r\n <select class=\"form-select\" style=\"width: 80%;\">\r\n <option value=\"null\">Seleccione...<\/option>\r\n <option value=\"a\">\r\n a \r\n <\/option>\r\n <option value=\"b\">\r\n b \r\n <\/option>\r\n <option value=\"c\">\r\n c\r\n <\/option>\r\n <\/select> <\/center>\r\n <\/div> <br><hr>\r\n <div class=\"step_body\">\r\n <div class=\"contenedor\">\r\n a)<img decoding=\"async\" src=\"https:\/\/www.creativosonline.org\/wp-content\/uploads\/2018\/04\/formulari-minimalista.jpg.webp\" class=\"my-4\" style=\"max-width: 27%;\">\r\n b)<img decoding=\"async\" src=\"https:\/\/www.creativosonline.org\/wp-content\/uploads\/2018\/04\/vintage.jpg.webp\" class=\"my-4\" style=\"max-width: 27%;\">\r\n c)<img decoding=\"async\" src=\"https:\/\/www.creativosonline.org\/wp-content\/uploads\/2018\/04\/formulario-contacto-expansivo.jpg.webp\" class=\"my-4\" style=\"max-width: 27%;\">\r\n <\/div> <br> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l de estos dise\u00f1os de formulario le gusta m\u00e1s?<\/h5>\r\n <\/div>\r\n <div class=\"col\"><center>\r\n <select class=\"form-select\" style=\"width: 90%;\">\r\n <option value=\"null\">Seleccione...<\/option>\r\n <option value=\"a\">\r\n a \r\n <\/option>\r\n <option value=\"b\">\r\n b \r\n <\/option>\r\n <option value=\"c\">\r\n c\r\n <\/option>\r\n <\/select><\/center>\r\n <\/div> <br><hr>\r\n <div class=\"step_body\">\r\n <div class=\"contenedor\">\r\n a)<img decoding=\"async\" src=\"https:\/\/www.hostinger.es\/tutoriales\/wp-content\/uploads\/sites\/7\/2019\/10\/arial.png\" class=\"my-4\" style=\"max-width: 27%;\">\r\n b)<img decoding=\"async\" src=\"https:\/\/www.hostinger.es\/tutoriales\/wp-content\/uploads\/sites\/7\/2019\/10\/courier-new-fuente.png\" class=\"my-4\" style=\"max-width: 27%;\">\r\n c)<img decoding=\"async\" src=\"https:\/\/www.hostinger.es\/tutoriales\/wp-content\/uploads\/sites\/7\/2019\/10\/brush-script-mt-fuente.png\" class=\"my-4\" style=\"max-width: 27%;\">\r\n <\/div> <br> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l de estos estilos tipogr\u00e1ficos le gusta m\u00e1s?<\/h5>\r\n <\/div>\r\n <div class=\"col\"><center>\r\n <select class=\"form-select\" style=\"width: 90%;\">\r\n <option value=\"null\">Seleccione...<\/option>\r\n <option value=\"a\">\r\n a \r\n <\/option>\r\n <option value=\"b\">\r\n b \r\n <\/option>\r\n <option value=\"c\">\r\n c\r\n <\/option>\r\n <\/select><\/center>\r\n <\/div> <br><hr>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfHay alg\u00fan sitio web en particular cuyo dise\u00f1o le llame la atenci\u00f3n?<\/h5>\r\n <input type=\"text\" class=\"step_input\" name=\"sitio\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"3\" data-step=\"4\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"5\" data-step=\"4\">Siguiente<\/button>\r\n <\/div> <br>\r\n <\/div>\r\n \r\n <div class=\"step\" id=\"step-5\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">CONTENIDO (PASO 5) <\/font><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1ntos servicios tiene?<\/h5>\r\n <input type=\"Servicio\" class=\"step_input\" name=\"servicios\"> \r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfNecesita ayuda con la redacci\u00f3n del sitio?<\/h5>\r\n <input type=\"Ayuda\" class=\"step_input\" name=\"redacci\u00f3n\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l cre\u00e9 que es el nivel de implementaci\u00f3n de su sitio web?<\/h5> \r\n <select class=\"form-select\" style=\"width: 100%;\">\r\n <option value=\"null\">Seleccione ...<\/option>\r\n <option value=\"1\" >B\u00e1sica<\/option>\r\n <option value=\"2\">Informativa<\/option>\r\n <option value=\"3\">Pagina Web E-commerce B\u00e1sica<\/option>\r\n <option value=\"4\">Personalizada<\/option>\r\n <\/select>\r\n \r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"4\" data-step=\"5\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"6\" data-step=\"5\">Siguiente<\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step\" id=\"step-6\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">MANTENIMIENTO Y ACTUALIZACIONES (PASO 6) <\/font><\/b><\/h2>\r\n <\/div>\r\n \r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfQui\u00e9n se encargar\u00e1 del mantenimiento y las actualizaciones futuras de la p\u00e1gina web? <\/h5>\r\n <input type=\"Mantenimiento\" class=\"step_input\" placeholder=\"Empleado capacitado, administrador, no cuento con personal\" name=\"mantenimiento\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"5\" data-step=\"6\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"7\" data-step=\"6\">Siguiente<\/button>\r\n <\/div> <\/div>\r\n <div class=\"step\" id=\"step-7\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">PLAZOS Y PRESUPUESTOS (PASO 7) <\/font><\/b><\/h2>\r\n <\/div>\r\n \r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1l es el plazo esperado para la finalizaci\u00f3n del proyecto?<\/h5>\r\n <select class=\"form-select\" style=\"width: 100%;\">\r\n <option value=\"null\">Selecciona...<\/option>\r\n <option value=\"3 a 6 meses\">\r\n 3 a 6 meses\r\n <\/option>\r\n <option value=\"7 a 9 meses\">\r\n 7 a 9 meses\r\n <\/option>\r\n <option value=\"10 a 12 meses\">\r\n 10 a 12 meses\r\n <\/option>\r\n <\/select>\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfTiene un presupuesto estimado para el proyecto?<\/h5>\r\n <input type=\"Presupuesto\" class=\"step_input\" name=\"presupuesto\">\r\n <\/div> <br>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"6\" data-step=\"7\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"8\" data-step=\"7\">Siguiente<\/button>\r\n <\/div> \r\n <\/div>\r\n <div class=\"step\" id=\"step-8\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\">SEO Y MARKETING ( PASO 8)<\/font><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfTiene requisitos espec\u00edficos en t\u00e9rmino de optimizaci\u00f3n para motores de b\u00fasqueda (SEO)?<\/h5>\r\n <input type=\"Requisitos\" class=\"step_input\" name=\"optimizaci\u00f3n\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"7\" data-step=\"8\">Regresar<\/button>\r\n <button type=\"button\" class=\"step_button step_button--next\" data-to_step=\"9\" data-step=\"8\">Siguiente<\/button>\r\n <\/div>\r\n <\/div>\r\n <div class=\"step\" id=\"step-9\">\r\n <div class=\"step_header\">\r\n <h2 class=\"step_title\"> <b> <font color=\"white\"> COMUNICACI\u00d3N Y APROBACIONES (PASO 9)<\/font><\/b><\/h2>\r\n <\/div>\r\n <div class=\"step_body\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfCu\u00e1les la mejor manera de comunicarse durante el proceso de dise\u00f1o?<\/h5>\r\n <input type=\"comunicacion\" class=\"step_input\" name=\"comunicar\">\r\n <h5 class=\"step_sub\" style=\"margin-bottom: 15px;\">\u00bfC\u00f3mo prefiere dar su aprobaci\u00f3n en las etapas claves del proyecto?<\/h5>\r\n <input type=\"text\" class=\"step_input\" name=\"Etapas\">\r\n <\/div>\r\n <div class=\"step_footer\">\r\n <button type=\"button\" class=\"step_button step_button--back\" data-to_step=\"8\" data-step=\"9\">Regresar<\/button>\r\n <button type=\"submit\" class=\"step_button\">Registrar<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/form>\r\n \r\n <\/div>\r\n <script>\r\n let form = document.querySelector('.form-register');\r\nlet progressOptions = document.querySelectorAll('.progressbar_option');\r\n\r\nform.addEventListener('click', function(e) {\r\n let element = e.target;\r\n let isButtonNext = element.classList.contains('step_button--next');\r\n let isButtonBack = element.classList.contains('step_button--back');\r\n if (isButtonNext || isButtonBack) {\r\n let currentStep = document.getElementById('step-' + element.dataset.step);\r\n let jumpStep = document.getElementById('step-' + element.dataset.to_step);\r\n currentStep.addEventListener('animationend', function callback() {\r\n currentStep.classList.remove('active');\r\n jumpStep.classList.add('active');\r\n if (isButtonNext) {\r\n currentStep.classList.add('to-left');\r\n progressOptions[element.dataset.to_step - 1].classList.add('active');\r\n } else {\r\n jumpStep.classList.remove('to-left');\r\n progressOptions[element.dataset.step - 1].classList.remove('active');\r\n }\r\n currentStep.removeEventListener('animationend', callback);\r\n });\r\n currentStep.classList.add('inactive');\r\n jumpStep.classList.remove('inactive');\r\n }\r\n});\r\n <\/script> \r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Comencemos REGISTRO INFORMACI\u00d3N GENERAL (Paso 1) Nombre de la empresa o marca: Breve descripci\u00f3n de la empresa Objetivos principales de la p\u00e1gina web \u00bfCuenta con un manual de marca? Siguiente P\u00daBLICO OBJETIVO Y COMPETENCIA (Paso 2) \u00bfA qui\u00e9n est\u00e1 dirigida la p\u00e1gina web? \u00bfHay alg\u00fan segmento espec\u00edfico que quieran alcanzar? \u00bfPuede proporcionar ejemplos de sitios web de la competencia que le gusten o que considere efectivos? Regresar Siguiente FUNCIONALIDADES (Paso 3) \u00bfQu\u00e9 funcionalidades espec\u00edficas le gustar\u00eda tener en su p\u00e1gina web? Regresar Siguiente DISE\u00d1O Y ESTILO (Paso 4) a) b) c) \u00bfCu\u00e1l de estos dise\u00f1os de home le gusta m\u00e1s? Seleccione… a b c a) b) c) \u00bfCu\u00e1l de estos dise\u00f1os de formulario le gusta m\u00e1s? Seleccione… a b c a) b) c) \u00bfCu\u00e1l de estos estilos tipogr\u00e1ficos le gusta m\u00e1s? Seleccione… a b c \u00bfHay alg\u00fan sitio web en particular cuyo dise\u00f1o le llame la atenci\u00f3n? Regresar Siguiente CONTENIDO (PASO 5) \u00bfCu\u00e1ntos servicios tiene? \u00bfNecesita ayuda con la redacci\u00f3n del sitio? \u00bfCu\u00e1l cre\u00e9 que es el nivel de implementaci\u00f3n de su sitio web? Seleccione …B\u00e1sicaInformativaPagina Web E-commerce B\u00e1sicaPersonalizada Regresar Siguiente MANTENIMIENTO Y ACTUALIZACIONES (PASO 6) \u00bfQui\u00e9n se encargar\u00e1 del mantenimiento y las actualizaciones futuras de la p\u00e1gina web? Regresar Siguiente PLAZOS Y PRESUPUESTOS (PASO 7) \u00bfCu\u00e1l es el plazo esperado para la finalizaci\u00f3n del proyecto? Selecciona… 3 a 6 meses 7 a 9 meses 10 a 12 meses \u00bfTiene un presupuesto estimado para el proyecto? Regresar Siguiente SEO Y MARKETING ( PASO 8) \u00bfTiene requisitos espec\u00edficos en t\u00e9rmino de optimizaci\u00f3n para motores de b\u00fasqueda (SEO)? Regresar Siguiente COMUNICACI\u00d3N Y APROBACIONES (PASO 9) \u00bfCu\u00e1les la mejor manera de comunicarse durante el proceso de dise\u00f1o? \u00bfC\u00f3mo prefiere dar su aprobaci\u00f3n en las etapas claves del proyecto? Regresar Registrar<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-434","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/pages\/434"}],"collection":[{"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/comments?post=434"}],"version-history":[{"count":22,"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/pages\/434\/revisions"}],"predecessor-version":[{"id":544,"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/pages\/434\/revisions\/544"}],"wp:attachment":[{"href":"https:\/\/bechaprastudio.com\/index.php\/wp-json\/wp\/v2\/media?parent=434"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}