McGivrer's Home

life of french web developer

  • Gnome-Do and Docky, or the user oriented interface

    • 11 Jul 2010
    • 0 Responses
    •  views
    • design do docky gnome ubuntu ui usability
    • Edit
    • Delete
    • Tags
    • Autopost
    Logo for Gnome-Do, a simple gear on a light star purple background.
    Logo for Docky, an anchor on ligth star blue background.

    You know how you have some automated behaviour when you are working on a computer: how to open a file, how to launch any tool, etc...  So you know how Microsoft Windows contribute to open Computer to people, but also how it contributes to format "User" usage about User interface and behaviour !

    So, in the Linux world, during years, the goal was to bring to Linux user a User Interface oriented free Operating System. And during the few 2 or 3 last years, big evolution are drop in the pipe of Gnome evolution. First tries were gnome-shell and gnome-zeitgheist. But these tools are not matue for People.
    Screenshots?action=AttachFile&do=get&target=Screenshot-gnome-shell-overview.png
    Gnome Shell, The new Gnome Desktop approach
    So , Gnome Do and Docky are some of these beautiful tools design for easy life ! Gnome Do will enable you to launch any tools, docs, contacts just with one key shortcut and keying the first letters of the action you want to do!  Docky is another MacOSX Dock Icon clone. But a well integrated one for the Gnome Desktop.
    So launching an application or accessing one of the last docuemnt you've just write have never been so easy !
    Gnome Do
    Launching an application :
    ubuntu-gnome-do-1.png
    Mail to one of your contact:
    ubuntu-gnome-do-2.png
    And just retreiving one of your Google Docs:
    ubuntu-gnome-do-3.png
    Anyway, you are able to configure any interaction between Gnome-DO and your desktop enviroment, thanks to numerous plugins already existing which are able to connect to all the main applications you use everyday.
    ubuntu-gnome-do-preferences.png 
    Docky
    More as usual in our desktop, the docked toolbar at bottom screen is one of the most popular way to start an application. Docky is one of the most integrated to Gnome with a lot of customization for geeks :)
    Very easy to use and configure, just drag and drop icon of applications you want to be able to include in the dock bar. 
    Multiple skin exists for the Dock bar appearance, so just choose the one that's feat better to your own desire. 
    And start apps !
    ubuntu-gnome-docky.png
    Gnome Docky - The Gnome Desktop Dock Bar by excellence !
    And a lot of docklets (greffons in french) are available to enhanced your user experience, adding Weather, GMail state icon, Time, Battery life, Processor performance, and so on ...
    Also exists Plugins (greffons in french language), to connect Docky to other application like liferay, Gajim, Rythmbox, etc...
    Docklets preferences tab :
    ubuntu-gnome-docky-prefs-docklets.png
    Plugins preferences tab :
    ubuntu-gnome-docky-prefs-plugins.png
    So now, just Start Apps and enjoy ;)
    • Tweet
  • CSS: how to reset default value in a multi browsers scope ?

    • 9 Jun 2010
    • 1 Response
    •  views
    • css design reset web
    • Edit
    • Delete
    • Tags
    • Autopost

    Already have to produce web page to public target ?  And by public i mean out of intranet or extranet of the world of enterprise, targetting any public.

    Yes ?

    So the first thing to do before creating a CSS styles sheet is to start from the same point for all browser. And as all CSS specification version didn't tell a word about what are the default values, all browser developers go with there own randomly choosen values ;)

    A first solution
    So, it's mandatory to reset these values to be sure that your CSS will have chance to produce the same visual result on all web client of the world, any OS, any browser.

    The first technic is to reset individualy all html tags to some common values:

    html, body, div, form, fieldset, legend, label {
       margin: 0;
       padding: 0;
    }

    table {
       border-collapse: collapse;
       border-spacing: 0;
    }

    th, td {
      text-align: left;
      vertical-align: top;
    }

    h1, h2, h3, h4, h5, h6, th, td, caption { font-weight:normal; }

    img { border: 0; }


    Quick and dirty ?
    The second
    technic is to reset with a one big line
    :

    * {
     
      vertical-align: baseline;
      font-weight: inherit;
      font-family: inherit;
      font-style: inherit;
      font-size: 100%;
      border: 0;
      padding: 0;
      margin: 0;

    }


    Thanks to "Carrer Blog : CSS Mini Reset" for this very fast solution covering 80% rules.

    References
    Other solutions exists :

    • http://www.maxdesign.com.au/articles/css-reset/
    • http://perishablepress.com/press/2007/10/23/a-killer-collection-of-global-css-reset-styles/
    • http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
    • Tweet
  • What is HTML5 ?

    • 9 Jun 2010
    • 0 Responses
    •  views
    • css design graphics html html5 schema specifications
    • Edit
    • Delete
    • Tags
    • Autopost
    Html5_overview

    Thanks to Focus, we can have a nice view of what you get out of the box with HTML5.

    • Tweet
  • HTML5 full demo story

    • 26 Apr 2010
    • 0 Responses
    •  views
    • design html5 interactivity presentation web
    • Edit
    • Delete
    • Tags
    • Autopost
    http://apirocks.com/html5/html5.html#slide1

    nothing more, just read/see/contemplate :)

    Flash would have only some months to survive, after the "go live" of HTML5 ...

    • Tweet
  • Simple design with simple color and simple tools !

    • 6 Apr 2010
    • 0 Responses
    •  views
    • css demo design html js web
    • Edit
    • Delete
    • Tags
    • Autopost

    Yes, working as Web developer prevent me to be a good web designer. And sometime, I need focus on state of my knowledge about simple web languages as HTML and CSS.

    This is my "State Of the Art"  about web design.  A tentative of design ;)

    Comments are welcome.

    Capture-web-context_-_mozilla_

    Note: please, notate that red part at bottom is only for debug purpose ;)

    • Tweet
  • Typography and the Web

    • 30 Nov 2009
    • 0 Responses
    •  views
    • design font-faces fonts types web
    • Edit
    • Delete
    • Tags
    • Autopost

    Here is the most interresting presentation I've ever red on this hot subject: how to integrate types into your own web site or into your customer's website, without falling into the standard Verdana, MS Trebuchet, Tahoma, Serif and other fonts already installed, ready to use on each desktop computers ?

    Parts of the answer are in the following sharepoint :

     

    Beautiful Web Typography v5.3 Edge of the Web presentation
    View more documents from Pascal Klein.
    • Tweet
  • About

    Java/J2EE Expert
    Technical Manager
    Web Standard evangelizer

    114907 Views
  • Archive

    • 2012 (4)
      • January (4)
    • 2011 (53)
      • December (5)
      • November (1)
      • September (4)
      • August (4)
      • July (5)
      • June (2)
      • May (11)
      • April (11)
      • March (5)
      • February (3)
      • January (2)
    • 2010 (51)
      • December (2)
      • November (2)
      • October (1)
      • September (3)
      • August (8)
      • July (4)
      • June (15)
      • May (3)
      • April (2)
      • March (5)
      • February (5)
      • January (1)
    • 2009 (29)
      • December (1)
      • November (5)
      • October (6)
      • August (1)
      • July (4)
      • June (2)
      • May (1)
      • April (4)
      • March (2)
      • February (1)
      • January (2)
    • 2008 (39)
      • December (1)
      • November (5)
      • October (8)
      • September (8)
      • August (8)
      • July (9)

    Get Updates

    Follow this Space »
    You're following this Space (Edit)
    You're a contributor here (Edit)
    This is your Space (Edit)
    Follow by email »
    Get the latest updates in your email box automatically.
    Loading...
    Subscribe via RSS
    FacebookFlickrPicasametaweblog