Quite often web designers use several Photoshop layers to represent one entire image. However, web developer usually wants to represent this image with only one physical file.
Let's see how automated psd to html/css conversion will work out in such case. By default, separate image file will be created for each Photoshop image layer. Obviously, it will have a negative effect on the resulting html markup:
- a lot of images will be created,
- size of the web page will increase, and hence the loading time will also increase,
- html code will become less readable
It's very simple to deal with this problem, though. You can use one of two non-destructive techniques, described below:
- Create new Layer Group and put there all layers that correspond to the image. Mark that group with the $merge$ tag. In the process of automated PSD to HTML conversion this group will be merged into one layer.
- Another way is to convert these layers into a single Smart Object. Select desired layers in the Layers palette and launch "Layer" -> "Smart Objects" -> "Convert to Smart Object" command.
Such approach will lead to the better quality of automated psd to html conversion. Moreover, you will find that structure of your PSD templates become much better, easy to understand and work with.
Today automatic PSD to HTML conversion service was moved to the new more powerful server. Now conversion of PSD template to HTML/CSS markup is performed 10-15 times faster then before.
Also the limitation on the maximum PSD file upload size was changed. Now we allow PSD files of size up to 40Mb. Presumably, after the thorough testing we will allow to upload PSD files of even bigger size.
Furthermore, quite soon the new website design will be published and the service will be fully revised.
For the period of Christmas and New Year holidays we are setting the 50% discounts for all - for single page PSD to HTML conversions, for packages of PSD to CSS conversions, for unlimited PSD to XHTML conversion subscriptions!
Discounts are only available till 7-Jan!
A lot of us get used to write from the left to the right. So it is accepted in English, Russian and a lot of other languages. But there are a lot of languages (like Arabian or Hebrew) in which LTR writing system is used. HTML and CSS provide support for both LTR and RTL writing system.
HTML provides a special attribute dir, that accepts two values:
- ltr - for the left to right writing system
- rtl - for the right to left writing system
However, using "dir" attribute is not welcomed because it is responsible for the appearance of the document, not for its structure. But cascading style sheets should be used to describe appearance.
In CSS there is a "direction" property that is responsible for:
- how the text is rendered in the block;
- position of the scroll bar in the blog;
- order of columns in the table;
- position of the orphan line in the text block with text-align: justify.
Psd to Css Online service now supports conversion of design templates with RTL text direction. We added an additional option for that on the PSD file upload page. Choose the text direction you need on your web page and then upload your PSD design. Psd to Html software will make all the work for you.
You can now upload files on the Psd to CSS Converter web site faster. We now allow you to upload a zip archive with a Psd design template inside. Psd files compress quite well. That allows you to save Internet traffic and reduce a time taken by file upload on the Psd to Html conversion server.
Limitation on the size of uncompressed PSD file remains the same - 30Mb. Moreover, zip archive must contain only one PSD file.
We reworked the scheme of payment and made in much more flexible. Now, besides buying single PSD to CSS conversion you can buy subscription on unlimited use of the design to HTML conversion service and create as many web pages as you need to!
You can buy unlimited subscription to use the PSD to XHTML conversion service for one or several days. Right after you buy the subscription the countdown timer starts. Time to the end of subscription will be shown in the information window on the Online Profile page. If you have an active subscription and buy another one, then time of the new subscription will be added to the remaining time of the old subscription.
Experiment with the design template as long as you want - change layers ordering and groupping, add "tags", etc. Do as many PSD to HTML conversions as you need to.
Please, note that:
- You can also buy a one-day subscription during the conversion process, after a PSD file's upload and conversion.
- You can view history of all payments at the payments history page.
- If you think that having several conversions, which will never expire, is more convenient that having unlimited subscripton for the limited time, please consider buying just several conversions.
One day of unlimited use subscription cost only $10 (US dollars). So, you can now create a multiple page web site almost for free!
A lot of time has gone since the first publication of the video guide about the service of automatic Psd to XHTML Conversion. Since that time service has changed dramatically and old video became irrelevant. That's why we are updating the video tutorial which shows how easy it is to use the service of automated PSD to CSS conversion.
Service of automatic PSD to HTML and CSS conversion has got a new feature that has been demanded by our customers for quite a long time. We implemented the progress bar for the PSD file upload and its conversion process. First, the customer will see a progress bar of the process of file upload to the server. Then, another progress bar will appear and show the PSD to HTML conversion progress. That's much more convenient than waiting for several minutes in front of the "Please wait, file conversion is in progress" sign on the display.
Along with this a rare problem was fixed: conversion process might hang if user uploaded a file that needed a long time to get converted (more tham 5 minutes). The "Please wait" window continued to be shown to the user forever. Redirect to result page was not performed.
Moreover, the page with conversion results was significantly reworked. A very useful new feature was added. If you uploaded a PSD file, were redirected to the conversion result page and decided to download the HTML markup, but noticed that you are not logged in - that's not a problem anymore. You can log in right on this page. If there are conversion available on your account then you will be offered to use them. Even you have no bought conversions it is better to log in - remember, that with each conversion you earn a progressive discount!
Those, who are using automatic Psd to Html conversion service for a long time have already noted that Photoshop text layers are now converted into HTML text in a different way. In the past, text style of the first letter of a Photoshop text layer was used for all the converted layer's text. Now, all the text styles are extracted form the Photoshop text layer. Thus, you do not need anymore to divide your text layers into text layers with similar text style. Creating web sites has become easier.
Moreover, all the underlined texts are now converted into XHTML hyperlinks automatically by PSD to CSS conversion service. So, if you would like your text to be converted into a hyperlink you should mark it with a $link$ tag only in case your text has not underlined style. However, if you don't want your underlined text to be converted into a link you can simply mark such a text layer with a $nolink$ tag.
Automatic PSD to CSS conversion service has got a new feature. Now, not only screenshot of the converted web site is available for preview, but you can also check out resulting HTML web layout! So, besides reviewing the visual result of PSD to HTML conversion you will be able to evaluate HTML layout itself. It will help you to avoid such situations as:
- Text layer was converted into image. This usually happens because text layer uses font that is not standard for web, i.e. such a font that most probably is not installed on the computer of a person who is going to view your web site. Change the layer's font to the standard one, like: Arial, Verdana, Tahoma, Times New Roman, Georgia, Palatino Linotype, Helvetica. After that CSS layout will contain text, not an image.
- Layers are grouped in a way you do not like. If layers in the PSD template are not grouped enough then PSD to HTML service tries to automatically group layers into rows and columns. Sometimes it may be done in a wrong way. To avoid it we recommend to group layers in PSD template logically. Tend to create layer groups for header, footer, main content and other rows and columns of elements. Also, never divide all layers into group of all texts and group of all images. It will help PSD to CSS conversion service to divide template into proper div blocks.
After uploading your PSD template evaluate the conversion result. If something has gone in a wrong way then update your PSD design properly an upload it again. Proceed with payment only if conversion result satisfies you. We hope this new feature of PSD to HTML service will help you to get better conversion results. Now, to create a web site is very easy and is almost free!
We are always open for your suggestions and observations. Feel free to contact us through the contact form or via support email address which is also published on the contacts page.