Posts Tagged ‘Designstudio’

vom: 20.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , , , , , , , , , ,
Comments Closed

Create a Sleek, Corporate Web Design (HD Video Series: Day 4)

Der Artikel “Create a Sleek, Corporate Web Design (HD Video Series: Day 4)” wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

In this video series, we’re going to walk you through how to create a sleek, professional web design for a corporate website. This is part 4 of a 4 part series – we’ll also be finishing the support pages and coding the entire thing in HTML/CSS! About this Tutorial Series Adi Purdila is going to walk us through an entire project – from design to coding – all here on Webdesigntuts this week! In Day 1 , he showed us how to set the basic framework for the design as well as how to actually lay out the homepage. In Day 2 , he showed us how to create the various support pages (contact, gallery, etc.). In Day 3 , he began the coding process by showing us how to convert the entire Photoshop design to a fully working HTML/CSS site. Today is Day 4, so we’ll be finishing up the project and adding the final polish! Just to give you a general roadmap for the coding, here’s the basic outline of what we’ll be doing over these final 2 days: Day 3, Part1: Creating the markup for the homepage Day 3, Part2: Slicing the PSD and writing the CSS file (i divided this into Hour1 and Hour2) Day 3, Part3: (cont.) Slicing the PSD and writing the CSS file (I divided this into Hour1 and Hour2) Day 4, Part1: Slider installation, customization and some very basic jQuery functions Day 4, Part2: Creating and styling the secondary pages (Services, Gallery and Contact) + browser checking Also, I’d like to share some links for some of the resources I’ll be using today: Slider plugin: http://www.gmarwaha.com/jquery/jcarousellite/ Cufon: http://cufon.shoqolate.com/generate/ CSS Browser Selector (for making styles for different browsers in the same CSS file): http://rafael.adm.br/css_browser_selector/ Reset CSS: http://meyerweb.com/eric/tools/css/reset/ Let’s get started! Day Four: PSD to HTML Conversion In this next series of videos, Adi is going to walk through the conversion process from PSD to HTML/CSS.

vom: 20.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , ,
Comments Closed

The 1140 CSS Grid 12 Columns Fluid Down to Mobile

Der Artikel “The 1140 CSS Grid 12 Columns Fluid Down to Mobile” wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

The 1140 grid fits perfectly into a 1280 monitor. On smaller monitors it becomes fluid and adapts to the width of the browser. Beyond a certain point it uses media queries to serve up a mobile version, which essentially stacks all the columns on top of each other so the flow of information still makes sense. Scrap 1024! Design once at 1140 for 1280, and with very little extra work, it will adapt itself to work on just about any monitor, even mobile

vom: 19.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , ,
Comments Closed

Apprise: Attractive Alert and Dialog Box for jQuery

Der Artikel “Apprise: Attractive Alert and Dialog Box for jQuery” wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

Apprise is an alert alternative for jQuery that looks good. Apprise is a very simple, fast, attractive, and unobtrusive way to communicate with your users. Also, this gives you complete control over style, content, position, and functionality. Apprise is, more or less, for the developer who wants an attractive alert or dialog box without having to download a massive UI framework. It has been tested on Chrome 8.0+, Firefox 3.0+, Safari 4.0+, Internet Explorer 9.0

vom: 16.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , , , , , , , , , ,
Comments Closed

How to Create a Modern Ribbon Banner Navigation Bar with Pure HTML/CSS3

Der Artikel “How to Create a Modern Ribbon Banner Navigation Bar with Pure HTML/CSS3″ wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

As CSS3 becomes more robust and is more widely supported, the options for fun modern design elements that can be created without graphics are virtually limitless! For a recent project, I decided to see if I could create a centered ribbon banner with pure CSS3. This tutorial will walk you through how it was done. As it turns out, it’s actually quite easy, using only simple, semantic HTML and some CSS3 trickery thanks to the magic of the the border-width property. The only caveat: As with all new CSS3 techniques, it can act a bit wonky in some IE browsers… we’ll address that at the end of the tutorial. Here’s how: Step 01: The Navigation Links We want to create a navigation link bar, so we’re going to begin with a simple unordered list [ul] with links inside [a].

vom: 16.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , , ,
Comments Closed

Sliding Boxes and Captions with Mosaic jQuery Plugin

Der Artikel “Sliding Boxes and Captions with Mosaic jQuery Plugin” wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

Mosaic jQuery Plugin automatically generates sliding boxes & captions. It allows slide & fade animations with custom directions. It preloads images within boxes. It is very lightweight at ~2kb (minified). Implementation is fairly easy, they have provided a number of sample configurations in the downloadable file

vom: 15.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , , , , ,
Comments Closed

Reader’s Poll! How Do You Code Designs Into HTML/CSS?

Der Artikel “Reader’s Poll! How Do You Code Designs Into HTML/CSS?” wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

We recently made the big announcement that we’ll be publishing PSD > HTML tutorials here on Webdesigntuts, which has prompted a bit of debate over most web designers are coding nowadays. There are actually a wide number of options that any web designer/developer has to pick from: Dreamweaver, Coda, and Notepad++ are just a few of the options… The Poll: How Do You Code Designs Into HTML/CSS? Before we dive into the poll and discussion, let’s get one thing straight: This isn’t about the right way to code, it’s about what works for you. What we’re specifically asking is how you get it done on a daily basis.

vom: 15.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , , , , , ,
Comments Closed

Pixel Perfection When Rotating, Pasting And Nudging In Photoshop

Der Artikel “Pixel Perfection When Rotating, Pasting And Nudging In Photoshop” wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

? ? When creating Web and app interfaces, most designers slave over every single pixel, making sure it’s got exactly the right color, texture and position. If you’re not careful, though, some common functions like moving, rotating and pasting can undo your hard work, resulting in a blurry mess. But with some small changes to your workflow, you should be able to maintain the highest-quality artwork from the start to the end of the project. Pixel-Perfect Rotation If you’re not careful, rotating layers in Photoshop can damage them in a very noticeable, pixel-mashing way

vom: 13.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , , , , , ,
Comments Closed

Create a Sleek, Corporate Web Design (HD Video Series: Day 2)

Der Artikel “Create a Sleek, Corporate Web Design (HD Video Series: Day 2)” wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

In this video series, we’re going to walk you through how to create a sleek, professional web design for a corporate website. This is part 2 of a 3 part series – we’ll also be finishing the support pages and coding the entire thing in HTML/CSS! About this Tutorial Series Adi Purdila is going to walk us through an entire project – from design to coding – all here on Webdesigntuts this week! In Day 1 , he showed us how to set the basic framework for the design as well as how to actually lay out the homepage. In Day 2, he’ll show us how to create the various support pages (contact, gallery, etc.). In Day 3, he’ll be showing us how to convert the entire Photoshop design to a fully working HTML/CSS site

vom: 13.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , , , , ,
Comments Closed

Create a Sleek, Corporate Web Design (HD Video Series: Day 2)

Der Artikel “Create a Sleek, Corporate Web Design (HD Video Series: Day 2)” wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

In this video series, we’re going to walk you through how to create a sleek, professional web design for a corporate website. This is part 2 of a 3 part series – we’ll also be finishing the support pages and coding the entire thing in HTML/CSS! About this Tutorial Series Adi Purdila is going to walk us through an entire project – from design to coding – all here on Webdesigntuts this week! In Day 1 , he showed us how to set the basic framework for the design as well as how to actually lay out the homepage. In Day 2, he’ll show us how to create the various support pages (contact, gallery, etc.).

vom: 13.4.11
Abgelegt in: Partner-News
Schlagwörter: , , , , , , , , , , , , , , , ,
Comments Closed

Create a Sleek Corporate Web Design (HD Video Series: Day 1)

Der Artikel “Create a Sleek Corporate Web Design (HD Video Series: Day 1)” wird bereitgestellt von:
artViper designstudio – new projects and products in AJAX, mySQL, PHP and Flash

In this video series, we’re going to walk you through how to create a sleek, professional web design for a corporate website. This is part 1 of a 3 part series – we’ll also be finishing the support pages and coding the entire thing in HTML/CSS! About this Tutorial Series Adrian Purdilla is going to walk us through an entire project – from design to coding – all here on Webdesigntuts this week! In Day 1, he’ll show us how to set the basic framework for the design as well as how to actually lay out the homepage. In Day 2, he’ll show us how to create the various support pages (contact, gallery, etc.). In Day 3, he’ll be showing us how to convert the entire Photoshop design to a fully working HTML/CSS site. Let’s get started! Day One: Creating the Homepage Design In this first series of videos (about 2 hours total), Adrian is going to walk through the homepage design in Photoshop.