Best sources to learn html and css?

[Lexi Lovegood]

I know there are about a billion profile help threads out there, and this isn't exactly that. I don't need help with a specific line of code nor do I want anyone to do anything for me, I'm just wondering, those of you who are self-taught, how did you learn? What are you favorite online or book resources? How long did it take you to figure it out? I intend to be doing this for a while, so I'd really like to be as self-sufficient as possible, but just Googling html tutorials isn't helping me much. Any other computer or tech related resources you use a lot or used when you were just starting out would also be helpful. I'm basically a toddler when it comes to technology and computer stuff so things that really break everything down into simple, easy steps are preferable. Thanks!

 

[TheLostYoutuber]

Hi,

I'm a computer scientist but I also have some experience in web design.

There are tons of resources that can help you online, but I can understand it can be quite overwhelming at first.
My advice would be just to pick up one ( I heard this https://www.sololearn.com/Courses/ have good courses for the very basics) and keep a learner mindset, for every trouble you encouter stackoverflow.com is the heaven for every computer-enthusiast. Really, just start somewhere and you'll see that you'll start feeling confortable very quick

Also this website have really nice tutorials, but it is for a more advanced coders -> https://css-tricks.com/

Feel free to shoot a message and ask if you have any problem

 

[Dan Epstein]

There are a few paid platforms that are good too, like Treehouse, or focused Udemy courses. I take a 20 minutes sprint each time, rather than try to specialize over a weekend binge.

 

[Goblin]

Mostly I learned from downloading (pirating if I'm honest) Adobe Dreamweaver and messing about on there

With a program like that it mocks up a live page to preview and you can click insert whatever you want, links, images tables, colours etc etc and you can look at the code as you go to see what's doing what

You can always then google tutorials; most tutorials will give you the bit of html you wanted pre-done anyway with only minor editing needed

For me, doing it like that I learned pretty quickly the basics of what does what

I will say though, if you want to make things look good it more comes down to knowing photoshop and having some natural creative panache for design

 

[Dan Epstein]

Yeah, but HTML&CSS gives you building blocks that can help later on with wordpress, bootstrap, python, and Content Management Systems in general.

 

[TheLostYoutuber]

I will say though, if you want to make things look good it more comes down to knowing photoshop and having some natural creative panache for design

That is not necessarily true, you can make everything with html and css (apart of course image graphics, and for that I agree), then javascript is a must if you wish to make it dynamic.

And if you plan to become a full stack developer, at that point you also need to learn PHP and have basis of databases.
A good PHP framework is Laravel and there is a really great Tutorial from scratch on youtube about it (https://www.youtube.com/playlist?list=PLillGF-RfqbYhQsN5WMXy6VsDMKGadrJ-)

**I guess I'm going a bit too far, but maybe it can be of your interest anyway ahah**

 

[Dan Epstein]

We could seriously use a thread with small coding challenges to be updated from time to time, along side with a thread of guitar tabs and chords of course.

 

[TheLostYoutuber]

We could seriously use a thread with small coding challenges to be updated from time to time, along side with a thread of guitar tabs and chords of course.

Ahah I would never expected to find coder-enthusiasts here, sounds like a good idea actually

 

[DFT]

We could seriously use a thread with small coding challenges to be updated from time to time, along side with a thread of guitar tabs and chords of course.

And cam model boot camp so new models don't get thrown in the deep end unaware!

https://www.w3schools.com - that and NotePad is how I started.

 

[AriAngel]

I actually learned HTML and CSS from playing Neopets back in the day.
Step 1: Play neopets & learn CSS
Step 2: ????
Step 3: Profit!

 

[Slapstick]

https://www.w3schools.com - that and NotePad is how I started.

This. Highly recommended.

Tons of simple to understand information about everything HTML/CSS related. Also includes an interactive editor so you can play around and immediately see the results of your changes. If you are just starting out you might want to find a few simple "Getting Started" tutorials, but w3schools is my go to reference.

 

[Goblin]

That is not necessarily true, you can make everything with html and css (apart of course image graphics, and for that I agree), then javascript is a must if you wish to make it dynamic.

In the context of the forum, I thought OP was talking about editing profiles and such?

To make a profile look good you need to be able to make attractive images, for buttons, for banners etc

You can't make a very attractive custom profile purely from html and basic css

 

[Slapstick]

Hi,

I'm a computer scientist but I also have some experience in web design.

What area? I am currently working in NLP (Natural Language Processing), in particular question answering systems for Bio-medical data.

We could seriously use a thread with small coding challenges to be updated from time to time, along side with a thread of guitar tabs and chords of course.

That would be a great idea. Although I would rather see and separate "Programming and Development" forum started rather than lumping everything into a single thread. I find that information is harder to find when it is buried deep in a perma-thread hundreds of pages long.

In the context of the forum, I thought OP was talking about editing profiles and such?

To make a profile look good you need to be able to make attractive images, for buttons, for banners etc

You can't make a very attractive custom profile purely from html and basic css

Typically I would have to disagree and side with TheLostYoutuber here. For example see https://chaturbate.com/littleang3le/ which is pure html/css. Sure, you will need some images, but anything that can be done in html/css (which is almost everything) should be done in html/css as it will behave much better across browsers and devices.

The problem is that Chaturbate makes it so fricking annoying to use pure html/css by requiring and all styles be inline. So I can't really fault anyone for just wanting to do the whole profile in Photoshop/Gimp/etc. However, nothing gets me out of a room faster than a tip menu image that is too large to fit on my screen.

 

[NotYou]

I am unsure if it still does, but Khan Academy ( https://www.khanacademy.org/ ) offers a lot of free learning, including css and html and more coding too.
The

 

[Goblin]

Typically I would have to disagree and side with TheLostYoutuber here. For example see https://chaturbate.com/littleang3le/ which is pure html/css. Sure, you will need some images

There's loads of images in that? (linked below) .. the overall aesthetic is done with images

ok you can find these things already done for you, but it's nice to have something personalised to your own tastes, personally I think these are pretty tacky

Background

https://camo.stream.highwebmedia.co...f756e64732f62675f77686974655f6d61696e2e706e67

Boxes

https://camo.stream.highwebmedia.co...32e636f6d2f323031352f30392f656d7074792e706e67

Buttons

https://camo.stream.highwebmedia.co...e636f6d2f323031362f31302f62625f7477742e706e67

https://camo.stream.highwebmedia.co...32e636f6d2f323031362f30392f72725f61312e6a7067

etc

 

[Slapstick]

There's loads of images in that? (linked below) .. the overall aesthetic is done with images

Yes, there are loads of images and you need images for backgrounds etc. But all the "content" (tip menu, rules, store items etc) is html text so it can be changed in a text editor without editing images.

Also, I didn't say it looked good Just that it was an example of a (mostly) pure html/css profile as opposed to a profile that is nothing but one big image file.

 

[TheLostYoutuber]

What area? I am currently working in NLP (Natural Language Processing), in particular question answering systems for Bio-medical data.

Oh nice, I'm into data analysis and artificial intelligence, but I'm doing a bachelor now.

 

[Lexi Lovegood]

Oh wow, you all are a fount of knowledge, thank you!

There are a few paid platforms that are good too, like Treehouse, or focused Udemy courses. I take a 20 minutes sprint each time, rather than try to specialize over a weekend binge.

Haha, I'm definitely a bingle-learner. I know it's not the most effective way to learn things, but the three sisters, attention, interest, and motivation, are fickle bitches, so I have to monopolize on them when they're around, lol.

Mostly I learned from downloading (pirating if I'm honest) Adobe Dreamweaver and messing about on there

With a program like that it mocks up a live page to preview and you can click insert whatever you want, links, images tables, colours etc etc and you can look at the code as you go to see what's doing what

You can always then google tutorials; most tutorials will give you the bit of html you wanted pre-done anyway with only minor editing needed

For me, doing it like that I learned pretty quickly the basics of what does what

I will say though, if you want to make things look good it more comes down to knowing photoshop and having some natural creative panache for design

Yeah, I looked at some Adobe products. Issue being I'm poor and also have no idea how to pirate because I'm an internet toddler/granny (however you want to look at it). Also, my internet company seems to be able to tell when I'm using something I didn't pay for. A friend brought over a pirated episode of Legend of Korra once and I got an angry email from my internet company. I know there are ways to get around that, but again, internet illiteracy. I know how to use Google and Facebook and that's about all I've got up my sleeve, lol. Perhaps if I actually start making some money at this I'll be able to sink some into good products.

And cam model boot camp so new models don't get thrown in the deep end unaware!

https://www.w3schools.com - that and NotePad is how I started.

I just found this online last night. I'm glad it's actually a good resource. It seemed legit, but honestly, I don't know enough to know the difference.

I actually learned HTML and CSS from playing Neopets back in the day.
Step 1: Play neopets & learn CSS
Step 2: ????
Step 3: Profit!

Hahah, I played Neopets a little. I honestly don't remember much about how it worked. All I know is that I feel a soul-crushing guilt when I think of the fact that I forgot my password and my Neopets are either dead or perpetually starving forever and ever..... Yeaaaaahhh, gonna have to change the subject.

 

[DivineNemesis]

And cam model boot camp so new models don't get thrown in the deep end unaware!

https://www.w3schools.com - that and NotePad is how I started.

When I saw this thread I was going to come in to say this. W3schools is an excellent resource.

If you run into a specific problem that isn't quite clarified by w3schools, it has probably been asked about 10 times on stack overflow already. So also check out stack overflow!

 

[Lexi Lovegood]

Huh, this is actually kind of fun. I thought it would feel like learning math and I would hate it, but it actually, well, I would say it feels like learning a secret code, but duh. Seriously though, I feel silly saying this, but I've had an interest in codes and ciphers as a means to relay secret information going back to middle school. My friends and I replaced all the letters of the alphabet with symbols so teachers couldn't read our notes and way later I had a boyfriend that I would write love notes to that he could only read if he could figure them out (he hated this, I thought it was fun and clever) but my brain somehow never made the connection that computer code would essentially be the same thing. I'm ridiculous.

 

[TheLostYoutuber]

Huh, this is actually kind of fun. I thought it would feel like learning math and I would hate it, but it actually, well, I would say it feels like learning a secret code, but duh. Seriously though, I feel silly saying this, but I've had an interest in codes and ciphers as a means to relay secret information going back to middle school. My friends and I replaced all the letters of the alphabet with symbols so teachers couldn't read our notes and way later I had a boyfriend that I would write love notes to that he could only read if he could figure them out (he hated this, I thought it was fun and clever) but my brain somehow never made the connection that computer code would essentially be the same thing. I'm ridiculous.

Great to hear that, even though HTML and css is not exactly what you are looking for then, because they technically are not even programming language, they are for structure and style of a webpage. For that you would maybe like to look into cryptography and start learning cool language (c/c++/java/Python etc..)

 

[Lexi Lovegood]

Great to hear that, even though HTML and css is not exactly what you are looking for then, because they technically are not even programming language, they are for structure and style of a webpage. For that you would maybe like to look into cryptography and start learning cool language (c/c++/java/Python etc..)

No it is. I'm mostly interested in being able to create a good profile and such, I'm just saying that it kind of reminds me of playing around with secret codes as a kid. Definitely going to start with the easy stuff I can use right away, and if I stay interested and motivated I'll progress from there.

 

[Lintilla]

I taught myself by example and by just doing things and fucking up. I've never found many courses or explicit teaching resources particularly helpful for HTML or CSS, personally. The web was also a lot simpler back in the early 90s, so viewing source code and copying what you see is not always so straightforward anymore. I still recommend that approach, though. Learn the basic structure of CSS and HTML from something like W3 and then dig in as soon as you can. Find a page/profile you like, view source to see how they did it, Google anything you see there that you don't understand.

http://www.mezzoblue.com/zengarden/alldesigns/ is a great place to learn what CSS can do. All of the designs there use the exact same HTML code. It's pretty similar to how you'll work with a camsite profile, since you can't alter a lot of that HTML.

In a past life I worked as a front end web developer, and I still enjoy solving problems and helping people out. I know the same goes for people in this thread and many others on these forums. I agree that hand-holding won't help long term, but if you find yourself banging your head against a wall, do ask questions! Community is the other most important resource.

 

[Lexi Lovegood]

The problem is that Chaturbate makes it so fricking annoying to use pure html/css by requiring and all styles be inline. So I can't really fault anyone for just wanting to do the whole profile in Photoshop/Gimp/etc. However, nothing gets me out of a room faster than a tip menu image that is too large to fit on my screen.

I know what this means now! That is both good info to know, and a pain in the ass.

 

[Goblin]

@Lintilla what did you disagree with about my post?

Find me a good looking profile that doesn't have custom made images

Thanks

 

[Lintilla]

@Lintilla what did you disagree with about my post?

Find me a good looking profile that doesn't have custom made images

Thanks

It's a matter of taste, so a link is irrelevant. I'm a minimalist, you're probably not. I don't like absolute statements like the one you made. I could find you a profile that in my opinion looked great without custom images, and you could say nahhhhh, that looks like shit. Wouldn't change my preferences, and it'sinot relevant to this thread beyond noting... Don't let anyone else dictate your taste, there's so much room to put your own personality into things!

 

[Goblin]

It's a matter of taste, so a link is irrelevant. I'm a minimalist, you're probably not. I don't like absolute statements like the one you made. I could find you a profile that in my opinion looked great without custom images, and you could say nahhhhh, that looks like shit. Wouldn't change my preferences, and it'sinot relevant to this thread beyond noting... Don't let anyone else dictate your taste, there's so much room to put your own personality into things!

That's fair, totally understandable

It was just jarring to have been left a disagree without explanation because I feel like it looks like I've left misleading advice

 

[Dan Epstein]

There's always the possibility of SQL training, that's what I do when I run out of sleeping pills

 

[Slapstick]

I know what this means now! That is both good info to know, and a pain in the ass.

It took me about three days and I said fuck it. I found a few programs on the web that would inline CSS styles, but nothing that did exactly what I want so wrote a program to do this for me. Now I have a simple prototype that will take a stylesheet and HTML file and inline all the styles for me. This allows me to easily tweaks the styles in a separate CSS file and quickly preview the page. Then I can generate the HTML with inline styles to make Chaturbate happy.

I will likely wrap this as a web service and put on Google App Engine for others to use if they are interested. It won't be as fancy and sleek as Dan20's cam girl profile editor, and it will require knowledge of CSS and HTML, but it should be better than dealing with the pages of gibberish that Chaturbate requires.

 

[missholly]

Codeacademy.com