Share
Crear un sitio web para su restaurante es crucial si desea atraer nuevos clientes. Afortunadamente, hoy en día es más fácil que nunca hacer que los sitios web de restaurantes funcionen rápidamente. Gracias a las numerosas plantillas HTML para restaurantes, no necesita perder tiempo buscando un diseñador ni aprender a crear sitios web de restaurantes desde cero..
Una plantilla HTML es fácil de modificar y cargar a un servidor de alojamiento. Otro beneficio de una plantilla HTML es el hecho de que utiliza un código menos complejo, lo que hace que los sitios web de restaurantes creados con plantillas HTML se carguen más rápido que los de un CMS como WordPress..
Si te has estado preguntando cómo hacer un sitio web para un restaurante, esta publicación es para ti. Le mostraremos lo que necesitará para comenzar, cómo usar una plantilla de restaurante HTML5, personalizarla y, finalmente, cómo cargarla en su servidor de alojamiento para que pueda mostrar lo que su restaurante tiene para ofrecer.
El primer paso para crear el sitio web de su restaurante es reunir todas las herramientas y recursos que necesitará. Esto incluye un nombre de dominio, una compañía de alojamiento, un programa FTP, el contenido que se incluirá en su sitio y una plantilla de restaurante. Echemos un vistazo más de cerca a cada uno de los siguientes.
Un nombre de dominio es cómo sus clientes lo encontrarán en línea. La opción más obvia es usar el nombre de su restaurante como el nombre de dominio emparejado con una extensión .COM. Sin embargo, los mejores nombres de dominio a menudo ya se reclaman, así que no se sorprenda si se toma su nombre de dominio deseado.
Si ese es el caso, puede intentar ponerse en contacto con el propietario del dominio y preguntar sobre la posibilidad de comprar el nombre de dominio de ellos. Otra opción es experimentar con una extensión diferente o agregar las palabras restaurante o el nombre de tu ciudad.
Además del nombre de dominio, también necesitará un servidor de alojamiento que alojará todos los archivos del sitio web del restaurante para usted. Vale la pena mencionar que puede comprar un nombre de dominio al mismo tiempo que compra un plan de alojamiento. De hecho, la mayoría de las empresas de alojamiento ofrecerán un dominio gratuito como incentivo para suscribirse a su plan de alojamiento..
Antes de instalarse en una empresa de alojamiento, asegúrese de hacer su debida diligencia y leer las reseñas de terceros en sitios de restaurantes independientes. Esto le dará una imagen más precisa de la calidad y la satisfacción del cliente del anfitrión.
La siguiente tarea en su lista es descargar un cliente FTP para que pueda transferir los archivos de su plantilla desde su computadora a su servidor. Dependiendo de su sistema operativo, encontrará muchos programas FTP para Windows, Mac y Linux. También puede considerar FileZilla ya que es un cliente multiplataforma que se puede descargar y usar de forma gratuita..
Necesitará un editor de código para editar los archivos de su plantilla. Un editor de código es similar a un editor de texto como Notepad, pero usa resaltado de sintaxis para mayor claridad.
Prefiero Sublime Text, que se puede usar en Mac, Windows y Linux, también está disponible una versión de prueba gratuita, pero cualquier editor de código será suficiente.
Finalmente, necesitará una plantilla de sitio web de restaurante y el contenido que se incluirá en su sitio web. Aunque es posible que desee obtener una plantilla HTML de restaurante gratis, encontrará que una plantilla premium ofrece más funciones. Puede comenzar mirando nuestra colección de plantillas de sitios web para restaurantes para encontrar la más adecuada para su negocio. Para los fines de este tutorial, usaré la plantilla Resta. Esta plantilla tiene un diseño simple y limpio con un atractivo control deslizante de ancho completo. También incluye un formulario de reserva de trabajo, por lo que podrá realizar reservas en línea.
Cuando se trata del contenido, reúna toda la copia que desee, como por ejemplo, cuándo abrió su restaurante, qué tipo de cocina ofrece, sus listas de menús, biografías del personal, disparos a la cabeza y cualquier otra cosa que sea relevante para su restaurante..
Ahora es el momento de familiarizarse con la plantilla y personalizarla según sus necesidades. Continuemos!
Una vez que haya encontrado una plantilla de restaurante HTML5 que le guste, cómprela y luego guarde la carpeta comprimida en su computadora. Descomprímalo en una ubicación de fácil acceso, como su escritorio o su carpeta de descargas.
Antes de que pueda comenzar a modificar los archivos, es una buena idea tener al menos una comprensión superficial de la estructura de la plantilla. Tenga en cuenta que algunas de las carpetas y archivos pueden ser diferentes de los que se muestran a continuación. Sin embargo, en la mayoría de los casos, encontrará una carpeta que contiene la documentación de la plantilla y otra con la plantilla real..
Dentro de la carpeta de la plantilla real, normalmente encontrarás las siguientes subcarpetas y archivos:
También puede encontrar los siguientes archivos y carpetas como en la plantilla de Resta:
Con la estructura fuera del camino, comencemos a modificar la plantilla..
Comenzaremos por editar el archivo index.html. Haga clic derecho en el archivo y seleccione Abierta en el navegador. Esto abrirá el archivo en su navegador predeterminado y le permitirá ver qué partes deben cambiarse.
Como se ve en la captura de pantalla a continuación, hay algunas cosas que editar, incluyendo:
Para que sea más fácil encontrar esa información en su plantilla, haga clic derecho en el texto del encabezado y haga clic en Inspeccionar.
Aparecerá un panel en la parte inferior que muestra el código HTML que conforma nuestra plantilla..
En ese panel, notará que la línea de texto que seleccionamos para inspeccionar está resaltada en azul en el lado izquierdo del panel Inspector. Si miras a la derecha, notarás que se muestra un código ligeramente diferente, que controla el estilo visual de esa línea de texto..
Como puede ver en la captura de pantalla, el texto del encabezado que seleccionamos está entre
Para editar la plantilla, ubique las etiquetas que contienen el contenido que desea cambiar, encuéntrelas en el editor de código y cámbiela por su información.
Con ese conocimiento, vuelva a la carpeta de plantillas, haga clic derecho en index.html y seleccione Abrir con texto sublime o el editor de código que descargaste anteriormente.
Ahora, desea encontrar el mismo código que vio en el panel Inspector de su navegador.
Desplácese hacia abajo hasta que lo encuentre en la línea 298. Luego, haga clic entre las
Luego, en la línea 301, haga clic entre
De manera similar, puede seguir estos pasos una y otra vez: inspeccione la información que desea cambiar, identifique las etiquetas que contienen ese texto, encuéntrelas en su editor de código y reemplácelas con su texto.
Para cambiar el logotipo y otras imágenes en el sitio, tómese un momento para ver los nombres de las imágenes utilizadas en la carpeta img de su plantilla. Luego, cambie el nombre de sus imágenes con esos nombres, seleccione todas las imágenes de marcador de posición, elimínelas y luego coloque sus imágenes en la carpeta img.
Finalmente, para modificar el formulario de reserva para que sus reservas lleguen a la dirección correcta, vaya a la carpeta de su plantilla, haga clic derecho mail.php Archivo y abrirlo con su editor de código. En la línea de código que tiene la dirección de correo electrónico ficticia, haga clic entre comillas, resalte la dirección de correo electrónico y sustitúyala por la suya..
Una vez que haya reemplazado toda la información, es hora de diseñar la plantilla a su gusto. De vuelta en la carpeta de su plantilla, haga clic derecho en el style.css archiva y ábrelo en tu editor de código.
Para editar el CSS, siga los mismos pasos utilizados para editar el HTML. Haga clic con el botón derecho en el elemento que desea diseñar y haga clic en inspeccionar, pero esta vez busque el código en el lado derecho de la pestaña Inspector y luego encuentre el mismo código en el editor de código. La pestaña Inspector le mostrará qué línea de CSS necesita editar.
Por ejemplo, cambiemos el encabezado a un color verde azulado ingresando un código HEX como:
color: # 65b5c1;
También cambiemos el texto del párrafo a un color más oscuro como el siguiente:
color: # 222222;
Ahora que ha personalizado la plantilla, todo lo que queda por hacer es cargar sus archivos en el servidor de alojamiento. Su anfitrión debería haberle enviado los detalles de inicio de sesión, así que busque ese correo electrónico y anote el nombre del servidor, su nombre de usuario y contraseña..
Inicie su programa FTP. Ingrese la información provista por su anfitrión en los campos correspondientes y luego haga clic en Conectar.
El lado izquierdo de la pantalla le permitirá encontrar la carpeta que contiene los archivos de plantilla en su computadora. Haga clic para expandirlo. Seleccione todos los archivos y carpetas, arrástrelos al lado derecho de la pantalla y suéltelos en el public_html carpeta.
Espere a que se carguen los archivos, luego abra su navegador e ingrese su nombre de dominio. Enhorabuena, tu sitio ya está en vivo.!
Una vez que su sitio está activo, hay algunos ajustes adicionales que puede hacer para causar una gran primera impresión en su audiencia..
Agregue su sitio a sus perfiles de redes sociales. Ahora que tiene un sitio web de restaurante, es hora de actualizar la sección de biografía y sitio web en todos sus perfiles de redes sociales. Hágales saber a sus seguidores que pueden revisar su menú en línea, así como hacer una reserva. Comparta la captura de pantalla del sitio web del restaurante y anímelos a reservar ofreciéndoles un código de descuento o un cupón promocional.
Incluir comentarios de clientes anteriores.Sus clientes anteriores probablemente sabrán qué tan buenas son sus comidas y el gran ambiente que ofrece su restaurante. Muestre sus testimonios y comentarios en el sitio web de su restaurante. Esto ayudará a animar a los nuevos visitantes a visitarte..
Lista tu restaurante con Google Business. Al incluir su restaurante en Google Business, es más probable que su sitio web aparezca en los resultados de búsqueda y, si lo incluye, permitirá que los usuarios se conecten con usted directamente.
Comprime tus imágenes. Las excelentes fotos son una necesidad para un restaurante, pero asegúrese de comprimir el tamaño de sus imágenes. Esto hará que su sitio sea más rápido para cargar y mejorar la experiencia de usuario del visitante.
Insertar un mapa de Google. Agregar un mapa de Google a la página web de su restaurante hará que sea más fácil para los clientes potenciales encontrarlo y obtener direcciones mientras están en movimiento..
En este tutorial hemos explorado cómo hacer un sitio web para un restaurante. Para obtener más información sobre los sitios web de restaurantes, revise uno de los tutoriales a continuación:
Gracias a una variedad de plantillas HTML5 para sitios web de restaurantes, no tiene que romper el banco para crear un sitio hermoso para su restaurante. Ahora que le mostramos cómo hacer un sitio web para un restaurante, está listo para comenzar. Explore nuestra colección de plantillas de restaurantes y use nuestra guía para lanzar el sitio web de su restaurante hoy.
Accentsconagua