12 Replies Latest reply on Nov 3, 2009 12:36 AM by liedzeit

    Developing InDesign docs for both print and web

    BrianMcM

      I develop InDesign documents for offset printing but now the organisation wants to drag itself into the 21st century by also putting these same documents up on the web (as interactive web pages that respond to user input). I am looking for a broad outline of the best way to tackle this, just so that I don't waste too much time trying to learn the wrong technology or the wrong software.

       

      I have started to tag my documents with XML, so I am thinking that the route to the web is from InDesign to XML then via XSLT or CSS to XHTML. Is that the best and/or only way to do it? I assume DreamWeaver will also feature in the equation at some point.

       

      These documents are test questions. They are pretty simple. All the paras will have para styles but there will be some overrides of the font like bold, italic, underline, subscript, superscript. Presumably these all need to be tagged with XML, perhaps using character styles? There are lots of inline graphics (ai and psd files) that will have to be converted to png, I guess. I also have attached metadata via XML attributes and I want that metadata to get to the web page and help direct the action based on user input (like which answer they give to a question).

       

      Since I have always worked on print documents, I don't know XSLT, CSS, XHTML or even HTML so I just want to get started on the right foot.

       

      Any suggestions welcome, including perhaps good tutorials or other resources. And obviously I want to automate this process as much as possible using scripts.

       

      Thanks,

       

      Brian

        • 1. Re: Developing InDesign docs for both print and web
          Kasyan Servetsky Level 5

          Hi Brian,

           

          I wanted to do the same at my work, but my boss didn’t allow me this. So, I have a general idea about how to do it, but have no chance to implement it into a working solution. In my opinion you answered correctly to your own questions and you are on the right track.

          As to tutorials and resources, I couldn't find much information on the subject so far.

          The best tutorial I know about is in this book:

          http://www.amazon.com/Designers-Guide-Adobe-InDesign-XML/dp/0321503554

          (Chapters 9-11)

           

          See also this tutorial:

          http://indesignsecrets.com/how-to-export-basic-html-out-of-cs2.php

           

          All the paras will have para styles but there will be some overrides of the font like bold, italic, underline, subscript, superscript. Presumably these all need to be tagged with XML, perhaps using character styles?

          There are a couple of ready to use scripts that do this — you can run such a script and then Map Styles to Tags.

           

          There are lots of inline graphics...

          That's good — inline graphics are better then stand alone ones for XML export.

           

          I don't know XSLT, CSS, XHTML or even HTML so I just want to get started on the right foot.

          The above mentioned book gives you basics on all these topics, but it's not enough — you'll need a good book on Dreamweaver as well. I'd recommend you Dreamweaver CS3 The Missing Manual Series.

           

          Kasyan

          1 person found this helpful
          • 2. Re: Developing InDesign docs for both print and web
            Jeremy bowmangraphics-DQuh1B Level 3

            I create InDesign catalogs from XML files to print. To get these catalogs online, I use a combination of XSLT and CSS rather than exporting from InDesign. The basic idea is that the XSLT transforms the XML into HTML. In doing so, it adds a link to a CSS stylesheet, which styles it in appropriate ways for screen rather than print.

             

            Jeremy

             

            EDIT: By the way, although I use Dreamweaver quite a bit to manage websites, I don't think I ever used it for the above purpose. In my experience, the least bad procedure is:

             

            Tinker with the XSLT and the CSS in a text editor, then look at it in a browser.

            Tinker with the XSLT and the CSS some more in a text editor, then look at it in a browser.

            Tinker with the XSLT and the CSS some more in a text editor, then look at it in a browser.
            Tinker with the XSLT and the CSS some more in a text editor, then look at it in a browser.
            (etc., etc.)
            1 person found this helpful
            • 3. Re: Developing InDesign docs for both print and web
              BrianMcM Level 1

              Thank you Kasyan and Jeremy. This is obviously a big project for me but the moral support really helps. I will just have to ready and experiment a lot.

               

              Brian

              • 4. Re: Developing InDesign docs for both print and webH
                BrianMcM Level 1

                Hi, Kasyan.

                 

                I have taken your advice and have purchased the Designer's Guide to InDesign and XML from Adobe Press. (I have also had a look at InCopySecrets.com.)

                 

                I have not had much success yet but hopefully this info will get me going.

                 

                Thanks.

                 

                Brian

                • 5. Re: Developing InDesign docs for both print and webH
                  Kasyan Servetsky Level 5

                  Hi Brian,

                   

                   

                  Just buying a book doesn't give you the knowledge. It takes time and effort to master it. I've read it from the first to the last page, sometimes rereading some chapters. In the end, I was able to transform an ID file into a web page in a few seconds. Most of the manual process, described in the book, can be automated.

                  This book is not perfect: it contains numerous typos and examples were created on Mac, so some of them don't work on Windows version of ID and I had to spend some time to make them compatible with it. Nevertheless, it's the best book I know about on the subject.

                   

                  I wanted to redesign our site — it must be the ugliest one in the whole internet: www.business.ua — and after spending so much time on this book, my boss told me: "Don't tell anybody that you can do this." I wish you success and envy you: you have such an interesting project to work on.

                   

                   

                  Kasyan

                  • 6. Re: Developing InDesign docs for both print and webH
                    BrianMcM Level 1

                    Hi, Kasyan.

                     

                    Thanks for the heads-up about the Designer's Guide to InDesign and XML. I am an editor myself, so I will be on the lookout for typos.

                     

                    I have been working with XML in InDesign for the past few months, but only with very simple XML structures. I know how XML works in ID and in the ID object model (JavaScript) so this book should pull it all together for me. This may be the only book on the subject, so thanks again for letting me know about it.

                     

                    The bridge I have not crossed yet is outputting an ID file to XML and simultaneously processing it with an XSL file. I also recently purchased XSLT 2nd Edition by Doug Tidwell (O'Reilly publishers), all 965 pages of it. I have been trying to get the Hello World example to work. I have an ID doc that is tagged as follows: <Root><greeting>Hello, World!</greeting></Root>.

                     

                    Based on instructions in the book, I created an XSL file as follows:

                     

                    <?xml version="1.0"?>
                    <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
                        <xsl:output method="html"/>
                        <xsl:template match="/Root/">
                            <xsl:apply-templates select="greeting"/>
                        </xsl:template>
                        <xsl:template match="greeting">
                            <html>
                                <body>
                                    <h1>
                                        <xsl:value-of select="."/>
                                    </h1>
                                </body>
                            </html>
                        </xsl:template>
                    </xsl:stylesheet>

                     

                    I export the ID file to XML (with an HTML extension) and the XSL transformation is supposed to produce an HTML file with "Hello, World!" as an <h1> heading. I get an HTML file, but the contents is just <Root><greeting>Hello, World!</greeting></Root>, which is what I get without including the XSL file.

                     

                    I had a look at your website. There is a lot there, but unfortunately I can't understand it, I have told everybody at work about all the amazing things that scripting and XML can do but sometimes I also wonder if I should have kept quiet and just used it for my own work. When you tell people you can perform miracles they just want more and more miracles without knowing how hard it was to get the first miracle to happen.

                     

                    Brian

                    • 7. Re: Developing InDesign docs for both print and webH
                      Kasyan Servetsky Level 5

                      Hi Brian,

                       

                       

                      I can't tell you anything concerning the Hello World example right now — I need to read the book first.

                       

                      Designer's Guide to InDesign and XML has examples and explanation of using XSL transformations (starting on page 287). These examples show you how to do this while importing/exporting an XML file to/from InDesign.

                       

                       

                      Kasyan

                      • 8. Re: Developing InDesign docs for both print and webH
                        Jeremy bowmangraphics-DQuh1B Level 3

                        For what it's worth, I would use the following XSLT to perform that task:

                         

                         

                        <?xml version="1.0" encoding="UTF-8"?>

                        <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

                        <xsl:output method="html" />

                        <xsl:template match="/">

                        <html>

                        <body>

                        <h1>

                        <xsl:value-of select="/Root/greeting"/>

                        </h1>

                        </body>

                        </html>

                        </xsl:template>

                        </xsl:stylesheet>

                         

                         

                        To test this in a browser, make sure you change the exported file's extension from 'xml' to 'html'.

                         

                         

                        Also, make sure your original InDesign document has the correct structure:

                         

                        Screen shot 2009-10-30 at 09.33.39.png

                         

                        Jeremy

                        • 9. Re: Developing InDesign docs for both print and webH
                          BrianMcM Level 1

                          Hi, Kasyan and Jeremy.

                           

                          Jeremy, thanks for the help. I edited my xsl file as you suggested and the transformation worked!

                           

                          This is my first xsl transformation so, simple as it is, it is a real buzz for me.

                           

                          Thanks again.

                           

                          Brian

                          • 10. Re: Developing InDesign docs for both print and web
                            liedzeit Level 2

                            Hi Kasyan and book readers,

                            I also bought the book now (someone else had recommended it to me before). Unfortunately the link to the tutorial files is dead.

                            Does anyone know where to find them?

                             

                             

                            Thank you,

                            Ralf

                            • 11. Re: Developing InDesign docs for both print and web
                              BrianMcM Level 1

                              Hi, Ralf.

                               

                              In the introduction to the book, on page xii, they give the link for the support materials, which is www.peachpit.com/indesignxmlguide.

                               

                              Peachpit are the publishers of the book. You have to create an account on their website and also register the book that you purchased. I bought mine online from Adobe Press and when I did they somehow created my account at Peachpit and registered the book as well without me having to do anything.

                               

                              When you do register and sign in, there is a tiny little word at the top of the page, "account", just under your name, which is also tiny. When you click on "account" it takes you to the page showing the books you have registered. Under the blurb for each registered book, there is another link, also in tiny type, that says "Access to protected content". When you click on that link you get to the page that has the support materials (a zip file for each chapter).

                               

                              Hope this helps.

                               

                              Brian

                              • 12. Re: Developing InDesign docs for both print and web
                                liedzeit Level 2

                                Thank you, Brian. That did it. Good book, by the way, although I find it annoying to be constantly reminded that there is no "scary code".

                                 

                                Ralf