Jump to content
Fi8sVrs

More PSD To HTML Tutorials

Recommended Posts

  • Active Members
Posted (edited)

How to Code a Grunge Web Design from Scratch

In this step-by-step web development tutorial, you will learn how to convert a beautiful and eye-grabbing grunge theme web layout–created from Photoshop in a previous tutorial–into a working HTML and CSS template.

31-02_grunge_xhtml_preview.jpg

PSD to HTML Tutorial Link

Converting a Design From PSD to HTML

Author will take you through the process step by step – even through the tedious parts.

sc_completeWebsiteMarkup.jpg

PSD to HTML Tutorial Link

Portfolio Layout #10: Learn To Code It

In this tutorial author will explain the steps to take in slicing and coding the layout.

step4.jpg

PSD to HTML Tutorial Link

Design and Code a Slick Website From Scratch – Part II

We will code our design into a standards-compliant, cross-browser xHTML, CSS, and JavaScript/jQuery layout. Fire up Coda, or your editor of choice… it’s coding time!

1.jpg

PSD to HTML Tutorial Link

Portfolio Layout 4: The Code

In this tutorial author will show you the code behind my portfolio layout #4.

step3.jpg

PSD to HTML Tutorial Link

Code a Corporate Website from a Photoshop Design: PSD to HTML Tutorial

In this tutorial we will walk through the process of coding that design in HTML and CSS.

1-full.jpg

PSD to HTML Tutorial Link

From PSD to HTML, Building a Set of Website Designs Step by Step

Author is going to take you through my entire process of getting from Photoshop to completed HTML.

2_large.jpg

PSD to HTML Tutorial Link

Coding a Clean & Illustrative Web Design from Scratch

In this comprehensive and step-by-step web development tutorial, you will learn how to convert a Photoshop mockup of a professional web layout design that features an illustrative landscape header into a standards-compliant XHTML/CSS template.

04-02_code_clean_illustrative_preview.jpg

PSD to HTML Tutorial Link

How to Create a Dark and Sleek Web Design from Photoshop

In this web development tutorial, you will learn, step-by-step, how to create a beautiful dark and sleek web layout using standards-based HTML and CSS. Along the way, you will witness how to use CSS Sprites and CSS Text Image Replacement.

10-20_final.jpg

PSD to HTML Tutorial Link

Create a Killer Band Site with Drupal: A 6-part Tutorial Series

In this tutorial series they sliced up graphics. Now author is going to take those graphics and move on to coding the XHTML and Cascading Style Sheets.

22_iconimage.jpg

PSD to HTML Tutorial Link

Tutorial: Coding a Layout

This tutorial should help you learn how to analyze either a new template, or even your current layout to find the best way to code it.

26.jpg

PSD to HTML Tutorial Link

How to Code up a Web Design from PSD to HTML

Take the design to the next step and code up a complete mockup in HTML and CSS, ensuring our code is semantic and standards compliant.

concept.jpg

PSD to HTML Tutorial Link

Converting a Photoshop Mockup: Part Two, Episode One

Start the conversion process of an Adobe Photoshop mockup of a website, into a real live CSS based website.

css.jpg

PSD to HTML Tutorial Link

How To Create a Horizontally Scrolling Site

Learn how to code/create a Horizontally scrolling website design instead of normal Vertical scrolling web site design.

horzscrolling.jpg

PSD to HTML Tutorial Link

Building a Website (2 of 3): HTML/CSS Conversion

Much of the work isn’t actually “slicing” the Photoshop file, but looking closely at it and trying to mimic what is done there with correct markup and CSS techniques.

html.jpg

PSD to HTML Tutorial Link

How to Convert a PSD to XHTML

Screencast that shows you exactly how to convert a PSD into perfect XHTML/CSS.

someEvent2009_HOMEPAGE.jpg

PSD to HTML Tutorial Link

PSD To HTML

We’ll be converting our PSD into a one page working CSS template.

step7.jpg

PSD to HTML Tutorial Link

Sursa

Edited by Fi8sVrs
Converting a Photoshop Mockup: Part Two, Episode One

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.



×
×
  • Create New...