Studies have shown that people tend to want to focus on web site content and not necessarily the capabilities of their web browser when they are conducting browsing activities. Yet, browser designs tend to focus on a user interface that emphasizes the browser's capabilities, thus making it more challenging for a user to focus on a web site's content.
This Summary is provided to introduce a selection of concepts in a simplified form that are further described below in the Detailed Description. This Summary is not intended to identify key features or essential features of the claimed subject matter, nor is it intended to be used to limit the scope of the claimed subject matter.
In various embodiments, a web browser user interface includes a subset of selected controls distributed along a single line at the top of the web browser user interface. Layouts of the controls can be in a left-to-right or a right-to-left fashion. Specifically, in a left-to-right layout, selected controls meeting certain criteria can appear to the left of other controls. Similarly, in a right-to-left layout, selected controls meeting certain criteria can appear to the right of other controls. In at least some embodiments, at least some of the controls that appear distributed along the single line are controls that are related to navigation of some type. Such controls can include those that enable textual input to be provided by user.
In addition, in at least some embodiments, a control set can be visually treated within the web browser user interface in a manner that places greater emphasis on site content rather than controls.
The same numbers are used throughout the drawings to reference like features.
In various embodiments, a web browser user interface includes a subset of selected controls distributed along a single line at the top of the web browser user interface. Layout of the controls can be in a left-to-right or a right-to-left fashion. Specifically, in a left-to-right layout, selected controls meeting certain criteria can appear to the left of other controls. A left-to-right layout would work well in locales where users read left-to-right. Such would provide a comfortable, intuitive experience. Similarly, in a right-to-left layout, selected controls meeting certain criteria can appear to the right of other controls. A right-to-left layout would work well in locales where users read right-to-left. Such would provide a comfortable, intuitive experience for these users. Any suitable type of criteria can be utilized to determine how to distribute the selected controls along the single line. Distributing selected controls along a single line makes efficient use of both horizontal and vertical screen real estate. Specifically, in a horizontal dimension, having selected controls distributed along a single line facilitates quick visual identification of controls that are, in at least some embodiments, most often used. This enables screen real estate in the vertical dimension to be utilized for other controls that might, for example, be used less often.
In at least some embodiments, at least some of the controls that appear distributed along the single line are controls that are related to navigation of some type. For example, such controls can include, by way of example and not limitation, back and forward navigation buttons, a navigation control that provides an input field, such as an address bar or search bar, and/or input instrumentalities that enable a user to switch between views of different content, such as tabs.
In addition, in at least some embodiments, a control set can be visually treated within the web browser user interface in a manner that places greater emphasis on site content rather than controls.
In the discussion that follows, a section entitled “Operating Environment” is provided and describes one environment in which one or more embodiments can be employed. Following this, a section entitled “Example Linear Control Layout Module” describes an example linear control layout module in accordance with one or more embodiments. Next, a section entitled “Visual Treatment of Controls to Emphasize Site Content” describes how controls can be visually treated to emphasize site content in accordance with one or more embodiments. Following this, a section entitled “Placing Visual Emphasis on Certain Controls that Appear in the Control Layout Area” describes how visual emphasis can be placed on certain controls in accordance with one or more embodiments. Next, a section entitled “Sizing the Address Bar Relative to the Tab Band” describes how an address bar can be sized and re-sized relative to a tab band in accordance with one or more embodiments. Following this, a section entitled “Example Method” describes an example method in accordance with one or more embodiments. Last, a section entitled “Example System” describes an example system in accordance with one or more embodiments.
In addition, computing device 102 includes a software application in the form of a web browser 110 that includes or otherwise makes use of a linear control layout module 111 to provide a web browser user interface that operates as described above and below. The linear control layout module is designed to assist users in focusing on a website's content, while removing some of the distractions that can be provided by controls. For example, the web browser user interface, via the linear control layout module, can include a subset of selected controls distributed along a single line at the top of the web browser user interface. Layout of the controls can be in a left-to-right or a right-to-left fashion, as noted above. Any suitable type of criteria can be utilized to determine how to distribute the selected controls along the single line. For example, one criterion can include the frequency of use of a particular control across a collection of users. Alternately or additionally, another criterion can include an individual user's preference such that the appearance of the controls along the single line is user-customizable. Further, in at least some embodiments, at least some of the controls that appear distributed along the single line are controls that are related to navigation of some type. For example, such controls can include, by way of example and not limitation, back and forward navigation buttons, a navigation control that provides an input field, such as an address bar or search bar, and/or input instrumentalities that enable a user to switch between views of different content, such as tabs.
In addition, in at least some embodiments, a control set can be visually treated within the web browser user interface in a manner that places greater emphasis on site content rather than controls, as will become apparent below.
In addition, environment 100 includes a network 112, such as the Internet, and one or more web servers 114 from and to which content can be received and sent, as described above and below. Such content can include web pages that are received from the web servers.
Computing device 102 can be embodied as any suitable computing device such as, by way of example and not limitation, a desktop computer, a portable computer, a handheld computer such as a personal digital assistant (PDA), cell phone, and the like.
Having described an example operating environment, consider now a discussion of some example embodiments that can utilize linear control layout module 111.
The control layout area 204 is provided under the influence of the linear control layout module 111 (
In the illustrated and described example, it can be desirable to group the back and forward navigation buttons together because each is related to navigation. Further, in at least some embodiments, it can be desirable to group an address bar such as that represented by navigation control 302, adjacent the back and forward buttons. This is because the address bar and back/forward buttons are related insofar as the address bar shows URLs to which the browser has been navigated, in some instances, via the back and forward buttons.
In addition, other controls can be distributed along a line l such as so-called secondary controls 306. From a visual standpoint then, line l defines, in at least some embodiments, a continuum of controls that are distributed in terms of controls that meet some criterion or criteria, to controls that meet, to a lesser degree (or not at all) the criterion or criteria. In at least some embodiments, line l is disposed at the top of the web browser user interface (
In addition, in at least some embodiments, a control set can be visually treated within the web browser user interface in a manner that places greater emphasis on site content rather than the controls, as will become apparent below.
As an example, consider
As in the above example, the control layout area 204 is provided under the influence of the linear control layout module 111 (
In the illustrated and described embodiment, in order to place greater visual emphasis on content that is rendered within content rendering area 206, control layout area 204 can be rendered to effectively be clear so as to reflect the underlying theme. Specifically, in this example, notice that the controls that appear in the content rendering area reflect the underlying theme as indicated by the gray dotted pattern. In at least some embodiments, when a user selects a particular control that appears within the control layout area 204, the control can assume a different color which can facilitate the discovery of controls that appear in the control area 204.
Alternately or additionally, the controls that appear within the control layout area 204 can be rendered in a monochromatic manner in which the controls and the associated control layout area in which they appear can be rendered in a single color that is selected to emphasize content that appears in content rendering area 206. For example, the controls and the control layout area 204 can be rendered in grayscale to place emphasis on content rendering area 206. Upon selection of a control by a user, the control may assume a different color to place emphasis thereon.
Placing Visual Emphasis on Certain Controls that Appear in the Control Layout Area
In at least some embodiments, visual emphasis can be placed on certain controls that appear in the control layout area. As an example, consider
In this example, as in the above example, a plurality of controls are distributed along a single line designated “l”. The example controls can include, by way of example and not limitation, back and forward navigation buttons 300, a navigation control 302 that provides an input field, such as an address bar or search bar, and/or input instrumentalities that enable a user to switch between views of different content, such as tabs 304.
Notice in this example that backward navigation button 800 appears larger than forward navigation button 802. In this example, button 800 is larger because it is used more often than forward navigation button 802. Other techniques of visual emphasis can be used without departing from the spirit and scope of the claimed subject matter.
As display screen sizes get horizontally larger, there is a trend toward providing a widescreen user experience. To be sure, part of the motivation of at least some of the above-described embodiments is associated with providing an improved user experience by efficiently using horizontally available screen real estate.
In at least some embodiments, the web browser is designed in a manner to efficiently manage the controls in the control layout area when the web browser window is resized. For example, the web browser can ascertain the horizontal resolution of the display screen and, responsive to a window re-size operation, can intelligently manage the layout of the tabs and address bar.
For example, the web browser can select a ratio between the size of the tab band that contains the tabs and the address bar. The ratio can change in conjunction with changes in the horizontal resolution of the display screen. Further, once the ratio is selected between the tab band and the address bar, the web browser can attempt to maintain this ratio when the web browser window is resized, e.g., made smaller. However, at some threshold level when the size of the web browser window is reduced, the web browser can switch to a reduced address bar width and can begin removing controls, such as secondary controls. The dimensions of the reduced width of the address bar can be selected to maintain a desired amount of text therewithin. As the size of the window continues to be reduced, the web browser can begin to remove tabs so that the address bar and the navigation controls are viewable even on a very small screen size.
Having described various embodiments above, consider now an example method in accordance with one or more embodiments.
Step 900 renders a web browser user interface. Step 902 distributes selected controls along a single line adjacent the top of the web browser user interface. Examples of selected controls are provided above.
Computing device 1000 includes one or more processors or processing units 1002, one or more memory and/or storage components 1004, one or more input/output (I/O) devices 1006, and a bus 1008 that allows the various components and devices to communicate with one another. Bus 1008 represents one or more of any of several types of bus structures, including a memory bus or memory controller, a peripheral bus, an accelerated graphics port, and a processor or local bus using any of a variety of bus architectures. Bus 1008 can include wired and/or wireless buses.
Memory/storage component 1004 represents one or more computer storage media. Component 1004 can include volatile media (such as random access memory (RAM)) and/or nonvolatile media (such as read only memory (ROM), Flash memory, optical disks, magnetic disks, and so forth). Component 1004 can include fixed media (e.g., RAM, ROM, a fixed hard drive, etc.) as well as removable media (e.g., a Flash memory drive, a removable hard drive, an optical disk, and so forth).
One or more input/output devices 1006 allow a user to enter commands and information to computing device 1000, and also allow information to be presented to the user and/or other components or devices. Examples of input devices include a keyboard, a cursor control device (e.g., a mouse), a microphone, a scanner, and so forth. Examples of output devices include a display device (e.g., a monitor or projector), speakers, a printer, a network card, and so forth.
Various techniques may be described herein in the general context of software or program modules. Generally, software includes routines, programs, objects, components, data structures, and so forth that perform particular tasks or implement particular abstract data types. An implementation of these modules and techniques may be stored on or transmitted across some form of computer readable media. Computer readable media can be any available medium or media that can be accessed by a computing device. By way of example, and not limitation, computer readable media may comprise “computer-readable storage media”.
“Computer-readable storage media” include volatile and non-volatile, removable and non-removable media implemented in any method or technology for storage of information such as computer readable instructions, data structures, program modules, or other data. Computer-readable storage media include, but are not limited to, RAM, ROM, EEPROM, flash memory or other memory technology, CD-ROM, digital versatile disks (DVD) or other optical storage, magnetic cassettes, magnetic tape, magnetic disk storage or other magnetic storage devices, or any other medium which can be used to store the desired information and which can be accessed by a computer.
In various embodiments, a web browser user interface includes a subset of selected controls distributed along a single line at the top of the web browser user interface. Layouts of the controls can be in a left-to-right or a right-to-left fashion. Specifically, in a left-to-right layout, selected controls meeting certain criteria can appear to the left of other controls. Similarly, in a right-to-left layout, selected controls meeting certain criteria can appear to the right of other controls. In at least some embodiments, at least some of the controls that appear distributed along the single line are controls that are related to navigation of some type. Such controls can include those that enable textual input to be provided by user.
Although the subject matter has been described in language specific to structural features and/or methodological acts, it is to be understood that the subject matter defined in the appended claims is not necessarily limited to the specific features or acts described above. Rather, the specific features and acts described above are disclosed as example forms of implementing the claims.