How to create a website from photoshop

A
Posted By
Adriaan
Jul 13, 2005
Views
513
Replies
9
Status
Closed
Hi All

Just wanted to know if someone could help me, i want to know how i can take my design and turn it into a website but the whole she-bang, not just export as a html file

How to Master Sharpening in Photoshop

Give your photos a professional finish with sharpening in Photoshop. Learn to enhance details, create contrast, and prepare your images for print, web, and social media.

O
Owamanga
Jul 13, 2005
On Wed, 13 Jul 2005 14:56:42 +0200, Adriaan wrote:

Hi All

Just wanted to know if someone could help me, i want to know how i can take my design and turn it into a website but the whole she-bang, not just export as a html file

Basically, No.

At some stage, exporting it to html, then adding some web logic (eg, click here takes you to this page etc) is going to be needed. Photoshop (in conjunction with image-ready) is a great tool to start from, but you’ll need to get your hands dirty with html at some stage.


Owamanga!
http://www.pbase.com/owamanga
K
Kingdom
Jul 13, 2005
Adriaan wrote in news:db334c$pb2$:

Hi All

Just wanted to know if someone could help me, i want to know how i can take my design and turn it into a website but the whole she-bang, not just export as a html file

You need to use layers for anything that changes like buttons, so you have a layer with the button not selected then a layer with the button in a lighter colour for selected.

Then pass the image to Image Ready, slice it with all the ‘selected’ button layers swithed off and save, then slice it with them all swiched on, saving to seperate directories.

That gives you all your roll over images you need and Image Ready will create the page html too.

It’s not an ideal way to build a website as any error in either your image or html can seriously messup the entire site, it’s also difficult to easily make small text changes and no radical shift from the design can be accomidated easiy also it makes the pages quite sizeable and slower to load.

I’d recomend you make the graphics you require in PS but use a standard HTML editor like dreamweaver to build the site


f=Ma well, nearly…
BW
Brain Weaver
Jul 13, 2005
Adriaan;
Preparing comps in Photoshop is fine, but I would advise against using it in a finale design because of bandwidth issues associated with large image files.
If you design a site using image files and you want the site to be spydered by Google, let’s say, remember that spiders cannot read image files. Thus the sites placement or page rankings will suffer deeply.

However that said, you can use whatever you want to design a site, but you really knew that anyway right?

Adriaan wrote in news:db334c$pb2$:

Hi All

Just wanted to know if someone could help me, i want to know how i can take my design and turn it into a website but the whole she-bang, not just export as a html file
KM
Kelly McCulloch
Jul 13, 2005
there is a programme that came with Computer Arts magazine a few issues ago that is a Photoshop plug-in.
Basically, you create your entire site in Photoshop, with every element in different layers, named with certain names specified by the programme, and then you run this plug in and hey presto you have a website!

I can’t remember the name off hand, but i’ll go have a look and get back to you. It was a full licensed version that came with the mag and if i still have it and you’d like to use it then i’ll send u a copy.

Kelly

"Brain Weaver" wrote in message
Adriaan;
Preparing comps in Photoshop is fine, but I would advise against using it in a finale design because of bandwidth issues associated with large image files.
If you design a site using image files and you want the site to be spydered by Google, let’s say, remember that spiders cannot read image files. Thus the sites placement or page rankings will suffer deeply.
However that said, you can use whatever you want to design a site, but you really knew that anyway right?

Adriaan wrote in news:db334c$pb2$:

Hi All

Just wanted to know if someone could help me, i want to know how i can take my design and turn it into a website but the whole she-bang, not just export as a html file
T
Tacit
Jul 14, 2005
In article <db334c$pb2$>,
Adriaan wrote:

Just wanted to know if someone could help me, i want to know how i can take my design and turn it into a website but the whole she-bang, not just export as a html file

Photoshop is not a Web page editor. It is an image editor. What you’re asking to do is about like asking to use it as a word processor.


Art, photography, shareware, polyamory, literature, kink: all at http://www.xeromag.com/franklin.html
K
Kingdom
Jul 14, 2005
Tacit wrote in server2.tampabay.rr.com:

In article <db334c$pb2$>,
Adriaan wrote:

Just wanted to know if someone could help me, i want to know how i can take my design and turn it into a website but the whole she-bang, not just export as a html file

Photoshop is not a Web page editor. It is an image editor. What you’re asking to do is about like asking to use it as a word processor.

Not so, PS can be used to produce very beautiful websites! Its just there are other consideration other than imaging.


f=Ma well, nearly…
K
Kingdom
Jul 14, 2005
Brain Weaver wrote in
news::

Adriaan;
Preparing comps in Photoshop is fine, but I would advise against
using it in a finale design because of bandwidth issues associated with large image files.
If you design a site using image files and you want the site to be
spydered by Google, let’s say, remember that spiders cannot read image files. Thus the sites placement or page rankings will suffer deeply.
However that said, you can use whatever you want to design a site,
but you really knew that anyway right?

Adriaan wrote in
news:db334c$pb2$:

Hi All

Just wanted to know if someone could help me, i want to know how i can take my design and turn it into a website but the whole she-bang, not just export as a html file

Image size and editability are the two big drawbacks. Search engines will happily index rollover links but not image text. May sights use the image slices as table background then use HTML text in the cell so the engine can access it however even doing it this way you are severly limiteds to the ‘size’ of the HTML content size as the cell cannot expand or the design is ruined. A major limiting factor. This type of sight only realy works for one thats very well planned and will not require updates but they can look very impresive, esspecialy if aimed at broadband users wher file size has less importance.


f=Ma well, nearly…
K
Kingdom
Jul 14, 2005
"Kelly McCulloch" wrote in
news:db41mp$k4s$:

there is a programme that came with Computer Arts magazine a few issues ago that is a Photoshop plug-in.
Basically, you create your entire site in Photoshop, with every element in different layers, named with certain names specified by the programme, and then you run this plug in and hey presto you have a website!

I can’t remember the name off hand, but i’ll go have a look and get back to you. It was a full licensed version that came with the mag and if i still have it and you’d like to use it then i’ll send u a copy.

Kelly

I would like to see how that plugin works, if you can locate it.
O
Owamanga
Jul 14, 2005
On Thu, 14 Jul 2005 03:53:24 GMT, Tacit wrote:

In article <db334c$pb2$>,
Adriaan wrote:

Just wanted to know if someone could help me, i want to know how i can take my design and turn it into a website but the whole she-bang, not just export as a html file

Photoshop is not a Web page editor. It is an image editor. What you’re asking to do is about like asking to use it as a word processor.

Good analogy, but let’s not throw out Photoshop as the perfect tool (together with image-ready) to design the layout and graphics of the entire page, then exporting certain bits and layers to provide the basis of a site.

More help for the OP:

Some bits need further work in Flash, some bits stay as cut graphics and the entire thing needs to be handed over to a web-development tool.

Image-ready will take the photoshop design and allow you to cut it up into slices (based on areas that are to remain graphics, areas that become links or buttons, areas that are to be text) and will actually create the starter html file for you.

This is exactly how monster templates and others do it. I’m not saying it’s easy – it isn’t. Start with photoshop, export with image-ready and finish with Dreamweaver or a good free editor is HTML-Kit.

HTML-Kit has been around since 1999, has hundreds of addons for download, database extensions, spell checker, color widgets, server-side scripting, embedded help for scripting languages and helpers for all aspects of web design. Switching between preview and source is a simple tab click.

For developers who want to mold the kit to their own requirements, full documentation and examples on how to build your own extensions into the development environment (in a number of different languages) are provided.

http://www.chami.com/html-kit/

and take a look at the plugins:

http://www.chami.com/html-kit/plugins


Owamanga!
http://www.pbase.com/owamanga

Must-have mockup pack for every graphic designer 🔥🔥🔥

Easy-to-use drag-n-drop Photoshop scene creator with more than 2800 items.

Related Discussion Topics

Nice and short text about related topics in discussion sections