HTML5 and CSS3
Get flash to fully experience Pearltrees
Giving feedback to the visitors is a massive part of the user experience , if the user clicks a button they would expect to see something happen. An example of this is uploading an image to a website, it may take some time for the server to upload the image, but when the user clicks the upload button they would expect the page to do something. If the page doesn’t give any feedback that the image is currently being uploaded, the visitor could get impatient and either repeatedly click the upload button or navigate away from the page before the upload is complete, for this reason you should always give feedback to your visitors. A common approach is to use a spinner graphic which is either done with a gif image or with Javascript .
How To Create Loading Spinners Using CSS3 Animations
Designer, developer, co-founder of TheCodePlayer. You can follow me on twitter at https://twitter.com/#!/ruby...
CSS3 Family Tree
Fixing 5 common SEO problems with HTML5... today! - distilled
For sometime now you’ve probably been hearing conversations about how some problem or another would be much easier solved with HTML5, but because X percent of users are still on IE we can’t “move to HTML5″. However, in reality, HTML5 isn’t something you need to ‘switch on’ – it isn’t one big thing. Think of HTML5 not as a tool but as a toolset ; a collection of new features, in many cases independent of one another. This post deals with the SEO benefit of HTML5, and so our focus is on what Google and co. can interpret and not with browser compatibility.
CSS Font and Text Style Wizard Welcome to the CSS Font and Text Style Wizard, brought to you due to the popularity of the HTML and CSS Table Border Style Wizard . Use this wizard to experiment with font and text styles and generate sample CSS style source code.
CSS Font and Text Style Wizard
Written by Paul Hayes: Using CSS3 techniques a modal box can be created without JavaScript or images. With a bit of animation, transition an... Taken rom Paul Hayes: 3D Cube using CSS3 Transformation, more information here http://www.paulrhayes.com/2009-04/3d-cube-using-css-transformations/
HTML5 Snippets
TOOLS
An Ultimate HTML5 Cheat Sheet for Web Developers
HTML5 has now become the new standard for the web development, every new browser has the compatibility of HTML5, and collectively these are called modern browsers . So the moral of the story is if you are a web developer and want to match the future of web development, you have to learn HTML5 . You cannot depend on previous HTML for your web projects because these will be out dated soon. But one major question may arise into your mind – How to learn HTML5 easily? Learning a new language is not an easy task, as it may have new concepts and logic.
Font Squirrel | Create Your Own @font-face Kits
Usage: Click the "Add Fonts" button, check the agreement and download your fonts. If you need more fine-grain control, choose the Expert option. EOT compressed with LZ compression. File sizes are often smaller than WOFF. Special thanks to Richard Fink and Philip Taylor for creating the excellent EOTFast app. If the font has the features, this will allow you to "flatten" the selected features into your font file.Bulletproof @font-face syntax « Paul Irish
This is the Fontspring @font-face syntax. I'll circle back to why this is the best possible solution but let's first review the other techniques' weaknesses. Of course, the problem at the center of this is that IE needs an .eot font, and the other browsers must take a .ttf or .otf .
How to create slick effects with CSS3 box-shadow - RedTeamDesign
Drop shadows and inner shadows are some of the effects I learned to apply using Photoshop’s Blending options. But now, since CSS3 “hit the charts”, you don’t need Adobe’s design tool to add a drop shadow or an inner shadow to a box. The box-shadow property allows you to add multiple shadows (outer or inner) on box elements. To do that you must specify values as: color, size, blur and offset. Now let’s see how can you take advantage of this wonderful CSS3 feature.
The tools have been sorteds into the following categories: Grid and Layout, CSS Optimisers, CSS Menus Tools, CSS Buttons, CSS Rounded Corners, CSS Frames, CSS Sprites, CSS Tables, CSS Typography and CSS Forms. This is a fresh take on the CSS grid. It can be used to streamline page templates for content management systems, its mission is to be lightweight. The variable grid system is a quick way to generate an underlying CSS grid for your site. The CSS generated file is based on the 960 Grid System. Use this generator to design a layout structure, specifying column, margin and gutter sizes, all referencing a core unit (in pixels).
50 Useful Tools and Generators for Easy CSS Development