Skip to content

peter-m/blueprint

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

30 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

What does it do?

This is going to be some sort of boilerplate, considered to ease your webdeveloper's life with the following features:

  • css/styles.css is a solid css reset (I cherry-picked the best from the YUI reset, Eric Meyer's CSS Reset, the one from the HTML5 Boilerplate and of course my own experiences) and fixes IE's em resizing bug, furthermore it provides you with print-styles, helper classes (.unselectable, .hidden, .center, .fluid (for images and objects), a semantic .clearfix and many more coming soon), styles for HTML5 elements for browsers that are not familiar with them and predefined media queries for mobile web design.

  • css/plugins/... provides you with some useful ressources, e.g. a pure css tree menu (credits go to thecssninja.com)

  • css/ie7.css fixes some bugs for IE7

  • js/libs/ provides you with some libraries (such as jQuery, jQuery Animate Enhanced (extends jQuery's animate() function so that it makes use of CSS3 animations if possible), jQuery History (used for cross-browser pushState functionality and hash-fallback for IE) and Modernizr (teaches older browsers how to display HTML5 elements and provides functionality to load shivs if needed))

  • js/pushState.js "ajaxifies" your site, prevents the default action when clicking an internal link and instead requests the page's content via AJAX and changes the URI to the requested page's one

  • js/makeUnselectable.js is teaches IE and Opera how not to select something (recursively on all .unselectable elements)

  • there also is a .htaccess file, rewriting yourdomain/dir-where-it-is-placed/xyz to yourdomain/dir-where-it-is-placed/index.php/xyz (thus creating a virtual path, which is "parsed" by index.php) and fixing the "document-compatibility-leading-to-validation-error-problem"

  • appcache.php is like xyz.appcache (it is .php with a "text/cache-manifest"-header because some servers aren't capable of the .appcache format and serve it with a false MIME type) - set it up correctly and you will be able to display your page even if you are offline!

  • index.php basically does all the work (parses virtual path, created by .htaccess, into an array, sets a BASEPATH (if this file is accessed by yourdomain.com/path/to/index.php, BASEPATH will be "/path/to" -> useful for internal linking))
    Furthermore it is a nice template to start with, showing off some of the project's features (sidenode: the more curious ones may have noticed the use of insemantic container tags for the <header> and the <footer> tag to enable full browser width bars - of course this effect could also have been achieved by using the more semantic :before and :after CSS pseudo classes, as shown by css-tricks.com, but there are several drawbacks that go hand in hand with this technique, such as the need of declaring the overflow-x: hidden which has some additional drawbacks (when selecting text the content may disappear!))

ToDo:

  • add another css file for more advanced css helper classes (css tabs, responsive data tables, :after for external links/..., a CSS3 tooltip and more)

  • merge ie7.css and styles.css (make use of Modernizr's dynamic .ie7 class)

  • organize styles.css and document it for readability's sake!

  • working appache.php (dynamic one? (requires some additional logic for the virtual paths (as every combination (yourdomain.com/index.php/xyz where xyz could be EVERYTHING) is possible))

  • MVC (maybe even a leightweight CMS)

  • add a sitemap (maybe even generator, would do pretty much the same as the dynamic appcache.php)

  • include some HTML5 cross browser polyfills, which are ready to be used in with Modernizr

  • icons (apple touch icon, favicon)

  • more leighweight version (without MVC/CMS and helper classes) or a builder (only select the components you wish)

  • add cross browser HTML5 progress bars (update CSS reset and add helper class + polyfill)

  • add cross browser HTML5 forms

  • create a slick WYSIWYG editor (with the contenteditable attribute, crossbrowser support (IE))

  • improve .htaccess and add some more features (see the one from initializr)

  • create a collection of tips for common mistakes and more

About

a collection of useful ressources to start a new website from

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published