Paleo? Like paleontologist?

2015-02-26 19_51_06-Meats Overview - Paleo Eats

Screenshot of the meats overview page.

This minisite focuses on the paleo diet and paleo-friendly recipes. The paleo diet cuts out grains, sugar, and processed foods from a meal. This leaves room for more fruits, vegetables, and meat that mimic the diet of our ancestors thousands of years ago before the agricultural revolution. There are three main categories: meats, salads, and fermented foods. Within these three categories are three recipes. This website is monochromatic blue because it is simple and the colors do not clash together. It gives a friendly and inviting feel to the website and isn’t too bright or make the text unreadable. These images were taken directly from Paleo Leap, a great website with delicious paleo-friendly recipes. The primary menu bar at the top shows the three categories while the left shows the recipes. Using the information from Smashing Magazine’s article “Efficiently Simplifying Navigation Systems”, a primary menu bar with a secondary left navigation bar was the simplest solution to convey top-level and secondary-level information. The typefaces used are Open Sans and PT Sans. These fonts are one of the most widely used fonts by Google. These are easy to read and seemed like the most user-friendly fonts.

CSS and HTML offer a wide arrange of options such as preprocessors (SASS, LESS), language integration (Javascript, PHP, Ruby on Rails), content manager systems (Squarespace, Drupal, WordPress), and frameworks (Bootstrap, Foundation). All of these options become very overwhelming and a developer must pick and choose which works best for their style and work ethic while remaining on top of the trends of web design (ex. responsive mobile first design, CSS3 animations). The great thing about CSS is that its flexibility allows it to be easily changed and updated to modern standards. Some trends to watch out for would be for more cross-platform and mobile friendly sites. Grid systems and frameworks allow developers to quickly prototype their website that looks great across multiple devices.

HTML5 Up! is a great website for free templates of responsive websites. It’s also a fantastic place to get simple layout ideas and see what simple HTML5 can offer. Frameworks and grid systems can be confusing to work with at first, but Skeleton is one of the simplest and easiest to understand. It has less than 200 lines of CSS and will work for almost all simple projects. Most mobile-first sites do not have print-friendly pages, but this article from A List Apart titled “CSS Design: Going to Print” details how to make a page print-friendly using CSS.

This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s