A Slide that goes fairly into detail at least with regards to the target audience, "Toddlers", teaching basic web frontend technologies such as html,css and javascript. to said audience
2. There are 3 things that make up today's frontend.
Html, CSS and javascript.
HTML is where you put the text and other content.
CSS makes your website pretty.
Javascript adds the magic. like making stuff move, appear and
disappear on command.
3. This is by far the simplest, kiddo.
Open up Notepad, type "I like ice cream"
Save it as icecream.html.
Open it in your web browser.
Viola, You have a Website.
HTML (SIMPLE)
4. Open up icecream.html in notepad.
Delete the content. and add
<!DOCTYPE html><html><head></head><body><div><p></p></div>
</body></html>
HTML (ADVANCED)
doctype html =tell the browser, this is a web page.
html = we put all html web stuff inside here
head = this is where we link our css files.
body = this is where we put our stuff.
div= think of it as a bucket.
p = paragraph
<x>y</x> = this is an element. while just the <x> is a tag
and anything with a / infront means we closing what we
opened.
5. Now add "i like ice-cream between the p's"
<!DOCTYPE html><html><head></head><body><div><p>I like ice-
cream</p></div></body></html>
save as index.html inside a folder called ice-cream
Now we really have a website. :)
HTML
6. Open up Notepad
Write
html,body{height:100% width;100%}
.div p {background:blue; color:white;}
Save it as style.css
In your html, inside the head tag,
type <link rel="stylesheet" href="style.css">
now we have a page with styling :)
CSS
7. Open up Notepad
Write
document.body.style.backgroundcolor = "red";
Save it as "javascript.js" inside the ice-cream folder
In your Html, inside the body tag, right before the closing
body tag, i.e"</body>".
type <script src="javascript.js"></script>
Now we have a page with javascript.
JAVASCRIPT
8. If You Want To Do More.
Or Get Lost/Confused.
Get On StackOverflow.com
Or just google or your problem.
DO MORE