Making Embedded Content Work In Responsive Design

A few HTML elements don’t play nice with responsive layouts. One of these is the good ol' iframe, which you may need to use when embedding content from external sources such as YouTube. In this article, we’ll show you how to make embedded content responsive using CSS, so that content such as video and calendars resize with the browser’s viewport.

Making Embedded Content Work In Responsive Design

For those occasions when non-coders will be embedding video on your website and you don’t want to rely on them adding extra markup, we’ll also look at a solution that uses JavaScript instead of CSS.

Read more...

Creating Responsive Prototypes With Adaptive Views In Axure RP 7

Responsive Web design has vexed people who build prototypes since the techniques came into use several years ago. While responsive design is an extremely elegant way to handle coding for multiple device types when executed with HTML and CSS, the prototyping tools available to UX professionals have not delivered testable or demonstrable experiences of the same quality. That changed recently with the adaptive views feature that is part of the new Axure RP 7.

Creating Responsive Prototypes With Adaptive Views In Axure RP 7

Creating responsive prototypes without writing code is now possible with Axure RP 7’s new adaptive views feature. The feature enables you to create one page in Axure RP with several “views.” The view displayed on a given device is determined by the width of the device’s screen.

Read more...
Advertisement Advertise with us!

Off The Beaten Canvas: Exploring The Potential Of The Off-Canvas Pattern

The off-canvas flyout menu has taken over as the primary navigation pattern for mobile layouts — even some desktop layouts have jumped on board. And for good reason: An off-canvas menu is a great way to maintain context while giving the user a lot of additional information.

Off The Beaten Canvas: Exploring The Potential Of The Off-Canvas Pattern

In this article, we’ll talk about why off-canvas has become so successful as a navigation pattern and show its potential to be so much more. From filters on product list pages to shopping carts to lists of recently viewed articles, the potential of this pattern is bound only by our drive to pioneer. It’s time that we explore just how far off canvas we can go.

Read more...

WordPress: How It Came To Be And Where It’s Heading

2013 was a busy year for me for conferences and travel. It was also the year I attended my first (and second) WordCamp. The first was WordCamp UK in July, where I met Mike Little, one of the two co-founders of WordPress.

Interview With Matt Mullenweg And Mike Little — WordPress: How It Came To Be And Where It's Heading

Three months later, I was honored to meet the other co-founder, Matt Mullenweg, twice in three weeks: at WordCamp Europe in Leiden, and at The Summit. I was lucky enough to have both Matt and Mike participate in interviews for this post about WordPress, including its history, community and future.

Read more...

Kickstart Your Project With INIT And Grunt

Whenever you start a project, you have to repeat certain tasks and set up certain structures: create new folders, choose a framework, set up your development tasks. But configuring settings once and reusing them would be simpler.

Kickstart Your Project With INIT And Grunt

An easy way to achieve this is by using some kind of generator — for example, Yeoman Generator — or tools such as INIT, which can perfectly coexist with and even be used through a generator.

Read more...

Responsive Design Frameworks: Just Because You Can, Should You?

Responsive design is about building a website with a grid-based layout, images that resize and media queries, as described by Ethan Marcotte. After Marcotte defined the technique, responsive design frameworks began to emerge that incorporated these principles.

Responsive Design Frameworks: Just Because You Can, Should You?

Mostly based on CSS and JavaScript, many of these frameworks are open-source, free to download and quickly customizable. Some of the most popular today are Bootstrap and Foundation, which we’ll focus on in this article. As responsive design frameworks became popular, a big debate emerged: Why would a professional designer use a responsive design framework?

Read more...

A Type Design Brief: What Is In It, And Why Does It Matter?

Type design is equal parts suffering and euphoria. It is a walk along a winding road that goes on for many weeks and months before it’s done. A type design brief is like a charter path: It asks you questions, and the answers will guide you to where you want to be.

A Type Design Brief: What Is In It, And Why Does It Matter?

It will not make the walk much shorter, but the chances of getting lost will be much lower. Below are six questions that will shape the typeface through its first moments of creation and serve as guiding principles through the various stages of the design.

Read more...

↑ Back to top