Oct
14
2012

Where I Learned It

Between being a few days shy of two weeks post-op, and learning on the fly how to update my code to html5, my brain is fried.  This is my first design attempt with html5, and of course I pulled out a few tricks with CSS3.  When my braincells start firing again I will post some unique styling tricks, until then check out the tutorials that helped me build this layout:

HTML 5

  • Using HTML5 Today – A great summary on the current implementation of html5 on the various browsers.  This article summarizes all the little things you need to know including html5 validation, cross browser support, the role attribute, and the proper use of headings and their purpose in html5.
  • Avoiding Common HTML5 Mistakes – Reviews the proper use of the section and hgroup tag, and provides some useful tips on how to properly use HTML5 mark-up.

CSS3

  • CSS3 Transitions – This is a solid set of tutorials on the use of CSS3 transitions which I use in a lot of the link effects in this layout.  This tutorial is covers how to set up a variety of transitions and explains how each of the transition properties work so you can easily create your own.
  • CSS Gradient Text Effect – I’ve waited years to pull this one out!  This is the tutorial for how to get that nifty degraded text effect that I have on the headings of this page.  It’s a simple trick that layers transparent pngs over text.  The main limitations are that a span tag needs to be declared in the heading, the background must be solid, and the transparent png must only use the background color.
  • Text Rotation with CSS – I have used this styling technique on and off since Expiation.org first went online.  Great tutorial on cross browser compatible CSS for rotating text.  This tutorial also covers how to create the date boxes that appear in this layout.
  • Drop Down Menus CSS & Javascipt – Basic tutorial on creating drop down menus, with the ability to have sub-menus.  I needed to change my menu script to transition to nested drop down menus.  Look forward to an update of my WordPress and Drop Down Menus tutorial.

WordPress

endothumbnail

One thought on “Where I Learned It”

Leave a Reply

Your email address will not be published. Required fields are marked *


*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

CommentLuv badge