10 things your professor isn't telling you about being a professional web developer

89
10 THINGS YOUR PROFESSORS AREN’T TELLING YOU ABOUT BEING A PROFESSIONAL WEB DEVELOPER

Upload: chris-barr

Post on 15-Jan-2015

567 views

Category:

Technology


0 download

DESCRIPTION

Presented to the University of West Florida Association of Information Technology Professionals by myself and my co-worker James Shallard of AppRiver.

TRANSCRIPT

Page 1: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

10 THINGS

YOUR PROFESSORS AREN’TTELLING YOU ABOUT BEING

A PROFESSIONAL

WEB DEVELOPER

Page 2: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Hi there, we work for

Page 3: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Web Designer/Interface Developer at AppRiver Nearly 5 years

Co-owned small web design company for 3 yearsGraduated from Full Sail in Orlando in 2006

Associates in Digital Media Bachelors in Digital Art & Design Learned techniques here, but programming is self-taught

Find me online @ChrisMBarr chris-barr.com

WHO IS CHRIS BARR

Page 4: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHO IS JAMES SHALLARD

Manager of Software Development at AppRiver Worked for AppRiver for last 5 years Lead the Interface Group

Web Application Development for almost 14 years Owned Web Development Company for three years Worked for a variety of large and small

organizations in the UK and USA

Started in 1999 (IE5, Netscape Navigator v4)

Find me online @JamShally

Page 5: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Today

Page 6: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

1999

Page 7: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Today

Page 8: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

1999

Page 9: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Today

Page 10: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

1999

Page 11: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

10 THINGS

YOUR PROFESSORS AREN’TTELLING YOU ABOUT BEING

A PROFESSIONAL

WEB DEVELOPER

Page 12: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DON’T WORRY ABOUT NOTES!

http://tinyurl.com/AppRiverUWF

Page 13: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHAT IS WEB?(AND IS IT IN THE CLOUD?)

THING#1

Page 14: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHAT IS WEB?(AND IS IT IN THE CLOUD?)

"The cloud is what hipsters call the Internet” - Scott Hanselman, Twitter

“[The Internet] is a series of tubes” - Senator Ted Stevens, 2006

Clear?

Page 15: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

World Wide Web

“A system of interlinked hypertext documents accessed via the Internet” - Wikipedia

WHAT IS WEB?(AND IS IT IN THE CLOUD?)

Page 16: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Internet: A global system of interconnected computer networks that use the Standard Internet Protocol Suite

WHAT IS WEB?(AND IS IT IN THE CLOUD?)

Page 17: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Standard Internet protocol suite (TCP/IP)

WHAT IS WEB?(AND IS IT IN THE CLOUD?)

Page 18: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

HTTP

“…is the foundation of data communication for the World Wide Web” - Wikipedia

WHAT IS WEB?(AND IS IT IN THE CLOUD?)

Request

Response

Page 19: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Internet

WWW

HTTP

TCP/IP

WHAT IS WEB?(AND IS IT IN THE CLOUD?)

Page 20: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Service delivered over the internet

WHAT IS WEB?(AND IS IT IN THE CLOUD?)

Page 21: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

• The Web is:• Internet• TCP/IP• HTTP• HTML

• The Cloud is on top of the Internet

WHAT IS WEB?(AND IS IT IN THE CLOUD?)

THING#1

Page 22: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

SO, WHAT DOES YOURWEB BROWSER DO ANYWAY?

THING#2

Page 23: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

THE BROWSER

Page 24: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

THE BROWSER

<p>This is a paragraph!</p>

<a href="http://google.com"> This is a link</a>

<img src="kittycat.gif" />

<ul> <li>Item One</li> <li>Item Two</li> <li>Item Three</li></ul>

HTML

Page 25: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

THE BROWSER

html{ background-color: lightblue; font: 18px Helvetica;}

img{ border: 10px solid white; border-radius: 10px; box-shadow: 0 0 20px black;}

a{ color: red;}

CSS

Page 26: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer
Page 27: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer
Page 28: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer
Page 29: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

THE BROWSER

<script> document.write = "Hello!";</script>

Page 30: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

It turns HTML, CSS, and JavaScript into something a human can use & understand.

SO, WHAT DOES YOURWEB BROWSER DO ANYWAY?

THING#2

Page 31: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DEMO!

THING#3

Page 32: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHICH WEB LANGUAGE IS MOST DELICIOUS?

THING#4

Page 33: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHICH WEB LANGUAGE IS MOST DELICIOUS?

Page 34: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHICH WEB LANGUAGE IS MOST DELICIOUS?

Page 35: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHICH WEB LANGUAGE IS MOST DELICIOUS?

W3Techs.com – March 2013

Page 36: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHICH WEB LANGUAGE IS MOST DELICIOUS?

Page 37: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHICH WEB LANGUAGE IS MOST DELICIOUS?

Rails is Omakase

PHP is McDonalds

Cold Fusion is Sun Dried Tomatoes

Java is Tapas

ASP.Net is Häagen-Dazs

Page 38: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

It is a matter of taste. We like ASP.Net, but Ruby looks pretty tasty.

WHICH WEB LANGUAGE IS MOST DELICIOUS?

THING#4

Page 39: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHY IS WEB DESIGN C.R.A.P?

THING#5

Page 40: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

ContrastRepetition (consistency)

AlignmentProximity

WHY IS WEB DESIGN C.R.A.P?

Page 41: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DESIGN - CONTRAST

1 2 3

4 5 6

7 8 9

Page 42: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DESIGN - CONTRAST

1 2 3

4 5 6

7 8 9

Page 43: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DESIGN – REPETITION (CONSISTENCY)

Page 44: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

View more on our products page.

DESIGN – REPETITION (CONSISTENCY)

Page 45: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DESIGN – ALIGNMENT & PROXIMITY

Page 46: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer
Page 47: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer
Page 48: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer
Page 49: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer
Page 50: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer
Page 51: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DESIGN – ALIGNMENT & PROXIMITY

Page 52: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DESIGN – ALIGNMENT & PROXIMITY

Page 53: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Art ≠ Design

DESIGN

Page 54: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

• Contrast• Repetition• Alignment• Proximity

WHY IS WEB DESIGN C.R.A.P?

THING#5

Page 55: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DESIGN TOOLS THING#6

Page 56: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

960.gs

DESIGN TOOLS

Page 57: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Twitter Bootstrap

DESIGN TOOLS

twitter.github.com/bootstrap

Page 58: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

DESIGN TOOLS

jqueryUI.com

Page 59: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

• 960 Grid• Twitter Bootstrap• jQuery UI

• Lots more online!

DESIGN TOOLS THING#6

Page 60: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WEB ARCHITECTURE: WHY DOES EVERYONE HATE JOHN?

THING#7

Page 61: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WEB ARCHITECTURE: WHY DOES EVERYONE HATE JOHN?

Page 62: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WEB ARCHITECTURE, WHY DOES EVERYONE HATE JOHN?

Page 63: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WEB ARCHITECTURE, WHY DOES EVERYONE HATE JOHN?

Robert C. Martin

Page 64: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WEB ARCHITECTURE, WHY DOES EVERYONE HATE JOHN?

Separation of Concerns

BehaviorPresentation

CodebehindMVC

Page 65: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

Because John does not separate Concerns

WEB ARCHITECTURE: WHY DOES EVERYONE HATE JOHN?

THING#7

Page 66: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHAT IS THE FUTURE OF WEB DEVELOPMENT?

THING#8

Page 67: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHAT IS THE FUTURE OF WEB DEVELOPMENT?

Page 68: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHAT IS THE FUTURE OF WEB DEVELOPMENT?

The Browser as a Platform

Page 69: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHAT IS THE FUTURE OF WEB DEVELOPMENT?

Page 70: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

• Cloud computing• More “behavior” running in the

browser• WebSockets

Easier to write “desktop style” applications in the browser.

WHAT IS THE FUTURE OF WEB DEVELOPMENT?

THING#8

Page 71: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHY IS YOUR PHONE SO IMPORTANT?

THING#9

Page 72: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

MOBILE

Page 74: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

MOBILE

2010 2012 Increase

Africa 5.81% 14.85% 155.59%

Asia 6.1% 17.84 192.46%

Europe 1.81% 5.13% 183.43%

North America

4.71% 7.96% 69%

Oceana 2.88% 7.55% 162.15%

South America

1.46% 2.86% 95.89%

Worldwide 3.81% 10.01% 162.73%

Mobile Web Usage

Page 75: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

MOBILE

2010 2012 Increase

Africa 5.81% 14.85% 155.59%

Asia 6.1% 17.84 192.46%

Europe 1.81% 5.13% 183.43%

North America

4.71% 7.96% 69%

Oceana 2.88% 7.55% 162.15%

South America

1.46% 2.86% 95.89%

Worldwide 3.81% 10.01% 162.73%

Mobile Web Usage

Page 76: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

MOBILE

Page 77: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

MOBILE

:(

Page 78: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

MOBILE

Page 79: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

MOBILE

bostonglobe.com

Page 80: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

MOBILE

lukew.com

Luke Wroblewski

Page 81: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

MOBILE

Page 82: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

• Lots of mobile devices• The internet is still pretty

popular• Be “Future Friendly”

WHY IS YOUR PHONE SO IMPORTANT?

THING#9

Page 83: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHO KNOWS ABOUT STUFF?

THING#10

Page 84: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHO KNOWS ABOUT STUFF?

Scott HanselmanMicrosoft Tech [email protected]

Jeff AtwoodStack Overflow & [email protected]

Joel SpolskyFog Creek Software & Stack [email protected]

“Programming isn't a good job for folks who aren't interested in constant learning.”

source

“If you have a problem, ask yourself if there's anything you could throw away that would solve that problem.”

source

“We programmers are job creation engines! One bad programmer can easily create two new jobs a year.”

source

Page 85: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHO KNOWS ABOUT STUFF?

Nathan Smith960 Grid, UI/CSS/JS enthusiast @nathansmithsonspring.com

Paul IrishGoogle Chrome Developer Relations@paul_irishpaulirish.com

Luke WroblewskiMobile First, UI design [email protected]

“Never trust a skinny chef. ” == “Never trust a creative director on Windows XP.”

source

Page 86: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

WHO KNOWS ABOUT STUFF?

“Making people read more instructions is not a design solution. It's a chore. Rework the design so less needs to be explained.”

source

John [email protected]

Jason Fried37Signals, Author of REWORK@jasonfried

David TravisUsability, user experience & psychology@userfocus

Page 87: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

• Use social media• Follow interesting people

• @AppRiver• @ChrisMBarr• @JamShally• :)

WHO KNOWS ABOUT STUFF?

THING#10

Page 88: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

The Cloud is on top of the InternetAnyone can be on CNNRuby tastes deliciousWeb design is CRAPEveryone hates John’s spaghettiMore cell phones are born every day than humansTwitter knows a lot of stuff

REVIEW

Page 89: 10 Things Your Professor Isn't Telling You About Being A Professional Web Developer

QUESTIONS

?