A Comprehensive Guide to Microsoft Vista Fonts for Designers [T]here are no bad fonts — only inappropriate ones.— Jason Beaird The majority of computer users became aware of Microsoft Windows Vista on January 30, 2007, when the company released the new operating system publicly. You and I of course knew about it well beforehand. Once Vista was available for beta, many web designers adopted it early to begin trying — with varying levels of success — to figure out if they can incorporate Vista fonts into their designs. Three things quickly became clear: They are beautiful typefaces.They are unusually — and, for designers, unacceptably – blurry unless you have ClearType or another anti-aliasing protocol enabled; but there are serious issues with ClearType.With some exceptions, they are markedly smaller in size than most fonts, making them difficult to incorporate into font stacks. But I like these fonts: they’re beautiful and they are available in many of our user’s computers (as much as 92% of all PCs use Windows as of May 2010[1]). Vista "C" fonts.
Fixed-position footers This page describes a solution to the problem of creating a page with a fixed-position footer that is always displayed, while the rest of the content is free to scroll if required (depending upon the size of the browser window and the content). See a working example Constraints A previous solution had used javascript to remedy the problem of fixed positioning and fixed backgrounds in IE. This obviously required that javascript be enabled, which I don't consider to be a serious shortcoming, but the solution didn't work particularly well. The design had to work across both Gecko- and IE-based browsers. Highlights of the solution Fixed position footer Footer obscures main content behind it Background image which obscures content under the footer, but is behind the content otherwise Footer does not flicker while scrolling Works across Gecko (Firefox), IE6 and IE7 No javascript Markup validates as XHTML 1.0 Strict Only a few ugly CSS hacks Producing a fixed footer Sensible browsers See an example.
10 Android Apps Every Web Designer Should Know About With the dominance of Apple’s iPhone in the recent years, Google’s Android OS seems to have been left in its shadows. However, this is only because the iPhone was released long before any Android device. Nevertheless, as the popularity of Android grows (and its growth is staggering) so does its range of apps. In this article are the top 10 Android apps for people who make websites, enabling them to be productive whilst on the go. 1. Do you need access to your web servers on your Android mobile device? 2. A simple source code editor app, SilverEdit lets you code up full HTML, CSS, PHP files that you can save to your phone or send to your email account. 3. Adobe brings the ever-popular Photoshop to the Android platform. 4. If you come upon a mobile site that you want to study whilst you’re browsing the Mobile Web, View Web Source allows you to inspect and download the entire source code of the page to its text editor. 5. 6. 7. 8. 9. 10. Need to review your HTML prowess? Related Content
The viewport metatag (Mobile web part 1) | David B. Calhoun – Developer Blog The skinny Use this: Introduction This series of posts is intended to introduce web developers to basic techniques for designing for the mobile web. It assumes at least a basic knowledge of creating desktop websites. The problem Ok, so you’ve settled down to learn how to write a website for a mobile device using your current knowledge of building desktop websites. <! Ok! <p class=”wp-caption-text”> Hello World on the iPhone </p></div> Doh! This is the first lesson in making mobile websites: width is your enemy. If you think about it logically, it seems to make sense: mobile Safari took a look at the page and assumed it was a document designed for the desktop, which is true of the vast majority of websites. Viewport But this is no good! Now we tweak our Hello World just a bit… <! And we get this… <div id=”attachment_203” style=”width: 320px” class=”wp-caption aligncenter”> <p class=”wp-caption-text”> Hello World with the Viewport tag </p></div> Much better! More fun with the viewport tag References
13 Google Chrome Extensions To Simplify Web Designer's Life Don't Forget to participate in a contest where you can win an amazing e-Commerce template from TemplateMonster. You might have been using Chrome for a quite some time now but there is a good chance you are not taking its full advantage. Chrome’s maximum potential lies in the power of its extensions. Below We have gathered 13 Chrome extensions that will enable you all to realize Chrome’s full potential if you are a web design expert. You will not find these extensions in similar lists on other websites; I hope you find them to be useful to your computer usage. Give the list a thorough reading, try out any extension you are interested in, and let me know in the comments how they worked out for you. Speed Tracer Speed Tracer is a tool to help you identify and fix performance problems in your web applications. Chrome Editor With this extension, you can edit HTML easily, right inside your browser. Resolution Test Web Developer BuiltWith BuiltWith is a web site profiler tool. MultiSwitch IE Tab
Webinos Device Agnostic Platform webinos can be applied to many industries and applications. We have focused initially on four specific areas or gateways: TV, Automotive, Health and Home Automation Gateways. Each gateway consists of complete end to end specification of reference hardware, core platform and example applications. A core concept of webinos is interaction across several broad domains: automotive, home automation, health, media – by connecting these areas individual devices can offer users much more powerful options. webinos is a “Service Platform” project under the EU FP7 ICT Programme (click for more info). For more information on webinos you can download the project fact-sheet in pdf format by clicking here. Overview Project title: webinos (Secure Web Operating System Application Delivery Environment) Project coordinator: Dr. Partners: AmbieSense Ltd (UK), BMW Forschung und Technik GmbH (DE), Deutsche Telekom (DE), DOCOMO (GMBH), Fraunhofer Gesellschaft zur Förderung der angewandten Forschung e.V. 1. 2.
A Web Designer’s Guide to Linux Fonts "Many people find Linux to be an afterthought as far as target audience is concerned, but Linux is exponentially increasing in popularity as an alternative to other operating systems. … Web design should be bulletproof and your choice of type should be no different."– Jonathan Christopher Linux Users and Web Design One area in which few Linux users see any representation is Web typography. At the time, he was right. That’s not true any longer either. As with so many other aspects of Web design, Linux users are expected to tag along behind the Windows and Mac crowd, doing the best they can with the fonts they have. What fonts Linux users (in all their diversity) have depends on a lot of factors, including their particular flavor of operating system, desktop environment, their own interest in expanding their font collections, and so forth. It’s time to let Linux users, in all their variegated versatility, be fairly represented in your font stacks. Short Shrift: The Microsoft Core Fonts 1.
ViewPorts Page last changed today Related files: Last major update on 12 November 2013. Here’s the inevitable compatibility table that goes with my viewport research. It treats the viewports themselves as well as some related items. position: fixed was moved to the CSS test pages. See A tale of two viewports for a further explanation of these terms. CSS pixels Expand and contract with zooming; it’s this pixels that are taken as measurement grid for all CSS declarations. Device pixels Formal number of pixels on device. Device pixel ratio The ratio of physical pixel count and ideal viewport. Layout viewport The initial area of the HTML element. Visual viewport The actual screen viewport through which you look at the layout viewport. Ideal viewport The one you get when using width=device-width. This table looks into the properties that are necessary to read out useful information about the three viewports and the two types of pixels. Test page. iOS 6 WebKit 536 Default browser on iPhone 4S with iOS 6.1.3 iOS 7 Presto
40 Highly Customizable Commercial Admin Templates And Skins Building a CMS from scratch can be hard and exhausting work, plus you need to have a good design stitched to it if you’re creating it for client. Sometimes it’s better to spend little money for a great quality product, these highly customizable admin templates could be a great starting point into new project and now there are really big assortment to choose from by. In this post you’ll find 40 customized, user-friendly and fluid themes to integrate in your CMS. Enjoy! 1. Admintasia ($14) Admintasia is a complete backend administration user interface that has the flexibility to house any kind of application. Admintasia’s layout is very customizable. 2. Simpla Admin is a professional template with a beautiful and user-friendly interface. Some features: Semantic, valid XHTML and CSSWell commented codeLiquid layout – content resizes to the user’s windowPowered by jQueryCross-browser compatibleWYSIWYG Editor on any text area 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21.