Go Back   MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Reply
 
Thread Tools Search this Thread Display Modes
Old Oct 24, 2012, 10:36 PM   #1
eclipse
macrumors 6502a
 
Join Date: Nov 2005
Location: Sydney
How long to learn HTML5, CSS, php, JS, etc?

Hi all,
If I was to dive in as an amateur developer interested in designing and manipulating CMS's like Joomla and Wordpress, how long would it take to learn:

HTML5

CSS

PHP

JS?

Or would I just mainly be doing HTML and CSS and relying on forum support for the occasional PHP tweak? I'm mainly interested in being able to design websites in CMS, not completely reprogram the php I guess. Any estimates out there as to how long it takes to get a 'good' understanding of these languages?

Cheers
__________________
My computer: 27 Inch iMac, 2.7 GHz Intel Core i5 with 8GB RAM.
My page on how we know we are at world peak oil about now
eclipse is offline   0 Reply With Quote
Old Oct 25, 2012, 06:56 AM   #2
NathanCH
macrumors 65816
 
NathanCH's Avatar
 
Join Date: Oct 2007
Location: Stockholm, Sweden
Send a message via Skype™ to NathanCH
If you want to get into front-end then you're right that you will want to start with just HTML and CSS. When designing Wordpress themes, you will run into PHP but the Wordpress codex is good plus you may only end up editing one or two words.

I am still learning HTML and CSS after even doing it as my job for several years now. I am finding new ways to be more efficient. At the same time my design style is always changing putting me in new situations. So how long it takes to learn, depends how well you want to learn it. You could have a simple website going by the end of the day if you spend a few hours reading up first.

I should say, ideally for Front-end it would be more beneficial for you to learn JS before PHP if you want a job in front-end dev.
__________________
Design/Development Portfolio: Cetan.ca
NathanCH is offline   0 Reply With Quote
Old Oct 25, 2012, 12:19 PM   #3
fig
macrumors 6502a
 
Join Date: Jun 2012
Location: Houston, TX
Agreed, I do a lot of modifications to Wordpress themes, including starting with a blank theme and designing it out to something custom, and I know next to nothing about PHP but am pretty proficient in HTML and CSS.

That's definitely where you'll get the most return on your time investment, then once you've got those pretty nailed down you can start looking at what else it'll benefit you to learn depending what direction you're moving in.

Jquery can also come in really handy and isn't too tough to pick up as far as implementation.
__________________
figdigital | @figdigital | dribbble
fig is offline   0 Reply With Quote
Old Oct 25, 2012, 04:17 PM   #4
eclipse
Thread Starter
macrumors 6502a
 
Join Date: Nov 2005
Location: Sydney
Thanks guys, that's good feedback. Cheers.
__________________
My computer: 27 Inch iMac, 2.7 GHz Intel Core i5 with 8GB RAM.
My page on how we know we are at world peak oil about now
eclipse is offline   0 Reply With Quote
Old Oct 25, 2012, 08:29 PM   #5
jacob.3336
macrumors newbie
 
Join Date: Jul 2012
I learned it quickly, but you need to find a good tutorial series to watch. I would recommend TheNewBoston.com
jacob.3336 is offline   0 Reply With Quote
Old Oct 26, 2012, 11:46 AM   #6
YanniDepp
macrumors 6502
 
Join Date: Dec 2008
Honestly? You're always learning. The day you stop picking up new things and trying new approaches, you're in trouble.

I have a degree in computing science, and I left university in 2007. I've been building sites since: as my own one-man business, for a company in the city I live, and for a huge educational establishment. Looking back now, the code I wrote when I left uni is horrific. Even when I look at code I wrote a year ago, I see ways I could drastically improve it.

Although I do write PHP often, I really enjoy writing front-end code: HTML, CSS and Javascript. When you're dealing with this stuff, there are a few underlying concepts you really need to get. You can tell when people don't 'get' these concepts because their code grows into a monster, even when they try something mildly complex.

These tips are aimed at people who know how to write some HTML, and have used CSS before, and want to take their skills to the next level. If you're just starting out, you might not fully understand what they mean, but they'll keep you right.

The best lesson you can learn is about document flow. Block level and inline HTML elements, the styling limitations of both. What happens when you float (and clear) elements, what happens when you position elements absolutely or relatively, and how these ideas affect everything else on your page. People who don't understand these ideas tend to absolutely position everything, and give everything explicit heights and width. You really don't need to do this, and it makes your front-end code a nightmare to maintain.

Another important lesson to learn is CSS specificity. If you're new to CSS, you'll probably write rules and wonder why they're not appearing on your page. It's frustrating, but everybody does it at some point. There are times when certain CSS rules override certain other CSS rules: it's all in the selector that you apply the CSS rule with. #myID is more important than div.myClass, which is more important than .myClass, which is more important than div. People who don't understand specificity often end up with CSS with complex selectors, and often end up fighting to understand why certain CSS rules impact other things on their page. Nicole Sullivan gave an excellent presentation on this, calling it 'specificity war'.

If my first job after university, I was lucky enough to have a boss that really cared about writing neat HTML and CSS. He had crazily high standards, but they really helped me keep my HTML simple and meaningful, and my CSS clean. If you're going to be building themes for CMS and blogs, this is another important thing to learn. We call it 'semantic markup'. Here's a link that tells you a little bit about it.

The last lesson: don't arrange your site using tables. It's a tired cliché, but it's very important. There is a better way. I remember the first time I had to build a semantic XHTML site using CSS (without tables). I hated it and thought "this would be so much easier if I just used a table". But once you 'get' how to lay out content (which comes from lesson 1: document flow), you'll wonder why you ever used tables.
__________________
MacBook Pro (2012), 2.5 GHz Core i5, 16GB RAM
Mac Mini (2009), 2.0 GHz Core2Duo, 8GB RAM
iMac (2006), 2.0GHz Core Duo, 2GB RAM
iPhone 5 (16GB), iPod touch 5 (64GB), iPad 3 (16GB), iPod mini (16GB)

Last edited by YanniDepp; Oct 26, 2012 at 11:53 AM.
YanniDepp is offline   1 Reply With Quote
Old Oct 26, 2012, 01:17 PM   #7
SrWebDeveloper
macrumors 68000
 
SrWebDeveloper's Avatar
 
Join Date: Dec 2007
Location: Alexandria, VA, USA
 
Outstanding response from YanniDepp.

I add my affirmation to all that, and even in the sequence noted. I cannot stress more to the OP the first thing said, "You're always learning", as not only is the technology advancing, but so is the development community and support infrastructure. From a high level view as a developer in general it's exciting to be a part of the open source community in particular, even with all the sloppy code, egos and poorly documented crap which is part of a code base being shared and constantly evolving. It teaches you patience and diligence to research solutions beyond the first hit on Google. Then, ultimately, feel confident enough to help others.

Welcome to the community!

The only thing I can think to add beyond all the wonderful advice here is that the real learning - even for a front end UI person - comes from examining template code, making changes and seeing the affects (for better or worse) Books, video seminars, tutorials and support forums, blogs certainly are amazing, rich, and important as well as time saving measures. Nothing replaces opening up an IDE, looking at the code line by line and using books and all these other things as reference in the beginning.

You can't learn English from a dictionary if you don't know the construct of the language -- so also spend time to learn STANDARDS and BEST PRACTICES from the very outset via these key high level resources as you code your first projects:

W3 Schools - http://www.w3schools.com/w3c/w3c_intro.asp
W3C Validation tools - http://validator.w3.org/

This will make you a better developer, reduce costly errors in time and money in the future, and produce cross-browser compatible code. Front end people should also focus on learning 508 accessibility measures, which I understand was not a concern posted by the OP but I feel must be included in the conversation for those following:

http://www.epa.gov/inter508/standards/index.htm

Best of luck to you, and happy coding!
__________________
Jim Goldbloom
Sr. Web Developer, owner GoldTechPro, LLC
http://www.GoldTechPro.com
SrWebDeveloper is offline   1 Reply With Quote
Old Oct 26, 2012, 03:49 PM   #8
lucidmedia
macrumors 6502a
 
Join Date: Oct 2008
To the OP: I have been a member of this forum long enough to know that you have been asking questions about front-end web design and development since 2008, so gauging "how long" is impossible without knowing more context about what you know now, your motivations, prior experience, etc.

In abstract, the students in my program are decently proficient in designing and coding responsive web sites using HTML5 & CSS3 after a single semester-long introductory course... about 60 total hours of classroom time.

Another 60-hour "advanced" course covers PHP and Javascript.

So, the list you define comprises about 6 college-level credits. That will give you a strong foundation from, as noted by others, you will continue to learn.

In fact, you need to continue to learn. I have been very proficient at web development several times in my career. But, take a year or so away from hands on development and the landscape will shift so much that you find yourself starting from scratch again!

At various times in my career I was an "expert" at:

-coding with tables and clear pixel gifs,
-coding to XHTML web standards,
-semantic markup

and today I find myself re-learning how to make websites... this time coding responsive sites using frameworks. It never ends... Web design and development is a moving target...
lucidmedia is offline   1 Reply With Quote
Old Oct 26, 2012, 08:00 PM   #9
eclipse
Thread Starter
macrumors 6502a
 
Join Date: Nov 2005
Location: Sydney
Quote:
Originally Posted by lucidmedia View Post
To the OP: I have been a member of this forum long enough to know that you have been asking questions about front-end web design and development since 2008, so gauging "how long" is impossible without knowing more context about what you know now, your motivations, prior experience, etc.
Yeah, back then I was starting out on the web design journey mainly to help some activist stuff I was involved in at the time. A mere wordpress.com blog would have sufficed. Anyway, it turns out I can put all this to bed. I've been overruled. The designer wife just wants to design it herself in Muse. I'm out.

Oh well, time to find a cool Open Source game to play...
__________________
My computer: 27 Inch iMac, 2.7 GHz Intel Core i5 with 8GB RAM.
My page on how we know we are at world peak oil about now

Last edited by eclipse; Oct 27, 2012 at 01:29 AM.
eclipse is offline   0 Reply With Quote
Old Oct 27, 2012, 06:04 AM   #10
SrWebDeveloper
macrumors 68000
 
SrWebDeveloper's Avatar
 
Join Date: Dec 2007
Location: Alexandria, VA, USA
 
Quote:
Originally Posted by lucidmedia View Post
In abstract, the students in my program are decently proficient in designing and coding responsive web sites using HTML5 & CSS3 after a single semester-long introductory course... about 60 total hours of classroom time.
Another 60-hour "advanced" course covers PHP and Javascript.
It never ends... Web design and development is a moving target...
I know why you mentioned the 60 hours based on classroom time and recognize your disclaimer re: moving target and I do not think you're saying anyone, all the time, can learn in 60hrs guaranteed. ;-) But that is your estimate based on a measurable experience with specific goals (classroom learning) for a basic and initial understanding of the languages and their construct. Yet some of us noted the "years" taken to (paraphrasing) "master" the technologies or that it might only take "one single day" to get a basic site started if one is motivated enough.

So which is it? (asked rhetorically)

If I was the OP I might find all this somewhat confusing, estimates varying from one day to 60hrs classroom time to years. I point this out to remind the OP why some of the responders here made it a point not to mention specific time periods at all. I mean absolutely no disrespect to anyone who posted time estimates, and everyone really is right nor shall any opinion be censored, but my main concern is we don't want the OP to feel pressured to learn.

I agree with the comment, "So how long it takes to learn, depends how well you want to learn it" and hopefully we all do. This is an open ended response, but the most pragmatic.

That's why some of us focused on what to learn to help the OP.

From my reading of this topic, the technologies involved for front end development include HTML, CSS, Javascript and related frameworks mostly, including PHP/MySQL for advanced CMS template and theming which involves some back end code.

I hope the OP understands the original question as to "how long" really is impossible to answer accurately, and that the advice offered as to identifying you as a front end UI person and advising which technologies to focus on is really the proper and most responsible.

I added this comment to kind of summarize and consolidate things. No disrespect intended to anyone.

My .02.
__________________
Jim Goldbloom
Sr. Web Developer, owner GoldTechPro, LLC
http://www.GoldTechPro.com

Last edited by SrWebDeveloper; Oct 27, 2012 at 06:13 AM. Reason: Fixed a stupid typo
SrWebDeveloper is offline   0 Reply With Quote
Old Oct 29, 2012, 07:02 PM   #11
nartb
macrumors newbie
 
Join Date: Oct 2012
HTML5 Android App

Check out this app if you want to learn about HTML5 and have an android phone!

https://play.google.com/store/apps/d...html5reference
nartb is offline   0 Reply With Quote
Old Oct 30, 2012, 05:25 PM   #12
Lambros
macrumors regular
 
Join Date: Feb 2010
Location: Sydney, Australia
Quote:
Originally Posted by eclipse View Post
Hi all,
If I was to dive in as an amateur developer interested in designing and manipulating CMS's like Joomla and Wordpress, how long would it take to learn:

HTML5

CSS

PHP

JS?

Or would I just mainly be doing HTML and CSS and relying on forum support for the occasional PHP tweak? I'm mainly interested in being able to design websites in CMS, not completely reprogram the php I guess. Any estimates out there as to how long it takes to get a 'good' understanding of these languages?

Cheers
After about 18 months of HTML/CSS, I am now able to convert any Photoshop (PSD) file into a fully functional website (in Drupal, Joomla, WordPress or a standard HTML/CSS template). I acquired paid jobs after 6 months, and am now a freelance web developer (having worked previously for a company). After the initial 12 months, I found that to do anything "interesting" I needed to have a basic knowledge of JavaScript (more specifically, jQuery). So, I committed some time towards that.

The PHP in Drupal/Joomla/WordPress is easy to manipulate, especially if you have a basic knowledge of the English language (and you know what conditional statements and loops are). I am currently, after 18 months, committing my learning towards these fields. If a client actually asks for backend development (i.e. writing a plugin/module) there is usually much more money in the job.

However, for frontend development, you can gain a strong knowledge in 3-6 months (I was maintaining a full-time university degree simultaneously, and still am). I've also taught HTML/CSS, and would be willing to help you out if you want to shoot me a private message.

All the best!
Lambros is offline   0 Reply With Quote
Old Nov 10, 2012, 08:59 AM   #13
AFPoster
macrumors 65816
 
Join Date: Jul 2008
Location: Charlotte, NC
Check out this site: teamtreehouse.com
__________________
2014 15" Retina MacBook Pro 2.5Ghz i7
iPad 2 32gb (white)
iPhone 6+ 64gb (white)
iPhone 5s 16gb
AFPoster is offline   0 Reply With Quote

Reply
MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Similar Threads
thread Thread Starter Forum Replies Last Post
[php] - php problems os x mountain lion 10.8.2 cakas6933 OS X 10.8 Mountain Lion 4 Jun 10, 2014 09:08 AM
Looking for good resources to learn OOP PHP! clukas Web Design and Development 1 Jun 27, 2013 02:45 AM
New App for Photographers: The Seascapist - Learn Long Exposure Seascape Photography TheReef iPad Apps 1 May 17, 2013 03:51 PM

Forum Jump

All times are GMT -5. The time now is 05:53 PM.

Mac Rumors | Mac | iPhone | iPhone Game Reviews | iPhone Apps

Mobile Version | Fixed | Fluid | Fluid HD
Copyright 2002-2013, MacRumors.com, LLC