Web Designers Roadmap for 2011
June 26th, 2011
Web Designers Roadmap
June 2011 – By: Stefan Mischook
PDF: web-designer-roadmap
The skills required in modern web design are constantly changing … that’s because the Web itself is always changing. If you want to be successful as either a web professional (web designer / programmer) or as web site owner, you have to keep up!
What to learn (as of 2011-2012) – in order of priority:
1. HTML
2. CSS
3. PHP basics
4. Javascript
5. JQuery
6. Wordpress
7. OOP PHP (for programmers only)
8. HTML 5 and CSS 3
9. iPad / iPhone (choice of either: Objective C or HTML 5 + CSS 3)
Comments
HTML
This is the foundation of any site – you have to learn HTML. You’ll might notice that I did not mention XHTML … it was all the rage once but people have finally figured out that its’ days are numbered. Fortunately, if you know XHTML, you pretty much know HTML since they are so similar.
CSS
The sister language to HTML: where HTML provides the structure, CSS provides the style.
PHP Basics
PHP is the most popular Web programming language out there. PHP is used by millions of tiny sites and on mega web sites like Facebook. As a web professional, you need to learn at least basic PHP because so many standard things that people want on websites are built with PHP – for example:
- shopping carts/e-commerce systems.
- blogs and content management systems.
- forums and contact forms.
… And that is just a small sample.
Sure, you can get by without understanding PHP (or PHP’s top competitor Ruby) but you will be at great disadvantage to those who do. You’ll also find your job as a web designer to be that much more difficult as you continually run into PHP based software that clients will need you to use.
Javascript
Javascript is the programming language used in web browsers … it compliments PHP and is a 100% must learn language. Again, like PHP, so many things that we expect in websites today rely on Javascript.
You can learn more about Javascript
JQuery
JQuery is the de facto standard when it comes to creating effects on your web pages:
- sliders
- dynamic menus
- slide shows
… etc. JQuery is helping to replace Flash.
JQuery is a Javascript library that makes all these things easy to drop into web pages (actually, you almost literally do!) and has now been widely adopted by the major players out there like Microsoft, Apple and Google. To really use JQuery effectively, it is good to know Javascript.
You can learn more about JQuery
Wordpress
Wordpress is the most popular blogging engine / content management system (CMS) out there. Many websites are built entirely out of Wordpress because using Wordpress automatically gives a website a whole bunch of capability for free:
- built-in search
- ability to add images, mp3’s to pages.
- ability to edit and create new pages with no web skills.
etc …. Wordpress does much, much more.
In fact, there is a new breed of web designer I like to call ‘Wordpress Web Designers’ who do 100% of their web sites based on Wordpress. They are running circles around the competition.
You can learn more about Wordpress
OOP PHP
If you decide to become more of a web programmer, then you will need to learn PHP OOP. Object Oriented Programming (OOP) is the modern style of programming and everything that is anything today is built using OOP based systems. It’s must learn whether you use PHP, Ruby, Java or Javascript.
HTML 5 and CSS 3
HTML 5 and CSS 3 is the cutting edge of these languages (HTML & CSS) and delivers power and capability that old time nerds like me used to dream and fantasize about. I did not include these with standard HTML and CSS because they are a totally different beast in terms of what you use them for.
Not all web browsers being used today will understand HTML 5 and CSS3, but that is changing very fast because Google, Apple, Microsoft and Firefox are pushing these twin towers of power, pushing everyone to upgrade to the latest browsers.
Besides standard web browsers adopting HTML 5 and CSS, all the new smartphones and tablets understand these cool new technologies – for example, iPad runs HTML 5 and CSS 3.
You can learn more about HTML 5 and CSS 3
iPad / iPhone
It is estimated there will be 100 million iPads in use by 2012! So if you want to reach that audience, you have to learn about the capabilities and limitations of iOS … the operating system that runs on iPads and iPhones.
Here’s the good news, if you know HMTL 5 and CSS 3, you can build some really cool stuff for iOS. But, if you want to take full advantage of the iPad or iPhone, you will need to learn Objective C … the programming language of iOS and Apple.
… And guess what, Objective C is object oriented … so if you know OOP PHP, learning Objective C will be much easier than it would have been otherwise.
About Flash:
Flash is dying partly because Apple will not allow Flash to run on the iPhone and iPad. Apple blocked Flash simply because Flash runs terribly on Mac OS … so who can blame them?
Another thing that is killing Flash, is that there are now free alternatives that don’t require a special plug-in (as Flash does) that can do pretty much everything people use Flash for … I am talking about JQuery, HTML 5 and CSS3. I like Flash but I think it is looking like a dead-end technology and is not something I would be investing in.
Final Comment
You don’t need to learn all these technologies to build a website, or to be a successful web professional, but consider the following:
Knowing 1 and 2 is great for small web sites owners .. so you can make changes on your own. Knowing 1-6 is great for web designers. Web programmers should learn 1-8 and to add a little ‘juice’ (and cash to your bank account,) learn 9. iPad development is hot these days.
Update: I just created a video on this topic:
Stefan Mischook
www.killersites.com
Nice article. I love OOP so much.
Thanks for the clear and concise outline of current skills needs. I web irregularly and update my skills only when needed, so a review like this is great for me! I have gone down wrong paths before, like too much Flash, Flash nav and early formatting using CSS, to say nothing of the library of conflicting books I accumulate.
Yes. The problem is that you have a lot of companies wanting to push their products or nerds who want to defend what they like.
Personally, I like being able to find work … that means being realistic about what works and what is in demand now in terms of web technology.
…. I still remember the days when Flash was super hot. Those days are fading quick.
Stefan
You forgot Joomla.
Very nice post. The pdf version is good as I prefer filing this type of info. Thanks
@Brian,
In the video blog I do mention Joomla a few times. The video version of this article will be up tonight.
Stefan
DBMS and SQL is missed
I think this is a great site and nice article post. I started learning some of my PHP programming from this site. Now I am getting involved with the Zend Framework. Add more Zend F please… Thanks.
We have some Zend Framework stuff here:
http://www.killerphp.com/zend-framework/
Stefan
Yes, DBMS and SQL is something that I always associate with PHP, so I did not explicitly list it … maybe I should have.
Stefan
Really very nice post. I like the “killersites.com” the most for web related activities.
It would be great if you will publish new post on web programming with database as back end. I like OOP also.
Thanks .
and why you dont tell anything for the design software like as photoshop and flash and dreamweaver ??
very nice. But I want to know the better institutions
to learn it in India, which is my country.
I think you are right on your roadmap. The future for webdesign seems to be HTML5 related. Flash will still remain an formidable tool for desktop applications and games and animations etc. I still hope for some Actionscript 3.0 course on the site, please ?
This is so great artile.thanks for this
[...] If you want to maximize your chances of having your job outsourced, concentrate on Java and .NET. If you want to create nimble web applications for small and medium sized businesses, then you should be working with PHP or Ruby, MySQL, HTML 5, CSS 3 and JavaScript. Learn more about 2012 web skills. [...]
You didn’t menthion Android development….
I like this analysis. As a web designer with clients in say Africa where most of them have a target audience that is using internet cafes to surf the web features that use flash are basically a drawback. Some websites will be asking them to download flash player but the owner might not want them to download anything and hence they end up leaving the page and going somewhere else.
@Anthony,
That is another example where sticking to the standards does help in many ways.
Stefan
Stefan:
I have sent my inquiry/message to your email regarding payment for the tutorial books and videos. I dont have pay pal only credit card.
Hope you can check my message. Waiting for your instructions and reply.
Thanks!
@Jun,
You can pay with credit using our own processor or use paypal … you don’t need a paypal account to pay with your credit card on paypal. This video covers the buying process:
http://www.killervideostore.com/free-support-videos/kvs-buying-videos.php
Hi Stefan,
I understand as of late that mobiles are about to overtake the present desktop and laptop computers and that the focus of designers needs to be enhanced or at least redirected.
Dreamweaver CS5.5 seems to have been adapted to deal with mobile design and development. If possible, can you give us a good course focused on both this program and general mobile design issues ?
Also, database professionals are running wild for sqlite 3, also mostly in relation to mobile development. I hope you`ll give it some attention.
I still don`t agree on Flash, it is still a masterful design program, uniquely complete for 2 and 2.5D with 3D shortly and capable of writing for web, desktop and mobile devices. It will survive because of it`s relative ease of use and low cost compared to most programs in it`s class.
Still hoping for some attention for Actionscript 3.0 and Java.
@John Donner,
We are looking at mobile development training courses for sometime in the next 6 months.
… We are just busy with a new educational platform we are developing. That said, I do plan to put out a beginners Java course since Android development is Java based. From Android:
‘Android is a software stack for mobile devices that includes an operating system, middleware and key applications. The Android SDK provides the tools and APIs necessary to begin developing applications on the Android platform using the Java programming language.’
Stef
Good idea to start looking at Java, thanks !
I think now all web browsers being used today will understand HTML 5 and CSS3, because Google, Apple, Microsoft and Firefox are pushing these twin towers of power, pushing everyone to upgrade to the latest browsers
hello stefan,
thank you for sharing your knowledge with us. I’m a regular office employee (business course grad) and bec of high job competition I’m thinking of upgrading my skills by learning to do web design. I did made a quick research I stumble on this course outline:Web Basics / HTML Tag coding / HTML 5
Adobe Dreamweaver Workspace, Tools, and Panels
Adding/Modifying Text Contents
Working with Graphics for web
Mastering Cascading Style Sheet (CSS 3)
Page Layout Design and Site Structure
Using Reusable Templates, Libraries, and Snippets
Adding Media Elements (Flash, sound, video)
Creang Web Forms
Behaviors, Spry Effects, Spry Widgets and other Extension Packages
XML tag coding and SPRY XML Datasets
Site Uploading with FREE Sub‐domain per parcipant
do you think this will be enough to start with?
I would really appreciate your feedback.
Thanks, jenny
Photoshop?
@Jenny,
For the delay. The list looks good but it is Dreamweaver heavy. I would remove the Flash and Spry stuff … JQuery replaces both.
Stef
@Asif,
Photoshop basics are required. That said, web design and graphic design ARE NOT so tightly coupled anymore – you can be a great web designer with little graphic design or Photoshop skills.
Stefan
Hi,
I am interested in creating a website similar to the + chive .com which is powered by wordpress.
I am currently in an online html class, and I am about to sign up for a few college classes in web design.
Do you think college classes are worth it, or should I stick to cheaper online classes if I want to create a site similar to thechive.com?
Some of the online classes offered are:
Creating web pages with html- currently taking
Intro Css and xhtml
Intro Php and mysql
intermediate Css and xhtml
intermediate Php and mysql
Designing effective websites
Web pages advanced
Marketing your online business
Search engine postions, achieving top
Intro to dreamweaver cs3,4,5
Intermediate dreamweaver cs3,4,5
Intro to photoshop cs3,4,5
Intermediate photoshop cs3,4,5
Intro to wordpress.com
The college classes are:
Intro to web design 1
Intro to web design 2
Web systems
Photo editing and implementation
All of the online classes combined are cheaper than one college class, but I’m sure the college classes go more in depth and cover many of subjects the online classes offer.
What would you recommend to me?
Thanks for any help.
@Dan,
The course items seems ok … but a little vague IMHO. I am biased, but this course is better:
http://www.killervideostore.com/video-courses/complete-web-designer.php
Stef