Bienvenida
En el mundo moderno las organizaciones hacen del uso de las tecnologías, y su principal estrategia para competir con un mercado a nivel mundial es mediante el uso de la web, la cual, en ocasiones, llega a ser la tarjeta de presentación de las organizaciones ante el mundo, y se convierte en la primera impresión de las organizaciones sobre sus posibles clientes. Por ello, es importante que la creación de un sitio web sea planificada estratégicamente, para captar a los usuarios y obtener los beneficios que esto representa para la supervivencia y ampliación del mercado. En este contexto, se puede afirmar que diseñar y maquetar correctamente una página web es indispensable para atraer la atención de los internautas, así como para que permanezcan en ella.
Como ingeniero en Desarrollo de software, es indispensable que aprendas a manejar todas las herramientas y programas necesarios para hacer de tu creación un producto rentable. Para ello, esta unidad se estructura con cuatro temas. En el tema 1. Maquetación y estructura de HTML5 te capacitarás para que sepas utilizar toda una serie de aplicaciones informáticas dedicadas al diseño y la maquetación, en un nivel profesional, mediante HTML5; asimismo, se expondrá la funcionalidad de los comandos avanzados de los lenguajes de programación HTML y CSS. Adquirirás una formación multidisciplinar que te permitirá no sólo planificar el diseño de una página, sino también llevarlo a la práctica de manera eficiente y fluida. En el tema 2. Diseño responsivo para HTML se revisarábásicamente la forma de definir una pantalla en diseño responsivo. Por su parte, en el tema 3. Administradores de contenido se revisará lo correspondiente a la ingeniería orientada a la reutilización de componentes. Y en el tema 4. Alojamiento web se te proporcionarán los elementos necesarios para que puedas comenzar a trabajar tu sitio web en un host.

Fuente de consulta: https://www.freepik.com/free-vector/programming-language-illustration_6051733.htm
Da clic en Competencias para continuar el estudio de la unidad 1.
Competencia específica
Maquetar un sitio web para identificar la ubicación de los recursos requeridos mediante las herramientas e instrumentos dirigido a los requerimientos de una organización.
Logros
- Utilizar etiquetas HTML5 en tu diseño de páginas web.
- Aplicar el diseño responsivo para adaptar una página web a cualquier tipo de dispositivo de cómputo.
- Alojar páginas web en un host para estructurar un sitio.
Da clic en Contenido para continuar el estudio de la unidad 1.
Contenido
Material de estudio
Da clic en el ícono, para descargar el contenido de la unidad 1.
Da clic en Cierre para continuar el estudio de la unidad 1.
Cierre
Al finalizar la unidad se enfatiza la importancia de la nueva definición de las etiquetas en HTML5, que facilitan el poder maquetar un sitio de una manera más sencilla con la nueva estructura semántica del lenguaje, así como la integración de estilos CSS3 en los sitios, ya que éstos son los que brindan la oportunidad de definir reglas que hacen que el sitio trabaje y se adecúe a las necesidades requeridas.
Debido a HTML5 y CSS3 es que los sitios web, y la web en general, están tomando una nueva definición para creación de sitios para la web, haciendo que estos sitios puedan ser visibles en cualquier tipo de dispositivo móvil con acceso a internet.
En esta unidad se han estudiado los sistemas de gestión de contenido para crear sitios web de contenido dinámico a través del modelo de ingeniería de software, orientada a la reutilización. Se explica cuáles son las funciones y características básicas que tienen en general, como la administración de publicaciones, de usuario, extensiones y plantillas.
Se explicaron los diferentes criterios que se utilizan para clasificar a los CMS respecto al tipo de licencia, a su funcionalidad y al lenguaje de programación y tecnologías que utilizan, como el servidor web y de base de datos. Se abordó la arquitectura general de un CMS, que tiene un diseño por capas donde la capa más interna es el núcleo del CMS; le siguen la capa de extensiones, que se encarga de la lógica de negocio de la aplicación; y finalmente, la capa de presentación que se encarga del formato de las publicaciones e información en general.
Finalmente se presentaron los requerimientos generales para instalar un CMS y se expusieron las ventajas y desventajas que su uso conlleva. La página de la UnAD México está implementada sobre uno de los administradores de contenido más populares de código abierto, que es Joomla, mientras que la plataforma de e-Learning que utilizas en tu aprendizaje, la cual se conoce como Moodle, es otro ejemplo de un CMS aplicado a la educación en línea (LMS) de código abierto.
A lo largo de esta unidad has logrado conocer las características principales para considerar al momento de alojar un sitio en cualquiera de los servidores de tipo comercial o gratuito que brindan los servicios de hosting. Se expuso un ejemplo paso a paso del uso de un servidor gratuito para que pudieras observar la forma de registrar el dominio y, posteriormente, alojar la maquetación previamente realizada.
Estos temas han servido para que vayas conociendo cada uno de los pasos que debes seguir para poner a funcionar el sitio web que diseñarás. La siguiente unidad se enfocará en la seguridad con la que debe contar un sitio web, lo cual es importante para identificar y afrontar sus vulnerabilidades.

Fuente de consulta: https://www.freepik.com/free-vector/programmers-work-composition_4029424.htm#page=3&query=software+development+web+development+programmer&position=9
Da clic en Fuentes de consulta para concluir el estudio de la unidad 1.
Fuentes de consulta
Básica
- Acámica (s/f). Maquetando el monstruo web. http://www.acamica.com/cursos/11/maquetando-el-monstruo-web
- Arias, P. M. (2006). Manual práctico de comercio electrónico. Madrid: Las Rozas.
- Ariza, M., y Molina, J. C. (Septiembre 2004). Introducción y principios básicos del desarrollo de software basado en componente.
- Aubry, C. (2012). HTML5 y CSS3 Revolucione el diseño de sus sitios web. Barcelona: Ediciones ENI. https://tinyurl.com/yxg4vd6z
- Baltazar, L. (2006). Sistemas gestores de contenido SGC.
- CECAIP Comisión Estatal para el Acceso a la Información Pública (2014). Mini manual de uso y configuración Filezilla. Manual sobre el uso y configuración del servidor Web filezilla versión 3.5.2. Zacatecas:CECAIP,Servicio de Sistemas e Informática.
- Centro de Apoyo Tecnológico a Emprendedores, Fundación Parque Científico y Tecnológico de Albacete. (2012). Estudio de los sistemas de gestión de contenidos web. Análisis de las mejores soluciones del mercado. Albacete: Junta de Comunidades de Castilla-La mancha. Publicado bajo licencia Creative Commons. http://www.bilib.es/uploads/media/estudio_sistemas_gestion_contenidos_web_cms.pdf
- Diamond, F. (2013). Tu negocio online ¡Hecho Fácil!: La guía paso a paso para lograr ¡el sueño del negocio propio! Nueva York: Penguin Group.
- Diez Media (9 de Febrero, 2014). Diseñando sitios web responsivos.
- Fernández, C. R. (1999-2000). DNS. Madrid: ATI Asociación de técnicos en informática. Glosario básico inglés-español. http://www.ati.es/novatica/glosario/glosario_internet.html#Domain%20Name%20System
- Frain, B. (2012). Responsive web design with HTML5 and CSS3. Birmingham: Packt Publishing Ltd.
- Gaitan, J. J. y Pruvost, A. G. (2001). El comercio electrónico. Santa Fe: Universidad Nacional del Litoral.
- GEOCITIES (2014a). CPANEL. http://members.geocities.ws/index.php
- GEOCITIES (2014b). Top Class Unlimited Free Web Hosting. Recuperado de: http://www.geocities.ws/
- Glosario de informática e internet (Junio, 2013). Hosting. https://www.internetglosario.com/letra-h.html
- Harnett, M. (2014). Guía de acceso rápido a Google Adwords. Buenos Aires: Granica.
- ICANN Internet Corporation for Asiggned Names and Numbers (2013). ¿Qué es la ICANN? https://www.icann.org/es
- InterNic (2014). The Accredited Registrar Directory. Turkey, Los Angeles, Singapore: ICANN.
- LatinoamerICANN (2008). mx: NIC México presenta su División Registry .MX. Lima: NicMx- Alfa Redi
- Marcotte, E. (25 de Mayo, 2010). Responsive web design. Alist Apart.
- McGraw Hill (s/f). Unidad 2. Sistemas gestores de contenidos. http://www.mheducation.es/bcv/guide/capitulo/8448183924.pdf
- Mercadeo en internet (1 de mayo, 2009). Tutorial administrador de contenidos (CMS) Mi página.net. https://www.youtube.com/watch?v=2GZe-wuFS2U&feature=youtu.be
- MSDN Microsoft Developer Network (2014a). Lección 2: Conceptos básicos de HTML, XHTML y CSS. https://docs.microsoft.com/es-es/previous-versions/msdn10/Hh749021(v=MSDN.10)
- MSDN Microsoft Developer Network (2014b). Lección 4: Uso de las etiquetas HTML5. https://docs.microsoft.com/es-es/previous-versions/msdn10/hh749023(v=msdn.10)
- Peña, J. (2013). Unidades absolutas y relativas. En: CSS 3. Unidades de medida de fuentes. Artículos técnicos comunidad MSDN. http://msdn.microsoft.com/es-es/library/dn602493.aspx
- Pérez, A. J. (16 de septiembre, 2010). Cómo hacer un gestor de contenidos web. [archivo de video] http://www.youtube.com/watch?v=3Y4mGzPAmVI&feature=youtu.be
- Raiola Networks. (2019). Manual de Filezilla como cliente FTP. [En linea] https://raiolanetworks.es/blog/manual-filezilla-cliente-ftp/
- Sancho, M. (s/f). Plantilla básica y primera página web.
- Ramos, A., y Ramos, M. de J. (2014). Aplicaciones Web. Madrid: Paraninfo.
- Rigó, A. (8 de febrero, 2013). Diseño web adaptable. http://www.antoniorigo.com/diseno-web-adaptable/
- Rodríguez, S. (2013). Sistemas de pruebas y control de la maquetación. ARGP0110. Málaga: IC Editorial.
- Soluciones media (17 de mayo, 2012). Como elegir un buen Hosting para mi página web. http://www.solucionesmedia.com/como-elegir-un-buen-hosting-para-mi-pagina-web/
- Sancho, M. (2013). Curso básico HTML5. https://www.cursosenhd.com/category/programacion/html-html5/
- Sommerville, I. (2011). Ingeniería de software. México: Pearson Education. Pág 13,35-36.
- Tajadura, J. (2013). Responsive Web Design. Diseño web adaptativo ya! ¿Un tutorial para empezar?
- Trazos net (2022). 6 aplicaciones online para maquetar tus diseños. https://trazos.net/desarrollo-web/
- W3C (1999). Transitional Document Type Definition. https://www.w3.org/TR/html4/sgml/loosedtd.html
Complementaria
- Mejía, J. C. (23 de enero, 2012). Marketing Digital. Beneficios del Responsive Web Design.
- Cocher, J. (1 de Marzo de 2012). Practical e commerce. SEO Benefits of Responsive Web Design. http://www.practicalecommerce.com/articles/3395-SEO-Benefits-of-Responsive-Web-Design.
- Quezada, S. (21 de noviembre de 2013). ¿Qué es el responsive web design? The last Blog.
- Canal de aula virtualmatematic (4 de abril, 2012). Taller Joomla. MPG. [archivo de video] https://www.youtube.com/watch?v=Cqnk_SZHJz4
- Usuna, R. (2010). Los sistemas de Gestión de Contenidos en Información y Documentación. En: Revista General de Información y Documentación. Vol. 20. Pág 67-100.
Fuentes de imagen
- Ajaxshake (s/f,a). Agregar un editor HTML en tu sitio web. http://www.ajaxshake.com/public/usersFiles/main/html-editor-00_user_1_a99e4.jpg
- Ajaxshake (s/f,b). Editor html WYSIWYG para sitios web. http://www.ajaxshake.com/public/usersFiles/main/html-editor-30_user_1_bd1da.jpg
- Desarrollo web.com (2012). Etiquetas semánticas del HTML5. http://www.desarrolloweb.com/articulos/images/html5/semantica-html.png
- Universidad de valencia (s/f). Editando un curso con MOODLE. https://www.uv.es/bellochc/moodle/15edicioncurso.htm
- Webconsultoría (2013). ¿Qué necesito para tener mi sitio en Internet?. http://www.webconsultoria.com.mx/images/sitio.jpg
Muy bien, has concluido el estudio de la unidad 1, ahora realiza las Actividades de aprendizaje.