Filed under CSS, Web Design by Paul Andrew
It has been well over a year since we last took a look at some of the latest CSS3 buttons techniques. And what a difference a year makes. No longer satisfied with just using the basic CSS3 properties (border-radius, box-shadow…), many developers have progressed to using @font-face icons, animation and 3D effects. All with only CSS. Hope you enjoy this selection: You might also like… 20 CSS3 Tutorials and Techniques for Creating Buttons → 22 CSS Button Styling Tutorials and [...]
Continue Reading "20 More CSS3 Tutorials and Techniques for Creating Buttons"
May 15, 2012 at 4:13 pm Comments (0)
Filed under Articles, Coding, CSS, css3, Design, generators, interface, links, Resources, roundup, Tips, Tools, Web Design by Chris Spooner
With the latest advances in CSS3 many of the effects that were once only achievable in Photoshop can now be replicated in CSS code, but it’s sometimes difficult to visualise the appearance of these effects when staring at a few lines of syntax. This is where CSS generators come in handy, this roundup of tools [...]
Continue Reading "Handy Roundup of CSS3 Generators and Tools"
May 7, 2012 at 7:00 am Comments (0)
Filed under CSS, Web Design by Heiko Stiegert
Fluent animated transitions for sliding web page elements such as a menu or an image gallery, have always traditionally been implemented with JavaScript. But using the CSS3 pseudo-class :target and the negation pseudo-class :not() properties, together with the CSS3 Transition Module you can achieve the same effect, but without JavaScript! This means that the very popular “accordion or toggle” effects can be easily implemented using only CSS! In the following CSS workshop we will build an accordion/toggler image gallery to [...]
Continue Reading "How to Build an Accordion Image Gallery with only CSS"
April 26, 2012 at 7:15 am Comments (0)
Filed under accessibility, Coding, CSS, Design, dribbble, HTML, Portfolio, standards, techniques, Tips, Tutorial, Tutorials, Web Design by Chris Spooner
Continue this step by step tutorial to create a simple single page portfolio website design that will self-update using shots from your Dribbble profile. In this second and final part of the series we’ll go through the process of building the Photoshop concept into a working HTML/CSS web page then add the jQuery plugins to [...]
Continue Reading "Build a Basic Dribbble Fed Portfolio Website (Part 2/2)"
April 23, 2012 at 7:00 am Comments (0)
Filed under CSS, Web Design by Jameel Khan
All of the CSS3 navigation tutorials we have for you today are all fully functional and could easily be used on a live site. But we do prefer to think of them all as being more experimental and proof-of-concept rather than being a robust end-product (a sprinkle of jQuery always makes everything better!). What they do offer is an opportunity to roll-up your sleeves and delve into some ground-breaking code. Anyway, here they all are: You might also like… CSS3 [...]
Continue Reading "CSS3 Menu and Navigation Tutorials"
April 19, 2012 at 7:59 am Comments (0)
Filed under Animation, Articles, Coding, CSS, css3, Design, keyframes, links, Resources, Web Design by Chris Spooner
We started seeing experimentation and articles about CSS3 @keyframes animation in 2011, but back then support was limited to webkit browsers. As of mid 2011 Firefox 5 gained support, and we can expect the next incarnation of Internet Explorer (10) to also show support, so now is the perfect time to get to grips with [...]
Continue Reading "Useful Links for Learning CSS @Keyframes Animation"
April 9, 2012 at 7:00 am Comments (0)
Filed under accessibility, Coding, CSS, html5, Web Design by Jacob Cass
This is a guest article contributed by Vail Joy. As Opera evangelist Bruce Lawson puts it, “Everyone’s talking about HTML5”. It’s perhaps the most hyped technology since people started putting rounded corners & gradients on everything. In fact, a lot [..]
Read More
Continue Reading "7 Facts and Myths of HTML5"
March 27, 2012 at 1:27 pm Comments (0)
Filed under app, Application, Button, buttons, CSS, Design, dev, development, flash, forms, HTML, icon, Icons, iOS, iphone, mobile, Resource, Resources, showcase, Template, web by Jake Rocheleau
There are a lot of factors to consider before building and submitting a mobile application. Developers have plenty of resources on the web for consulting official documentation. But there are some traits you should consider about the overall process. Whether you are building for Apple or Android-powered devices will make all the difference. Some developers have the confidence to build for both platforms which is staggering. I’ll try to mesh ideas together so they apply in both development environments equally. [...]
Continue Reading "Guidelines to Follow when Building for the App Store (iOS & Android)"
March 23, 2012 at 8:33 am Comments (0)
Filed under app, book, CSS, Design, dev, font, Graphic, icon, Icons, jQuery, Logo, minimal, mobile, photoshop, Resource, Resources, showcase, theme, Tutorial, Twitter, Vector, web, Weekly News by Paul Andrew
This is our weekly column were we share our favorite design related articles, resources and cool tidbits from the past week. Enjoy 
If you would like to receive our daily updates and keep up to date with the latest and greatest articles and resources from the design community, you can follow us on Twitter, on Facebookor by subscribing to our RSS feed. Our Weekly Design News has been sponsored by MediaLoot. Check them out for some seriously useful resources [...]
Continue Reading "Weekly Design News – Resources, Tutorials and Freebies (N.123)"
March 13, 2012 at 6:19 pm Comments (0)
Filed under app, CSS, Design, dev, development, effects, font, Graphic, icon, Inspiration, javascript, Resource, Resources, showcase, Template, Text, Typography, web, Web Design by Jake Rocheleau
Modern web designers are incorporating innovative new concepts for digital type. In the previous decade we have witnessed the Internet transform into a powerful tool for sharing media all around the world. More specifically digital designers have adapted and web trends continue to change over time. Text on a page will always be the most uniform way of communication. It’s up to web designers to mold this text in a tasteful and easy-to-read manner. In this guide I’ll share a [...]
Continue Reading "Captivate your Audience with Typography"
March 12, 2012 at 4:37 pm Comments (0)
Filed under Ajax, app, CSS, HTML, javascript, Text, web, Web Design, Website Speed, Wordpress by Andy Killen
Programming for speed is not what most coders think of. What they tend to consider first, and usually only, is getting it working. Sometimes people will talk of refactoring to reduce the amount of code, but again this is usually only for those that suffer with the luxury of having too much money and time. I wish I had that luxury, to be able to spend twice as long on a problem to make a perfect solution. In truth I [...]
Continue Reading "Website Speed Part 4 : PHP Programming for Speed"
March 12, 2012 at 9:00 am Comments (0)
Filed under Coding, CSS, css3, Design, interface, layouts, media queries, responsive, techniques, Tips, Tutorial, Tutorials, Web Design by Chris Spooner
If you’ve yet to get your hands dirty with media queries, now is your chance to create your first responsive website design. In this tutorial we’ll look at converting one of my previous WordPress theme designs into a responsive layout, while taking into consideration the design’s original grid structure. If you cast your mind back [...]
Continue Reading "Create a Responsive Web Design with Media Queries"
March 12, 2012 at 8:00 am Comments (0)
Filed under app, CMS (Content Management), CSS, Design, flash, javascript, showcase, theme, Twitter, Web Design, Wordpress by Visual Idiot
I’m going to make a bold assumption here, but I bet you’ve got a blog. If you do, then you join a crowd of millions, all penning their deepest thoughts and documenting their life. It really is hard to stand out from the crowd though. Anchor aims to fix that. Based on the technology behind my blog, Anchor’s a super-tiny content management system, built especially in mind for art-directed posts; that is, a blog where every article is designed (and [...]
Continue Reading "Say Hi To Anchor – A Super-Tiny CMS"
March 9, 2012 at 8:54 am Comments (0)
Filed under app, CSS, Design, font, HTML, javascript, jQuery, plugin, Text, web, Web Design, Wordpress by Alexandre Smirnov
One page scrolling sites have experienced a huge growth in popularity in web design in recent years. Although this type of site isn’t for everyone, it is still useful to know how they work. Today, I will teach you how to create a very simple one page scrolling site using jQuery. Before we begin you can download the Source Files, or try the Demo. This is what we will be building: OK, lets get on with it… The HTML This [...]
Continue Reading "Scroll to Internal Link with jQuery"
March 7, 2012 at 8:00 am Comments (0)
Filed under app, book, CSS, Design, dev, font, forms, Graphic, HTML, icon, Icons, jQuery, minimal, Resource, Resources, theme, Tutorial, Twitter, Vector, web, Weekly News by Paul Andrew
This is our weekly column were we share our favorite design related articles, resources and cool tidbits from the past week. Enjoy If you would like to receive our daily updates and keep up to date with the latest and greatest articles and resources from the design community, you can follow us on Twitter, on Facebookor by subscribing to our RSS feed. Our Weekly Design News has been sponsored by MediaLoot. Check them out for some seriously useful resources [...]
Continue Reading "Weekly Design News – Resources, Tutorials and Freebies (N.123)"
March 6, 2012 at 8:43 am Comments (0)
Filed under app, CSS, Design, dev, development, HTML, javascript, jQuery, magazine, mobile, plugin, Text, theme, Video, web, Web Design, Wordpress by Jane Parker
Images are one of the most important elements on a web page in terms of user experience. Few objects on a page have the same impact on everything from emotional responses to bounce rates. When users are viewing your site on mobile devices, small screens, or in other unusual situations the images can distort the page and ruin your careful site design. That’s why responsive design is being developed. In this post we examine the use of images in responsive [...]
Continue Reading "The Challenge of Responsive Images"
March 5, 2012 at 8:49 am Comments (0)
Filed under app, book, Competition, CSS, Design, email, HTML, web by Paul Andrew
An unbelievable 411 comments! That is how many comments last weeks HTML & CSS – Design and Build Websites Book Giveaway generated. Its been by far and away our most popular competition ever and clearly underlines how good the book is. It is just a pity we only have 3 copies to giveaway. Anyway, the competition ended yesterday and it is now time to annouce the winners. Thanks to everybody for their comments and if you are not one of [...]
Continue Reading "HTML & CSS – Design and Build Websites Book Competition – The Winners"
March 2, 2012 at 5:39 pm Comments (0)
Filed under app, Button, buttons, CSS, Design, effects, font, HTML, icon, Icons, javascript, jQuery, Resource, Resources, Template, Text, Tutorial, web, Web Design by Jameel Khan
Today we are showcasing some of best tutorials and techniques that will help you create beautiful and functional designs by using only CSS, focusing primarily on the properties of CSS3. All with absolutely NO JAVASCRIPT. For the most part, the techniques we have highlighted below, can be used for everyday use, others probably not. Please do check browser compatibility when implementing any of these techniques. You might also like… CSS3 Compatibility Tools, Resources and References for Internet Explorer → CSS [...]
Continue Reading "CSS3-Only Tutorials and Techniques for Your Next Design"
March 1, 2012 at 9:27 am Comments (0)
Filed under CSS, Design, dev, HTML, Inspiration, jQuery, mobile, plugin, theme, web, Web Design, Web Inspiration, Wordpress by Jake Rocheleau
Responsive web design become a very popular trend in 2011. It’s likely something we’ll see continuing well into 2012 as designers are beginning to support a myriad of mobile devices. Building layouts for the web can be tough, but inspiration is a huge factor. In this gallery I’ve collected 40+ amazing responsive website layouts. These designs are built to support a set of different resolutions and re-size accordingly. It’s tricky building this functionality in HTML5, even advanced web developers may [...]
Continue Reading "40 Examples of Brilliant Responsive Website Layouts"
February 29, 2012 at 8:23 am Comments (0)
« Older Posts