The free pizza HTML template comes with plenty of different content sections that provide the flexibility needed in personalizing a website. The example here is a light theme one, but it can be easily set to a dark or mixed theme, as you can change each section’s background gray shade individually.
Ok, so far, we know it’s easy to personalize. But probably this template’s superpower is its performance. First, what we mean by that is that it can’t load any faster than this. Because at its core is HTML5 and CSS3, so the simplest way to write code that browsers and search engines love. Second, speaking of search engines and performance, it’s SEO optimized. We’ll get to this a bit later.
Links: preview | download this free template
Sections in this free pizza HTML template
We’ve mentioned these content sections. So, what are they? They’re the main building block for your content area. You stack them vertically to add more content and visuals to your website. We’ll talk about header and footer last. Right now, let’s focus on the content area.
And, before we start, just a quick note here that it’s easy to personalize these as you wish. First, you can change the background color for each section by changing a single value, from a list of predefined values. Second, you can change the top and bottom spacing, like the background color. Third, you can further personalize your sections by customizing the css files in the package or by adding other elements from other sections (text, buttons, links, etc.).
Hero/intro section
In the free pizza html template, the first section is a visual one – with an image in the left and some brief content on the right, together with a couple of buttons.
There is a wide variety of similar sections throughout the template, so picking your intro section is up to you and your needs
Menu section
This is a multiple column section that scales up and down as needed. So, if you bake 20 or more pies, you can easily display them all. There is an additional four-column section further down on the page – under the “Product examples” – so make sure you check that one out as well.
Here’s a hint – you can add more text or buttons to each element on a column. So, if you want to add a price for example, you can do so. It’s really easy.
Full background image section
There’s one of them used three times in this free pizza html template. We said “there’s one of them” because there are more in the premium version of this template. Not only this, but many more features, documentation and tips included with this premium version.
Contact Us and Newsletter sections
Their purpose is straight forward. There are two special sections included with this free template that you can use stay in contact with your customers.
Other sections
The header and footer sections included with this template illustrate quite complex versions of themselves. That’s mainly to include the complex versions in case you might need them. You don’t necessarily need a subnavigation, but in case you will, well… there it is.
Same goes for the footer. And, both the header and footer can take the same background color values as the rest of the content sections, to match the look & feel of your webstie.
Colors and fonts
Fonts
You get two predefined choices with the free cake HTML template – stylish and professional. They set the overall font in the entire page. And, to do that, these are set in the body tag, in the html code. If you don’t have too much experience with HTML or CSS, don’t worry. It just means that you can change a single word in the code to change the font on the entire page.
In case you have more experience, you know you always have the option to install your own font if you want to.
Buttons and links
Same as above, for fonts – you can change the color in the entire page for all buttons and links by changing a single word in the body tag. There are six predefined colors with the template – pink, red, orange, green, blue, and cyan.
And you can add your own colors by changing or duplicating the predefined classes in the css files.
Background color
Here is a slight difference, but a necessary one – all sections have their own background colors. That way you have a bit more granular control over the look and feel of each portion of your website.
If you want a full light or dark theme, just go ahead and set the background colors for each section to white, light, grey, dark or black. It’s still as easy as changing one word in each section.
In addition to these options, for each section you can define a top and bottom spacing. Again, you can make use of predefined values that range from xs, s, m, up to xl.
Performance
SEO-ready
All necessary metatags, social tags, image and links attributes are part of the template. You just need to build your SEO strategy and make use of them by filling them in with your content.
Besides these, the template makes use of headings for your titles. These are also some elements that search engines look for in your code. And, besides search engines, these guide you implicitly to keep things succinct – for both your visitors and the search engines.
Fast. Fast. Fast.
This template has probably the best loading speed time as it could possibly have. And that’s precisely because it has HTML5 and CSS3 in its core. On top, it’s responsive and retina ready. And that means that the base template, as you get it, ensures it renders fast and optimal on mobile. That means you don’t have to worry about your customers on the move. Especially about them since we’re all online on our phones.
Just make sure you optimize your media. There are online tools that can help optimize your images file size as much as possible without losing visual quality.
Free pizza HTML template – conclusions
Let’s see what we got so far – it’s easy to use, looks modern & stylish, it’s fast and responsive. These are probably the most important attributes for a long-lasting, high-performance website.