1001+ Photoshop Website Layout Tutorials

1001+ Photoshop Website Layout Tutorials

page 1 | 2 | 3 | 4 | 5 |

189 tutorials in database (8 pages)

Sorted by: Views | Date

New Search | All Categories

Links on page 5 | 10 | 25 | 50

1. Metal Orb

by iamvica (1 tutorial)

Jun-7-2003

This tutorial will teach you how to design a metal orb as well as a LCD screen. You will learn about things such as creating reflections and making metal textures for your interfaces/skins.

2. Simple Layout

by stealthdesignz (48 tutorials)

Jan-26-2005

This is a fairly difficult tutorial and expects you to know the basics of photoshop as every step is not explained in great amounts of detail.

3. Interface

by psgallery (6 tutorials)

Nov-29-2003

This tutorial will show you how to make the basic interface objects as seen on the Omega Designs.

4. Web Interface Design 2

by bluesfear (30 tutorials)

Mar-18-2003

A walk-through on the creation of an interface.

5. Glass Tube

by bluesfear (30 tutorials)

Aug-5-2003

Design a glass tube with rounded edges.

6. Modern Web Design Style

by pegaweb (30 tutorials)

Jun-21-2003

For this tutorial, I'm taking a temporary departure from realistic lighting, smooth bevelling, metallic effects, and soft shadows. Welcome to a world of sans-serif fonts, monocoloured areas, objects that don't cast shadows, colours that don't contrast, and text saved as picture files.
Modern-style web design, also known as the "Microsoft style" has become the most common form of web design these days. It presents web page elements not as realistic images, but as neatly arranged diagrams.
This tutorial goes through the steps to making a website in this style.

7. Web Interface Design

by bluesfear (30 tutorials)

Mar-19-2003

Here you will be taught how to make a web interface that is transparent. This design requires that you use an image as your webpages background.

8. A Slicing Tutorial

by devclever (14 tutorials)

Aug-2-2005

Here, we will take a glossy layout, and slice it with auto expanding content boxes using Dreamweaver.

9. Gel Tab Navigation Design

by my-photoshop (12 tutorials)

Jan-16-2006

A tab navigation system makes it extremely easy to get around a website. This tutorial is extremely easy, ending with a very clean tabbed navigation bar that you can add to any existing or yet-to-be website layout. The only thing which you have to have is the Mac OSX layer style, which you can download from this tutorial site.

10. 100 Percent Layout

by zymic (25 tutorials)

Jan-23-2005

Create an effective 3 column web layout using Photoshop and Macromedia Dreamweaver. Learn how to create the main header in Photoshop and the code the rest of the layout manually without the use of slicing in Dreamweaver.
Slicing a web page usually isn't a great idea unless it's really simple. Slicing produces far too much code and images you do not need... and not to mention it can get pretty hard to work with.
Making a layout following this tutorial without slicing will show you how to code so your web page fills 100% width of the page and also the actual content can fit in unlimited amounts of space without the layout messing up (usually like when people try to slice and then try and fit content in.. it messes up when there is too much content).

11. Website Creation

by webpages (1 tutorial)

Jul-17-2004

This lengthy tutorial is broken into sections. The first section deals with banner creation. The second section is about slicing that banner in ImageReady. The last section shows how to add that to a website.

12. LCD Interfaces

by biorust (119 tutorials)

May-3-2003

LCDs are undoubtedly the most commonly-used type of interface in modern consumer electronics. Understandably, therefore, they are also used extensively in skins, websites, consumer graphics, etc. Recreating a realistic LCD-type display is, however, a little harder than it looks and takes quite a while to get right. The aim of this tutorial is to detail my method for designing the most '3-dimensional' display possible, whilst keeping the complexity down to a minimum. I'll also spend a considerable amount of time explaining my processes and how you can personalize them to your own design.

13. Coded Box

by pbkill (2 tutorials)

Dec-20-2005

First we are going to start off by making the box. Keep in mind this tutorial will not give you every color used. We want you to add your own artistic touch to this content box. PSD file is included.

14. Full Gaming Template

by photoshopnerds (59 tutorials)

Nov-17-2005

In this tutorial we will see how we can use Photoshop effectively to create a Gaming Template. The techniques which are used in this tutorials are very easy to follow.

15. Rock Cafe Website

by designtutorials (78 tutorials)

Dec-16-2005

If you have to make a website for a friend or for a customer you try to keep it clean and simple. This tutorial will teach you to make a clean website for a rock caffe. Many people think that this is somehow hard, because it`s about rock. You just have to find pictures related with the theme and pick an appropriate design.

16. Splat Website Layout

by pegaweb (30 tutorials)

Aug-12-2004

By using a few gradients, and applying the wave filter, it's possible to make this simple website layout.

17. Interface Wires

by hateralligator (5 tutorials)

Feb-27-2004

So you want to make wires for your web page interface? They look really nice when used right. Whether it be for a banner, or to connect images on your layout, wires can be very effective and look very nice.

18. Hi Tech Interface

by tutorialwiz (99 tutorials)

Jan-15-2005

This tutorial will show you step by step how to create a nice looking hi-tech interface. You can use it for your website or software. This is a fairly long tutorial, that is because I break it into step by step so even beginners will be able to get good results.

19. Dripping Slime

by phong (12 tutorials)

Aug-17-2002

Use this tutorial to create rust, slime, or blood dripping from holes, pipes, or text.

20. A Glossy Layout

by devclever (14 tutorials)

Jul-16-2005

Learn how to create this web page layout with gradients and glossy buttons.

21. Full Business Template Design

by photoshopnerds (59 tutorials)

Nov-21-2005

This tutorial illustrates the basic steps to create a business template.

22. Sunlight Web Design

by pegaweb (30 tutorials)

Nov-5-2003

By using some Clouds, Noise, a few adjustment layers, and some ornaments, this tutorial demonstrates how to create a website with a very nice, sparkling, sepia effect. Tutorial requires Photoshop 6.0, 7.0 or above.

23. Website Design

by photoshopsupport (110 tutorials)

Feb-6-2005

Many people new to web design are confused by slices and Javascript rollovers and end up abandoning their projects out of frustration. The point of this Photoshop web tutorial is to keep things simple by creating a web page that uses only 2 graphics.

24. Smooth Navigation

by thedesignworld (42 tutorials)

Jun-28-2005

Smooth navigation to use for business/corporate designs. Learn how to create this navigation from scratch.

25. Clean Web Design Interface

by depiction (67 tutorials)

Jan-3-2005

Learn how to create a simplisitc but effective contemporary design. Many website designs created in Photoshop are overdone, in the sense that pages become cluttered with information and complex design aspects that make a design busy. In this tutorial you will learn how to create a simplistic but effective design.

back to top

189 tutorials in database (8 pages)

Sorted by: Views | Date

New Search | All Categories

Links on page 5 | 10 | 25 | 50

1001+ Photoshop Website Layout Tutorials

page 1 | 2 | 3 | 4 | 5 |

Previous

Next