пятница, 15 апреля 2011 г.

Native HTML5 and Real-world sites

Native HTML5 support in Windows with IE9 makes a huge difference in what sites can do. We demonstrated real-world sites from the development community that a year ago would have been possible only with a plug-in or application. These sites are live now and show that the technologies as implemented in IE9 are production-ready for consumers and businesses. Links are available at www.beautyoftheweb.com for you to try them out. These sites are proof of progress on the goal of same markup and standards-based Web technologies. They run in other browsers – just slower. As an industry, we’ve just started to see what’s possible when sites can take advantage of these capabilities. The experiences may be new today; they reflect what people will simply come to expect from sites in the future.

April 2011 Cumulative Security Update for Internet Explorer Now Available

The April 2011 Cumulative Security Update for Internet Explorer is now available via Windows Update. This security update resolves four privately reported vulnerabilities and one publicly disclosed vulnerability in Internet Explorer. This security update is rated Critical for Internet Explorer 6, Internet Explorer 7, and Internet Explorer 8 on Windows clients; and Moderate for Internet Explorer 6, Internet Explorer 7, and Internet Explorer 8 on Windows servers. Internet Explorer 9 is not affected by the vulnerabilities.

The most severe vulnerabilities could allow remote code execution if a user views a specially crafted Web page using Internet Explorer. An attacker who successfully exploited any of these vulnerabilities could gain the same user rights as the local user. Users whose accounts are configured to have fewer user rights on the system could be less impacted than users who operate with administrative user rights.

The update addresses the vulnerabilities by modifying the way that Internet Explorer handles objects in memory, content during certain processes, and script during certain processes. For more information about the vulnerabilities, see the full bulletin.

The majority of customers have automatic updating enabled and will not need to take any action because this security update will be downloaded and installed automatically. Customers who have not enabled automatic updating need to check for updates and install this update manually. For information about specific configuration options in automatic updating, see Microsoft Knowledge Base Article 294871.

For administrators and enterprise installations, or end users who want to install this security update manually, Microsoft recommends that customers apply the update immediately using update management software, or by checking for updates using the Microsoft Update service.

CSS3 Multi-column Layout

Finally, you can use CSS Multi-column layout to arrange content into multiple columns on the page. This approach is used by newspapers and magazines in the print world, which makes text easier to read and track from line to line by organizing the content into multiple parallel columns.

Multi-column layout allows you to do that with a few lines of CSS. For example, the content in the image below can be quickly organized into 3 columns by placing the line “column-count:3” on the containing div.


Lorem ipsum...

#beagleContent { column-count: 3; }

Multi-column layout offers a wide variety of options to specify how your content is laid out, including the ability to set a fixed column count, a minimum column width, the size of the gap between columns, and even column rules, which are decorative borders between columns. Multi-column layout also provides the ability to specify where column breaks should occur, and to have content automatically balanced between columns, so all columns are the same length. Also, note that because Multi-column is a W3C Candidate Recommendation, no -ms- tag is needed when using these properties. You can try an example of CSS3 multi-column layout using the IE10 platform preview and other browsers.

CSS3 Flexible Box Layout

Grid is great for adaptive layout, but it’s not the only option available. In the IE10 platform preview developers can also use Flexible Box Layout (aka “Flexbox”) to lay out elements in a fluid, source-independent way. Flexbox and Grid share many common aspects – elements are placed inside of a parent container, and their size and position are adjusted depending on the parent size. The key difference between Flexbox and Grid is that Flexbox lays out its content along a single axis (vertical or horizontal) whereas grid can lay out content in both rows and columns. Also, the default behavior of Flexbox is to “stack” elements along one side of the container, whereas the default behavior of Grid is to place elements “on top” of each other in row 1, column 1.

While many behaviors that can be achieved with Flexbox are also possible with Grid, and vice versa, Flexbox is best suited for creating individual components and collections (e.g. toolbars, image collections) while Grid is designed for creating full-page layouts, and for components where individual elements overlap.

The basics of using Flexbox are straightforward. The example below starts with three buttons (individual components of a basic media toolbar) laid out in a containing div. By default, these buttons are laid out with display: inline-block, which means that they have an intrinsic size that does not change as the container size changes. This can lead to unused white space where the layout does not adapt to the available space.





Result of markup above

With flexible box layout (i.e. display: box) you can specify that the button container will lay out its children such that each child element has an equal share of the available space in the container. Now the buttons fill the container completely, and will do so regardless of how the container size changes. This is an approach that works well with flexible grid cells – if the outer container is a div that is sized to fill a flexible grid cell, then not only does the overall layout adapt as the screen size changes, but the individual toolbar changes as well.

#playControl { display: -ms-box; }
button { -ms-box-flex: 1; }

Result of markup above

Another useful feature of Flexbox is the ability to act as a container for an arbitrary number of items, especially using the box-lines property. Specifically, a container element (such as a div) with display: box; set will automatically stack elements in that container towards one side of the container (the left side of the container, for most Western languages). If the box-lines property is set to multiple, then a Flexbox container will arrange content elements in multiple rows of content, if vertical space allows. This means that a flexible container element can automatically arrange its contents to make the best use of space, without the designer having to know how many items are in the container and having to explicitly place each item.

In the example images below, the same five items are arranged in a single row when the container is wide enough, but a second row of items is created beneath the first when the container is too narrow. This approach can be used when a dynamic data query has returned an unknown number of items, and you want to display them in a simple, straightforward way.

1
2
3
4
5

#collectionContainer { -ms-box-lines: multiple; }

IE10 Platform Preview and CSS Features for Adaptive Layouts

The first platform preview of IE10 contains many new CSS3 features all developed as implementations of evolving Web standards. In this post, we’ll look at three of those CSS features—CSS3 Grid Layout, Flexible Box Layout, and Multi-column Layout. CSS Grid Layout and Flexible Box Layout both help developers create layouts for complex Web applications and Web sites. Multi-column is designed to help developers create advanced text layouts for improved readability on the Web. These three new CSS features can make it easier to more effectively use screen real-estate across a wide variety of devices and resolutions—a longstanding and growing problem for Web designers.
CSS3 Grid Layout

Let’s start with CSS Grid Layout (aka “Grid”), which is a proposal recently submitted by Microsoft to the CSS Working Group. The core idea behind Grid is to partition a Web page into a defined set of rows and columns, and then position and size elements based on those rows and columns, all using CSS. Because the size of rows and columns can be defined as fixed, flexible, or size-to-content, it’s easy to build a layout that completely fills the entire screen, regardless of screen size.

For example, the image below shows an exemplary game board which has been divided up into two columns and three rows, containing multiple elements. Some of the elements need to remain fixed, while others need to grow or shrink as the size of the browser window changes.

With Grid, you can achieve this design starting with the markup below.

Game Title
Score
Stats
Board
Controls

The div with ID “grid” is set as a grid container with display: grid, and the various rows and columns are defined as either flexible (that is, growing or shrinking based on available space) or auto-sizing, which sizes the row or column to the width or height of the largest element placed inside.

#grid {
display: -ms-grid;
-ms-grid-columns: auto 1fr;
-ms-grid-rows: auto 1fr auto;
}

Once the grid is defined, you can position individual elements to specific grid cells. As the markup below shows, not only can you specify that an element is placed at a specific row and column in CSS, but you can specify that an element should span multiple rows and/or columns, and specify an element’s horizontal or vertical alignment within a cell or range of cells. Elements can be specified as having a fixed size, or can be specified to fill the available width or height of the cell they’re placed in. In the example above, the “board” element grows along with the screen, while other elements, such as the “title” element, stay fixed in size. (Note that, because this is still an emerging specification, in IE10 usage, all of the grid properties below are prefixed with “-ms-”.)

#title { -ms-grid-column: 1; -ms-grid-row: 1 }
#score { -ms-grid-column: 1; -ms-grid-row: 3 }
#stats { -ms-grid-column: 1; -ms-grid-row: 2; -ms-grid-row-align: start }
#board { -ms-grid-column: 2; -ms-grid-row: 1; -ms-grid-row-span: 2 }
#controls { -ms-grid-column: 2; -ms-grid-row: 2; -ms-grid-column-align: center }

By combining Grid with CSS3 Media Queries, you can specify entirely different layouts for different resolutions, aspect ratios, and screen orientations. For example, you can define a different number of rows or columns for different screen sizes (e.g. more columns for a vertical “portrait” layout, more columns for a horizontal “landscape” layout), or specify that rows and columns are sized differently. You can try this out for yourself with the Griddle test drive using the IE10 platform preview and resizing the window from wide to narrow width.

In addition, because the position of elements in a grid is independent of the order they are specified – that is, their position is specified purely by CSS rather than by their order in HTML markup – it’s easy to give elements different arrangements on different screen sizes, or even avoid displaying some elements entirely in some layouts. For example, you might want to skip displaying certain toolbars or sidebars on a small resolution designed for phones or tablets, where you might show a wider variety of content elements on a layout designed for a widescreen, high-resolution desktop screen. Most importantly, all these different effects are achieved purely with CSS – and because the visual display of content is entirely separated from the HTML, there’s no need to prepare a different HTML file for mobile vs. desktop devices.

суббота, 9 апреля 2011 г.

Real People, online now, relevant to you

OthersOnline is a Firefox and IE add-on that allows you to meet people with the same interests as yours. The way it works is that it keeps a track of what you visit online, the frequency you visit a page, and your search engine searches. With all this information it creates a profile that should be quite accurate on what you are interested in, so that you can see who is online in that moment and have a chat, sharing opinions or asking questions with the guarantee that the person you are contacting is acknowledged about the subjects you are interested in.

Although your privacy might be at risk, you can sign in and sign out at any moment and that leaves you the freedom to decide what you want the application to track and what no. There is also a filter to block 'adulty content, which is set as default in the user option menu.

The program is easy to use, just surf normally, and then click the 'global' menu to see all the relevant profiles of other users. You can then visit their blog, email them or see what you have in common. In the user options you can set to display just users who live near you, by specifying the miles of distance from you.

If you are willing to compromise a bit on your privacy, you can meet people with your own interests online and why not, offline.

Pros

* Intelligent way to understand your interests
* Specify the distance in miles of people you would like to talk to

Cons

* No options to have more control on your privacy

The latest edition of the web's most popular browser

Internet Explorer 9 is the new edition of Microsoft's hugely popular web browser. Building on the success of previous editions of IE with new features and a new look, Microsoft has high hopes for version 9.

The first thing you'll notice about Internet Explorer 9 is an overhauled interface. Making the most of the transparent graphical style available in Windows 7 and newer editions of Windows Vista, IE 9 looks sleek, smart and simpler than ever before. Like in Google Chrome, the Address bar and Search box have been merged to create a simpler, more seamless user experience.

Among the new features included in Internet Explorer 9 are better integration with the Windows operating system and a seriously beefed-up security system. IE 9 also lets you 'pin' websites to the Superbar and allows you to bookmark your favorite websites as 'applications' in your OS. The new Performance Advisor add-on identifies add-ons that are slowing Internet Explorer down (a feature badly needed in Mozilla Firefox).

Internet Explorer 9 also offers improved speed and performance, as well as better compliance with web standards and new technologies. IE 9 features decent support for HTML 5 (the new generation of media-rich websites use this language), and now finishes the Acid 3 test with a near-perfect 95/100. New features like hang recovery and InPrivate Filtering provide Internet Explorer a stabler and more secure web experience than most other browsers.

In all, the latest version of Microsoft Internet Explorer 9 is faster and prettier than its predecessors - and really throws down the gauntlet to its competitors. Watch out: the browser wars just got exciting again.

Meet the new Internet Explorer

Internet Explorer 9 is the new edition of Microsoft's hugely popular web browser. Building on the success of previous editions of IE with new features and a new look, Microsoft has high hopes for Internet Explorer 9.

The first thing you'll notice about Internet Explorer 9 is an overhauled interface. Making the most of the transparent graphical style available in Windows 7 and newer editions of Windows Vista, IE 9 looks sleek, smart and simpler than ever before. Like in Google Chrome, the Address bar and Search box have been merged to create a simpler, more seamless user experience.

Among the new features included in Internet Explorer 9 are better integration with the Windows operating system and a seriously beefed-up security system. IE 9 also lets you 'pin' websites to the Superbar and allows you to bookmark your favorite websites as 'applications' in your OS. As for safety, the new Tracking protection and ActiveX filtering features let you block certain sites from tracking your movements online and switch off ActiveX elements on a per-site basis, respectively. The new Performance Advisor add-on identifies add-ons that are slowing Internet Explorer down (a feature badly needed in Mozilla Firefox).

Internet Explorer 9 also offers improved speed and performance, as well as better compliance with web standards and new technologies. IE 9 features decent support for HTML 5 (the new generation of media-rich websites use this language), and now finishes the Acid 3 test with a near-perfect 95/100. New features like hang recovery and InPrivate Filtering provide Internet Explorer a stabler and more secure web experience than most other browsers.

In all, the latest version of Windows Internet Explorer 9 is faster and prettier than its predecessors - and really throws down the gauntlet to its competitors. Watch out: the browser wars just got exciting again.
Pros

* Faster multicore JavaScript engine
* Support for HTML5 and CSS3
* Very well integrated with the system
* Sleek interface
* Improved security features

Cons

* Basic HTML5 support

Windows Internet Explorer

Web browsing is the No. 1 thing people do on their Windows-based PC, and as such, they increasingly expect the same experience they associate with their PC applications from their favorite Web-based e-mail service, photo site or social network site. This kind of immersive experience does not occur on the Web today, and using a browser is often associated with limited performance and interactivity. Microsoft developed Windows Internet Explorer 9 to help change this.

пятница, 1 апреля 2011 г.

Seamless with Windows 7

Internet Explorer 9 integrates seamlessly with computers running Windows 7 to bring you the best web experience for Windows.
Snap

Snap makes it easy to view two websites at the same time

Whether you're comparing menus for restaurants on different websites, watching a video while going through email, or looking at a map while reading an itinerary for a trip, it often takes more than one webpage or window to accomplish a task.

Snap is a quick—and fun—way to show two sites or pages on your screen at one time. Simply drag each one to opposite edges of your screen and the sites will appear side-by-side. Content on the sites is rendered continuously and video frames remain when snapping a window in place, providing a fluid experience. And you’re able to see more content at one time without having to waste time thinking about whether to use tabs or windows.
Jump Lists

Jump Lists make it easy to access your favorite sites

A quick and easy to way to get to your favorite websites without having to open Internet Explorer, Jump Lists take you right to the websites you use every day.

To open the Internet Explorer 9 Jump List, right-click the Internet Explorer icon on the taskbar. You’ll see the sites that you visit often. There’s also quick access to start InPrivate Browsing, open new tabs, or close a window. Any website that you’ve pinned to the taskbar has a Jump List, too. What you see in each one depends on the website, but all of them include InPrivate Browsing, opening the site, unpinning the site, and closing the window.
Thumbnail preview controls

Some websites that are pinned to the taskbar have controls that can be accessed from the taskbar. Point to the icon for a website that's pinned to the taskbar and you'll see the thumbnail preview controls for that website underneath the thumbnail preview.
Icon overlays

Some pinned sites also have icon overlays, which provide information about the website. For example, the number of new messages are shown on the icon in the taskbar. That way you're kept up-to-date about new information without having to go to the website.

SmartScreen Filter

Internet Explorer 9 is designed to help protect you from evolving web and social engineering threats. Whether it's a link in email that appears to be from your bank, fake notifications from social networking sites, search results for popular content, or malicious advertisements—you name it, someone's trying it. With SmartScreen Filter, you can browse with more confidence knowing you have better protection if you're targeted by one of these types of attacks.

SmartScreen Filter helps combat these threats with a set of sophisticated tools:

*

Anti-phishing protection—to screen threats from imposter websites seeking to acquire personal information such as user names, passwords, and billing data.
*

Application Reputation—to remove all unnecessary warnings for well-known files, and show severe warnings for high-risk downloads.
*

Anti-malware protection—to help prevent potentially harmful software from infiltrating your computer.

If a malicious website is detected, Internet Explorer 9 blocks the entire site, when appropriate. It also can do a "surgical block" of malware or phishing hosted on legitimate websites, blocking malicious pages without affecting the rest of the site.

Smartscreen Filter also works with Download Manager to help protect you from malicious downloads. Potentially risky downloads are immediately blocked. Download Manager then clearly identifies higher risk programs so that you can make an informed decision to delete, run, or save the download.

We recommend that you turn on SmartScreen Filter. You can turn it on or off at any time. You can also help improve the web for everyone by reporting suspected malicious sites.

Pinned Sites

With Pinned Sites, you can get to your favorite sites directly from the Windows taskbar—without having to open Internet Explorer first.

Pinning a site takes seconds: click the icon to the left of the web address in One Box, or the tab for the website, or the website's icon on the New Tab page, and then drag it to the taskbar. That's it. Once a site is pinned, it shows up as its own thumbnail, separate from Internet Explorer. Now all it takes is one click to get to your favorite website.

Each site that's pinned to the taskbar has a Jump List. Some also have thumbnail preview controls like playing or pausing a video, which you'll see underneath the thumbnail preview. And some sites you pin have icon overlays, which provide information about the status of a website, such as the number of new messages in your inbox.

By pinning a site, the site is at the center of the experience, not the browser. When a pinned site is launched from the taskbar, the browser frame and navigational controls integrate the site's icon and primary color, providing an experience that's tailored to the site you're viewing.

You can also add additional home page tabs for each site you pin. That way when you open a site that's pinned you can open several webpages or websites all at once. To add additional home page tabs to a pinned site, navigate to the webpage or website you want to add as a home page tab, right-click the pinned website's icon to the left of the Back button, and then click Add as a home page.

One Box

Whether you want to navigate to a website or start a search, you have a single place to go in Internet Explorer 9—One Box.
Surfing and searching—all in one place

With One Box, surfing or searching the web is a snap. You can start typing a web address and AutoComplete anticipates what you’re looking for to help you get to your websites quickly. And because search functionality is integrated into One Box, you don’t have to worry about remembering the full web address—type in familiar terms like “news” or “music” and you can get to the sites you love in a flash.

Trying to locate something on the web? Searching from One Box gives you a quick way to find what you're looking for. Depending on the search providers you use, as you type words, search suggestions, search results—including visual search results—and headline matches or other relevant suggestions are shown in the drop–down list. Click a suggestion to run the search without having to type any more words. And you can add search providers or change the provider you want to use right from the bottom of the drop–down list as well.
Your privacy

The privacy of information that you enter into One Box is an important part of the Internet Explorer promise. You're in control of what information, if any, gets shared with search providers. From the Address bar drop-down list, you can choose to turn on search suggestions or turn them off. If you choose to turn search suggestions on, the text you type is sent to the search provider as you type it rather than being sent after you finish typing and press Enter.