Kyle goes over the difference between static and dynamic sites, how easy it is to use WordPress and ExpressionEngine, and goes over hypothetical situations.

2. The World of Dynamic Sites

3. What We’ll Cover

5. What is a Dynamic Site

6. What is a Dynamic Site
Why Build a Dynamic Site

7. What is a Dynamic Site
Why Build a Dynamic Site
Using a Content Management System

8. What is a Dynamic Site
Why Build a Dynamic Site
Using a Content Management System
Practical Uses For You

10. Junior at Springbrook
High School

11. Junior at Springbrook
High School
On SHS Web Team

12. Junior at Springbrook
High School
On SHS Web Team
Part of the SHS Web
Business Program

13. Junior at Springbrook
High School
On SHS Web Team
Part of the SHS Web
Business Program
Owner of Cotter
Interactive

14. Two Types of Sites

15. Static

16. Dynamic

17. Dynamic

18. Definition

19. Static
Pertaining to or Characterized by a Fixed or Stationary Condition

20. Example

23. Definition

24. Dynamic
Pertaining to or Characterized by Energy or Effective Action;
Vigorously Active or Forceful; Energetic

25. Example

28. Static
Only way to update is by editing code

29. Dynamic
Provides an Interface to Work With for Easier Updates

30. Why Build a Dynamic Site?

32. Easier for the Client

33. Easier for the Client
Easier for You

34. Easier for the Client
Easier for You
More $$ For You

35. Easier for the Client
Easier for You
More $$ For You
Updating & Adding Content is no longer
your problem

36. Many Ways to Create a
Dynamic Site

37. ...But What is Most
Practical?

38. CMS
Content Management System

39. CMS
Content Management System

40. Technical Definition

41. “A CMS, or Content Management System, is
an application designed to store, format,
reproduce and manage Web data. The
CMS usually uses a database to store the
content and a server-side scripting language
to recall and present the data.”
-- Sitepoint.com

42. Content & Code

43. Content
Keep Them Separate
&
Code

44. How a Site is
Broken Down

45. Markup - HTML
Style - CSS
Content - Use of a CMS

46. <h1 style=“background: blue; color: white; margin: 20px;”>
Welcome to My Awesome Web Site!
</h1>

47. Markup Style
<h1 style=“background: blue; color: white; margin: 20px;”>
Welcome to My Awesome Web Site!
</h1>
Content

49. <h1 class=“header”>
{title}
</h1>

50. Markup
CSS
<h1 class=“header”>
{title}
CMS
</h1>

51. Markup
CSS
<h1 class=“header”>
{title}
CMS
</h1>

52. Examples of a CMS

57. “WordPress is web software you can use to
create a beautiful website or blog. We like to
say that WordPress is both free and priceless
at the same time.”
-- WordPress.org

58. Why WordPress?

60. Installed and functional on your server in
less than 2 minutes

61. Installed and functional on your server in
less than 2 minutes
1000’s of FREE themes to use

62. Installed and functional on your server in
less than 2 minutes
1000’s of FREE themes to use
Using a CMS means more $$ and less of
your time

63. Example

64. Our Client
Great Photographer
Wants a Site Showcasing His Work
Doesn’t Like Code

65. Doug

66. What Doug Wants
Home Page
About Page
Gallery Page
Contact Page

67. Step 1
Find Your Theme

70. If All Else Fails...
Search Google for Free WordPress Themes

71. Step 2
Setup WordPress

72. Step 3
Tweak to Your Needs

73. Setting Up Full Site in
1 Minute and 25 Seconds

76. Managing Content in
WordPress

78. Finished Product

80. Great work! I love it. It’s
easy for me to update and
change my collection on
my own time.

81. What We Learned

82. Very Minimal Work Needed On Our End
You Can Charge $200 - $300
Happy Client = More Work

84. “Its flexibility allows you to build a website
that not only fulfills your needs and creative
vision today, but will grow and scale as your
business needs change in the future.”
-- ExpressionEngine.com

85. ExpressionEngine is a Great
Learning Environment

87. “But the code is not going
to make sense to me.”

88. ExpressionEngine’s
Syntax is Like English

89. Setting the Scene
Display 5 Blog Posts on Blog Page

90. Title
Blog Post
Author

91. You Tell ExpressionEngine What Each
Field Should Be Referred To As

93. channel=“blog”

94. channel=“blog”
{title}

95. channel=“blog”
{title}
{blog-post}

96. {exp:channel:entries channel=”blog” limit=”5”}
<h1 class=“blog-title”>
{title} - By: {author}
</h1>
{blog-post}
{/exp:channel:entries}

97. {exp:channel:entries channel=”blog” limit=”5”}
<h1 class=“blog-title”>
{title} - By: {author}
</h1>
{blog-post}
{/exp:channel:entries}

98. Markup Style
{exp:channel:entries channel=”blog” limit=”5”}
<h1 class=“blog-title”>
{title} - By: {author}
</h1> CMS
{blog-post}
{/exp:channel:entries}

99. Markup Style
{exp:channel:entries channel=”blog” limit=”5”}
<h1 class=“blog-title”>
{title} - By: {author}
</h1> CMS
{blog-post}
{/exp:channel:entries}

100. Bottom Line
You’re Setting Variables that Get Filled with what the
User Types in the CMS Control Panel

101. What We Learned

103. Static vs. Dynamic

104. Static vs. Dynamic
Who Benefits From a Dynamic Site

105. Static vs. Dynamic
Who Benefits From a Dynamic Site
What a CMS is

106. Static vs. Dynamic
Who Benefits From a Dynamic Site
What a CMS is
Realistic Scenario Using WordPress

107. Static vs. Dynamic
Who Benefits From a Dynamic Site
What a CMS is
Realistic Scenario Using WordPress
Easy-to-Understand Code Using
ExpressionEngine

108. Thank You