Archive for August, 2010

HTML5 Navigation Structure

Tuesday, August 31st, 2010

1. <nav>
2.     <ul>
3.         <li><a href=”#”>Home</a></li>
4.         <li><a href=”#”>About Us</a></li>
5.         <li><a href=”#”>Services</a></li>
6.         <li><a href=”#”>Clients</a></li>
7.         <li><a href=”#”>Blogs</a></li>
8.         <li><a href=”#”>Contact Us</a></li>
9.     </ul>
10. </nav>

Build a HTML5/CSS3 Website Layout Without Images

Monday, August 30th, 2010

CSS Image Map

Friday, August 27th, 2010

In the days of table based web design, using image maps in your web layouts were quite common. They were used to define clickable areas, or “hotspots”, within several sliced images (coming together to form one image). During this time, these hotspots were used mostly for navigational purposes. Today, image maps created in CSS are not only a much leaner and cleaner markup, but they’re also easily editable and are often used for displaying additional content when hovered, not just as a means of navigation.

Read More

JQZoom Image Magnifier

Wednesday, August 25th, 2010

JQZoom is a javascript image magnifier built at the top of the popular jQuery javascript framework.jQzoom is a great and a really easy to use script to magnify what you want.

A Web Designer’s Guide to Linux Fonts

Saturday, August 21st, 2010

One area in which few Linux users see any representation is Web typography. In 2003, Linux user and software developer Jeremy Zawodny howled about the dearth of decent fonts for Linux.

At the time, he was right. But that situation has since changed, even though many Web designers still believe fonts designed for (and included with) various Linux flavors are all just icky.

Read More

30 Creative Illustrated Website Footers

Friday, August 20th, 2010

Benefits of HTML5

Wednesday, August 18th, 2010
  • Now, each of these elements serves a unique purpose:-
    • ‘header’ denotes the inclusion of heading, sub headings etc. which is more specific.
    • ‘nav’ signifies both the website navigation as well as the navigation of the table of contents.
    • ‘section’ element corresponds to a broad category of a web page.
    • ‘article’ element symbolizes a particular section of web page such as: blog, news, testimonials etc.
    • ‘aside’ element is used to include the content that may relate to a specific section of a document or a web page.
    • ‘footer’ element is used to indicate important information like copyright data, the author’s name, links to other pages etc.

Expanding Captioned Images

Tuesday, August 17th, 2010

HTML5 has a new attribute, contenteditable, which can be applied to any element which allows it to be edited directly in the browser window. Think of text input with a predefined value, but it can literally be any element. Form elements like text inputs support the :focus pseudo class, which allow us to style those elements when they are clicked upon or otherwise navigated to. Giving an element the contenteditable attribute means it also now supports the :focus pseudo class, which opens up some interesting possibilities!

Read More

Common Disadvantages of not having mobile friendly websites

Monday, August 16th, 2010
  • Speed of site is very low when seen on mobile devices
  • Low memory model
  • Graphics:  Fixed width graphics, flash often create nightmares for mobile users
  • Finding Relevant contents can be very difficult
  • Script Dependencies
  • Wired layout on mobile browsers

Web 2.0 Webdesign-Tutorials

Friday, August 13th, 2010