I Do The Internet

Each Semester I do a presentation at Clemson University for their GC 340 class. This class is part of a "Printing" major, and I'm supposed to help teach about the importance and joys of web. These are the slides. I leave some important things (like sass) out because they haven't dealt with it all all. As the class grows and the students become familiar I will add more of those things in.

Transcript

1. I DO THE INTERNET *because I’m a Nerd. WITH DAVID LEININGER
2. I HAVE SOCIAL SKILLS dl@knowclassic.com.............. ! davidleininger................. ! dleininger.......................... ! dleinin................................ Find me online, I’ll talk nerdy to you... My name is David Leininger, but I never really called that.
3. Yes this is a tattoo. Yes it’s real. THIS IS ME
4. THIS IS WHERE I WORK Some rad nerds work here...
5. TODAY’S AGENDA AKA... What I’m going to talk at you... 1. Why do I internet?! 2. Current trends and what they mean for GC! 3. Show and tell (Some Stuff I did that makes me cool)! 4. What you should learn and how to learn it! 5. Tools the pros use! 6. Ron Swanson! 7. Pizza Party and Team Building Exercises
6. I INTERNET BECAUSE Because not shorts. 1. It’s different everyday! 2. It isn’t going away anytime soon! 3. It let’s me be creative and logical! 4. Anyone can innovate! 5. Problem solving and puzzles! 6. It honestly makes me happy
7. RON SWANSON There are bad days
8. RON SWANSON I love riddles
9. I LOVE MY JOB Seriously. I really do. 1. Culture of Empowerment! 2. Flexible hours! 3. Flexible location! 4. Freedom! 5. All the new technology you could ever want…
10. CURRENT INTERWEBS How is it being used? • It’s responsive (It’s flexy) • It’s open sourced (It’s free) • HTML5 & CSS3 • Web Typography & Icon Fonts • Interaction • Mobile • Retina • NO Flash or Internet Explorer
11. RESPONSIVE WEB It just works • Flexible Grids • Media Queries • Flexible Images (at a minimum)
12. OPEN SOURCE Free Dollars • Community Driven • Do-ocracy • Content Management Systesms • Companies will always be looking for developers for these CMS’s
13. HTML5 & CSS3 The new standard • Eliminates the need for Flash • Integrated Media • It’s WAY faster
14. WEB TYPOGRAPHY It’s not just 7 fonts anymore!!! • Google Web Fonts • Typekit • @Font-Face • Icon Fonts (So Freaking Cool)
15. INTERACTION This is where you get to be a wizard. • Parallax • Hover and Focus Effects • CSS3 Animations • Mobile Animations • Done without Flash
16. MOBILE Though mobile doesn’t mean anything anymore either Mobile Safari still holds around 50% of the mobile web browser share
17. RETINA DISPLAY I love Apple (probably more than you), but this is tough… • Print Resolution • Legacy Devices (72 ppi)
18. JUST SAY NO It’s a gateway drug to disappointment • No Flash • No Internet Explorer • No Flash • No Internet Explorer
19. GC’S CURRENT INTERWEBS How are we using it? • Email Campaigns • pURLS • Storefronts an eCommerce • QR Codes & MS Tags • Augmented Rality All of these have to work together. *Print isn’t dead. It’s just a part. GC means web and print.
20. SHOW AND TELL
21. SHOW AND TELL
22. SHOW AND TELL http://fivable.com
23. SHOW AND TELL
24. SHOW AND TELL
25. SHOW AND TELL
26. SHOW AND TELL
27. SHOW AND TELL
28. SHOW AND TELL
29. SHOW AND TELL
30. SHOW AND TELL
31. SHOW AND TELL
32. SHOW AND TELL Jimmy Fallon Messed Up
33. WHAT TO LEARN Take baby steps •HTML & HTML5 •CSS & CSS3 •Javascript and jQuery •Content Management Systems (CMS) •PHP or other server side languages •Objective C or other mobile app programming langages
34. RON SWANSON Know what you’re about
35. WHERE TO LEARN It took me more than 10 minutes
36. WHERE TO LEARN Free, but you get what you pay for Codeacademy
37. WHERE TO LEARN Good for someone with little to no experience Treehouse
38. WHERE TO LEARN Really learn to code Code School
39. WHERE TO LEARN This is where I started CSS Tricks
40. WHERE TO LEARN Seriously read these… A Book A Part
41. WHERE TO LEARN My favorite conference Front-End Design Conference
42. APPS AND TOOLS These are the ones I use
43. TEXT EDITORS Dreamweaver works, but it’s far from the best! •Sublime Text 2 (I use this one) •Text Mate •Coda 2 •Text Wrangler (Free - but you get what you pay for)
44. DESIGN TOOLS There are a few different opinions here… •Photoshop (The old standard) •Fireworks •InDesign
45. PHOTOSHOP ADD-ONS So freaking cool. •Slicy (Even does retina graphics) •CSS-Hat
46. LOCAL TESTING Because it’s not good to test when it’s live. •MAMP or MAMP Pro •WAMP •LAMP •Custom Solutions for CMS •Mobile Phone Emulators
47. QUESTIONS? You’ve got questions, I’ve got answers
48. I’M #TOTES SOCIAL dl@knowclassic.com.............. ! davidleininger................. ! dleininger.......................... ! dleinin................................ Find me online, I’ll talk nerdy to you... My name is David Leininger, but I never really called that.