Index - Articles - DMXzone.COM

CSS

Master the New CSS Layout Properties

Laying out pages in CSS has always seemed a more complicated process than it needs to be. So here’s some great news: there are fresh specs that will make creating layouts a much simpler task for web designers. The major browsers, with the help of bodies such as the W3C, are starting to provide standards and implementations for a variety of new layout options that you can begin using today. For example, the W3C currently considers CSS3 Multicolumn Layout Module a Candidate Recommendation. Basically this means it’s at the point where the W3C is comfortable with browsers implementing it as a feature.

Ivo Rangelov

1742

Usability

Adobe Edge Web Fonts

If you have anything to do with the design industry, whether you are an outright typographer, designer, or even someone with a keen eye for all things that look beautiful, good looking words will never fail to impress your eyes. Keeping in sync with your affection for good typography, Adobe has come up with their own font library, Adobe Edge Web Fonts. For ages, calligraphy and typography have been treated as something that should not be overlooked — both in visual and aesthetic senses. In this digital age, you have fonts that deserve a special mention and have the power to attract (or repel) one’s attention.

Ivo Rangelov

1620

JavaScript

Vertical Showcase Slider with jQuery and CSS Transitions

In this tutorial Mary Lou will create a very simplistic and responsive product slider for an online store or a portfolio. The idea is to have different sections in a fullscreen view: the image or preview, a navigation and the description. When navigating through the items, she will slide the preview section and the section with the description in opposite directions.

Ivo Rangelov

2551

Design

Convert Web Page into a Responsive Website

Michael John Burns has shown us how to convert a PSD file to working HTML/CSS. Now, in this tutorial he will teach you how to make it Responsive by using Media Queries. Media Queries will change the look of the website depending on the screen resolution of the device: desktop to a mobile resolution by tweaking the CSS for a variety of viewports. By the end of this media queries tutorial you will learn how to convert any website into a responsive website.

Ivo Rangelov

27597

HTML5

5 HTML5 Tags for SEO

The advent of HTML5 has created a new set of opportunities for web developers and site architects. The new system has also forced those unfamiliar with its origins to reassess how they view their site design, especially when it comes to questions of search engine optimization. How will HTML5 interact with the current search engine spiders, such as Googlebot and Bing, and how will those crawlers evolve in this dynamic environment?

Ivo Rangelov

2004

Photoshop

Create a Bloody Text Effect in Photoshop

Text Effects are great opportunity to realize your creative aspiration, turning a text into an original and unique masterpiece, enriched with unusual forms, colors and shapes. Inscriptions made in different styles will be a good decoration and supplement to any design and context. In this tutorial Jan Stverak will show you how to create a bloody text effect using layer styles in Photoshop.

Ivo Rangelov

4173

CSS

3D Restaurant Menu Concept

Applying CSS 3D transforms to components can bring some more realism to normally flat web elements. Mary Lou has experimented with some simple concepts for restaurant websites and came up with a 3D folded menu (a real menu, not a “web” menu). The result is a restaurant website template where the menu will open by unfolding. Clicking the linked items will reveal a modal overlay which contains some more info. Since this flyer structure requires a decent amount of space, and, although she will make this responsive, she’ll add a media query for smaller screens where everything will fall back to a simplified stacked structure. The same will be applied for browsers that don’t support 3D transforms.

Ivo Rangelov

2315

CSS

Swishy CSS3 Navigation

CSS3 offers so many possibilities to create cool rollovers on website menus. Here’s a simple way to spice up your navigation with just a sprinkle of CSS magic. This technique takes your typical list based navigation and adds a nice rollover effect. Obviously this is only visible on modern browsers, but it fails very gracefully for the others. Dan Voyce explains how he created this effect.

Ivo Rangelov

1717

Tips & Tricks

Dashboard Design Elements for the Win

Dashboards or admin panels are the visual interface for your data, and the user interaction epicenter for your application. Designing and building dashboards has always stressed Patrick Cox. Mainly because you are dealing with dynamic content, a lot of data, a high level of interaction and you’re designing the main view that your user will probably be using the most. Admin areas are often neglected as well. Mainly because designers focused on the app itself and just simply forget that they have to provide thier users with a great UI to manage and view their data.

Ivo Rangelov

7000

Design

Code a Photoshop File to a Working Website

In this PSD to HTML tutorial you will learn how to code a page In Adobe Photoshop. Michael John Burns is not really into coding, more of a design person and this is his first coding tutorial. He will try his best to guide you through the whole thing. He will be coding this from scratch and by the end you will have an awesome and fully functional page layout.

Ivo Rangelov

3546

Explore the Articles