HTML and CSS - Origin

WEB DESIGN = DESIGN + INTEGRATION (HTML + CSS)

What is Design?

Is it something you sketch? Is it a bright idea in your mind? There are end less questions and answers about what design is. It is hard to just give one precise answer because design lives in so many areas of our lives.. Design involves finding solutions that fit the user, task, and context of use. Properly designed objects -- including software, tools, and web sites

What is Web Page?

When we examine the element of its Construction, a web document can consist of up to three Layers

1. Content - HTML
2. Presentation - CSS
3. Behavior - Javascript

What is HTML?

HTML – Hyper text markup Language Its not a Programing language, its a Markup Language.

What is the meaning of HYPER and MARKUP in HTML

HYPER: means Away From Its opposite to linear which means anything arrange in line. languages like C, C++, Java, etc, all these languages write in linear fashion. You can't skip a line. They have a proper path, they have a continuity. But in case of hyper you go anywhere on the internet by clicking a link. There is no set order to do things in. MARKUP: Markup is Preformatted text define some tags. In simple way we can say how we can distinguish normal text to system text, they way to write text for system called MARKUP.

Why we need HTML, why HTML invent, Origins of HTML

HTML was the brainchild of Sir Tim Berners Lee. Sir Tim Berners lee is a British Computer Scientist and MIT Professor.

• He is the inventor of www - (World Wide Web)
• He is the inventor of HTTP – (Hyper Text Transfer protocol)
• He is the inventor of urls - ( Universal Resource Locators)
• He is the inventor of HTML - ( Hyper Text Markup Language)

more about HTML and CSS - Origin

Cheers!! Joginder Poswal

Portable Apps for Web professionals

Portable application is a computer program that you can carry around with you on a portable device and is able to run independently without the need to install files to the system it is run upon.

I have a collection of some useful portable applications links and i want to share with my readers .

Mozilla Firefox - Mozilla Firefox®, Portable Edition is the popular Mozilla Firefox web browser bundled with a PortableApps.com Launcher as a portable app, so you can take your bookmarks, extensions and saved passwords with you.

Download Here

Google Chrome - Google Chrome is a browser that combines a minimal design with sophisticated technology to make the web faster, safer, and easier. Its Portable version runs web pages and applications with lightning speed. It's designed to be simple and stylish.

Download Here

OpenOffice.org - OpenOffice.org Portable is a complete office suite -- including a word processor, spreadsheet, presentation tool, drawing package and database -- packaged as a portable app, so you can take all your documents and everything you need to work with them wherever you go.

Download Here

7-Zip - 7-Zip is a file archiver with a high compression ratio.It supported packing / unpacking formats: 7z, ZIP, GZIP, BZIP2 and TAR and also Supported formats for unpacking only: ARJ, CAB, CHM, CPIO, DEB, DMG, HFS, ISO, LZH, LZMA, MSI, NSIS, RAR, RPM, UDF, WIM, XAR and Z.its Compression ratio for ZIP and GZIP formats: 2-10 % better than the ratio provided by PKZip and WinZip

Download Here


More in Portable Apps for Web professionals

Google Phone Gallery - Find the best Android powered mobiles

Want to buy a good and best Andriod Mobile, or want to know information about new andriod mobiles coming to market around the word? Google can helps you.

Google introduced a tool called Google Phone gallery, it's a showcase of Andriod phones you can buy todays.

As per Ben Serridge(Product Manager, Android) "Here at Google, we’re thrilled with the global adoption of Android and with the high quality of devices that are coming to market around the world. Since there are so many great phones, we wanted to make the selection process a little easier for people who are in the market for a new one. Today we’re rolling out the Google Phone Gallery -- a showcase of Android-powered devices that deliver the best Google experience today."



There are tools that make it easy to compare phones side by side: you can filter phones by country, manufacturer, and carrier; view and compare technical specifications and features; and find where each phone is available for sale.

The Toyota Prius Cars That Drive Themselves - Google's New Project

Google announced today that it has developed cars that drive themselves automatically in traffic and it has successfully road-tested them.

The cars drove all over California, including heavily trafficked Hollywood Boulevard and San Francisco’s Lombard Street, known for its tight zig-zag turns, according to the Google blog.
As google "Our automated cars use video cameras, radar sensors and a laser range finder to “see” other traffic, as well as detailed maps (which we collect using manually driven vehicles) to navigate the road ahead. This is all made possible by Google’s data centers, which can process the enormous amounts of information gathered by our cars when mapping their terrain."

More In Cars That Drive Themselves

How to Use New Indian Rupee Symbol(WebRupee) on your Webpage or Blog

On July 15, 2010 the union cabinet has approved the new symbol for the Indian Rupee. Now our currency rupee got its own symbol which give it a unique identity; designed by D. Udayan Kumar, Post-graduated by IIT (Indian Institute of Technology). Government announced that it will take about 2 year to make it available on the keyboards.

But designers started to use it on print, you might have seen it in newspapers and television. If you want to use it in your word document; just download the font and install it in your computer and press the key above 'tab' button and you'll get the rupee symbol. But to use it on web is little bit tricky. In today's post I am going to tell how to use the rupees' symbol in web pages.

In this tutorial we are using "@font-face" property of CSS to display rupee symbol on multiple browse. This Property first introduce in CSS 2.0. It does work on all the major & updated browsers. But it has some inconsistencies in older versions
More In How to Use New Indian Rupee Symbol

Interview Questions For Front End Web Developer

In this article, we will be discussing about the common questions that companies may ask you in your in-person interview as a CSS web developer or Front End Web Developer. There are no any fix pattern for these questions its all depends on the person who takes your interview. And also depends on on which level your are intervening.
So I categories its in to three levels.

1. Entry level
2. Intermediate
3. Expert level

Entry Level: This is the level one your are going for you first interview after finish your studies.

Questions:

What is CSS or What you mean by CSS ?

In computing, CSS is a style sheet language used to describe the presentation of a document written in a markup language. CSS, short for Cascading Style Sheets, a new feature being added to HTML that gives both Web site designers, developers and users more control over how pages are displayed. more about CSS....

What you mean by Cascading?

Cascading, A fundamental feature of CSS is that more than one style sheet can influence a document's presentation. In CSS every rule is assigned a specificity value based on the composition of its selector, its location within a style sheet, and the location of that style sheet relative to other style sheets. specificity is what helps the browser determine how much "weight" is to be applied to a given CSS rule, based on the situation in which it appears. more about Cascading...

Difference between HTML and XHTML.

HTML, stands for Hyper Text Markup Language, and XHTML stands for Extensible Hypertext Markup Language is a family of XML markup languages that mirror or extend versions of the widely used Hypertext Markup Language (HTML).

More in Interview Questions For Front End Web Developer

Div based layout vs Table based layout

When we start developing a static website we have two options for layouting. One is CSS based layout and another is table based. Lots of beginners have questions that which one is best. In initial phase of my career in many interviews, the interviewer always asked me this question, “What is the difference between CSS and table based layout? Give me some good reasons why we use CSS div based layout?”
There are so many reasons why CSS based design is superior to table based layout.

What is CSS

CSS stand for Cascading Style Sheets used to describe the presentation of a document written in a markup language and was introduced by the World Wide Web Consortium (W3C). in late 1996.

Cascading Style Sheets allow the designers to separate the content from the design of a web page and make the page more efficient, more consistence, more clean code, more accessible and easier to maintain and update.

Reasons why use CSS based layout:

Faster page loading :

when a user visit your website and if a page takes too long to load, user will simply often leave it. No one likes waiting for a web page to load. In table based layout website there are lots of code like, table, tr, th, td, height. Weight, bg color, align, etc. meaning that your browser has more to read before rendering the page. In CSS based layouts much less HTML coding than table based layout.
CSS based layout become 2-3 times faster in loading as compare to table based layout. When we use CSS for layout (external CSS file) browser will cache all the formatting and layouting for your page. This can result in much faster page lading time.

Accessibility and usability :

CSS based website is more accessible and usable than table based layout for user.

1. Universal cross browser support using cross browser declaration. Designer can create different css file for different browser.
2. Multimedia support: designers can specify CSS file specifically for mobile devices, printing, PDA's, Projectors, and computer screen, as a result website become accessible at all multimedia applications.

Visual Consistence across pages:

In table based layout it is easy to lose their consistency because each web page layout, design, and style are hard coding individual in every page. And if you want to change in your website across all pages you 'll have to change the code on every individual page. But as compare in CSS based layout the design elements can be defined in a single place( external css file) and will automatically be applied to those elements on the website. No need to change on individual pages one by one.

CSS is better for Search engine optimization (SEO):

As we already discussed that in CSS based layout there are less amount of code by which page loads faster, search engine spiders can easily crawl through the websites. Due to Less junk markup and Structural organization( by using h1, h2, h3 tags) makes it easier for Search Engine Spiders to decipher between code and content and determined what content is more important than others. As compare in table based layout

More in Div based layout vs Table based layout

cheers!!
Joginder Poswal