HotelM4 - HTML Web Template Review Part 2

• « Part 1

This approach comes implemented in quite a few different ways where the plain images and the pricing tables come to be just the ends of the specter. In between, there are also regular card-like room showcases, hotel/room/location specifics summarized in brief and many more.

In aid to the appealing images, you might have are also coming the

friendly and light icons

Spread all over the features blocks making the showcased information more compact and easy to both get and compare. Actually, the icons do have this very special place in Mobirise Builder – you an insert a mini iconic image in so many places without taking any extra efforts by just picking it up from the Icons palette. And of course – each one of the icons already placed there can be easily replaced the very same way. So for example, if it says Welcome drink and you want it Breakfast included just click on the cocktail glass and replace it with a cup of a coffee icon (or whatever you like in the icons panel) and edit the text accordingly. Additionally – you can add icons to pretty much any button in this or any other M4 theme as well.

Another hotel business specific block is the one being generally implemented as price tables but having this cool adjustable stars in the header of each item, so with a single click in the block’s properties panel you can point out just how luxury is the item in a fresh and business specific way.

One of the

interesting combinations

Which can be spotted in the travel HTML template is the pricing table/short text info combo which is quite cool when you have just one or two pricing plans to show. With the regular pricing blocks as we have used to see them on the Net it’s accustomed to see three or more pricing options but when it comes to one or two items the layout kind of seems a bit too loose – the free space comes to be a bit too much around them. That issue gets easily handled by the pricing table/heading combo block.

With the HotelM4 HTML web template, you can also have

Some appealing sliders and galleries

To impress your visitors or just to help them better get around. The image slides can be adjusted in both width and height, which is a feature the experienced Mobirise User could take advantage of in many other projects as well, and can also be containers for the few words and a call to action you might decide to place over the sliding images as well.

The gallery block features some extra goodies as subtle gradient overlay appearing over the thumbnails on hover and the cool option to type a short text describing each image so the visitor better gets around. Sadly, these are still seen only when the images are displayed as thumbnails on a page and not when viewed full screen in a lightbox, but hopefully, this will get updated in one of the next versions of the travel HTML template. Still, it’s quite beautiful and informative as is now.

Since the hotel business is all about serving the guests properly making them feel at home away from home

Communication matters

That’s why the HotelM4 HTML web template is also packed with a beautiful set of contact forms for your potential guests to be always able to get in touch with you and get the information they need without even leaving the website. Following the HTML web template’s main subtle and beautiful imagery-oriented design line while filling the contact form the form blocks provide some really fresh and appealing appearances like three differently sized image tiles or an image being overlapped by the form. This way space gets nicely utilized, the form layout – refreshed and since any image can be also a live link you can add some more functionality to the controls of the block if you need to.

Additionally, the interesting two price tables/heading appearance we mentioned above gets alternative implement in a form block allowing you to easily share some check-in / out essential info inline with the form inquiring for availability in a specific period. This not only looks good but is also quite convenient for the potential guest.

But letting aside the great functionality you can add to the form blocks what I probably like most about them is that like all the HotelM4 travel HTML template blocks they gust look good out of the box.

Taking a proper care for the guest is and always will be the hotelier’s first priority, however as all things in life this should be properly regulated. The fair approach is to have the potential guest aware of all this before taking any further actions, so they actually know what to expect and make an informed decision. These also come shaped as large amounts of dry text so nevertheless the HotelM4 travel HTML template has a huge section of blocks for showcasing text and stories – like captions, article blocks, quotes and all the rest needed for presenting a great story – the best approach when it comes to large amounts of dry text is hiding it into a toggle or accordion blocks having only the captions displayed until the visitor click on them to read only what he or she needs to know still having a glance at the bigger picture. We have those in the HotelM4 travel HTML template as well. The difference between the accordion and the toggle is that in the toggle you can have as many panels expanded showing their content at once while the accordion automatically collapses the expanded panel when another heading gets clicked to expand in turn.

Another thing quite important for the hotel business is making sure

The guests will easily find you

By providing a specific and easy to get guidance on your site. This gets handled by the blocks providing beautiful and easy to set up Google maps blocks. These are really easy to set up as well and don’t actually even need a street address if you don’t have one – just your place’s GPS coordinates. Still, if you have an address – just type it in and the map will properly position in seconds. Following the main travel HTML template’s aim to also display beautifully the map blocks come equipped with a built-in grayscale filter, so if you consider the default Gmaps colors too shouty for your elegant new hotel website – just flip the switch and let the colors go away. With the maps blocks you can have both full width and boxed layouts as well as a convenient map/contact form combination and in case you go for the boxed map – you can even put an appealing image or video as blocks background – pretty much like in any regular Mobirise Builder block.

A few extra goodies

To add with the HotelM4 HTML web template to your site are the live timers and countdown blocks.

The counters are especially useful when you need to just showcase some numbers and have them gently start from zero and gently rise to the defined amount once the element enters the viewport.

On the other side, the countdowns are really useful when you need to pin an important event taking forth in time at your place – like a conference, concert or a new lounge hall opening. Just fill in the desired date and the Mobirise Builder algorithm does the rest. Do note however once the adjusted date is reached the countdown stops at zeros so you need to timely update your site when this happens – otherwise it will look like your web site lacks support.

Finally, but not in importance -

the people

The potential clients often make the final decision considering what the ones before them have experienced and shared about the place. That’s why it is so important to also have a block letting you easily share with your potential guests what your regular ones are saying about you. As in any business, the real-life people feedback is probably the best commercial you can get.

On the other hand, besides any business, there is the staff working hard every day making it possible. It builds comfort and tryst seeing these people’s faces on the site. Additionally – it’s always nice when you have already visited a place and had a pleasant stay to come back to the place’s site and look at the new friends you made there on your stay with a smile.

For these purposes, the HotelM4 theme also has convenient Testimonials and Team blocks. You can easily showcase what others are saying about you and your business with them along with presenting your team.

making it global

Nevertheless, it’s obviously easy to help your hotel business to a global level that’s not exactly what I mean with that but a simple but most convenient functionality essential to all Mobirise Builder themes. You see – as you’ve probably noticed if you had dialed with web design before, if not just take my word for granted – once started the website kind of gets its own life, expands, evolves and pretty often its navigation structure changes along the way quite a few times. If it’s an one page site we’re talking about that’s not such a big issue since we have a single navbar to edit and it’s all good but in cases of websites consisting of plenty pages (a fellow Mobirise Builder user once shared he’s building a site for a US agricultural agency with the Builder consisting of more than a hundred pages!) this can become a huge pain. Especially for such cases, the elements meant for holding site’s navigation are being cleverly adjusted to have the very same content on each page they take place on – editing one of them causes the changes to get spread all over. This counts not only for the page header nav menu but for the footer as well.

Final words

Being with the Mobirise Website Builder project from back in the day of its second version I’ve seen quite a few themes for the application and some various ingenious implements with the blocks which are getting even more flexible by every new release. And nevertheless, all the themes are special and unique in a way as all things in life one gets to like some better than the others. Considering the M4 family themes the HotelM4 definitely stands up taking place on my favorites list for quite a few reasons. It’s being created following a beautiful, clean and balanced design line out of the box and considering all the blocks we discussed above it’s clearly seen it can be used from even a complete web design beginner for creating a fully functional and amazing hotel web site with ease.

That’s pretty much how our journey with what came to be my favorite Mobirise Builder HTML web template so far comes to its end. We managed to look over all the cool features and tried to explore not only this great addition to the M4 family but also some general principles in web design when it comes to creating a website for the hotel business. Of course, the HotelM4 provides the great means to describe your fabulous place providing rest and comfort for the tired traveler but as regarding any business – before being able to create a great website about it you will actually need the great content to pour in. This includes strong appearance and structure concept, appealing well-optimized images, well-thought promotions and calls to actions – you name it – I think you got the idea. These we need to figure out for ourselves – no application is capable still (and probably ever) of creating a concept.

The Mobirise Site Builder can be quite useful in helping you give the blurry idea gradually taking shape in your mind clear out much rapidly though. Here are some examples how I do it:

I use the flexible blocks and the reordering feature to sketch up directly in the application exploring all the possible appearances at once with the comfortable viewport switching buttons. This way I briefly throw in some blocks adjust them roughly and observe the result and according to whether I like it or not – take the further steps. That’s pretty much as fast as drawing it on paper (sometimes even faster!) with the major difference I don’t need to make a few sketches for the different screen widths.

Sometimes the images for the topic are coming before the actual content and structure are being composed and also serve as a great source of inspiration. Sometimes it’s exactly the other way around – the text content is ready or being composed and starts getting poured in and we just need some images – even not the actual ones in order to be able to refine the site’s appearance further. In such cases I used to be looking up some similar images around the net, downloading and inserting them. Now I’m just picking up the correct ones from the built-in Mobirise Builder sample images gallery. It contains greet in-app access to a library of numerous great free to use pictures with a convenient search feature so I just look the topic up, insert one of the vivid images proposed and go on not letting anything to stop my workflow.

And when it comes to uploading some great pictures live on the Net one essential matter is optimizing them properly so the visitors don’t see the browser endlessly loading and eventually browse away. What I mean here is the images should be definitely properly optimized providing least file size with the best appearance according to the purpose they will be serving. That’s, of course, great to say but when it comes to hundreds of raw images I need to pick just a few from this switching between the web design and raster editing application has always been quite a distortion for me – especially while a concept is forming. That’s why I enjoy the Resize images and Edit Image features of Mobirise Builder so much. These are both priceless, especially at the early stages since what Resize images actually provides is a built-in web-ready image optimization algorithm right inside the program and with the convenient Edit Image feature I can crop the needed part of any picture at the moment of its insertion so nothing comes to distort me anymore. Additionally, the image optimization feature is so powerful that quite often that’s the only image optimization ever needed – it shrinks them great keeping the appearance intact.

No matter if there is already chosen hosting plan for the site or not – I can instantly share the results of my work taking benefit of the GitHub pages fast servers and free SSL again – without even leaving the Mobirise Builder due to the convenient upload to GitHub feature of the Publish dialog box.

These are some of the goodies which working along with the great flexible blocks in any of the M4 themes are helping me create appealing website lightning fast. Using them and the great blocks from the HotelM4 Mobirise Builder HTML web template now creating a hotel website comes to be not only easy but a pleasure and fun.

Happy designing!