Index - Articles - DMXzone.COM

Usability

Breaking Down Media Queries

The core of any Responsive Web Design framework is the media query. Media queries are what enable your website to call different style declarations from your stylesheets based on the current window width of the viewing device. Many of those new to Responsive Web Design, RWD, don’t spend time getting familiar with them. When there are great frameworks like The Semantic Grid System, Foundation by Zurb, and Twitter Bootstrap that let everyone just pick up and go, why would they bother? Right? Wrong! Having a skill that solely relies on code created by another is a hindrance to your career, in order to be able to say something is part of your skill set you have to understand it first.

Ivo Rangelov

1874

CSS

Sticky Menus Are Quicker To Navigate

Most designers would agree that navigation is one of the most critical components of a website. Despite this, it is not always easy to use or access. Traditionally, users must scroll back to the top of the website to access the navigation menu. Hyrum Denney recently wondered whether sticky menus makes websites quicker to navigate, and he conducted a usability study to find the answer.

Ivo Rangelov

2204

HTML5

Make Disaster-Proof HTML5 Forms

How many times have you been in the middle of meticulously typing information inside a form and – BAM! – the browser crashed? Shwetank Dixit bets it’s happened a few times at least. And when it has, you’ve had to open the browser, go to the URL again and enter all that information one more time – hoping the browser doesn’t crash again a few minutes later. Various things can and do go wrong every day when filling in online forms. The browser may crash, your internet connection can barf at the wrong moment (especially on dial-up or flaky Wi-Fi), or you could even accidentally close the page yourself.

Ivo Rangelov

1513

Usability

Batch Resizing Using Command Line and ImageMagick

If you deal with images, sooner or later you will want to automate the repeating process of saving different sizes from one source image. If you own Adobe Photoshop and do not save too many output sizes, Photoshop actions are probably quite enough for your needs. However, keeping a Photoshop action up-to-date is quite painful — change a source folder, and you’re screwed. On his own wallpapers website, Vlad Gerasimov generates more than 300 JPEG files for each wallpaper! He wants his art to reach as many devices as possible, which means he need to publish his wallpapers in as many sizes as he can support.

Ivo Rangelov

2211

WordPress

Creating a Responsive Header in WordPress 3.4

Among all the new features and improvements that the recent WordPress 3.4 release has introduced, there is a hidden gem. The Custom Header Image feature has been supported by WordPress for some time, however previously its fixed dimensions made it too immobile to be of much use in the age of responsive design. The new release makes it flexible and introduces easier and cleaner code for this popular option. As theme developers you can now go further, taking into consideration the need to optimize for mobile visitors.

Ivo Rangelov

2571

Usability

5 CSS Methods for SEO

Development teams and design strategists spend countless man-hours converting the ideas for a website into a crucial tool for business development. They build database tables, track user navigation paths and create stunning graphics to bring a company’s products to life on the screen. While the fruits of these efforts are often both visually stunning and technically proficient, they can all count for nothing if no one can find the site in their search results.

Ivo Rangelov

1938

JavaScript

A Flexible Approach to Responsive Navigation

Many responsive websites provide a horizontal navigation bar on large screens and drop-down navigation for smaller viewports. It’s a perfectly decent approach, but it’s not without its issues. Firstly, devices don’t just come in large and small; they come in every size imaginable. Secondly, the navigation might well change over time. Thirdly, the layout or font size might vary across screen sizes. Ryan DeBeasi is going to do things differently.

Ivo Rangelov

2266

Design

Perfectly Paired: Using Symmetry in Web Design

Symmetrical design relies on principles of balance, rhythm, proportion and unity to create a style with mirroring sides. Symmetry happens when the composition of design is distributed evenly around a central point or axis. This symmetry can be horizontal, vertical or radial in form. But symmetrical design is not always identical design. Objects can have approximate symmetry as well. This is more prevalent than you might think and can be a great design tool. Here Carrie Cousins looks at different types of symmetry and how they can be used effectively.

Ivo Rangelov

2552

Design

Create Colorful Glossy Rating Stars

Follow this quick tip and learn how to create glossy rating stars. Diana Toma will add highlights with the help of the Blend Tool and an Art brush and this way she will obtain a pretty simple glossy look. Also, depending on the color palette of some websites she will try different variations of colors.

Ivo Rangelov

2102

Usability

SEO, HTML and Web Site Architecture

With hundreds of millions of users entering hundreds of billions of queries into major search engines such as Google, Yahoo and Bing, the importance of designing a site to be search-engine friendly cannot be underestimated. However, even the most experienced designers and developers can make simple mistakes that can cost their site thousands of views and (potentially) uncounted revenues.

Ivo Rangelov

1588

Explore the Articles