Code Academy recently asked me to come in give a workshop on the basics of HTML and CSS to their students. The workshop started with a presentation outlining the different structures of HTML and CSS, along with some common terms to be familiar with. After a collective understanding of HTML and CSS a deeper dive was taken into the box model and how to work with floats.
Continue Reading »Over the summer I have had the opportunity to speak at some terrific conferences, the last two being ChicagoWebConf and Omni Technical Conference. At these two conferences I spoke specifically about HTML5 and CSS3 and it's roll within quality front-end design and development. Please feel free to check out my slides from these talks below and let me know if you have any questions.
September 2011
Continue Reading »
Building a website is an exciting time! Everyone is firing on all cylinders and eager to get started. The mood is high and the room is full of great ideas. Putting the correct process in place will help grow the excitement and craft ideas into executable goals.
TechWeek, July 2011
Continue Reading »
CSS3 is a hot topic these days. Designers and developers are starting to widely utilize CSS3 and new tutorials are popping up nearly everyday. As a designer it is an exciting time to be at the forefront of it’s development. There are, however, many designers and developers that see browser support for CSS3 as insufficient. In their defense, not all clients are open to letting their websites look moderately different from browser to browser.
Thankfully Faruk Ateş, Paul Irish and Alex Sexton have developed a script, Modernizr, that detects CSS3, as well as HTML5, browser support and allows us to take advantage of CSS3 in compatible browsers while providing alternative fallbacks to incompatible browsers. The script adds a unique class to the html element of a page specific to each CSS3 property supported. As an example, in browsers that support CSS3 border radius a class of borderradius will be added to the html element, while in browsers without support for CSS3 border radius a class of no-borderradius will be added to the html element. This opens up a world of opportunities, giving us just what we need to fully implement CSS3 without worrying about incompatible browsers.
Best viewed in Safari or Chrome.
Continue Reading »
As with any inquisitive web designer or developer I am always looking for ways to experiment with the latest HTML and CSS source. This past spring I got engaged and set off to create a wedding website, providing me just the opportunity to play with CSS3 transforms, transitions, and animations.
My fiancé loves owls so my idea was to have an owl that moved his eyes every so often and when hovered over would raise his wings while a few light rays would spin in the background. A little excessive? Probably. Necessary? Nope. However, exactly what I was looking to do with CSS3 transforms, transitions, and animations.
View the DemoBest viewed in Safari or Chrome.
Continue Reading »
Recently I had the chance to ask Chris Coyier some quick questions, get his take on a few things within the web design industry, and see what he has been up to lately. Chris, as you may already know, is an extremely talented man who wears a number of different hats and has his hands in many different projects. Perhaps most notably, Chris is the curator behind one of the most well known web design communities CSS-Tricks. It was a pleasure to get to speak with Chris and I thank him for opportunity.
Continue Reading »
Are you barreling down on your latest design without a clue on what to do? Are you looking to roll out 5 more blog post this week without any topics in mind? Are you generally struggling to come up with any ideas? Your first thought may be to force through the creative process and work it out for better or worse. You keep pushing until you hit a breakthrough. You think if you put enough time and effort into your work something is bound to turn up. Fact of the matter is, what turns up will not be worth all of the agony.
Simply put, if you are not in the mood to do something do not force yourself to do it. For the time being work on something else, stay productive, and avoid getting burnt out on a piece of work that was going no where to begin with. Putting all of your time and effort in a failing attempt to produce something creative will only frustrate you further.
Continue Reading »
One of the most popular lines from the 1989 film Field of Dreams is “If you build it, he will come.” A great quote from an excellent movie. Sadly, this quote does not hold true to that of web design. Building a website will not get you visitors and writing in a blog will not get you readers. You must advertise and promote your website accordingly. Today, with the help of social media, gaining publicity has become increasingly easier. There are however many outlets that are often quickly overlooked. One of these outlets being user submitted community news.
Continue Reading »
With CSS3 gaining popularity so are CSS attribute selectors. CSS attribute selectors have been around for some time however CSS3 adds more selectors to the mix bringing new light to subject. Increased browser support, with nearly every major browser currently supporting attribute selectors (Internet Explorer 6 still struggles), has also added to the popularity.
So what benefit do CSS attribute selectors have to adding style to document links? CSS attribute selectors allow you to quickly and easily add styles to document links while keeping your code clean and clutter free. Ultimately, the more attractive looking your links are the more clicks they will receive.
Continue Reading »
Multivariate testing (MVT), testing multiple elements of a live web page at a time, is becoming more and more popular amongst the web design and development community. Understandably so, multivariate testing allows you to test a large amount of combinations and see exactly how those combinations stack up against one another. You will quickly find out that the smallest changes can produce the biggest results.
Continue Reading »