CSS3 is the partially implemented sequel to the CSS2 spec we all know and love. It’s already popping up in new browsers such as Firefox 3.5, Safari 4 and Chrome. In this article, the first of the articles that explore practical (and even far-fetched) implementation of CSS3, we start by applying CSS3 to something we all have to create: buttons.
Calls to action are critical for any website, and a compelling, attention-grabbing, clickable button goes a long way toward driving that engagement. In the past, really awesome buttons needed extra markup, sliding doors or other trickery. We’ll show you here how to create nice button styles without any hacks or cheats.
Read more…
Let’s look at some clever techniques developed and used by top professionals in the Web design industry. We can use their examples to develop our own alternative solutions.
Read more…
Buttons, whatever their purpose, are important design elements. They could be the end point of a Web form or a call to action. Designers have many reasons to style buttons, including to make them more attractive and to enhance usability. One of the most important reasons, though, is that standard buttons can easily be missed by users because they often look similar to elements in their operating system. Here, we present you several techniques and tutorials to help you learn how to style buttons using CSS. We’ll also address usability.
Before we explain how to style buttons, let’s clear up a common misconception: buttons are not links. The main purpose of a link is to navigate between pages and views, whereas buttons allow you to perform an action (such as submit a form).
Read more…
In addition to font stacks, we can replace the heading text with an image, embedded font, or bit of Flash? The methods described below are easier than they sound. And the end result is that the vast majority of users will see the beautiful typography you want them to see.
Read more…
The future of CSS is arriving fast, and many tools, languages, and solutions have been developed that make CSS a job not just for Web designers but developers, too. In many ways, the job could become more complex and confusing, but in many other ways, the new changes will provide more opportunity and better technology for the future of the Web.
Read more…
Photography is a wonderful hobby enjoyed by lots of people all over the world. It’s a very enjoyable passtime, but also a very technical one. There’s a bewildering range of cameras, lenses and accessories, and photographers also have to get to grips with computers and image editing software packages. It can get very confusing, especially for newcomers to the hobby, and there always seems to be something to new to learn, even for experienced photographers.
Read more…
The simplicity, advanced features and strong support are common arguments for developers preferring jQuery against other JavaScript-frameworks. In fact, jQuery is one of the most popular JavaScript frameworks, with powerful tools that can significantly improve the user’s interaction with Web applications.
Read more…
This post is a second part of the article Clever PNG Optimization Techniques that we posted last week. As a web designer you might be already familiar with the PNG image format which offers a full-featured transparency. It’s a lossless, robust, very good replacement of the elder GIF image format. As a Photoshop (or any other image editor) user you might think that there is not that many options for PNG optimization, especially for truecolor PNG’s (PNG-24 in Photoshop), which doesn’t have any. Some of you may even think that this format is “unoptimizable”. Well, in this post we’ll try to debunk this myth.
This post describes some techniques that may help you optimize your PNG-images. These techniques are derived from laborious hours spent on studying how exactly the PNG encoder saves data. We’ll talk about grayscale, how to use fewer colors for optimization and also about reducing detail to minmize the file size.
You may want to take a look at the following related articles:
* Clever JPEG Optimization Techniques
* Clever PNG Optimization TechniquesRead more…
CSS is almost certainly one of the best developments in web design since the first graphical web browsers were adopted on a wide scale. Where tables created clunky, slow-loading pages, CSS created much more streamlined and usable web pages. Plus, CSS has allowed designers to achieve a number of different styles that used to only be possible with images.
Read more…
If you’ve been reading some of the previous WordPress-related articles here on Smashing Magazine, you’ll know that WordPress is much more than a blogging platform. It can be used as a CMS, too. And WordPress widgets are a powerful tool in your WordPress development arsenal.
When you think of WordPress widgets, you may think they’re just a way to rearrange various items in your blog’s sidebar without touching any code. Sure, that’s nice and all, but that’s really just the tip of the iceberg of all the things WordPress widgets can do.
Read more…
