The power of CSS3 design offers unique trends for building custom website interfaces. And with the help of the open source movement, it is now easier than ever to make your own customized layout design. CSS3 user interface kits have become more common and you can find these published within various websites and blog. For […]
Case Study into CSS3 Effects on Popular Websites
It doesn’t seem like the many CSS3 standards are so “new” anymore. Web designers have been implementing these properties into most of the new layouts I run into. Rounded corners and text shadows are commonplace for the modern web.
I want to use this article as a small case study into CSS3 effects. I’ll be examining some big-name websites and how they are building unique web interfaces. The techniques are not exclusive to any single entity – and it’s actually simple to put together some code of your own. But it is my hope these examples can spur new ideas in budding developers.
How to Design a Dribbble-Style Homepage Layout
The popular design network Dribbble has grown substantially in just a few short years. Graphics designers and illustrators from all over the world have flocked onto the web seeking invites. But aside from the exclusivity their layout design has become a prominent factor of the entire branding.
I love the simplistic nature of their gallery-style photo boxes. It matches well with a community of designers excited to share their latest pixels with the world. In this tutorial I’ll go over techniques for constructing a similar design in HTML5 and CSS3. You can build a very similar page structure with just bare-bones essential CSS. Yet when we can utilize new browser-supported properties like box shadows the process becomes much more captivating.
33 Fresh jQuery And CSS3 Tutorials
In this post we have compiled some useful jQuery and css3 tutorials. Enjoy!!
If you like these tutorials you might also want to check out our previous posts below.
19 CSS3 and jQuery Tutorials for Perfect UI Design
Hover and Click Trigger for Circular Elements with jQuery
22 Useful HTML5 CSS3 Form Tutorials
Using HTML5 and CSS3 you can create creative web forms with great specifications. So in this roundup we are featuring 22 CSS3 form tutorials.
Slick login form with HTML5 & CSS3
Design a Full HTML5/CSS3 Template Replica of Digg v3
Social media junkies on the turn of the year 2004 surely remember Digg. It was the powerhouse of social news, all the techies would flock to Digg on a daily basis. And it’s been through quite a few changes recently with the v4 redesign. However I fondly remember Digg’s classic appeal running under v3 as the most accepted web interface.
Thus I’ve taken the liberty to re-code the entire front page template into HTML5/CSS3! And in this short tutorial I’ll be introducing you to some of my techniques. Additionally I’ve offered the source code completely free to download for your own usage. Much of the design I’ve had to piece together through the Wayback Machine Internet archives.
20 Tutorials That Will Improve Your CSS Skills and Make You a Better Coder
25 More Books For Designers, Developers And Web Workers
A while ago we shared 25 great web-design and development books and since this earlier post got a great response (and we’ve read a lot more books since), we’ve now gathered another 25.
In this list you’ll find books about design, theory, development, css, html and a lot more. I hope you enjoy the post!
Applying a Clean & Imageless Design to an Article – Part I
For Christmas this year, my beautiful wife gave me a copy of The Web Designer’s Idea Book, Volume 2. Obviously, I have been perusing the book, and I am finding that there are tons of awesome web designs to take in. I’m super happy with the gift and I expect that it will prove to be a highly valuable resource throughout 2011, and beyond.
Yet, even just a quick perusal of the book reveals the prevailing influence of Photoshop (or other graphics programs) on the industry at large. Today, the web is full of beautiful, rich and colourful graphics that continuously amaze and impress us in all manner of very legitimate ways. But just because we can include all of this incredible imagery, it doesn’t necessarily follow that we have to. Sometimes, the simple use of colour, shape and typography can create an attractive and elegant design all on its own.
Brilliante Blog Layout – Coding The PSD File Into CSS and HTML
In this tutorial, we’ll be revisiting the Brillante blog design, covering the PSD slicing, HTML/CSS coding, custom fonts embedding and some handy cool tips to improve your website performance.
This is Part 2 of 3 of the Photoshop blog design called Brilliante, published some time ago on SpyreStudios and designed by Mahmoud Khaled Deiab.
In this second part, I’m gonna walk you through the PSD to HTML/CSS coding process. Third part will be about creating a WordPress theme. Let’s begin!