Website Design and Development with HTML5 and CSS3. Hassen Ben Rebah

      

Table of Contents

      1  Cover

      2  Title Page

      3  Copyright

      4  Foreword

      5  Preface

      6  1 The Web and its Future 1.1. Background 1.2. Phases of evolution of the Web 1.3. Web application architecture

      7  2 The Language of the Web: HTML5 2.1. Overview 2.2. Structure of an HTML5 document 2.3. Structuring the content of a web page 2.4. Text organization 2.5. Creating hyperlinks 2.6. Inserting images and multimedia objects 2.7. Tables 2.8. Forms

      8  3 Style Sheets: CSS3 3.1. Overview 3.2. Text formatting 3.3. List formatting 3.4. Backgrounds, borders and shadows 3.5. Table formatting 3.6. Layout of the site

      9  4 Design and Creation of a Website 4.1. Process of creating a website 4.2. Ergonomics of the website 4.3. Different website types

      10  5 Practical Exercises 5.1. PE1: structure of an HTML5 web page 5.2. PE2: simple forms 5.3. PE3: table formatting 5.4. TP 4: media (image, video and audio) 5.5. PE: element positioning 5.6. PE6: creating a template model 5.7. PE7: creating a website from A to Z

      11  References

      12  Index

      13  End User License Agreement

      List of Illustrations

      1 Chapter 1Figure 1.1. Web 1.0: diffusionFigure 1.2. Web 2.0: collaborationFigure 1.3. Web 3.0: semanticFigure 1.4. Connected textilesFigure 1.5. LCD screen of a Samsung smart refrigerator⁵Figure 1.6. Architecture of an application on a central serverFigure 1.7. Two-tier architecture (client-data server)Figure 1.8. Three-tier architectureFigure 1.9. n-tier architecture

      2 Chapter 2Figure 2.1. The result of using the <div> tag. For a color version of this figur...Figure 2.2. The <header> of the mes.tn¹ site. For a color version of this figure...Figure 2.3. The <footer> of the mes.tn site. For a color version of this figure,...Figure 2.4. The <nav> navigation links of the mes.tn site. For a color version o...Figure 2.5. <section> page section of the mes.tn site. For a color version of th...Figure 2.6. <Aside> additional information block on wikipedia.org. For a color v...Figure 2.7. An example of an <article> article from the MES.tn site. For a color...Figure 2.8. Effect of the <p> tagFigure 2.9. Effect of the <blockquote> tagFigure 2.10. Effect of the <q> tagFigure 2.11. Effect of the <strong> tagFigure 2.12. Effect of the <em> tagFigure 2.13. Effect of the <b> tagFigure 2.14. Effect of the <i> tagFigure 2.15. Effect of the <small> tagFigure 2.16. Effect of the <code> tagFigure 2.17. Effect of the <var> tagFigure 2.18. Effect of the <kbd> tagFigure 2.19. Effect of the <samp> tagFigure 2.20. Effect of the <sub> tagFigure 2.21. Effect of the <sup> tagFigure 2.22. Effect of the <time> tagFigure 2.23. Result of using the datetime attributeFigure 2.24. Result of using the pubdate attributeFigure 2.25. Effect of the <hr /> tagFigure 2.26. Effect of the <br/> tagFigure 2.27. Effect of the <ins> tagFigure 2.28. Effect of