Web Applications

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

0 comments

Post a comment

    Post a comment
    Embed Video
    Edit your comment Cancel

    1 Favorite

    Web Applications - Presentation Transcript

    1. Emerging Trends on the Internet S.Krishnamorthy Ex. Senior EDP Manager,Southern Railway, India Web Consultant http://www.cyberbrahma.com/
    2. The Evolution
      • Plain HTML web page
      • Add dynamic elements
        • Marquee
        • Applet
        • Javascript
        • Embed Audio
        • Flash Object
      • Plain text
      An Image
      • <HTML>
      • <style type=“text/css”>
      • <?php ?>
      • Content pulled from database
      • (dynamic database-driven web sites)
      Web Page Anatomy
    3. Are you satisfied?
    4. Web 2.0
      • Enhance creativity
      • Information sharing
      • Collaboration among users
      • Internet as a platform
    5. Web 2.0
    6.  
    7. Web 2.0 deciphered!
      • Web 1.0   Web 2.0
      • DoubleClick --> Google AdSense
      • Ofoto --> Flickr
      • Akamai --> BitTorrent
      • mp3.com --> iTunes
      • Britannica Online --> Wikipedia
      • personal websites --> blogging
      • domain speculation --> SEO
      • page views --> cost per click
      • screen scraping --> web services
      • publishing --> participation
      • CMS --> wikis
      • directories (taxonomy)--> tagging (&quot;folksonomy&quot;)
      • stickiness --> syndication
    8. Thus came XML
    9. The Paradigm shift
      • Beyond the Browser
      • Invisible Browser
      • Web Desktop
      • Desktop widgets – Function-based
      • Adobe Integrated Runtime
      • Flash
      • Flex
      • Flex is a highly productive, free opensource framework for building and maintaining expressive web applications that deploy consistently on all browsers, desktops and operating systems.
      Adobe Suite
    10. AIR Toolkit
      • Builds desktop applications
      • Persistence and rich functionality
      • Rich Internet Applications
      • OS – independent
      • Data-driven dashboards
      • NASDAQ, eBay, AOL, Yahoo!
    11. The Big Brother!
    12. Google Apps
              • Docs
              • Spreadsheets
              • Presentations
              • Sites
              • Calendar
              • Maps
              • Gmail
    13. And then comes Ajax!
        • Asynchoronous Javascript and XML
        • Communicates with the server in the background
        • Without interfering with the current state of the web page
        • Uses XHTML and CSS for presentation
        • DOM for dynamic display of and interaction with data
        • XML and XSLT for the interchange and manipulation of data
        • XMLHttpRequest object for asynchronous communication
        • Javascript for combine these technologies
    14. Gmail
    15. XML
      • Custom markup language – human legible
      • User-defined elements
      • Structured data sharing
      • Portable across systems
      • Well-formed
      • Valid
      • Semantic
    16. R S S
        • Rich Site Summary (RSS 0.91)
        • RDF Site Summary (RSS 1.0)
        • Really Simple Syndication (RSS 2.0)
      Resource Description Framework
    17.  
    18.  
    19. Ubiquitous RSS
        • RSS Feed Readers – Desktop & On Line
        • Aggregators & Syndication
        • News
        • Images
        • Podcasting
        • Video
    20. RSS Aggregators
        • Google Reader
        • Bloglines
        • Rojo
        • My MSN
        • Pluck
    21. RSS Aggegator with Google API
    22. RSS Mashup
        • Google Mashup Editor
        • Yahoo! Pipes
        • PageFlakes
        • Netvibes
        • iGoogle
    23. Web Graphics
        • JPEG, GIF & PNG
        • Positioning by CSS
        • Wrap around text
        • Image Galleries
        • IrfanView
        • Copying Images
        • Image Manipulation
        • img.centered {
        • display: block;
        • margin-left: auto;
        • margin-right: auto;
        • }
        • img.alignright {
        • padding: 4px;
        • margin: 0 0 2px 7px;
        • display: inline;
        • }
        • img.alignleft {
        • padding: 4px;
        • margin: 0 7px 2px 0;
        • display: inline;
        • }
        • .alignright {
        • float: right;
        • }
        • .alignleft {
        • float: left
        • }
    24. Image Markup
          • <img class=“alignleft” src=“/images/sk.jpg” alt=“I am The Greatest” />
          • <img style=“float: left;” padding: 3px;” …/>
      • <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;>
      • <html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;>
      • <head>
      • <title> Image Markup Tutorial</title>
      • <meta name=&quot;generator&quot; content=&quot;Cyber Brahma&quot; />
      • <meta name=&quot;author&quot; content=&quot;S.K&quot; />
      • <meta name=&quot;keywords&quot; content=&quot;&quot; />
      • <meta name=&quot;description&quot; content=&quot;&quot; />
      • </head>
      • <body><p><img style=&quot;float: left; padding: 3px;&quot; src=&quot;/images/sk.jpg&quot; width=&quot;80&quot; height=&quot;80&quot; alt=&quot;I am The Greatest&quot; />Lorem ipsum dolor sit amet, blah…blah…. </p>
      • <p>&nbsp;</p>
      • <p><img style=&quot;float: right; padding: 3px;&quot; src=&quot;/images/sk.jpg&quot; width=&quot;80&quot; height=&quot;80&quot; alt=&quot;I am The Greatest&quot; />Lorem ipsum dolor sit amet, blah… blah…. </p>
      • <p><br /></p>
      • <p><img style=&quot;display: block; margin-left: auto; margin-right: auto; padding: 3px;&quot; src=&quot;/images/sk.jpg&quot; width=&quot;80&quot; height=&quot;80&quot; alt=&quot;I am The Greatest&quot; />Lorem ipsum dolor sit amet, blah… blah… </p>
      • </body>
      • </html>
    25. Result of Markup
    26. Image Gallery
          • Flickr and Picasaweb
          • Image data through RSS
          • API for manipulation
          • Pull from the repository
          • PHP + MySql + ImageMagick/NetPBM
          • Organize, annotate, tag and discuss
          • Lightbox, Highslide Javascript
    27.  
    28. Irfan View
    29. Copying images from the Web
      • Right click method
      • Print Screen method
      • Cache copy method
      • Look for Licence
      • EXIF data
      • Beware of IPR
      • Re-save without data
      • Photoshop enhancement
    30. Image manipulation on the Web
      • <?php // Load image $image = open_image('flower.jpg'); if ($image === false) { die ('Unable to open image'); }
      • // Get original width and height $width = imagesx($image); $height = imagesy($image);
      • // New width and height $new_width = 150; $new_height = 100;
      • // Resample $image_resized = imagecreatetruecolor($new_width, $new_height); imagecopyresampled($image_resized, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
      • // Display resized image header('Content-type: image/jpeg'); imagejpeg($image_resized); die();
      • ?>
    31. On the Fly with PHP
      • Dynamic resizing
      • Watermarking
      • Thumbnail creation
      • Rotating
      • Reducing file size
    32. Working with images..
      • Adobe Photoshop
      • GIMP
      • Stegenography
    33. Thank You S.K is only an email away at [email_address] Any time for any info on the New Net!

    + kichukichu, 2 years ago

    custom

    827 views, 1 favs, 1 embeds more stats

    This presentation was made by me for the students o more

    More info about this document

    CC Attribution License

    Go to text version

    • Total Views 827
      • 811 on SlideShare
      • 16 from embeds
    • Comments 0
    • Favorites 1
    • Downloads 22
    Most viewed embeds
    • 16 views on http://cyberbrahma.com

    more

    All embeds
    • 16 views on http://cyberbrahma.com

    less

    Flagged as inappropriate Flag as inappropriate
    Flag as inappropriate

    Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

    Cancel
    File a copyright complaint
    Having problems? Go to our helpdesk?

    Categories