Web Technology: Advanced
-
WordPress 01: Basics
Over the past 6 years WordPress has steady grown in popularity into the most used Content Management System (CMS) on the web. There are a number of reasons why WordPress is so widely used and such a great choice for a CMS: 1. Ease of Use: WordPress is not only easy to use for administrators…
-
Mobile Prototyping with Fireworks
There are many ways to create a prototype for the mobile platform, the most easiest and most effective approaches use HTML & CSS. The first method that we’ll look at uses Adobe’s Fireworks and requires no actual coding. Here’s the tutorial we will be following: http://unitid.nl/2011/03/touch-application-prototypes-tap-for-iphone-and-ipad-using-adobe-fireworks/
-
Practising CSS Animation & Transitions
Getting good at CSS3 animations and transitions takes practise. The only way to become proficient is by spending hours of working through different examples. Here are a number of good tutorials that generate some great effects. CSS3 Navigation effect http://www.alessioatzeni.com/blog/css3-menu-navigation-effect/ Animated Buttons http://tympanus.net/codrops/2011/11/07/animated-buttons-with-css3/ Animated Bubble Buttons http://tutorialzine.com/2010/10/css3-animated-bubble-buttons/ 3D Image Gallery http://inspectelement.com/tutorials/create-a-css3-image-gallery-with-a-3d-lightbox-animation/
-
Amazing CSS3 Animations
The Man From Hollywood http://lab.tylergaw.com/themanfromhollywood/ Making Clouds with CSS http://www.clicktorelease.com/tutorials/css3dclouds/ Walking Man http://andrew-hoyer.com/experiments/walking/
-
Introduction to Keyframe Animation
First read the introduction on Keyframe Animations. intro-to-keyframe-animation. Smashing Magazine has a great article on basic animation principles with CSS3 examples: http://coding.smashingmagazine.com/2011/09/14/the-guide-to-css-animation-principles-and-examples/ Mozilla Dev Team Article on Animation Events in Javascript https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_animations We’ll be going over it in our next class
-
Why We Should Start Using CSS3 and HTML5 Today
For a while now, we have taken notice of how many designers are reluctant to embrace the new technologies such as CSS3 or HTML5 because of the lack of full cross-browser support for these technologies. Many designers are complaining about the numerous ways how the lack of cross-browser compatibility is effectively holding us back and…
-
Example 1: CSS3 Transitions
A good place to start with CSS3 visual effects is transitioning a basic CSS property like color, background-color, or border on hover. To kick it off, let’s take a link color CSS property and connect it to a .4 second transition. Start with a basic unordered list for a navigation system: Page Title item 1…
-
Asmt1: Title Sequence
For your first assignment in this course I would like you to choose one of the classic title sequences from the list below (or find your own that is under 2:30 mins) and create an HTML5/CSS3 version. Please keep in mind that you are not expected to use embedded video in this assignment and should…
-
Introduction to CSS3
For our first foray into the new version of CSS we’ll read an article about the exciting new features of CSS3 and also follow some simple tutorial exercises that help us see some of the immediate benefits. Trent Walton’s article does a great job of describing the following improvements to CSS: CSS3 Transitions Background Clip…
-
Software & Server Requirements
For this course students will be taught how to develop using industry standard software practices. What do Web developers typically use to build websites? Of course, the answer is not entirely consistent across the board but there are some standard tools that make creating websites easier. Here is what you’ll need: Mac laptop or desktop computer…
Got any book recommendations?