Introduction To HTML
[Note: You need a text editor to do this. You can use Notepad or Text Edit. But it's so much better to download VS Code / Visual Studio Code. Save it with an extension of .html]
HTML stands for Hyper Text Markup Language
It is used to create webpages/websites.
It has a bunch of tags within angular brackets <....>
There are opening and closing tags for every element.
Opening tags look like this <......>
Closing tags look like this
The HTML code is within HTML tags. ( // code)
Here's the basic HTML code:
<!DOCTYPE html> <html> <head> <title> My First Webpage </title> </head> <body> <h1> Hello World </h1> <p> Sometimes even I have no idea <br> what in the world I am doing </p> </body> </html>
Line By Line Explanation :
<!DOCTYPE html> : Tells the browser it's an HTML document.
<html> </html> : All code resides inside these brackets.
<head> </head> : The tags within these don't appear on the webpage. It provides the information about the webpage.
<title> </title> : The title of webpage (It's not seen on the webpage. It will be seen on the address bar)
<body> </body> : Everything that appears on the webpage lies within these tags.
<h1> </h1> : It's basically a heading tag. It's the biggest heading.
Heading Tags are from <h1> to <h6>. H1 are the biggest. H6 are the smallest.
<p> </p> : This is the paragraph tag and everything that you want to write goes between this.
<br> : This is used for line breaks. There is no closing tag for this.
-------
Now, we'll cover some <Meta> tags.
Meta tags = Notes to the browser and search engines.
They donโt appear on the page.
They reside within the head tag
<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="Website Description"> <meta name="Author" content="Your Name"> <meta name="keywords" content="Websites Keywords"> </head>
Line By Line Explanation:
<meta charset="UTF-8"> : Makes sure all letters, symbols, and emojis show correctly.
<meta name="viewport" content="width=device-width, initial-scale=1.0"> : Makes your site look good on phones and tablets.
<meta name="description" content="Website Description"> : Describes your page to Google and helps people find it.
<meta name="author" content="Your Name"> : Says who created the page.
<meta name="keywords" content="Website's Keywords"> : Adds a few words to help search engines understand your topic.
_____
This is my first post in this topic. I'll be focusing on the practical side more than the actual theory, really. You will just have some short bullet points for most of these posts. The first 10 posts would be fully HTML. I'll continue with CSS later. And by 20th post, we'll build the first website. So, I hope it will be helpful :)
If I keep a coding post spree for like 2 weeks, would anyone be interested? o-o
I have no idea what I'm doing with my life. Honestly I just wanna sit back and cry. I have around 11 lessons for tomorrow's exam and let me tell you, it's not pleasant. T-T
Did 7+ hours of Business Studies
Completed Arabic Assignment
My brain is honestly fried. I have no idea what the hell I'm doing, i hope the exam is easy tomorrow :")
I hate ANY toxic/mean motivation so much. "You dont want to study because youre tired? Study tired." No? You a) wont learn anything (much probably) b)will give yourself a headache and you'll be dissapointed in yourself.
Especially: if you're sick, YOU DONT NEED TO LEARN. YOURE SICK, GET A TEA AND SLEEP. It can wait.
Day 2 [Multimedia Elements In HTML]
Welcome to day 2 :D
Day 1 [Introduction To HTML]
Line By Line Explanation:
(An attribute is extra info added to an HTML tag. So, is a tag. Src, alt, width and height are the attributes)
Tag : Used to add images to webpages
src : Used to give the URL of the image or the name of the image file
alt : specifies what will appear on the browser in case the image doesn't appear.
Width and height : Specifies the width and height.
Tag : Used to add audio
controls: shows a play/pause bar.
: your audio file (paste your file link there).
Type: Tells the browser what file you're showing it
Tag: Used to add videos
controls : lets users play/pause the video.
width and height: size of the video frame.
: your video file (paste your file link there).
Here's The Output โ
Additional Tip : Download these two extensions because they're really helpful.
Live Preview helps you to look your output without having to save it every time you make a change in VS code
Live Server is similar, it just shows you the output on the webpage.
You can search for these two in the extensions icon on the side.
_____________________
Hope it helps. Tomorrow, we'll cover links and lists xD
So... I didn't get selected for the competition but nevertheless, I'm glad I atleast tried my level best... Though, my computer teacher has now called me for another competition (not public speaking) i don't really wanna join but her glares are enough to make ice melt so... T-T
Anyway, today i:
Did some accounts sums and concepts (1 hr 30 mins)
Completed 70% of my computer assignment
Revised part 2 and 3 in lesson 3 of economics
That's it. My mid terms start from 18th so I need to pick my speed up because I have a huge portion to cover... especially in Business studies and Arabic, i haven't touched them in ages and both have 8 lessons for midterms :")
๐+๐
Hey lovely Anon! Thanks for the ask :D
๐ what is a project/assignment youโre really proud of?
Okay, so recently I had a computer project and we had to either make a video, animation or meme or whatever etc. And our team produced one video, one animation and 5 memes which was like alot of work in a span of 1-2 weeks. So, yeah, the teacher was really impressed and i was extremely happy with the results we got xD
Other one would also be a computer project, it was in junior year for the school exhibition. My friend and I did photoshop (like changing backgrounds, combining images etc) and yeah, that was cool xD
๐ a book/reading from your field youโd recommend/really enjoyed?
To be honest, I don't know what to say cause I'm still a senior in high school xD and i have no idea about what field I'll choose so... I don't know :")
And a reminder that higher education cannot be considered truly democratised if students can still be doomed to poverty with multiple or advanced arts and Humanities degrees...
Keep a small notepad with you so you can write down important things. If you don't write down things, you will definitely forget. It's gonna be helpful for you to stay organized.
I've struggled with this but I'm adapting, you know? So here are some of my tips I use for this :)
If you can't understand it at once, do not think that it is hard
Many times, the topic itself if simple but the way the textbook has described it is complex so go and search for related videos and Google about it until you've got a hint about what it is.
If it's complicated, divide the sentence.
When you find yourself getting completely lost in a topic while banging your head against the wall because it's so confusing.... separate each part of the sentence while you write each part as you say it out loud. It'll help you to atleast get a short idea about the subject.
Read! Read! Read!
Read it over and over again and underline the words you think are important, write them down, explain it to yourself, draw small diagrams around your notes, connect them through visual representation. The more you use different types of senses, the better you understand it.
Give yourself time.
Let yourself grasp what the whole topic is about, do not under any circumstances have a time limit for difficult topics. I took days just to understand how Javascript loops work and I'm still not fully clear about it but i can explain the general, very basic purpose of it.
Explain it to someone or yourself
The best way to learn is to teach, this actually does work. It helps you to put your understanding in words and clear any underlying questions. And lastly...
Handwritten notes!
I cannot stress this enough but things that you've written down generally stay in your memory for longer durations. I also prefer handwritten notes to digital ones cause personally it works better.
Hope this helps! :D
First day of school after Eid holidays and gosh, I'm tired but it was an overall alright day. Postponed the tests they were supposed to keep today (about 3 tests) and kept 2 other suprise tests... I don't think teachers know the meaning of "informing in advance" and "actually following their schedule" T-T
No one even asked for the assignments, I was annoyed because i literally wasted my time doing them and they didn't even ask ://
Anyways, I got done atleast somethings...
Did half of the new economics assignment
Completed Arabic homework
Completed English homework
Economics lecture (YouTube) 50 mins
Discussed computer assignment (we've barely started and we have so much to do)
Tomorrow, we have tests in economics, business studies, a seminar in English and probably my computer teacher's wrath... For some reason, despite starting so early this year, i feel way less confident than last year when i only touched my books during exams... life is so weird... And mid terms start in July (don't ask me how it's mid term already when it's only like the 2nd week of school and they haven't even completed half the portions for it T-T)
When people say they feel tired all the time, my only question is "What time do you sleep?" Like, If you sleep at 2 in the morning, of course you'll feel tired.
Don't set alarms in the morning. Set alarms to go to sleep. The max time you can stay awake is 12.
You sleep at the right time and you will automatically change for the better.
Don't push your body to do work beyond it's limit.
|| Isabelle || INFP-T || Study tips || Self improvement || Books ||
293 posts