Printable View
I need to seriously start getting myself prepared for later on, and I need to be a lot better at HTML and CSS. I only know the little basics, and I wanted some suggestions of some good books (or series) to help me code HTML and CSS. I really want a book that goes off of photoshop, that helps you code your layout after your slice it and code it properly without dreamweaver (if possible).
Any suggestions?
welll
learn html visually is good
and css for webdesigners only is good aswell
First mistake
You should code the layout first, and then slice the graphics so they fit the code. Not the opposit.Quote:
that helps you code your layout after your slice it
Common mistake among designers, one of the reason I never askes for a sliced layout.
Learning the scaffort pratice is the way to go :-) It consist of following steps:
1) Build the layout in boxes (different colour borders if you like) (avoid using tables)
2) Add CSS styling to handle borders, surfaces etc.
3) Add links, content
4) Add graphics !
Graphics is the absolute final step :)
Quote:
Originally Posted by DeathArt
kewl thanx i need tis as a prepair for a path in web design and prep myself in the next 3 years >< good bit of advice
Made no sense to me. Need a book/tutorial.Quote:
Originally Posted by DeathArt
Yeah It's possible without DreamWeaver, you can slice and code a layout in a text editor (Aslong as the layout is devided in images).
I remember a guy done a video tutorial on how to do it raw in notepad, think his name was Sean Greasley, or something like that.
I'll have a look now.
The main thing is, I need to go from: Slice layout, crappy beginner html coding, lots of errors. To: Knowing how to professionally code CSS. And I don't expect to do that in two days, I have 2-3 or 4 years.
Honestly, It takes a few weeks to learn HTML and CSS, although you'll probably need a list of tags from time to time. It'll probably take you a year or 2 to perfect it, but to truly perfect it, it's being flexible with any web development language. Working with HTML and CSS, HTML, CSS and PHP, HTML, CSS, PHP and MySQL, etc.Quote:
Originally Posted by Akai
Notepad (or the like) > Dreamweaver.
W3Schools Online Web Tutorials
I need one for coding photoshop layouts (better). Not just random HTML tuts.Quote:
Originally Posted by Shawnmb
Well you can slice your layouts first in photoshop, normally the code gets auto generated for you aswellQuote:
Originally Posted by Akai
Yes I know, that's obvious, but that has nothing to do with what I asked. I need to know how to code from there.., to add text, css, code it properly.Quote:
Originally Posted by sutsurikeru
I find the best editing software to be PSPad, which is very good, and can highlight many different syntaxes, in the way that you choose, even your own! - PSPad - freeware unicode developer editor for Microsoft Windows, capable handle near any syntax, e.g. HTML, PHP, XHTML, JavaScript, ASP, Perl, C and many other languages with HEX editor and multilanguage interfaceQuote:
Originally Posted by Shawnmb
There are a bajillion guides/ebooks on creating/coding layouts on the internet, I spent about 10 seconds and I found thisQuote:
Originally Posted by Akai
Complete Layout - Creation, Slicing & Coding - XHTML Valid - Adobe Photoshop Tutorials - Tutorial Dash
coding a phohotshop layout is simple its all that weve beeen talking about
write the CSS and html then insert specail effects and images
Photoshop Tutorials / Good-Tutorials
over 20k photoshop tuts
We're kind of going off topic from the main purpose of the thread. I don't want photoshop tutorials..
what program would you like to use instead of photoshop
Come on..., read the topic. I didn't say I wanted photoshop tuts, or to use any programs. I wanted a book or good tutorial series on how to code a good photoshop layout.Quote:
Originally Posted by coles12
ive been saying how and i posted 2 books to learn from......Quote:
Originally Posted by Akai
take your PSD and seperate all the buttons headers footers contetn area
and make your CSS with all those elements
the go into notepad
and write
<div id(if you used ids) or class if you used class ="elemnentname"></div>
then so on so forth
Sorry, I didn't see those books. I'll look into them right now.Quote:
Originally Posted by kip0130
These two things I don't understand. (What exactly does the div id do, where to play. And what elements in the CSS).Quote:
and make your CSS with all those elements
<div id(if you used ids) or class if you used class ="elemnentname"></div>
You need to learn up on some more HTML and CSS.Quote:
Originally Posted by Akai
Experience > AllQuote:
Originally Posted by KyleEnos
Special regarding webdevelopment, as there is so many different browser quirks. Internet Explorer is a study larger than the entire HyperText Markup Language.
most responses dont make sense, and something tells me mine wont either.. but here i go.
Most ppl now a day use Div's and not tables.. so to find out the properties u can get from div's read this CSS Tutorial. and get some blank CSS layouts here. Maybe u gona ask what are divs. Well they act like layers, u can put one on top of the other or move them around.. and basicly with couple lines. You can find alot of concepts about this if u just use Google:[GOOGLE]CSS[/GOOGLE]