Will StyleのWebサイト制作

Transcript

1. W Our philosophy Will StyleͷWebαΠτ੍࡞
2. Table of contents 1. ࣗݾ঺հ 2. WebαΠτ੍࡞ͱ͸ 3. SEOʹ͍ͭͯ 4. ࣮ࡍʹ΍ͬͯΈͨ͜ͱ 5. Will Style͕ߟ͑ΔWebαΠτ੍࡞ 6. WebαΠτʹ෇ՃՁ஋Λ༩͑Δ 7. ͍͞͝ʹ
3. Self introduction Will Style Inc. औక໾ CTOʗਆށͷWeb੍࡞ձࣾʗόϯυϚϯˠ26ࡀͰࣾձਓˠ׬શಠֶͰσ βΠφʔɾΤϯδχΞˠ32ࡀͰୟ্͖͛ͷܦӦऀʗࣗࣾϒϩάͰ͓࢓ࣄͷ100%ΛαΠτ͔Βͷ ͓໰͍߹Θͤʹͨ͠உʗӦۀɾ࠾༻ίετθϩʗ೔ຊҰૉఢͳWebαΠτΛ࡞ΔձࣾΛ໨ࢦ͢ Will Style Inc. ਆށͷWeb੍࡞ձࣾɻ ΫϥΠΞϯτͱͷίϛϡχέʔγϣϯΛେ੾ʹͨ͠WebαΠτ੍࡞Λ͢Δձࣾɻ
4. WebαΠτ੍࡞ͱ͸ Web creation
5. ͦ΋ͦ΋ɺͳͥWebαΠτ͕ඞཁͳͷͰ͠ΐ͏ Web creation WebαΠτ੍࡞ͱ͸
6. Web creation WebαΠτ੍࡞ͱ͸ ͳͥWebαΠτ͕ඞཁͳͷ͔
7. ͦΕ͸WebαΠτ͕ͳͯ͘΋ՄೳͰ͸ͳ͍Ͱ͔͢ʁ Web creation WebαΠτ੍࡞ͱ͸ DM΍ଞഔମͷ޿ࠂΛ࢖͑͹ ू٬͸Մೳ WebҎ֎Ͱ΋Ͱ͖Δ͜ͱ
8. Web creation WebαΠτ੍࡞ͱ͸ ௿ίετͰ޿ࠂͱͯ͠࢖͑Δ λʔήοτ΋ߜΕΔ Web͔ͩΒͰ͖Δ͜ͱ
9. WebαΠτ੍࡞ͱ͸Webʹ͔͠ग़དྷͳ͍͜ͱͰ ΫϥΠΞϯτͱϢʔβʔΛͭͳ͗ ໨తΛୡ੒ͤ͞ΔͨΊͷπʔϧΛ࡞Δ͜ͱ Web creation WebαΠτ੍࡞ͱ͸
10. SEOʹ͍ͭͯ SEO
11. SEO SEOʹ͍ͭͯ SEOͱ͸ • Search Engine OptimizationʢݕࡧΤϯδϯ࠷దԽʣͷུ • ݕࡧΤϯδϯ͸ΫΦϦςΟͷߴ͍ϖʔδΛ্Ґʹදࣔ͠Α͏ͱ͢Δ • ݕࡧΤϯδϯʹ޲͚ͯWebαΠτΛ࠷దͳঢ়ଶʹ͚ۙͮΔ͜ͱ
12. ϒϥοΫϋοτSEO ϒϥοΫϋοτSEOͱ͸࣭ͷ௿͍ίϯςϯπͷݕࡧॱҐΛෆਖ਼ͳํ๏ʹΑ্ͬͯঢͤ͞ΔςΫχοΫͷ͜ͱɻ 1. ඃϦϯΫͷେྔઃஔ 2. ίϐʔίϯςϯπ 3. Ӆ͠ςΩετ΍Ӆ͠ϦϯΫ 4. ΩʔϫʔυΛෆࣗવʹ٧ΊࠐΜͩจষʢϫʔυαϥμʣ 5. ݕࡧΤϯδϯ޲͚ͷಛผͳϖʔδΛදࣔ͢ΔߦҝʢΫϩʔΩϯάʣ SEO SEOʹ͍ͭͯ
13. ύϯμΞοϓσʔτͱϖϯΪϯΞοϓσʔτ ௿඼࣭ͳίϯςϯπΛݕࡧ݁Ռ͔Βআ֎͢Δ͜ͱͰɺ݁Ռతʹݕࡧ݁Ռ্Ґʹ඼࣭ͷߴ͍΢Σ ϒαΠτΛදࣔͰ͖ΔΑ͏ʹ͢ΔΞοϓσʔτ εύϜߦҝ΍ɺ΢ΣϒϚελʔ޲͚ΨΠυϥΠϯʹஶ͘͠ҧ൓͍ͯ͠ΔWebϖʔδʹରͯ͠ݕ ࡧ݁ՌͷॱҐΛԼ͛ΔΞοϓσʔτ Google͸࣭ͷ௿͍ίϯςϯπͷݕࡧॱҐΛԼ͛ΔΞϧΰϦζϜΞοϓσʔτΛߦ͍·ͨ͠ SEO SEOʹ͍ͭͯ
14. ϗϫΠτϋοτSEO ϗϫΠτϋοτSEOͱ͸Ϣʔβʔͷ՝୊ղܾͱͳΔྑ࣭ͳίϯςϯπΛ࡞੒ࣗ͠વͳඃϦϯΫΛ֫ಘ͢Δ͜ͱɻ 1. ݕࡧ݁Ռʹదͨ͠λΠτϧͱεχϖοτΛ࡞੒͢Δ 2. ޮՌతͳϦϯΫςΩετΛهड़͢Δ 3. ը૾Λ࠷దԽ͢Δ 4. Ϣʔβʔʹͱͬͯ༗ӹͳίϯςϯπΛ࡞੒͢Δ SEO SEOʹ͍ͭͯ
15. ਖ਼߈๏ͰΞΫηε਺ΛՔ͙͜ͱ Ϣʔβʔͷ՝୊ղܾͱͳΔྑ࣭ͳίϯςϯπΛ഑৴͢Δ͜ͱ SEO SEOʹ͍ͭͯ
16. ࣮ࡍʹ΍ͬͯΈͨ͜ͱ Tried
17. ฐ͕࣮ࣾࢪͨ͠ࣄͱಘΒΕͨ݁Ռ Tried ࣮ࡍʹ΍ͬͯΈͨ͜ͱ ݄ؒΞΫηε਺ฏۉ300લޙͩͬͨͷ͕ ໿30,000ΞΫηεʹ্ঢ ࣗࣾαΠτΛ2015೥11݄ʹϦχϡʔΞϧ ελοϑϒϩάΛ։ઃ ʮ΢Σϒ੍࡞ ਆށʯ౳Ͱ্Ґʹ Ӧۀίετɾ࠾༻ίετ͕θϩʹ
18. ಉۀछͷݕࡧऀ΁ͷΞϓϩʔνͰ΋੒ޭͨ͠ཧ༝ Tried ࣮ࡍʹ΍ͬͯΈͨ͜ͱ ྑ࣭ͳهࣄΛॻ͘ ΞΫηε͕૿͑Δ ྑ࣭ͳαΠτͱͯ͠αΠτશମͷධՁ্͕͕Δ αΠτશମͷॱҐ্͕͕Δ જࡏސ٬ͷχʔζͱ͸ҧͬͨ಺༰ͷهࣄͰ΋Ϣʔβʔͷ՝୊ΛղܾͰ͖Ε͹ٻΊͨ݁ՌΛಘΒΕΔ
19. Tried ࣮ࡍʹ΍ͬͯΈͨ͜ͱ Ϧαʔν͢Δ վΊͯਂ۷Γ͢Δ ࣗ෼Ͱ͸΋͏஌͍ͬͯΔΑ͏ͳ಺༰Ͱ͋ͬͯ΋ɺௐ΂ͯΈΕ ͹ΑΓਂ͘஌Δ͜ͱ͕Ͱ͖Δɻ·ͨɺීஈԿؾͳ͘΍͍ͬͯ ͨ͜ͱ͕୭΋·ͩ΍͍ͬͯͳ͔ͬͨ͜ͱ͔΋͠Εͳ͍ɻ ಉ͡ςʔϚͷهࣄ͸ͳ͍͔୳ͯ͠ΈΔ ॻ͜͏ͱ͍ͯ͠ΔςʔϚͱಉ͡ςʔϚͷهࣄ͕͋ͬͯ΋ɺͦ ͷهࣄʹ͸ॻ͔Ε͍ͯͳ͍͜ͱΛϓϥεΞϧϑΝͰॻ͚͹ͦ ͷهࣄΑΓΞΫηε਺ΛՔ͙͜ͱ͕Ͱ͖Δ ࠔ͍ͬͯΔਓΛ୳͢ ͦͷςʔϚͰࠔ͍ͬͯΔਓ͕͍ͳ͍͔୳ͯ͠ΈΔɻͲΜͳ͜ ͱͰࠔ͍ͬͯΔͷ͔Λ஌Δ͜ͱͰͦͷਓͷ՝୊ΛղܾͰ͖Δ هࣄΛൃ৴͢Δ͜ͱ͕Ͱ͖Δɻ τϨϯυΛ஌Δ ࣗ෼ͷ෼໺ͰͲΜͳ͜ͱ͕τϨϯυʹͳ͍ͬͯΔͷ͔Λௐ΂ ͯΈΔɻඞͣ࢓ࣄʹ௚݁͢Δඞཁ͸ͳ͍͕Ͱ͖Δ͚ͩ࢓ࣄͷ தͰࣗ෼ͷಘҙͱ͢Δ෼໺͕޷·͍͠ɻ
20. Tried ࣮ࡍʹ΍ͬͯΈͨ͜ͱ झ޲ΛڽΒ͢ λΠτϧΛ޻෉͢Δ λʔήοτΛ໌֬ʹ͠λΠτϧΛಡΜͰ۩ମతʹԿ͕ಘΒΕ Δͷ͔ΛϋοΩϦͤ͞ΔɻλΠτϧΛݟ͚ͨͩͰಡΈͨ͘ͳ ΔΑ͏ͳ޻෉Λ͢Δɻ ষʹ෼͚Δ هࣄΛষʹ෼͚ͯॻ͘ɻ͞Βʹ֤ষʹද୊Λ͚ͭΔ͜ͱͰಡ Έ΍͕͙ͬ͢͞ͱ্͕Δɻষʹ෼͚Δ͜ͱ͸ߏ੒͢Δ্Ͱ΋ ͱͯ΋ॏཁɻ ࢥ͍΍ΓΛײ͡ΔهࣄΛॻ͘ ಡΜͰ͍ΔਓΛ૝૾͠هࣄΛ޻෉͢ΔɻಡΜͰ͍Δਓ͕ײಈ Ͱ͖ΔΑ͏ͳ͓΋ͯͳ͕͠Ͱ͖͍ͯΔهࣄ͸૬ରతʹΞΫη ε਺͕ߴ͍ɻ ը૾Λ޻෉͢Δ ϒϩάʹͱͬͯը૾͸ॏཁɻจࣈ͚ͩͷهࣄΑΓ͸ը૾Λؚ Ίͨهࣄͷ΄͏͕ಡΈ΍͘͢ݟָ͍͍ͯͯ͠ɻಛʹ֦ࢄͨ͠ ࡍʹαϜωΠϧͱͳΔهࣄ̍ຕ໨ͷը૾͸λΠτϧͱϦϯΫ ͨ͠࠷ߴͷ̍ຕΛ഑ஔ͢Δɻ
21. ࣗ෼͕ͨͪ੒ޭମݧͨ͜͠ͱΛΫϥΠΞϯτʹͦͷ··఻͑Δ͜ͱ झ޲ΛڽΒ͠ɺίπίπଓ͚Δ͜ͱ Tried ࣮ࡍʹ΍ͬͯΈͨ͜ͱ
22. Will Style͕ߟ͑ΔWebαΠτ੍࡞ Thought
23. ͍͘Βू٬Λͯ͠΋ັྗ͋ΔαʔϏεͰͳ͍ͱ ͓໰͍߹Θͤʹ͸ͭͳ͕Βͳ͍ Thought Will Style͕ߟ͑ΔWebαΠτ੍࡞
24. Thought Will Style͕ߟ͑ΔWebαΠτ੍࡞ ίϛϡχέʔγϣϯͳͯ͘͠σβΠϯ͸Ͱ͖ͳ͍ σβΠφʔ΋ଧͪ߹Θͤʹಉߦ͢Δ ΫϥΠΞϯτͷݱ৔ʹ࣮ࡍʹߦ͖ ମײͨ͜͠ͱΛͦͷ··දݱ͢Δ
25. Thought Will Style͕ߟ͑ΔWebαΠτ੍࡞ ΫϥΠΞϯτͷྑ͞ΛҾ͖ग़͠ɺΑΓັྗతʹදݱ͢Δ ΩʔϏδϡΞϧɾΩϟονίϐʔͰ ૌٻྗΛߴΊΔ ίϯόʔδϣϯ΁ͱಋ͘ ັྗతͳߏ੒
26. Thought Will Style͕ߟ͑ΔWebαΠτ੍࡞ ίϯςϯπΛ૿΍͠ଓ͚ͯ΋Β͏࢓૊ΈΛಋೖ WordPressʢCMSʣΛಋೖ͠ ίϯςϯπΛ૿΍ͯ͠΋Β͏ هࣄΛߋ৽͠΍͘͢ɺ ΑΓັྗతʹͰ͖ΔΑ͏ʹΧελϚΠζ
27. ΫϥΠΞϯτΛΑ͘஌ΓɺͦͷັྗΛ఻͑Δ͜ͱ ΫϥΠΞϯτʹαΠτΛߋ৽͍͖ͯͨͩ͠ ΫϥΠΞϯτࣗ਎ͰWebαΠτΛҭ͍ͯͯͨͩ͘͜ͱ Thought Will Style͕ߟ͑ΔWebαΠτ੍࡞
28. WebαΠτʹ෇ՃՁ஋Λ༩͑Δ Added value
29. ͍͘Βັྗ͋ΔαΠτͰ΋ ϢʔβϏϦςΟ΍ύϑΥʔϚϯε͕ѱ͚Ε͹ ཭୤ͯ͠͠·͏ Added value WebαΠτʹ෇ՃՁ஋Λ༩͑Δ
30. Added value WebαΠτʹ෇ՃՁ஋Λ༩͑Δ Ϩεϙϯγϒ΢ΣϒσβΠϯͰ ϞόΠϧϑϨϯυϦʔʹ ϢʔβϏϦςΟΛ޲্ͤ͞Δࢪࡦ ཧ༝ͷ͋ΔಈઢઃܭͰ ϢʔβϏϦςΟΛ޲্͢Δ
31. Added value WebαΠτʹ෇ՃՁ஋Λ༩͑Δ ୤jQueryɾը૾ͷOptimize Ϧιʔε͸Prefetch·ͨ͸ඇಉظͰऔಘ ඇಉظ௨৴ʢPJAXʣͰϖʔδભҠΛߴ଎Խ ύϑΥʔϚϯεʹର͢Δࢪࡦ
32. Added value WebαΠτʹ෇ՃՁ஋Λ༩͑Δ ϏϧυπʔϧʢWebpackʣͱ λεΫϥϯφʔ(gulp)ͷಋೖ อकੑΛߴΊΔͨΊͷࢪࡦ CSSϑϨʔϜϫʔΫʢBootstrapʣΛ࠾༻ ςϯϓϨʔτΤϯδϯʢEJS) CSSϓϦϓϩηοαʔ(SCSS) ES2015ͷτϥϯεύΠϥʔ(Babel) ιʔε͸GitͰόʔδϣϯ؅ཧ ࣗಈσϓϩΠ؀ڥͷߏங
33. ϢʔβʔʹετϨεͳ͘Ӿཡͯ͠΋Β͑Δ޻෉Λࢪ͢͜ͱ ࠷৽ͷٕज़Λৗʹ௥͍͔͚ɺඞཁͰ͋Ε͹ಋೖ͢Δ Added value WebαΠτʹ෇ՃՁ஋Λ༩͑Δ
34. ͍͞͝ʹ To close
35. WebαΠτ͸࡞ͬͯऴΘΓͰ͸ͳ͘ Ϣʔβʔͷಈ޲Λ஌Γɺ՝୊ղܾͰ͖Δྑ࣭ͳίϯςϯπΛൃ৴͠ଓ͚Δ͜ͱ͕ॏཁ ·ͨɺ੍࡞ऀ͸ΫϥΠΞϯτͱͷίϛϡχέʔγϣϯΛ͔ͬ͠ΓͱऔΓ ΫϥΠΞϯτΛΑ͘஌ΓɺϢʔβʔ΁఻͑Δ͜ͱ͕࠷΋ॏཁ To close ͍͞͝ʹ
36. ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ Thank you for listening!