Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Sliced Template in Photoshop

Featured Replies

Hello i have made a template in photoshop and saved all the images ect but i wanna know how i can get that template from photoshop cs3 into a index.html and the same for the other pages.

 

Any help would be great thanks.

 

souNd B)

Hello, to do this you need knowledge of HTML & CSS, because you need to manually write the code, so it's valid and works cross-platform (on all browsers), read this post about learning website design before attempting to do it. There are hundreds of tutorials around the internet and if you have a grasp of CSS/HTML, then you'll be able to do it.

 

Just a warning, do not use a WYSIWYG editor to do the site, it will make you lazy and not teach you anything at all. Learn to code by hand straight away and you'll benefit from that more.

  • Author

Thanks traxor ill take a look at that then.

Never do it myself but you could always slice up your template using the slice tool and then clicking file, save for web.

 

Then hit save, when it asks the location you want to save as do so and at the bottom of that window lets you select what format you want to save it as. Click the drop menu and it will say 'HTML and Image'.

 

Selection of that will save your images in a 'image' folder and also make a HTML (index.html) for you, then from there its up to you.

 

Hope this helps :D

Why would you offere advice to someone and say you would never do it yourself? that makes no sense to me.

 

 

My advice is listen to traxor's advice as if you are interested in web design you should learn to be a web designer, rather than using something like photoshop to poorly cut up your site and make the code...this just causes a lot of issues and also means that you aren't really making a website you are just displaying a pretty picture on the web, and that just isn't web design.

Photoshop outputs dire, unflexible code (dire is my fave new word for the night, bear with me).

 

Coding by hand is the best way to learn, you'll get to know loads. Couple of templates later you'll be pretty good at html/css. At first it might be a bit tricky though.

 

P.S scott take note.. BEAR

Photoshop outputs dire, unflexible code (dire is my fave new word for the night, bear with me).

 

Coding by hand is the best way to learn, you'll get to know loads. Couple of templates later you'll be pretty good at html/css. At first it might be a bit tricky though.

 

P.S scott take note.. BEAR

 

:rofl: I can't help if I'm a bit of a pedant when it comes to those sort of things! :unknw:

 

Oh, and it's Scott lol. Capitalisation. Read the quote in my signature... :pp

 

I happen to think I've been rather good in ignoring the blatant disregard for spellingz ere on dis foram like :)

 

But that's a post for a different topic :D

Oh, and it's Scott lol. Capitalisation. Read the quote in my signature... :pp

 

GAH! so obvious too :rolleyes:

 

I'm terrible at grammar, i don't dispute that. I'll learn... slowly... for you scott ;)

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.