Refreshed

This website was featured on Best Web Gallery.

First step, I defined a set of goals:

  • Responsive Design
  • Improving access to open source projects
  • Optimize load time

Responsive design

After reading Responsive Web Design, I decided to took the initiative and start on a new version of this website. Ethan Marcotte (book’s author) proposes a design of gridsbased on percentages rather than pixels. This style contrasts with the well-known 960.gs adaptive where the grids are defined by pixels and its width are changing according to the stylesheet corresponding to the width of the browser (e.g.  1200px.css to max-width 1200px).

At the time of my design go from photoshop to HTML decided to keep the fixed content width at 1000 pixels. I wasn’t completely satisfied with using percentages for the container and I liked using a maximum of 1000 pixels version (yes, even if I see it from a TV).

Improving access to open source projects

One of the goals to be achieved this year is to increase the presence in Github and using this little snippet I could get all repositories.

Optimize load time

The loading time is an important issue in my view. I hate websites that take ages to load and didn’t even get a message during that time. Following this idea and decided to use WordPress plugins like History.js,  WP Super Cache y WP Better Minify to improve the speed.

I attached each script using the wp function wp_enqueue_script:

wp_enqueue_script( 'prettify', get_template_directory_uri() . '/js/libs/jquery-syntaxhighlighter/prettify/prettify.min.js');
wp_enqueue_script( 'jquery.syntaxhighlighter', get_template_directory_uri() . '/js/libs/jquery-syntaxhighlighter/scripts/jquery.syntaxhighlighter.min.js');
wp_enqueue_script( 'jquery.syntaxhighlighter-css', get_template_directory_uri() . '/js/libs/jquery-syntaxhighlighter/prettify/lang-css.js');
wp_enqueue_script( 'view-js', get_template_directory_uri() . '>/js/libs/viewjs/view.min.js?auto');

Follow me on twitter

Ricardo Rauch

Developer & Designer working on Auth0 and writing about WebApps.