Register FAQ / Rules Forum Spy Search Today's Posts Mark Forums Read
Go Back   MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Reply
 
Thread Tools Search this Thread Display Modes
Old Aug 1, 2013, 01:54 AM   #1
macmesser
macrumors 6502
 
Join Date: Aug 2012
Best way get current with HTML/CSS

Trying to expand my skill set and get up to speed with HTML5/CSS3. Will I find support or (lack of support) for new features fairly consistent across browsers? Any book recommendations?
macmesser is offline   0 Reply With Quote
Old Aug 1, 2013, 07:21 AM   #2
olup
macrumors regular
 
Join Date: Oct 2011
Depends what browsers you need to support. If it's < IE8, then definitely use the html5shiv script to support all those html5 tags.

As far as CSS3 is concerned I think there's still a lot of stuff that requires prefixes (-moz,-webkit,-ms,-o). A reliable source to check, what still needs to be prefixed and what doesn't is:http://www.caniuse.com

For CSS3 I remember reading the Book of CSS 3 by Peter Gasston, it was pretty decent, explained the css animations. transitions, transforms and such pretty well.

As far as HTML 5 is concerned I bought the HTML 5 book my Remy Sharp and Bruce Lawson. It's a rather basic book that gives you an overview of all the new features in HTML5.

Obviously the best way is to work on some project or create your own because that's where you will learn the most from.
olup is offline   0 Reply With Quote
Old Aug 2, 2013, 10:52 AM   #3
macmesser
Thread Starter
macrumors 6502
 
Join Date: Aug 2012
Quote:
Originally Posted by olup View Post
Depends what browsers you need to support. If it's < IE8, then definitely use the html5shiv script to support all those html5 tags.

As far as CSS3 is concerned I think there's still a lot of stuff that requires prefixes (-moz,-webkit,-ms,-o). A reliable source to check, what still needs to be prefixed and what doesn't is:http://www.caniuse.com

For CSS3 I remember reading the Book of CSS 3 by Peter Gasston, it was pretty decent, explained the css animations. transitions, transforms and such pretty well.

As far as HTML 5 is concerned I bought the HTML 5 book my Remy Sharp and Bruce Lawson. It's a rather basic book that gives you an overview of all the new features in HTML5.

Obviously the best way is to work on some project or create your own because that's where you will learn the most from.

Thanks for response. Will check out the books. I'm not all that interested in animations and such at this point. Just need to be able to do solid basic layouts with styles and semantic HTML and whatever new elements can be used with common browsers. Will be starting on some projects which I want to be easily upgradeable and therefore basically modern.
macmesser is offline   0 Reply With Quote
Old Aug 30, 2013, 01:51 AM   #4
geekrew
macrumors newbie
 
Join Date: Aug 2013
HTML5 is a markup language used for structuring and presenting content for the World Wide Web and a core technology of the Internet. It is the fifth revision of the HTML
geekrew is offline   0 Reply With Quote
Old Sep 2, 2013, 08:02 AM   #5
shelle
macrumors newbie
 
Join Date: May 2013
And don't forget to compress them, I mean on CSS. For better speed performance of your website i strongly recommend Minify (Google is also strongly recommend that, so if you don't believe me believe him

And for HTML I recommend to use W3 validator to avoid mistakes..
__________________
Saundz - the best English pronunciation software on the Web!
shelle is offline   1 Reply With Quote
Old Sep 5, 2013, 10:35 PM   #6
DisMyMac
macrumors 65816
 
DisMyMac's Avatar
 
Join Date: Sep 2009
Are there any good ways to translate HTML into CSS? This blog once had a tool, but it's currently down.

Of course this is like guessing a word from reading a definition, but surely it can be done. I don't expect something like layers to translate, however I've been panicking ever since <font> tags were deprecated.

There is another old thread on this topic, but the answers were unhelpful.
DisMyMac is offline   0 Reply With Quote
Old Sep 6, 2013, 01:42 PM   #7
beautifulcoder
macrumors regular
 
Join Date: Apr 2013
Location: The Republic of Texas
Here is a good starting point. Take any word document like your resume (or excel for a challenge). Then turn it into pure HTML/CSS. Trust me, you'll learn the CSS box model and may even dream it in your sleep.
beautifulcoder is offline   0 Reply With Quote
Old Sep 6, 2013, 02:03 PM   #8
960design
macrumors 6502a
 
Join Date: Apr 2012
Location: Destin, FL
Quote:
Originally Posted by DisMyMac View Post
Are there any good ways to translate HTML into CSS? This blog once had a tool, but it's currently down.
Yes, rewrite the code to current standards. HTML is for structure, CSS is for presentation. DO NOT mix the two. Your site should stand alone with well structured HTML5. Then add the CSS to make it pretty. Then add javascript to make it move. Then add server-side ( PHP for example ) to make it dynamic.

I've been very impressed with IE10/11 ( ducks behind pedestal to dodge thrown shoes ). The future looks very bright and much easier to write code without tons of IE fixes.

PS contentEditable, localStorage and websockets have completely changed the way I develop web sites.
__________________
TI-99/4A, tape cassette, 12" B&W Zenith
960design is offline   2 Reply With Quote
Old Sep 6, 2013, 02:54 PM   #9
beautifulcoder
macrumors regular
 
Join Date: Apr 2013
Location: The Republic of Texas
Quote:
Originally Posted by 960design View Post
I've been very impressed with IE10/11
*throws rotten tomato*

In my organization we are still stuck on IE8 with rumors of an upcoming upgrade to IE10. The future does look good indeed.

I have heard it said, the only reason IE exists is so you can get on the web and download a better browser.
beautifulcoder is offline   0 Reply With Quote
Old Sep 6, 2013, 08:56 PM   #10
DisMyMac
macrumors 65816
 
DisMyMac's Avatar
 
Join Date: Sep 2009
Quote:
Originally Posted by 960design View Post
Yes, rewrite the code to current standards. HTML is for structure, CSS is for presentation. DO NOT mix the two. Your site should stand alone with well structured HTML5. Then add the CSS to make it pretty. Then add javascript to make it move. Then add server-side ( PHP for example ) to make it dynamic.
I'm trying to un-mix them, but I'm not rewriting old code because it's too much work. I just have to hope someone comes along with a program someday, a kind of "markup messiah"....
DisMyMac is offline   0 Reply With Quote
Old Sep 17, 2013, 04:01 AM   #11
shelle
macrumors newbie
 
Join Date: May 2013
Quote:
Originally Posted by DisMyMac View Post
I'm trying to un-mix them, but I'm not rewriting old code because it's too much work. I just have to hope someone comes along with a program someday, a kind of "markup messiah"....
Believe me, that program/software will be a "gift from god" to webmasters, because i can't imagine more helpful tool then that software..

But until that day, as 960design said: use clean HTML for structure, rich CSS for presentation and PHP to make your website dynamic and that's it..

I wouldn't use javascript if it is not necessary, because they can make website too much slow...
__________________
Saundz - the best English pronunciation software on the Web!
shelle is offline   1 Reply With Quote
Old Oct 7, 2013, 04:15 AM   #12
trenthanover
macrumors newbie
 
Join Date: Oct 2013
There are so many books and ebooks available.i think you should try w3c school tutorial at your own so it will be more helpful.
trenthanover is offline   0 Reply With Quote
Old Oct 29, 2013, 07:21 AM   #13
trenthanover
macrumors newbie
 
Join Date: Oct 2013
I think both are necessary for the website because HTML is used for the structure of your website and CSS is the presentation of your page or structure.
trenthanover is offline   0 Reply With Quote
Old Oct 31, 2013, 03:47 PM   #14
DisMyMac
macrumors 65816
 
DisMyMac's Avatar
 
Join Date: Sep 2009
Quote:
Originally Posted by shelle View Post
Believe me, that program/software will be a "gift from god" to webmasters, because i can't imagine more helpful tool then that software..

But until that day, as 960design said: use clean HTML for structure, rich CSS for presentation and PHP to make your website dynamic and that's it..
I thought about this a bit more. I think that "miracle" translator I want is called a web browser.

You can export to so many formats now, then fix all of the elements in Komodo or whatever....
DisMyMac is offline   0 Reply With Quote
Old Oct 31, 2013, 09:00 PM   #15
Flood123
macrumors 6502a
 
Flood123's Avatar
 
Join Date: Mar 2009
Location: Living Stateside
You could always try a subscription to teamtreahouse.com. There are TONS of great free sites dedicated to this subject. www.css-tricks.com and www.smashingmagazine.com are a few. Smashing has GREAT books for sale. All reasonably priced.
Other than that, all I can really tell ya is google is your friend. Any question you could possible have, someone has posted about it before.This is fun stuff. Dig in.
__________________
Yada, yada, yada.
Flood123 is offline   0 Reply With Quote
Old Nov 1, 2013, 01:18 AM   #16
jrawl004
macrumors newbie
 
Join Date: Aug 2012
Location: Austin, TX
Every heard of Macaw.....

You should check them out here. I think they are designing that "holy grail" web design tool you seek and the best thing is, it's due to release on MAC in Jan 2014 and PC shortly after.

Quote:
Originally Posted by shelle View Post
Believe me, that program/software will be a "gift from god" to webmasters, because i can't imagine more helpful tool then that software..

But until that day, as 960design said: use clean HTML for structure, rich CSS for presentation and PHP to make your website dynamic and that's it..

I wouldn't use javascript if it is not necessary, because they can make website too much slow...
jrawl004 is offline   0 Reply With Quote
Old Nov 1, 2013, 07:45 PM   #17
Flood123
macrumors 6502a
 
Flood123's Avatar
 
Join Date: Mar 2009
Location: Living Stateside
why would you want software to write your code for you if you do it professionally? you have to know how to troubleshoot things. It's fun to do it yourself.
__________________
Yada, yada, yada.
Flood123 is offline   0 Reply With Quote
Old Nov 2, 2013, 07:54 PM   #18
Flood123
macrumors 6502a
 
Flood123's Avatar
 
Join Date: Mar 2009
Location: Living Stateside
https://learnable.com/courses/html5-...484#watchvideo
__________________
Yada, yada, yada.
Flood123 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
General: TimePasscode - A tweak that sets the current passcode to the current device's time Maverick1337 Jailbreaks and iOS Hacks 0 Feb 1, 2014 10:23 AM
Is Coda still the popular choice for CSS and HTML? chrono1081 Web Design and Development 3 Oct 27, 2013 02:06 PM
Help me with CSS. waloshin Web Design and Development 9 Jan 1, 2013 08:30 AM
Best way to code this in CSS/HTML fig Web Design and Development 8 Dec 3, 2012 07:26 AM
Slicing Tutorial to HTML / CSS AFPoster Web Design and Development 3 Nov 2, 2012 02:49 AM

Forum Jump

All times are GMT -5. The time now is 10:27 PM.

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

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