Learn Webdesign
This is for those newbies who want to learn the basics of webdesign i.e Html, Css & a little Javascript!
Monday 2 September 2013
Lexical Structure of Javascript
Lexical structure of javascript is the lowest-level( Very basic ) syntax in which the programs is written. The character set of javascript programs is the UNICODE which is the superset of LATIN-1 & ASCII. Lexical structure tells what happen when we add extra spaces in our programs, syntax of comments, reserved words and case sensitivity it is the basic level syntax for writing javascript code.
Friday 23 August 2013
Google fonts vs Adobe fonts
Love typography? yeah me too, today i am gonna show you two typographic sites one is free and one paid.
First the free one, the google fonts http://www.google.com/fonts
Google fonts let you include web fonts in your web site using something called @font-face property of CSS3. Currently at the time of my writing Google Fonts have 629 fonts variety to choose and include in your website.
Now the paid one Adobe's https://typekit.com/fonts
Dont let the word "paid" scare you, it gives you the "one month complete trial" period when you signed up currently there are 934 web fonts to choose from
The choice is yours =)
First the free one, the google fonts http://www.google.com/fonts
Google fonts let you include web fonts in your web site using something called @font-face property of CSS3. Currently at the time of my writing Google Fonts have 629 fonts variety to choose and include in your website.
Now the paid one Adobe's https://typekit.com/fonts
Dont let the word "paid" scare you, it gives you the "one month complete trial" period when you signed up currently there are 934 web fonts to choose from
The choice is yours =)
Division Using DIV Tag
<div> is known as division in html document. It is a paired tag which means if it open it needs to be close like this:
<div> Content goes here </div>
In contrast <meta />, <link />, <img />, <br /> and <hr /> which are of course standalone( empty tags ).
Divs are just like an empty vessels where you can put many different elements inside it this is what make it so special. Gone are the days when web designers use <table> to make page layout now it all done through <div> tags. Div is the block level element what it means that it takes up space before its presence and after its presence, and also left to right.
For instance:
<div>
<p>
Hello world hi how are you all. Hello world hi how are you all.
</p>
</div>
I filled the "DIV" tag using <p> element.
More block level elements are <p>, <h1 to h6>, <nav> etc. In contrast there is also inline level elements like <span>, <a> which we will explore later.
<div> Content goes here </div>
In contrast <meta />, <link />, <img />, <br /> and <hr /> which are of course standalone( empty tags ).
Divs are just like an empty vessels where you can put many different elements inside it this is what make it so special. Gone are the days when web designers use <table> to make page layout now it all done through <div> tags. Div is the block level element what it means that it takes up space before its presence and after its presence, and also left to right.
For instance:
<div>
<p>
Hello world hi how are you all. Hello world hi how are you all.
</p>
</div>
I filled the "DIV" tag using <p> element.
More block level elements are <p>, <h1 to h6>, <nav> etc. In contrast there is also inline level elements like <span>, <a> which we will explore later.
Quirks Mode
When you forget or didn't even include <!DOCTYPE html> in your webpage then some web browsers fall back into quirks mode, it is so important to include DTD(DOCTYPE Declaration) at the very top of the page. When we include "DOCTYPE" we are actually telling web browser that the following HTML code is written in standard mode.
More information at:
http://en.wikipedia.org/wiki/Document_type_declaration
More information at:
http://en.wikipedia.org/wiki/Document_type_declaration
Tuesday 20 August 2013
What is HTML?
HTML stands for Hypertext Markup Language. Every website you view on the internet is built using HTML it is the base of every website however websites like facebook, twitter, google or youtube use many scripting and programming but the structure( Skeleton ) built on HTML.
Hypertext means a simple text but with hyperlinks(links) in it.
Linear text means a simple text written on a book or in newspaper.
In HTML syntax we < Markup > text using tags( <> ) to tell the structure of website to the browser, for instance i want to add paragraph to my site( website ) for this purpose i am going to use built-in "paragraph pair tags" i.e <p></p> syntax is:
<p>Hello World</p>
This will render or interpreted by the browser as paragraph.
Hypertext means a simple text but with hyperlinks(links) in it.
Linear text means a simple text written on a book or in newspaper.
In HTML syntax we < Markup > text using tags( <> ) to tell the structure of website to the browser, for instance i want to add paragraph to my site( website ) for this purpose i am going to use built-in "paragraph pair tags" i.e <p></p> syntax is:
<p>Hello World</p>
This will render or interpreted by the browser as paragraph.
Good to know ...
- HTML is simple and not very hard to learn.
- HTML is the combination of tags, attributes and some set of rules.
- As we go further we are going to explore HTML is depth.
- In order to write HTML you should download apps like "Notepad++" for pc or "Text wrangler" for mac.
What is Webdesign?
"Web design is a process of creating websites"
But web design is a big thing its not that easy as it seems. Web design itself is a field of CS( Science ) inside, it contains many other areas like IA( Information Architecture ), Interactive Design, Back-end programming( PHP, .Net ), Mockups( Creating website visually on paper or on photoshop ) and many other areas.
History Of HTML
HTML stands for Hypertext Markup Language. It was developed by Tim-Berners lee in 1990's who was the programmer at netscape's company. HTML was originally based on SGML(Standard Generalized Markup Language) which means HTML syntax is influenced by SGML syntax, that's why they both share a common syntax, But the latest version of HTML i.e HTML5 is no longer based on the syntax of SGML.
The reason behind the development of HTML is computers to communicate with each other across distances, But you maybe wondering how computers can communicate with each other using HTML? when you enter www.facebook.com in the browser address bar the browser first resolve(convert) www.facebook.com into something that it knows which is ip address "173.252.110.27", then browser communicate to the server that serves "Facebook" and displays the website in front of a user.
Subscribe to:
Posts (Atom)