Bootstrap Templates


Simple, general bootstrap template layouts
Gallery Example One Gallery Example Two Gallery Example Three

About this project:


Bootstrap Templates

This project is an attempt to build a number of extremely basic bootstrap templates that can be altered, modified, and built upon easily for simple and flexible future projects.

Technologies used:


Bootstrap: This project relies on the Bootstrap framework, a responsive, mobile-first front-end component library. The framework utilizes HTML, CSS (Sass), and javaScript (JQuery). Bootstrap chosen for this project due to its low overhead and quick setup time. The modular and grid based nature of the framework allows for the individual templates to be customized, broken down, and altered extremely easily.

Design Talk:


Photography Template

The photography, or general artistic template was set up with (as the name would imply) an artistic individual in mind. The sample pages allow for a simple home page, with a carousel slideshow and space for a brief introduction; a gallery page, with linked images(popup modal options are easily implemented); and an 'About the Artist' page.

As the primary focus of the site is the art work itself, most of the design features are left intentionally stark, and ample amounts of white space are given to the individual elements. The font too is left simple, stark, and sans-serif, as to avoid drawing too much attention away from the image based focus of the template.

*All design features in the individual templates are easily changed, swapped, and adapted to meet personal taste*

Business Template

The business template is set up with a number of entry style pages for different areas of the site. The home page welcomes the customer with a large banner, a link to featured services, and space for a brief company introduction. The services page presents an area where the business may show off select (or all) services that they offer to their customer base. These services cards, when hooked into more detailed site layouts, can easily lead the customer to their desired product. The about us page is a straight-forward place where the business can leave a quick blurb about their history along with a company photo.

The design is more rigid than the other two templates, relying on darker colors and muted blues to give a more formal appearance. The page still retains much of its white/grey space as to not appear too overly colorful.

*All design features in the individual templates are easily changed, swapped, and adapted to meet personal taste*

Personal Template

The personal template is more suited for a personal site or makeshift blog. The home page gives a space for a personal introduction, as well as a picture of the owner. The about me page allows for similar content, with more emphasis on the background story of the site owner. The blog page gives a space for personal entries, paginated between pages (this template is not hooked to a database system and all samples are hard coded).

The personal site is round, soft, and intended to feel like someone's personal blog. There is space for large images of the owner, and lots of white space so that the user will only have to focus on a single thing at a time.

*All design features in the individual templates are easily changed, swapped, and adapted to meet personal taste*