I was listening to Jeffrey Zeldman interview Tim Brown on his excellent podcast “The Big Web Show” which I should start out by saying was a fantastic episode too. It really got me thinking about the terminologies we use around the web, web design and web development. Since I’ve been building traditional desktop and mobile applications for a while now, along side with website, I’ve found that application developers have a much richer set of terminology to describe responsive design.
I’ve been working a lot with MVVM lately, or Model View View Model. Which has a ton written about it and can be a pretty good practice. Without reading too much in to it all you really need to do is break it down to it’s core.
View
The code or markup that handles what is displayed on the screen. The View gets any of it’s data to be displayed from the Model View.
Model View
Is an abstraction layer to any data that is dynamically loaded and then displayed in the View. The Model View is nice because it can handle any of the translations, formatting, better naming of anything that is coming from your data. The Model View gets it’s data from the Model.
Model
This is another abstraction layer that is tied directly to your data. The Model gets it’s data from XML, hardcoded, MySQL or any database, etc.
Why?
because talking about pages is too dated. So many websites that I work on don’t have an actual concept of pages. So instead of calling them pages let’s call them views. That’s one place to start. How I layout my file structure for a project.
- Site Root
- index.html
- controls
- images
- css
- js
- views
- viewmodel
- model
So how is this helpful? My index.html becomes basically my main view. it boot straps the site to load everything that that is needed. Index could be PHP, MVC, whatever backend tech you want. I’m a big fan of doing as much as possible in the client, but there’s always a time and a place for server side operations.
Controls
You might see I have a folder called controls which has it’s own CSS and JS folder. What’s this for? This is where I put anything that is just a part of view that pretty could stand alone code wise. Usually it’s reused across other views. Things like custom lists, fancy custom AJAX interface elements, etc. Why not make them a view? I guess you could or you could just code your control in to a view and not abstract it. That’s up to you. I just think we need a name for it and control is used in application programming already.
This is just a start to the terminology. I would love your feedback.
Back in the mid-1940s, Seagram’s advertised its VO Canadian whiskey with a series of extremely manly magazine ads about “Men Who Plan Beyond Tomorrow” futuristic thinkers who liked the fact that Seagram’s was patient enough to age VO for six years. No, it doesn’t make much sense to me, either. But the ads, each of which depicted a different miracle that would transform postwar America, are glorious. They’re entertaining when they sort-of-accurately predict scenarios that eventually came to be, such as the rise of the cell phone.
Home