The Lifestream Home The Lifestream Forums The Lifestream Shop Donate to The Lifestream
The Lifestream

ARCHIVED FORUMS

Hello. You are currently viewing the old vBulletin forums, which are now in readonly archive mode.
Please go to https://thelifestream.net/forums to go to the current forums.


Go Back   The Lifestream Forums > Topical > Technology

Technology Discuss and welcome your new computer overlords.

Reply
 
Thread Tools
Old 05/01/2018   #1
LicoriceAllsorts
Default Learning html

Hi all

I am teaching myself html (very slowly) and I wondered if any of you could recommend a free site - something other than the instructional site eg codeacademy or Lynda - where I could practice building a website using html?
__________________



<img src=http://i738.photobucket.com/albums/xx25/licoriceallsorts/smallerfiftyshadesofTseng-1.jpg border=0 alt= />

FIFTY SHADES OF TSENG
LicoriceAllsorts is offline   Reply With Quote
Thanked by:
f a n c y (05/01/2018)
Old 05/01/2018   #2
Tennyo
Default

Other than YouTube videos, I don't know what else there is other than Code Academy as far as free options go.

There this site: https://www.khanacademy.org/

I only heard about it just a few days ago and haven't had a chance to look into it much myself.
__________________
Tennyo is offline   Reply With Quote
Thanked by:
Vixenish (05/01/2018)
Old 05/01/2018   #3
Ergo
Default

W3schools is really good and offers interactive tutorials on loads of modules.
__________________



Deep into that darkness peering,
long I stood there, wondering, fearing, doubting,
dreaming dreams no mortal ever dared to dream before.
Ergo is offline   Reply With Quote
Thanked by 3:
Minato (05/02/2018), Obsidian Fire (05/01/2018), Vixenish (05/01/2018)
Old 05/01/2018   #4
LicoriceAllsorts
Default

Thanks everyone, but I know where to learn html, what I need is a recommendation for a site like wix.com where I can build a website using html.
__________________



<img src=http://i738.photobucket.com/albums/xx25/licoriceallsorts/smallerfiftyshadesofTseng-1.jpg border=0 alt= />

FIFTY SHADES OF TSENG
LicoriceAllsorts is offline   Reply With Quote
Old 05/01/2018   #5
Vixenish
Default

The site that will work best for you will vary based on your use case. Do you have a particular type of website that you're looking to build, or are you just trying to learn how to pull it all together?

Also, what else do you currently know? Have you done any CSS work yet? Javascript? PHP? Ruby?
Vixenish is offline   Reply With Quote
Old 05/01/2018   #6
LicoriceAllsorts
Default

I know nothing! This is my summer project.
__________________



<img src=http://i738.photobucket.com/albums/xx25/licoriceallsorts/smallerfiftyshadesofTseng-1.jpg border=0 alt= />

FIFTY SHADES OF TSENG
LicoriceAllsorts is offline   Reply With Quote
Old 05/01/2018   #7
Vixenish
Default

Sounds like you're just trying to figure out the basics of how hosting works then.

How have you been coding up HTML so far? Where are you currently putting your files?
Vixenish is offline   Reply With Quote
Old 05/01/2018   #8
LicoriceAllsorts
Default

I have tinkered around with some lessons on Codeacademy and Coursera but I haven't been saving the files anywhere. I don't have time to do this right now but I have a load of empty time in the summer.
__________________



<img src=http://i738.photobucket.com/albums/xx25/licoriceallsorts/smallerfiftyshadesofTseng-1.jpg border=0 alt= />

FIFTY SHADES OF TSENG
LicoriceAllsorts is offline   Reply With Quote
Thanked by:
Vixenish (05/01/2018)
Old 05/01/2018   #9
Kionae
Default

If it's just HTML, you don't need anything special. You can just save your files in a folder on your desktop and load them locally in the browser.

But if you're looking for a host for more advanced stuff like PHP/mySQL or whatever (and don't want to set up a local dev environment, which really isn't all that hard if you use something like WAMP), I'd go with https://www.000webhost.com/. That's where I plan on moving my site once my current term with Hostgator is up.

Also, if you don't want to pay for a domain for a practice site, http://www.dot.tk will give you a .tk domain for free.
__________________

Awards 'n Stuffs

Least Likely to Win an Award - 2nd Place
Kionae is offline   Reply With Quote
Thanked by 5:
Fangu (05/02/2018), LicoriceAllsorts (05/01/2018), Minato (05/02/2018), Obsidian Fire (05/02/2018), Vixenish (05/01/2018)
Old 05/01/2018   #10
Vixenish
Default

That's exactly where I thought you were. Agreed with Kionae, start by using files on your computer the way she outlined. However when you decide to put it online I recommend setting up a github account and using that to host your code. Reason being that if you intend to do this as any sort of living you're going to have to know how to use git.

So there's a bunch of background stuff that a lot of the free/piecemeal html tutorial sites forget to tell you, so here's a quick run down of the issues I see most people run into when they try to learn it this way:

Your computer should have some sort of basic text editor(not word, think note pad on windows) Create a folder on your desktop, and save the files in it. Use the file extension .html for your html files, and .css for all of your CSS files in that folder.

You should be able to open that file in the browser by "right clicking" on the html file and opening with the browser. The URL bar will show your file structure instead of the standard https style domain.

When you save the file you should follow the standard naming schema. EG, index.html is the home page of your site. main.css is the primary CSS file for your site. It's not necessary on your desktop, just a good habit to get into because there is functionality on servers/in browsers based around that naming schema.

For your html document make sure that you get the headers right and open and close the major structures properly. Meaning that all of your documents should open with a doc type tag, then html open, then header open and close, body open and close, html close.

It's also a good idea to bookmark this website: https://validator.w3.org/ The point of that is that it will automatically review your files and let you know if you've messed up the html stuff. HTML is not a strict coding language, so it can be hard to tell if you've done something improperly because a lot of bad ideas won't actually break your page until much much later, and when you learn it through piecemeal tutorials it's really easy to not know things like using the h4 tag for the title of your page instead of the h1 is a bad plan because SEO and editability 2 years from now.

When you study HTML you also need to study CSS. A scripting language in addition to that is good, but no modern webpage is done purely in HTML any more. HTML is the way you set up the content and the structure. CSS is how you should do the formatting. The reason for this is that the HTML formatting is done over and over in every file every time you need a style, but the CSS formatting is done once in the CSS file and referenced in every html file.

Example: Say you want to change the formatting on your links from the standard blue underline to a red font with no styling and then decide you want it to actually be yellow. If you did your styling in HTML you will have to go find that styling on every single link on your site and edit each line. This is often hundreds or even thousands of edits. If you did it in CSS you go into your CSS file and change a single line and it will apply against every single link on your page.

Also, if you are going to learn anything more complex than HTML and CSS understanding the way CSS works, and structuring your pages around that will mean that you already have a ton of good habits that carry over to the more complicated forms of web dev.

That's it off the top of my head. Let me know if you have any questions, I'm happy to help!
Vixenish is offline   Reply With Quote
Thanked by 5:
BforBrigitta (05/01/2018), InterfaceLeader (05/02/2018), LicoriceAllsorts (05/02/2018), Minato (05/02/2018), Obsidian Fire (05/02/2018)
Old 05/02/2018   #11
LicoriceAllsorts
Default

Thanks so much, Kionae and Vixenish! You've been really helpful. When you start learning something new, you don't know what you don't know, so this advice has really helped point me in the right direction.
__________________



<img src=http://i738.photobucket.com/albums/xx25/licoriceallsorts/smallerfiftyshadesofTseng-1.jpg border=0 alt= />

FIFTY SHADES OF TSENG
LicoriceAllsorts is offline   Reply With Quote
Thanked by:
Vixenish (05/02/2018)
Old 05/02/2018   #12
InterfaceLeader
Default

I will also throw in https://jsfiddle.net/ which lets you edit html/css and see the results straight away - useful if you are debugging or working stuff out
InterfaceLeader is offline   Reply With Quote
Thanked by 2:
BforBrigitta (05/03/2018), Vixenish (05/02/2018)
Old 05/02/2018   #13
LicoriceAllsorts
Default

That looks really useful! Thanks!
__________________



<img src=http://i738.photobucket.com/albums/xx25/licoriceallsorts/smallerfiftyshadesofTseng-1.jpg border=0 alt= />

FIFTY SHADES OF TSENG
LicoriceAllsorts is offline   Reply With Quote
Old 05/02/2018   #14
Kionae
Default

Vixenish wrote: Reason being that if you intend to do this as any sort of living you're going to have to know how to use git.
Unless you're like me and use svn instead.
__________________

Awards 'n Stuffs

Least Likely to Win an Award - 2nd Place
Kionae is offline   Reply With Quote
Thanked by 2:
Minato (05/02/2018), Vixenish (05/02/2018)
Old 05/02/2018   #15
LicoriceAllsorts
Default

I'm learning this just for interest. I already have a trade.
__________________



<img src=http://i738.photobucket.com/albums/xx25/licoriceallsorts/smallerfiftyshadesofTseng-1.jpg border=0 alt= />

FIFTY SHADES OF TSENG
LicoriceAllsorts is offline   Reply With Quote
Thanked by:
Vixenish (05/02/2018)
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 05:10 AM.



Powered by vBulletin®
Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.