The Ultimate Guide to Creating a Design and Converting it to HTML and CSS

Tutorial & e-learning. June 21, 2010 by Neit84.
The Ultimate Guide to Creating a Design and Converting it to HTML and CSS

The Ultimate Guide to Creating a Design and Converting it to HTML and CSS
AVC | English | 2:03:51 | 720x540 | 30.000 fps 451 Kbps | AAC 128 Kbps | 492 MB
Genre: Eleaning

Trilogy of "The Ultimate Guide to Creating a Design and Converting it to HTML and CSS" describes the development of a skeleton page in Fireworks, creating designs in Photoshop and slicing the template in HTML / CSS. The first two parts exist only in the format of the web of text and pictures. The third part - screencast. It appears that previously manufactured sliced PSD-template from Photoshop to JPG / GIF / PNG and coding HTML / CSS in (makintoshevskom) notebook.

Manufacturer: TutsPlus.com, Jeffrey Way
Language: English
Length: 2:03:51
Format: MPEG-4

1. Creating a skeleton Web page in Fireworks
1. Build a Promotional iPhone App Website Wireframe in Fireworks
Wireframing is a useful part of the website design process. It's great to separate out this planning stage and have your page positioning, spacing, layout, and other elements like text size and tone works out before you jump into Photoshop to add color, texture, images, and effects to polish off your design.
Fireworks is a great tool for creating a wireframe and while it doesn't work perfect with Photoshop, you can export over there and then build off your wireframe. We'll cover the design process of creating a wireframe for an iPhone application website in Fireworks. For those of you not familiar with this program, it will be a good jumping off point for using it to wireframe your web design projects. This is a first part of a multi-part series and will be fun!
2. Creating Web-page design in Photoshop
2. Create a Promotional iPhone App Site in Photoshop
In this tutorial, we'll be continuing this series on creating an iPhone app promotional site by taking our previous Fireworks constructed wireframe and adding color, texture, images, and effects to polish off this design in Photoshop. We'll use some interesting elements, like iPhone imagery and a stylish aurora vector background illustration. We'll finish up with a professional site design ready to get coded!
3. Sliced PSD-template from Photoshop to JPG / GIF / PNG and coding HTML / CSS in (makintoshevskom) Notebook
3. Converting Our Design to a Nicely Coded HTML and CSS Website
This screencast will serve as the final entry in a multi-part series across the TUTS sites which demonstrates how to build a beautiful home page for a fictional business. We learned how to create the wireframe on Vectortuts +; we added color, textures, and effects on Psdtuts +; now, we'll take our completed PSD and convert it into a nicely coded HTML and CSS website.
Note: Unfortunately, the source format Photoshop and Fireworks are available Tolna by subscription, get them so far failed. If anyone has - send, add in hand.

Video
Format: AVC
Bit rate: 451 Kbps
Width: 720 pixels
Height: 540 pixels
Frame rate: 30.000 fps
Audio
Format: AAC
Bit rate: 128 Kbps
Channel (s): 2 channels

Screenshot
The Ultimate Guide to Creating a Design and Converting it to HTML and CSS

Download File

Here you can download files online. Unlimited access to all sources file with one click direct download link!
Share

Comment