How to adapt W3 Templates

The page you are viewing now have MANY modifications from the W3.css template. I suggest you start off choosing a simpler template and building on that. You could try an copy the template used for this website but you are likely to get lost!

When considering using a W3.css template you need to determine how complicated your web design needs to be. There is a danger that you try to adapt a template that has far more complexity than you need. There are many template examples on the W3 Schools website and you are well served by looking at all of them to decide which makes more sense for your application.

The tempusfugit.me.uk website started off life with the goal of explaining the design techniques used to build websites. What the design has evolved into is far too complicated for general use. However, the W3.css templates can be used with your own modifications and you then have the option to remove or add features from other templates.

While the design you see here was based on the "Nature Portfolio" template I have added quite a lot to it.

Modifications

The modifications that I have made here are:

• Drop-down menus added to the left (Desktop) menu
• A top-bar incorporating a drop-down menu.

At the same time as adding these features the responsive nature of the design required that many adaptions relating to how the top-bar displays are displayed on mobile and desktop screens.