Restructure - Template #422

Columns on a Web Page

When we talk about restructure I think most people would think about changing the number of columns on a web page. This kit offers one and two column designs. Some of our other kits provide up to four columns.

Easy HTML5 Construction

I've tried to construct these templates with as little HTML code as possible. I advise novice web developers to spend more time studying CSS and Responsive Web Design techniques. Learn to manipulate page structure and images with Media Queries.

Responsive Web Design

RWD came along about 10 years ago when surfing the internet with cell phones began to be an every day habit. A need for web design that allowed the same web site to be viewed on a desk top , laptop, tablet or cell phone was a must. What was then Liquid web design evolved further into what today is the norm as RWD.

Media Queries

Media Queries allow the developer to change font sizes, alter navigation devices and resize images or actully swap them out at different screen sizes as this template demonstrates.

To demonstrate grab the right edge of the browser and squeeze it to the left. As the width of the screen decreases three different size images will be displayed using the Media Queries in the style sheet. When you've squeezed as far as you can open Web Developer Tools beside it to get to the smallest size screen width.

Drop down Menu

The CSS for the drop down menu is from our free navbar collection. We offer kits that include horizontal and vertical designs.

They can be downloaded in Zip files and plugged into an existing web page with very little adjustment.

 

Top