Veo la respuesta de Geoffrey a continuación, pero agregaré mi respuesta a la lista de todos modos. Es un proceso complejo que puede involucrar a muchas personas, y tiene alrededor de un millón de variables y elementos que estoy dejando de lado, pero aquí están las partes importantes …
Paso 1: Arquitectura del sitio (el plan)
Como muchas cosas, comienza con un plan: necesita desarrollar una arquitectura de sitio. Un mapa del sitio y un conjunto de marcos de alambre serán su modelo de cómo está organizado y etiquetado el sitio, y qué funcionalidades únicas o requisitos de contenido existen en cada plantilla relevante del sitio. Esta fase de storyboarding / ideación se explica muy bien aquí: Storyboarding de sitios web | Ejemplos, Cómo y Sitemap.
Algunos consejos al desarrollar su plan …
- ¿Hay algún sitio web donde pueda personalizar sus páginas?
- ¿Por qué los sitios web necesitan tener una página de inicio?
- ¿Dónde puedo pedirle a la gente que pruebe mi sitio web de MVP y brinde comentarios?
- ¿Cuál es el nombre de dominio de nivel superior más apropiado para el sitio web personal?
- ¿Cuánto cuesta construir un sitio web de noticias?
– Intenta ser diferente. Trate de ser creativo en cómo planifica y desarrolla la visión de su sitio. Haz lo que sabes.
– Piensa siempre en tu público objetivo: tu usuario. Las etiquetas deben ser claras y deben tener sentido (es decir, no sean inteligentes ni demasiado complejas; no asuma que su audiencia recibirá el chiste o la referencia).
– Intente mantener el número de secciones de nivel superior de su sitio al mínimo (5-7 generalmente es ideal).
– No vayas más de 2-3 niveles de profundidad.
– Menos es más. Tome decisiones difíciles sobre lo que incluye en su sitio. Más es casi nunca mejor: a menudo es el resultado de un planificador del sitio que dice “Al diablo, lo pondré todo ahí”.
Paso 2: diseño visual
Con su plan en mano, ahora puede comenzar la parte divertida: el diseño visual. Primero, tome los marcos de alambre para algunas páginas clave y desarrolle un concepto creativo que haga realidad su marca y su estilo. Si está haciendo esto por sí mismo, asegúrese de explorar algunas opciones. Hay muchas maneras de interpretar cómo se puede dar vida a un marco de alambre, y dada la cantidad de opciones de interfaz poderosas que nos brinda el HTML moderno, las posibilidades pueden ser frustrantemente infinitas. Diviértete con esta fase: es increíble ver cómo toma forma tu sitio.
Asegúrese de desarrollar un lenguaje visual que el sitio pueda aprovechar en todo su marco. El uso constante de colores y un enfoque estandarizado de la tipografía realmente harán que su sitio se sienta cohesivo.
Paso 3: Revisión funcional
Los marcos de alambre deberían darle una idea clara de la funcionalidad que requerirá el sitio. Incluso si usted es el desarrollador, asegúrese de comprender realmente cómo van a funcionar los diversos elementos del sitio. Anota el infierno de cada cuadro en esa página. ¿Buscar? Suena simple, pero dependiendo de cómo desee ofrecer la experiencia a sus usuarios, puede ser muy complejo. Menús dinámicos? Claro, pero es mejor entender cómo los manejará y administrará. ¿Carrusel? Se ha hecho muchas veces antes, pero hay sutilezas en su funcionamiento que pueden crear algunos momentos desafiantes de gestión y presentación.
Paso 4: configuración del sistema
Paralelamente, puede seleccionar su Sistema de gestión de contenido (CMS) o, si lo está codificando, puede configurar el servidor para el sitio. La configuración básica de su entorno puede ocurrir en cualquier momento, pero el inicio del desarrollo de las diversas aplicaciones o componentes únicos del sitio (p. Ej., API, puntos de integración comercial, etc.) debe comenzar una vez que haya completado sus marcos de cables.
Paso 5: codificación frontal
Una vez que sus diseños visuales estén completos, puede comenzar a codificarlos (independientemente del sistema que esté usando). Si va a implementar un enfoque de diseño receptivo (diseño web receptivo), necesitará más tiempo para planificar cada componente. Codifique sus páginas para que sean flexibles y asegúrese de seguir las mejores prácticas para SEO (Search Engine Optimization (SEO) Best Practice Guide) y accesibilidad (Pautas de Accesibilidad al Contenido en la Web (WCAG) 2.0), y asegúrese de que su código valide. Además … pruebe a la perfección cada plantilla en todas las plataformas y navegadores modernos. Olvídese de IE 6, pero es importante tener en cuenta 7+ y los últimos 5 años de lanzamientos de Safari, Chrome y Firefox.
Paso 6: Integración de plantillas e ingeniería
Una vez que su código esté completo, puede comenzar a integrarlos en cualquier sistema que haya seleccionado (por ejemplo, Drupal, WordPress, etc.). Esto puede requerir algunas habilidades muy específicas y un conocimiento detallado de estos sistemas. Casi nada de lo bueno funcionará con las capacidades “listas para usar” (aunque hay muchos módulos disponibles para los sistemas modernos), por lo que deberá doblar el sistema a su voluntad. Al integrar sus plantillas, asegúrese de tener en cuenta la forma en que va a administrar el contenido del sitio. Si no va a actualizar algo más de una vez al año, entonces no hay necesidad real de administrarlo, puede ser un componente estático. Continúe hasta que sus plantillas clave funcionen según lo planeado.
Paso 7: Entrada de contenido y optimización
Obtenga todo su contenido en el sitio y asegúrese de que esté equilibrado y funcione colectivamente. Desea asegurarse de haber cubierto todas sus bases, tanto en el sitio como en su entorno de correo electrónico (CRM).
Paso 8: prueba, prueba, prueba
Una vez que tenga su contenido en el sitio y sus sistemas funcionen como deberían, puede comenzar el proceso de prueba. Utilice un sistema de seguimiento de errores / tickets para realizar un seguimiento de los problemas que encuentre (y las resoluciones que complete) y, nuevamente, asegúrese de realizar pruebas en todos los navegadores relevantes. No puedo enfatizar esto lo suficiente.
Paso 9: lanzamiento
Encuentra un buen ISP. Barato puede estar bien, pero asegúrese de que tengan las características que necesita (por ejemplo, servicios de reinicio, servicios de respaldo, etc.). Si está trabajando con una solución basada en la nube, no se preocupe. Antes de salir en vivo, abra una vista previa para su familia y amigos. Mantenga el sitio seguro mientras lo revisan y le dará retroalimentación. Ojalá sea bueno. Si no, aborde los problemas. Lanzarse prematuramente es una forma terrible de hacerlo.
Paso 10: Marvel
Da un paso atrás y disfruta de los frutos de tu arduo trabajo. Es un logro asombroso.
Si está preguntando sobre la construcción de un sitio web, supongo que ya tiene un esquema (si no un plan detallado) de qué tipo de pasatiempo / negocio debe presentarse en el sitio. Básicamente, primero debe recopilar toda la información necesaria, incluidos gráficos y medios, escribir textos y lemas únicos, crear un logotipo de marca, etc. Para ser breve, junte todos los materiales principales que desea agregar al sitio futuro y no olvide para almacenarlos en algún lugar local en su PC o incluso en la nube. Elija un nombre de dominio (mejor corto y simple) y regístrelo en cualquier empresa de alojamiento. El trabajo de preparación está hecho. 