Tag Archives: CSS

How To Customize The WordPress Admin Easily

How To Customize The WordPress Admin Easily

In this article, we take a break from some of the more advanced ways to customize WordPress, and share some super-easy customization techniques for the WordPress Admin area.

If you’re just getting started with WordPress, or have been running with default functionality for a while and now want to dig in with some useful and easy ways to customize your WordPress site, a great place to start is the WordPress Admin area, or backend. One of the great things about WordPress is that each part of the backend is easily customized using simple PHP functions.

customize-wp-admin

In this article, you’ll learn how to customize the login page with your own logo, add new

Article source: http://feedproxy.google.com/~r/SmashingMagazine/~3/mCwK4h1CbnU/

Applying Macrotypography For A More Readable Web Page

Applying Macrotypography For A More Readable Web Page

Any application of typography can be divided into two arenas: micro and macro. Understanding the difference between the two is especially useful when crafting a reading experience, because it allows the designer to know when to focus on legibility and when to focus on readability.

This article focuses mostly on a few simple macrotypographic techniques—with a dash of micro—and on how to combine them all to build a more harmonious, adaptable and, most importantly, readable Web page.

First, some definitions. Microtypography has to do with the details; setting the right glyph, getting the appropriate kerning and tracking, and making stylistic choices such as when to use small-caps. Micro techniques have received http://feedproxy.google.com/~r/SmashingMagazine/~3/nKMs04J3AEA/

A Pure CSS3 Cycling Slideshow

A Pure CSS3 Cycling Slideshow

Thanks to CSS3, we can create effects and animations without using JavaScript, which will facilitate the work of many designers.

But we must be careful to avoid abusing CSS3, not only because old browsers do not support all of its properties. In any case, we all see the potential of CSS3, and in this article we’ll discuss how to create an infinitely looping slider of images using only CSS3 animation.

Sections of This Article

To get a solid sense of the process from beginning to end, below is an outline of the article. Please note that this effect will only work properly in modern browsers that support the CSS3 properties being used.

  1. Introduction
    Learn basic concepts related to CSS3 transitions

    Article source: http://feedproxy.google.com/~r/SmashingMagazine/~3/DqCenf4a3hs/

Mental Model Diagrams (Cartoon)

Mental Model Diagrams (Cartoon)

We tend to carefully create our HTML and CSS, and meticulously place every pixel to our designs. We plan exactly where our content should be placed on a particular site. Among many other decisions we need to make, we always keep in mind to craft a great experience for all our users. But how do we know what our users really want?

One way is to understand the motivations that drive users in general. A mental model diagram can be created to do just that—to dive deeper and discover what users are trying to accomplish, and then create solutions that match.

In this comic, Indi and Brad introduce mental model diagrams to us

Article source: http://feedproxy.google.com/~r/SmashingMagazine/~3/B5G2h2iKI0s/

Decoupling HTML From CSS

Decoupling HTML From CSS

For years, the Web standards community has talked about the separation of concerns. Separate your CSS from your JavaScript from your HTML. We all do that, right? CSS goes into its own file; JavaScript goes in another; HTML is left by itself, nice and clean.

CSS Zen Garden proved that we can alter a design into a myriad of permutations simply by changing the CSS. However, we’ve rarely seen the flip side of this — the side that is more likely to occur in a project: the HTML changes. We modify the HTML and then have to go back and revise any CSS that goes with it.

In this way, we haven’t really separated

Article source: http://feedproxy.google.com/~r/SmashingMagazine/~3/CPfh5pYgYJ8/