WAP CSS/WCSS Tutorial - Learn Cascading Style Sheets for WAP Sites with the Help of Examples. WCSS (WAP CSS, also known as Wireless CSS or Wireless Profile CSS) is the cascading style sheet language that is used with XHTML MP. It is based on CSS2. Like XHTML MP, WCSS is defined in WAP 2.0. At the beginning of our WCSS tutorial, we will mention about what WCSS is, the advantages and disadvantages of using WCSS on your WAP site, WCSS's syntax, etc. After that we will look at different ways to apply WCSS cascading style sheets to XHTML MP documents, WCSS selectors, and some of the commonly used WCSS properties. WCSS (WAP CSS) Introduction MIME Type and File Extension of WCSS Files Wireless CSS and Wireless Profile CSS Advantages of Using WAP CSS Style Sheets on Mobile Internet Sites Disadvantages of Using WAP CSS Style Sheets on Mobile Internet Sites Syntax Rules of WCSS Comments in WCSS How to Apply WCSS Styles to an XHTML MP Document Link to an External Cascading Style Sheet Place WCSS Styles at the Document Head (Internal Style Sheet) Different Types of Selectors Type Selector ID Selector.
A Guide to Mobile Web Design Tips and Tricks. Having a mobile-optimized web site can really make your site stand apart from the pack. Even though smartphones like the iPhone and Google Android devices can display "the full web," having a web page formatted for smaller screens and with features that can take advantage of a touch screen, geolocation, or address book functionality can make the mobile web browsing experience that much better. Even just a few years ago, optimizing websites for mobile browsers was a painful and difficult process, in part because of the limitations of most mobile browsers. Today, thanks to the proliferation of WebKit (which powers the browsers on the iPhone, Android and webOS devices, with BlackBerry expected to join the mix next year), it's much easier to decide on a strategy for making your website pop on mobile platforms.
We've put together a toolkit of resources for the designer and non-designer alike to get you started. Did we miss your favorite tool or service? Let us know in the comments! Safe media queries - Opera Developer Community. By Opera Software Introduction Certain page authors reject media queries off-hand as a viable solution, claiming that the rules within them are not ignored by browsers with broken parsers (ie, ones that do not ignore unrecognized constructs like they are supposed to,) which in turn implies the pages they are applied to do not display as intended across browsers. This article provides analysis of the problem at hand, and offers a simple solution that does not resort to hacks, which should hopefully make such page authors consider giving media queries another look.
Example usage of media queries Consider the following stylesheet: This is a typical usage of media queries. For wide enough viewports, the object image is floated right, with text surrounding it from the left and below. Is this media query safe to use? Problematic usage of media queries The keyword here is 'simple'. Now it is no longer the case that IE does not apply the contents of the query. But then, what exactly is this doing? Optimiser son application web pour iPhone ou iPod Touch | Jay Salvat, le Blog. Avec la récente sortie française des iPhone et iPod Touch, il est maintenant intéressant de se pencher sur le développement d’application web adaptées à ce type d’appareil. Je viens tout juste d’adapter l’un des principaux services Kuantic pour une consultation sur iPhone/iTouch.
Je profite de ce premier billet pour essayer d’éclaircir le sujet. Dernière mise à jour le 16 janvier 2008 : WebclipCet article a été relayé par Le Journal du Net | Développeur.l’iPod Touch sera ici abrégé par le terme iTouch, ce qui pourra choquer quelques puristes ;] Tout type de page internet peut être consulté sur iPhone/iPod mais quelques règles sont à respecter pour offrir une expérience agréable à l’utilisateur sur ce type d’appareil. Les événements javascript courants ne se comportent pas tous comme prévu pour des raisons compréhensibles de navigation tactile. Il n’existe pas vraiment d’événements propres à l’appareil. La résolution de l’écran est 320 x 480 pixels. …revient à écrire Ajout le 24/06/2008. Coding for the mobile web. How to serve the right content to mobile browsers. By Chris Mills Introduction The modern web is viewed on many different devices, so it is getting increasingly important for us to think about how to create our web sites so that they will serve the right content to users, no matter what device they are using.
We have many technologies at our disposal, including media types, media queries, and browser sniffing, but what's the best way to handle this? In this article I will explore the different ways in which you can develop a web site to serve appropriate content to the different devices used to browse to your web site, and show how best to use them. I'll talk about: Browser sniffingCreating a separate site for mobile browsersMedia typesMedia queries Of course, it is argued by some that you should be able to ensure that your site will work well in most reasonably modern browsers (desktop and mobile) bydoing nothing except designing them carefully and making sure you stick to POSH (Plain Old Semantic HTML.) Browser sniffing Media types Summary.