デザイナーのためのラクして作る神速Webサイト

Transcript

1. View Slide

2. ϑΝΠϧͷμ΢ϯϩʔυ
   JOEFYIUNMͷ࡞੒
   $44ͷಡΈࠐΈ
   ίϯϙʔωϯτΛ࢖͏
   άϦουΛཧղ͢Δ
   ࡞ͬͯΈΑ͏
   جૅͷ͖
   ඞཁͳ΋ͷ
   جૅ஌ࣝ
   CPPUTUSBQͬͯʁ
   $44GSBNFXPSLͬͯ
   ະདྷͷ͸ͳ͠
   ࣭ٙԠ౴
   ͍͞͝ʹ
   ΧελϚΠζ
   -&44Λॻ͜͏
   -&44ͱ͸ʁ
   ৭Λม͑Δ
   ίϯύΠϧ͠Α͏
   

   View Slide

3. ඞཁͳ΋ͷ
   ύιίϯ
   ϒϥ΢β
   ςΩετΤσΟλ
   ඞཁ஌ࣝ
   )5.-
   $44
   Ի੠Λฉ͖ͳ͕ΒҰॹʹૢ࡞ͯ͠Έ·͠ΐ͏
   σϡΞϧσΟεϓϨΠ΍λϒϨοτͰ
   ͜ͷतۀΛݟͳ͕Β࡞ۀΛ͢Δͱ
   ཧղ͠΍͍͢Ͱ͢
   

   View Slide

4. CPPUTUSBQͬͯʁ
   

   View Slide

5. DTTΛಡΈࠐΜͰ͓͘ͱ
   IUNMΛॻ͚ͩ͘Ͱ
   Χοί͍͍αΠτ͕࡞ΕΔ΋ͷ
   CPPUTUSBQͬͯʁ
   

   View Slide

6. $44GSBNFXPSL
   

   View Slide

7. View Slide

8. ࡞ͬͯΈΑ͏
   

   View Slide

9. View Slide

10. )5.-Λ࡞੒
    $44ΛಡΈࠐΉ
    ͲΜͲΜίϐϖ
    

    View Slide

11. ϙΠϯτ
    ਅΜதʹ͍ͨ͠ͱ͖͸
    DMBTTʠDPOUBJOFSʡ
    

    View Slide

12. ࠷ॳͷน
    άϦουγεςϜ
    

    View Slide

13. DMBTTlSPXz
    DMBTTlDPMYYz DMBTTlDPMYYz
    ෳ਺ΧϥϜΛ࡞Δͱ͖͸
    SPXͱDPM
    

    View Slide

14. ݸͷ࢛͕֯ೖ͍ͬͯΔ
    ෯ΛڱΊΔͱԼʹྲྀΕΔ
    

    View Slide

15. ߹ܭʹͳΔΑ͏ʹ࡞Δ
    αΠυόʔ ϝΠϯίϯςϯπ
    ೖΕࢠʹ͢Δͱ͖΋ಉ༷
    

    View Slide

16. ݸฒ΂͍ͨͱ͖
    

    View Slide

17. ͭΛಉ͡෯Ͱฒ΂͍ͨͱ͖
    

    View Slide

18. ͭΛಉ͡෯Ͱฒ΂͍ͨͱ͖
    

    View Slide

19. EJWDMBTTDPMYTDPMTNDPMNE
    εϚϑΥ 1$Ͱม͍͑ͨͱ͖
    εϚϑΥ λϒϨοτ 1$
    

    View Slide

20. ΧελϚΠζ
    

    View Slide

21. -&44ͱ͸ʁ
    ͬͪ͜Λ
    μ΢ϯϩʔυ
    

    View Slide

22. View Slide

23. -&44ͱ͸ʁ
    

    View Slide

24. http:// lesscss.org/
    

    View Slide

25. શ෦ॻ͖ม͑Δ
    ͷ͸େมɻ
    ϛεͷݪҼ
    

    View Slide

26. ͚ͩ͜͜ม͑Ε͹
    શ෦͕มΘΔ
    

    View Slide

27. ηϨΫλ͕௕͍ʜ
    

    View Slide

28. ೖΕࢠ͕Ͱ͖·͢
    

    View Slide

29. ৭Λม͑ͯΈΑ͏
    

    View Slide

30. View Slide

31. -&44ฤूͷྲྀΕ
    DPEFLJU΁ొ࿥
    ग़ྗઌΛઃఆ
    MFTTϑΝΠϧΛฤू
    อଘ
    

    View Slide

32. View Slide

33. ͍͞͝ʹ
    

    View Slide

34. ྑ͔ͬͨΒങͬͯͶ
    

    View Slide