Introducción al Proyecto

MCC HTML5 + CSS + Javascript

Maxi's™ Computers® Corporation Website

Descripción

Este es el sitio web de Maxi's™ Computers® Corporation, una empresa que ofrece servicios de consultoría IT desde el año 2003. El sitio está diseñado para proporcionar información sobre los servicios de la empresa, su historia, y facilitar a los clientes el contacto mediante varias vías de comunicación como correo electrónico, teléfono, y redes sociales.

Tecnologías Utilizadas

HTML5: Estructura principal del sitio.
CSS3: Para el diseño y la estética del sitio.

 * Se incluye una versión para pantallas más pequeñas mediante media queries.

Animate.css: Para las animaciones de los elementos del sitio.
Font Awesome: Para los iconos de redes sociales y servicios.
JavaScript: Incluye código que maneja la carga de la API de YouTube y el manejo dinámico del año en el footer.
YouTube API: Para integrar un reproductor de videos dentro del sitio.

Estructura del Proyecto

Head (Cabecera del Documento)

Configuración de metadatos para SEO y optimización en redes sociales (Open Graph y Twitter Cards).
Carga de fuentes, estilos y archivos externos.
Declaración de `meta` tags para mejorar la indexación del sitio y su accesibilidad.

Body (Cuerpo del Documento)

Menú de Navegación: Contiene enlaces a las principales secciones del sitio y un menú desplegable para cambiar entre diferentes idiomas.

 * Idiomas soportados: Inglés, Español, Italiano, Francés, Alemán, Portugués.

Secciones Principales:

 * About Us: Breve historia sobre la empresa y sus orígenes.
 * Servicios: Descripción detallada de los principales servicios que ofrece la empresa:
   * Webhosting, Redes, Soluciones de Software, Soporte IT, Publicidad, Estudios de Grabación.
 * Nueva Sección: Más detalles sobre la empresa y un formulario de contacto.
 * Footer: Contiene información de copyright y enlaces a redes sociales como WhatsApp, LinkedIn, Instagram, YouTube, entre otros.

Video de YouTube: Sección para incrustar un reproductor de video mediante la API de YouTube.

Footer

Incluye la protección de derechos de autor actualizada dinámicamente con JavaScript.
Enlaces a perfiles sociales y contacto directo.

Funcionalidades Especiales

Multimedia: Integración con plataformas de streaming y redes sociales para maximizar el alcance de la empresa.
Responsive Design: Mediante el uso de `@media` queries para adaptar el diseño a pantallas más pequeñas como móviles y tablets.
Enlaces Externos Seguros: La mayoría de los enlaces en el sitio abren en nuevas pestañas para garantizar una navegación fluida sin perder la página original.

Instrucciones para Desarrolladores

Clonar el Repositorio:

 
 git clone https://github.com/MaxiComputers/maxiscomputers.com.git

Instalar Dependencias:

 Este proyecto no requiere la instalación de dependencias de backend ya que es un sitio web estático. Sin embargo, asegúrate de que los archivos CSS y JS se descarguen correctamente mediante las CDNs configuradas.

Personalizar los Estilos:

 Si deseas hacer modificaciones a los estilos, puedes editar los archivos CSS en la carpeta `/css/`. Hay un archivo específico para dispositivos móviles, `styles_m.css`, que se carga solo en pantallas más pequeñas.

Modificar Contenido:

 Para actualizar los textos o enlaces, edita directamente el archivo `index.html`. Los textos están en etiquetas `p`, `h2`, y `a`.

Tipos de implementación

1. Servidor físico/vm, simplemente cope todo el contenido de la carpeta html del repositorio en la carpeta www o public_html de su servidor y el código debería funcionar, verificar que esté abierto el puerto 80.

2. Implementación Dockerizada (Se detalla su implementación en un artículo separado).

3. Implementación en clúster de Kubernetes utilizando Helm3 (Generar imagen Docker previamente con el punto 2.

Mejoras Futuras

Integración de un CMS (WordPress o similar) para manejar el contenido de manera más dinámica.
Mejorar la integración de SEO con análisis de palabras clave más detalladas.
Expansión de la funcionalidad del formulario de contacto para manejar consultas directas mediante backend (PHP/Node.js).

Créditos

Desarrollado por Massimo para Maxi's™ Computers® Corporation.