FACTOID # 28: Austin, Texas has more people than Alaska.
 
 Home   Encyclopedia   Statistics   States A-Z   Flags   Maps   FAQ   About 
   
 
WHAT'S NEW
 

SEARCH ALL

FACTS & STATISTICS    Advanced view

Search encyclopedia, statistics and forums:

 

 

(* = Graphable)

 

 


Encyclopedia > Web design
An example of a web page that uses CSS Layouts
An example of a web page that uses CSS Layouts

Web design is a process of conceptualization, planning, modeling, and execution of electronic media content delivery via Internet in the form of technologies (such as markup languages) suitable for interpretation and display by a web browser or other web-based graphical user interfaces (GUIs). Image File history File links Mergefrom. ... The acronym CSS may mean: Cansei de Ser Sexy a Brazilian musical group Cascading Style Sheets, a stylesheet language Central Security Service, an agency of the United States government, created to promote partnership between the NSA and the SCE Content Scramble System, a Digital Rights Management method used on some... Layout may mean: Look up layout in Wiktionary, the free dictionary. ... A screenshot of a web page. ... For other uses, see Content (disambiguation). ... A specialized markup language using SGML is used to write the electronic version of the Oxford English Dictionary. ... An example of a Web browser (Mozilla Firefox) A web browser is a software application that enables a user to display and interact with text, images, videos, music and other information typically located on a Web page at a website on the World Wide Web or a local area network. ... GUI redirects here. ...


The intent of web design is to create a web site (a collection of electronic files residing on one or more web servers) that presents content (including interactive features or interfaces) to the end user in the form of web pages once requested. Such elements as text, forms, and bit-mapped images (GIFs, JPEGs, PNGs) can be placed on the page using HTML, XHTML, or XML tags. Displaying more complex media (vector graphics, animations, videos, sounds) usually requires plug-ins such as Flash, QuickTime, Java run-time environment, etc. Plug-ins are also embedded into web pages by using HTML or XHTML tags. A website, Web site or WWW site (often shortened to just site) is a collection of webpages, that is, HTML/XHTML documents accessible via HTTP on the Internet; all publicly accessible websites in existence comprise the World Wide Web. ... The inside/front of a Dell PowerEdge web server The term Web server can mean one of two things: A computer program that is responsible for accepting HTTP requests from clients, which are known as Web browsers, and serving them HTTP responses along with optional data contents, which usually are... For other uses, see Content (disambiguation). ... The end user is a central concept in software engineering, referring to an abstraction of the group of persons who will ultimately use a piece of software (i. ... A screenshot of a web page. ... A webform on a web page allows a user to enter data that is, typically, sent to a server for processing and to mimic the usage of paper forms. ... Image file formats provide a standardized method of organizing and storing image data. ... GIF redirects here. ... JPG redirects here. ... PNG (Portable Network Graphics), sometimes pronounced as ping, is a relatively new bitmap image format that is becoming popular on the World Wide Web and elsewhere. ... HTML, an initialism of HyperText Markup Language, is the predominant markup language for web pages. ... The Extensible HyperText Markup Language, or XHTML, is a markup language that has the same depth of expression as HTML, but also conforms to XML syntax. ... The Extensible Markup Language (XML) is a general-purpose markup language. ... Example showing effect of vector graphics versus raster graphics. ... For other uses, see Plug in. ... Adobe Flash (previously called Shockwave Flash and Macromedia Flash) is a set of multimedia technologies developed and distributed by Adobe Systems and earlier by Macromedia. ... QuickTime is a multimedia framework developed by Apple Inc. ... Java refers to a number of computer software products and specifications from Sun Microsystems that together provide a system for developing application software and deploying it in a cross-platform environment. ...


Improvements in the various browsers' compliance with W3C standards prompted a widespread acceptance of XHTML and XML in conjunction with Cascading Style Sheets (CSS) to position and manipulate web page elements. The latest standards and proposals aim at leading to the various browsers' ability to deliver a wide variety of media and accessibility options to the client possibly without employing plug-ins. WWWC redirects here. ... CSS redirects here. ...


Typically web pages are classified as static or dynamic.

  • Dynamic pages adapt their content and/or appearance depending on the end-user’s input or interaction or changes in the computing environment (user, time, database modifications, etc.) Content can be changed on the client side (end-user's computer) by using client-side scripting languages (JavaScript, JScript, Actionscript, media players and PDF reader plug-ins, etc.) to alter DOM elements (DHTML). Dynamic content is often compiled on the server utilizing server-side scripting languages (PHP, ASP, Perl, Coldfusion, JSP, Python, etc.). Both approaches are usually used in complex applications.

With growing specialization within communication design and information technology fields, there is a strong tendency to draw a clear line between web design specifically for web pages and web development for the overall logistics of all web-based services. Used on Dynamic Web page (opposite to), Web template and others. ... Hypertext Transfer Protocol (HTTP) is a communications protocol used to transfer or convey information on intranets and the World Wide Web. ... Webmaster or Webmistress is a commonly used term that refers to the person or persons responsible for a specific website. ... A programmer or software developer is someone who programs computers, that is, one who writes computer software. ... In classical hypertext navigation occurs among static documents, and, for web users, this experience is reproduced using static web pages. ... The end user is a central concept in software engineering, referring to an abstraction of the group of persons who will ultimately use a piece of software (i. ... This article is principally about managing and structuring the collections of data held on computers. ... JavaScript is a scripting language most often used for client-side web development. ... JScript is the Microsoft implementation of the ECMAScript scripting programming language specification. ... ActionScript is a scripting language based on ECMAScript, used primarily for the development of websites and software using the Adobe Flash Player platform (in the form of SWF files embedded into Web pages). ... PDF is an abbreviation with several meanings: Portable Document Format Post-doctoral fellowship Probability density function There also is an electronic design automation company named PDF Solutions. ... Hierarchy of objects in an example HTML DOM - Document Object Model The Document Object Model (DOM) is a platform- and language-independent standard object model for representing HTML or XML and related formats. ... Dynamic HTML or DHTML designates a technique of creating interactive web sites by using a combination of the static markup language HTML, a client-side scripting language (such as JavaScript) and the style definition language Cascading Style Sheets. ... For other uses, see PHP (disambiguation). ... ASP is a three-letter acronym with numerous meanings in different contexts. ... For other uses, see Perl (disambiguation). ... This article or section does not adequately cite its references or sources. ... Meanings of JSP: JavaServer Pages Java stored procedure Jackson Structured Programming JSP Records Japanese Surrendered Personnel Jacketed, Soft Point, a type of bullet. ... Python is a general-purpose, high-level programming language. ... Communication design is a sub-discipline of design (sometimes referred to as Graphic Design) which is concerned with how media intermission such as, print and digital pieces of work communicate with people in a visual way. ... Information and communication technology spending in 2005 Information Technology (IT), as defined by the Information Technology Association of America (ITAA), is the study, design, development, implementation, support or management of computer-based information systems, particularly software applications and computer hardware. ... Web development is a broad term for any activities related to developing a web site for the World Wide Web or an intranet. ...

Contents

History

Tim Berners-Lee published a website in August 1991.[1] Berners-Lee was the first to combine Internet communication (which had been carrying email and the Usenet for decades) with hypertext (which had also been around for decades, but limited to browsing information stored on a single computer, such as interactive CD-ROM design). Websites are written in a markup language called HTML, and early versions of HTML were very basic, only giving websites basic structure (headings and paragraphs), and the ability to link using hypertext. This was new and different from existing forms of communication - users could easily navigate to other pages by following hyperlinks from page to page. Sir Tim Berners-Lee Sir Tim (Timothy John) Berners-Lee, KBE (TimBL or TBL) (b. ... Wikipedia does not yet have an article with this exact name. ... Usenet (USEr NETwork) is a global, decentralized, distributed Internet discussion system that evolved from a general purpose UUCP architecture of the same name. ... In computing, hypertext is a user interface paradigm for displaying documents which, according to an early definition (Nelson 1970), branch or perform on request. ... The CD-ROM (an abbreviation for Compact Disc Read-Only Memory (ROM)) is a non-volatile optical data storage medium using the same physical format as audio compact discs, readable by a computer with a CD-ROM drive. ... A specialized markup language using SGML is used to write the electronic version of the Oxford English Dictionary. ... HTML, an initialism of HyperText Markup Language, is the predominant markup language for web pages. ... In computing, hypertext is a user interface paradigm for displaying documents which, according to an early definition (Nelson 1970), branch or perform on request. ... // A hyperlink, is a reference or navigation element in a document to another section of the same document or to another document that may be on a (different) website. ...


As the Web and web design progressed, the markup language changed to become more complex and flexible, giving the ability to add objects like images and tables to a page. Features like tables, which were originally intended to be used to display tabular information, were soon subverted for use as invisible layout devices. With the advent of Cascading Style Sheets (CSS), table-based layout is increasingly regarded as outdated. Database integration technologies such as server-side scripting and design standards like W3C further changed and enhanced the way the Web is made. As times change websites are changing inside(scripts) and out(design) because of the way programs and utilities are created and further developed. CSS redirects here. ... Server-side scripting is a web server technology in which a users request is fulfilled by running a script directly on the web server to generate dynamic HTML pages. ...


With the progression of the Web, thousands of web design companies have been established around the world to serve the growing demand for such work. As with much of the information technology industry, many web design companies have been established in technology parks in the developing world as well as many Western design companies setting up offices in countries such as India, Romania, and Russia to take advantage of the relatively lower labor rates found in such countries.


Web site design

A Web site is a collection of information about a particular topic or subject. Designing a web site is defined as the arrangement and creation of web pages that in turn make up a web site. A web page consists of information for which the web site is developed. A web site might be compared to a book, where each page of the book is a web page. A website, Web site or WWW site (often shortened to just site) is a collection of webpages, that is, HTML/XHTML documents accessible via HTTP on the Internet; all publicly accessible websites in existence comprise the World Wide Web. ...


There are many aspects (design concerns) in this process, and due to the rapid development of the Internet, new aspects may emerge. For non-commercial web sites, the goals may vary depending on the desired exposure and response. For typical commercial web sites, the basic aspects of design are: All Saints Chapel in the Cathedral Basilica of St. ...

  • The content: the substance, and information on the site should be relevant to the site and should target the area of the public that the website is concerned with.
  • The usability: the site should be user-friendly, with the interface and navigation simple and reliable.
  • The appearance: the graphics and text should include a single style that flows throughout, to show consistency. The style should be professional, appealing and relevant.
  • The visibility: the site must also be easy to find via most, if not all, major search engines and advertisement media.

A web site typically consists of text and images. The first page of a web site is known as the Home page or Index. Some web sites use what is commonly called a Splash Page. Splash pages might include a welcome message, language or region selection, or disclaimer. Each web page within a web site is an HTML file which has its own URL. After each web page is created, they are typically linked together using a navigation menu composed of hyperlinks. Faster browsing speeds have led to shorter attention spans and more demanding online visitors and this has resulted in less use of Splash Pages, particularly where commercial web sites are concerned. Image of the Wikimedia Commons logo. ... Homepage, Home page or Home may refer to: The URL or local file that is automatically loaded when a web browser starts is called homepage or startpage. ... HTML, an initialism of HyperText Markup Language, is the predominant markup language for web pages. ... // Uniform Resource Locator (URL) formerly known as Universal Resource Locator, is a technical, Web-related term used in two distinct meanings: In popular usage and many technical documents, it is a synonym for Uniform Resource Identifier (URI); Strictly, the idea of a uniform syntax for global identifiers of network-retrievable... A hyperlink, or simply a link, is a reference in a hypertext document to another document or other resource. ...


Once a web site is completed, it must be published or uploaded in order to be viewable to the public over the internet. This may be done using an FTP client. Once published, the web master may use a variety of techniques to increase the traffic, or hits, that the web site receives. This may include submitting the web site to a search engine such as Google or Yahoo, exchanging links with other web sites, creating affiliations with similar web sites, etc. A FTP client uses the FTP protocol to connect to an FTP server to transfer files. ... Webmaster or Webmistress is a commonly used term that refers to the person or persons responsible for a specific website. ... Search engine redirects here. ... This article is about the corporation. ... Yahoo! - Wikipedia, the free encyclopedia /**/ @import /skins-1. ...


Multidisciplinary requirements

Web site design crosses multiple disciplines of information systems, information technology and communication design. The web site is an information system whose components are sometimes classified as front-end and back-end. The observable content (e.g. page layout, user interface, graphics, text, audio) is known as the front-end. The back-end comprises the organization and efficiency of the source code, invisible scripted functions, and the server-side components that process the output from the front-end. Depending on the size of a Web development project, it may be carried out by a multi-skilled individual (sometimes called a web master), or a project manager may oversee collaborative design between group members with specialized skills. Interdisciplinarity is the act of drawing from two or more academic disciplines and integrating their insights to work together in pursuit of a common goal. ... Information System (example) An Information System (IS) is the system of persons, data records and activities that process the data and information in a given organization, including manual processes or automated processes. ... Information and communication technology spending in 2005 Information Technology (IT), as defined by the Information Technology Association of America (ITAA), is the study, design, development, implementation, support or management of computer-based information systems, particularly software applications and computer hardware. ... Communication design is a sub-discipline of design (sometimes referred to as Graphic Design) which is concerned with how media intermission such as, print and digital pieces of work communicate with people in a visual way. ... It has been suggested that this article or section be merged with Information systems. ... In their most general meanings, the terms front-end and back-end refer to the initial and the end stages of a process flow. ... I just want to try This page meets Wikipedias criteria for speedy deletion. ... Desktop publishing, or DTP, is the process of editing and layout of printed material intended for publication, such as books, magazines, brochures, and the like using a personal computer. ... The user interface is the part of a system exposed to users. ... Graphic redirects here. ... Write redirects here. ... Look up audio in Wiktionary, the free dictionary. ... Webmaster or Webmistress is a commonly used term that refers to the person or persons responsible for a specific website. ... A project manager is the person who has the overall responsibility for the successful planning and execution of any project. ... Collaboration refers abstractly to all processes wherein people work together —applying both to the work of individuals as well as larger collectives and societies. ...


Issues

As in collaborative designs, there are conflicts between differing goals and methods of web site designs. These are a few of the ongoing ones.


Lack of collaboration in design

In the early stages of the web, there wasn't as much collaboration between web designs and larger advertising campaigns, customer transactions, social networking, intranets and extranets as there is now. Web pages were mainly static online brochures disconnected from the larger projects. An advertising campaign is a series of advertisement messages that share a single idea and theme which make up an integrated marketing communication (IMC). ... This article does not cite any references or sources. ... Not to be confused with social network services such as MySpace, etc. ... An intranet is a private computer network that uses Internet protocols, network connectivity to securely share part of an organizations information or operations with its employees. ... An extranet is a private network that uses Internet protocols, network connectivity, and possibly the public telecommunication system to securely share part of an organizations information or operations with suppliers, vendors, partners, customers or other businesses. ... Online means being connected to the Internet or another similar electronic network, like a bulletin board system. ... A brochure is a flyer or other paper material distributed for the purposes of advertising. ...


Many web pages are still disconnected from larger projects. Special design considerations are necessary for use within these larger projects. These design considerations are often overlooked, especially in cases where there is a lack of leadership, lack of understanding of why and technical knowledge of how to integrate, or lack of concern for the larger project in order to facilitate collaboration. This often results in unhealthy competition or compromise between departments, and less than optimal use of web pages. Leader redirects here. ... For wartime collaboration, see Collaborationism. ... For other uses, see Competition (disambiguation). ... Look up Compromise in Wiktionary, the free dictionary. ...


Liquid versus fixed layouts

On the web the designer has no control over several factors, including the size of the browser window, the web browser used, the input devices used (mouse, touch screen, voice command, text, cell phone number pad, etc.) and the size and characteristics of available fonts. An example of a Web browser (Mozilla Firefox) A web browser is a software application that enables a user to display and interact with text, images, videos, music and other information typically located on a Web page at a website on the World Wide Web or a local area network. ... This article is about the rodent. ... Nintendo DS Touch screen A touch screen is an input/output device that allows the user to interact with the computer by touching the display screen. ... Look up text in Wiktionary, the free dictionary. ... Motorola T2288 mobile phone A mobile phone is a portable electronic device which behaves as a normal telephone whilst being able to move over a wide area (compare cordless phone which acts as a telephone only within a limited range). ...


Some designers choose to control the appearance of the elements on the screen by using specific width designations. This control may be achieved through the use of a HTML table-based design or a more semantic div-based design through the use of CSS. Whenever the text, images, and layout of a design do not change as the browser changes, this is referred to as a fixed width design. Proponents of fixed width design prefer precise control over the layout of a site and the precision placement of objects on the page. Other designers choose a liquid design. A liquid design is one where the design moves to flow content into the whole screen, or a portion of the screen, no matter what the size of the browser window. Proponents of liquid design prefer greater compatibility and using the screen space available. Liquid design can be achieved through the use of CSS, by avoiding styling the page altogether, or by using HTML tables (or more semantic divs) set to a percentage of the page. Both liquid and fixed design developers must make decisions about how the design should degrade on higher and lower screen resolutions. Sometimes the pragmatic choice is made to flow the design between a minimum and a maximum width. This allows the designer to avoid coding for the browser choices making up The Long Tail, while still using all available screen space. Depending on the purpose of the content, a web designer may decide to use either fixed or liquid layouts on a case-by-case basis. HTML, an initialism of HyperText Markup Language, is the predominant markup language for web pages. ... The acronym CSS may mean: Cansei de Ser Sexy a Brazilian musical group Cascading Style Sheets, a stylesheet language Central Security Service, an agency of the United States government, created to promote partnership between the NSA and the SCE Content Scramble System, a Digital Rights Management method used on some... Look up degradation in Wiktionary, the free dictionary. ... Pragmatism is a school of philosophy which originated in the United States in the late 1800s. ... The phrase The Long Tail (as a proper noun with capitalized letters) was first coined by Chris Anderson in an October 2004 Wired magazine article[1] to describe certain business and economic models such as Amazon. ...


Similar to liquid layout is the optional fit to window feature with Adobe Flash content. This is a fixed layout that optimally scales the content of the page without changing the arrangement or text wrapping when the browser is resized.


Flash

Adobe Flash (formerly Macromedia Flash) is a proprietary, robust graphics animation or application development program used to create and deliver dynamic content, media (such as sound and video), and interactive applications over the web via the browser. Adobe Flash (previously called Shockwave Flash and Macromedia Flash) is a set of multimedia technologies developed and distributed by Adobe Systems and earlier by Macromedia. ... Macromedia was an American graphics and web development software house headquartered in San Francisco, California producing such products as Macromedia Flash. ...


Flash is not a standard produced by a vendor-neutral standards organization like most of the core protocols and formats on the Internet. Flash is much more restrictive than the open HTML format, though, requiring a proprietary plugin to be seen, and it does not integrate with most web browser UI features like the "Back" button. An open format is a published specification for storing digital data, usually maintained by a non-proprietary standards organization, and free of legal restrictions on use. ... Proprietary software is software with restrictions on copying and modifying as enforced by the proprietor. ... An example of a Web browser (Mozilla Firefox) A web browser is a software application that enables a user to display and interact with text, images, videos, music and other information typically located on a Web page at a website on the World Wide Web or a local area network. ...


According to a study,[2] 98% of US Web users have the Flash Player installed.[3] Numbers vary depending on the detection scheme and research demographics.[4]


Many graphic artists use Flash because it gives them exact control over every part of the design, and anything can be animated and generally "jazzed up". Some application designers enjoy Flash because it lets them create applications that do not have to be refreshed or go to a new web page every time an action occurs. Flash can use embedded fonts instead of the standard fonts installed on most computers. There are many sites which forgo HTML entirely for Flash. Other sites may use Flash content combined with HTML as conservatively as gifs or jpegs would be used, but with smaller vector file sizes and the option of faster loading animations. Flash may also be used to protect content from unauthorized duplication or searching. Alternatively, small, dynamic Flash objects may be used to replace standard HTML elements (such as headers or menu links) with advanced typography not possible via regular HTML or CSS (see Scalable Inman Flash Replacement). Scalable Inman Flash Replacement (sIFR) is an open source JavaScript and Macromedia Flash based technology initially developed by Shaun Inman and improved by Mike Davidson and Mark Wubben that enables the replacement of text elements on HTML web pages with Flash equivalents. ...


Flash detractors claim that Flash websites tend to be poorly designed, and often use confusing and non-standard user-interfaces. Up until recently, search engines have been unable to index Flash objects, which has prevented sites from having their contents easily found. This is because many search engine crawlers rely on text to index websites. It is possible to specify alternate content to be displayed for browsers that do not support Flash. Using alternate content also helps search engines to understand the page, and can result in much better visibility for the page. However, the vast majority of Flash websites are not disability accessible (for screen readers, for example) or Section 508 compliant. An additional issue is that sites which commonly use alternate content for search engines to their human visitors are usually judged to be spamming search engines and are automatically banned. Search engine redirects here. ... Section 508 is the short name for US Public Law 105-220, a series of amendments to Section 508 of The Rehabilitation Act of 1973 which were enacted in August 1998. ...


The most recent incarnation of Flash's scripting language (called "ActionScript", which is an ECMA language similar to JavaScript) incorporates long-awaited usability features, such as respecting the browser's font size and allowing blind users to use screen readers. Actionscript 2.0 is an Object-Oriented language, allowing the use of CSS, XML, and the design of class-based web applications. ActionScript 3.0 has a similar syntax to ActionScript 2.0 but different set of APIs for creating objects. ActionScript is a scripting language based on ECMAScript, used primarily for the development of websites and software using the Adobe Flash Player platform (in the form of SWF files embedded into Web pages). ... ECMA is short for European Computer Manufacturers Association (Name of Ecma International until 1994) East Coast Music Awards European Carton Makers Association[1] ECMAScript This is a disambiguation page — a navigational aid which lists other pages that might otherwise share the same title. ... JavaScript is a scripting language most often used for client-side web development. ... A screen reader is a software application that attempts to identify and obtain what is being displayed on the screen. ... Object-oriented programming (OOP) is a programming paradigm that uses objects and their interactions to design applications and computer programs. ... The Extensible Markup Language (XML) is a general-purpose markup language. ...


Silverlight

In 2007 Microsoft introduced an alternative to Flash, Silverlight.[1] A browser plug-in for playing media and right interactive web applications, silverlight is very similar to Flash. Silverlight also comes with a designer and developer tools like flash, but instead of ActionScript uses Microsoft's .Net framework for building web applications.[2] Microsoft Corporation, (NASDAQ: MSFT, HKSE: 4338) is a multinational computer technology corporation with global annual revenue of US$44. ... Microsoft Silverlight (code-named Windows Presentation Foundation/Everywhere or WPF/E) is a proprietary XAML-based runtime for browser-based Rich Internet Applications, providing a subset of the animation, vector graphics, and video playback capabilities of Windows Presentation Foundation. ...


CSS versus tables

For more details on this topic, see Tableless web design.

When Netscape Navigator 4 dominated the browser market, the popular solution available for designers to lay out a Web page was by using tables. Often even simple designs for a page would require dozens of tables nested in each other. Many web templates in Dreamweaver and other WYSIWYG editors still use this technique today. Navigator 4 didn't support CSS to a useful degree, so it simply wasn't used. Tableless Web design (or tableless web layout) is a method of web design and development without using HTML tables for page layout control purposes. ... Netscape Navigator, also known as Netscape, was a proprietary web browser that was popular during the 1990s. ... A web template is a ready-made web design used to mass-produce cookie cutter websites for rapid deployment. ... Dreamweaver redirects here. ... For the Chumbawamba album, see WYSIWYG (album). ... CSS redirects here. ...


After the browser wars subsided, and the dominant browsers such as Internet Explorer became more W3C compliant, designers started turning toward CSS as an alternate means of laying out their pages. CSS proponents say that tables should be used only for tabular data, not for layout. Using CSS instead of tables also returns HTML to a semantic markup, which helps bots and search engines understand what's going on in a web page. All modern Web browsers support CSS with different degrees of limitations. The term browser wars is the name given to the competition for dominance in the web browser marketplace. ... Windows Internet Explorer (formerly Microsoft Internet Explorer abbreviated MSIE), commonly abbreviated to IE, is a series of graphical web browsers developed by Microsoft and included as part of the Microsoft Windows line of operating systems starting in 1995. ... Look up Bots in Wiktionary, the free dictionary. ... An example of a Web browser (Mozilla Firefox) A web browser is a software application that enables a user to display and interact with text, images, videos, music and other information typically located on a Web page at a website on the World Wide Web or a local area network. ... // The following tables compare CSS compatibility and support for a number of layout engines. ...


However, one of the main points against CSS is that by relying on it exclusively, control is essentially relinquished as each browser has its own quirks which result in a slightly different page display. This is especially a problem as not every browser supports the same subset of CSS rules. For designers who are used to table-based layouts, developing Web sites in CSS often becomes a matter of trying to replicate what can be done with tables, leading some to find CSS design rather cumbersome due to lack of familiarity. For example, at one time it was rather difficult to produce certain design elements, such as vertical positioning, and full-length footers in a design using absolute positions. With the abundance of CSS resources available online today, though, designing with reasonable adherence to standards involves little more than applying CSS 2.1 or CSS 3 to properly structured markup.


These days most modern browsers have solved most of these quirks in CSS rendering and this has made many different CSS layouts possible. However, some people continue to use old browsers, and designers need to keep this in mind, and allow for graceful degrading of pages in older browsers. Most notable among these old browsers are Internet Explorer 5 and 5.5, which, according to some web designers, are becoming the new Netscape Navigator 4 — a block that holds the World Wide Web back from converting to CSS design. However, the W3 Consortium has made CSS in combination with XHTML the standard for web design.


Form vs. Function

Some web developers have a graphic arts background and may pay more attention to how a page looks than considering other issues such as how visitors are going to find the page via a search engine. Some might rely more on advertising than search engines to attract visitors to the site. On the other side of the issue, search engine optimization consultants (SEOs) are concerned with how well a web site works technically and textually: how much traffic it generates via search engines, and how many sales it makes, assuming looks don't contribute to the sales. As a result, the designers and SEOs often end up in disputes where the designer wants more 'pretty' graphics, and the SEO wants lots of 'ugly' keyword-rich text, bullet lists, and text links. One could argue that this is a false dichotomy due to the possibility that a web design may integrate the two disciplines for a collaborative and synergistic solution. Because some graphics serve communication purposes in addition to aesthetics, how well a site works may depend on the graphic designer's visual communication ideas as well as the SEO considerations. A web developers workstation. ... Graphic arts is a term applied historically to the art of printmaking and drawing. ... // Advert redirects here. ... A typical search results page Search engine optimization (SEO) is the process of improving the volume and quality of traffic to a web site from search engines via natural (organic or algorithmic) search results for targeted keywords. ... A consultant is a professional that provides expert advice in a particular domain or area of expertise such as accountancy, information technology, the law, human resources, marketing, medicine, finance or more esoteric areas of knowledge, for example engineering and scientific specialties such as materials science, instrumentation, avionics, and stress analysis. ... A keyword in an Internet search is one of the words used to find matching web pages. ... ... Text links are parts of a webpage, which can be used to access other pages on the same website or externally. ... The logical fallacy of false dilemma, also known as fallacy of the excluded middle, false dichotomy, either/or dilemma or bifurcation, is to set up two alternative points of view as if they were the only options, when they are not. ... Synergy (from the Greek synergos, συνεργός meaning working together, circa 1660) refers to the phenomenon in which two or more discrete influences or agents acting together create an effect greater than that predicted by knowing only the separate effects of the individual agents. ... For other uses, see Communication (disambiguation). ... Aesthetics (or esthetics) (from the Greek word αισθητική) is a branch of philosophy dealing with the nature of beauty. ... Graphics are often utilitarian and anonymous,[1] as these pictographs from the US National Park Service illustrate. ... Visual communication is the conveyance of ideas and information in forms that can be read or looked upon. ...


An additional concern website owners face is that of Usability. This factor involves the ability of the user (web site visitor) to interact with the web site and perform the tasks most important to the web site owner. For instance a web site that sells cars would want to make the process of buying a car as easy and thought free as possible. Ideas like this populate the web design community, and experts like Steve Krug [3] have emerged. Usability is a term used to denote the ease with which people can employ a particular tool or other human-made object in order to achieve a particular goal. ...


Another problem when using lots of graphics on a page is that download times can be greatly lengthened, often irritating the user. This has become less of a problem as the internet has evolved with high-speed internet and the use of vector graphics. This is an engineering challenge to increase bandwidth in addition to an artistic challenge to minimize graphics and graphic file sizes. This is an on-going challenge as increased bandwidth invites increased amounts of content. A WildBlue Satellite Internet dish. ... Example showing effect of vector graphics versus raster graphics. ...


Accessible Web design

Main article: Web accessibility

To be accessible, web pages and sites must conform to certain accessibility principles. These can be grouped into the following main areas: For Wikipedias accessibility guideline, see Wikipedia:Accessibility. ...

  • use semantic markup that provides a meaningful structure to the document (i.e. web page)
  • Semantic markup also refers to semantically organizing the web page structure and publishing web services description accordingly so that they can be recognized by other web services on different web pages. Standards for semantic web are set by IEEE
  • use a valid markup language that conforms to a published DTD or Schema
  • provide text equivalents for any non-text components (e.g. images, multimedia)
  • use hyperlinks that make sense when read out of context. (e.g. avoid "Click Here.")
  • don't use frames
  • use CSS rather than HTML Tables for layout.
  • author the page so that when the source code is read line-by-line by user agents (such as a screen readers) it remains intelligible. (Using tables for design will often result in information that is not.)

However, W3C permits an exception where tables for layout either make sense when linearized or an alternate version (perhaps linearized) is made available. A specialized markup language using SGML is used to write the electronic version of the Oxford English Dictionary. ... Document Type Definition (DTD), defined slightly differently within the XML and SGML (the language XML was derived from) specifications, is one of several SGML and XML schema languages, and is also the term used to describe a document or portion thereof that is authored in the DTD language. ... An XML schema is a description of a type of XML document, typically expressed in terms of constraints on the structure and content of documents of that type, above and beyond the basic syntax constraints imposed by XML itself. ... A hyperlink, or simply a link, is a reference in a hypertext document to another document or other resource. ... This article does not cite any references or sources. ... CSS redirects here. ... Tableless Web design (or tableless web layout) is a method of web design and development without using HTML tables for page layout control purposes. ... A user agent is the client application used with a particular network protocol; the phrase is most commonly used in reference to those which access the World Wide Web. ... A screen reader is a software application that attempts to identify and interpret what is being displayed on the screen. ...


Website accessibility is also changing as it is impacted by Content Management Systems that allow changes to be made to webpages without the need of obtaining programming language knowledge.


Website Planning

Before creating and uploading a website, it is important to take the time to plan exactly what is needed in the website. Thoroughly considering the audience or target market, as well as defining the purpose and deciding what content will be developed are extremely important.


Purpose

It is essential to define the purpose of the website as one of the first steps in the planning process. A purpose statement should show focus based on what the website will accomplish and what the users will get from it. A clearly defined purpose will help the rest of the planning process as the audience is identified and the content of the site is developed. Setting short and long term goals for the website will help make the purpose clear and plan for the future when expansion, modification, and improvement will take place. Also, goal-setting practices and measurable objectives should be identified to track the progress of the site and determine success.


Audience

Defining the audience is a key step in the website planning process. The audience is the group of people who are expected to visit your website – the market being targeted. These people will be viewing the website for a specific reason and it is important to know exactly what they are looking for when they visit the site. A clearly defined purpose or goal of the site as well as an understanding of what visitors want to do or feel when they come to your site will help to identify the target audience. Upon considering who is most likely to need or use the content, a list of characteristics common to the users such as:

  • Audience Characteristics
  • Information Preferences
  • Computer Specifications
  • Web Experience

Taking into account the characteristics of the audience will allow an effective website to be created that will deliver the desired content to the target audience.


Content

Content evaluation and organization requires that the purpose of the website be clearly defined. Collecting a list of the necessary content then organizing it according to the audience's needs is a key step in website planning. In the process of gathering the content being offered, any items that do not support the defined purpose or accomplish target audience objectives should be removed. It is a good idea to test the content and purpose on a focus group and compare the offerings to the audience needs. The next step is to organize the basic information structure by categorizing the content and organizing it according to user needs. Each category should be named with a concise and descriptive title that will become a link on the website. Planning for the site's content ensures that the wants or needs of the target audience and the purpose of the site will be fulfilled.


Compatibility and restrictions

Because of the market share of modern browsers (depending on your target market), the compatibility of your website with the viewers is restricted. For instance, a website that is designed for the majority of websurfers will be limited to the use of valid XHTML 1.0 Strict or older, Cascading Style Sheets Level 1, and 1024x768 display resolution. This is because Internet Explorer is not fully W3C standards compliant with the modularity of XHTML 1.1 and the majority of CSS beyond 1. A target market of more alternative browser (e.g. Firefox and Opera) users allow for more W3C compliance and thus a greater range of options for a web designer. A rough estimation of usage share of layout engines/web browsers This article aims to be an unbiased historical record for the usage share of web browsers, based on statistics and articles published by well-known websites. ... It has been suggested that this article or section be merged into World Wide Web Consortium. ... The Extensible HyperText Markup Language, or XHTML, is a markup language that has the same depth of expression as HTML, but also conforms to XML syntax. ... CSS redirects here. ... Display standards comparison The display resolution of a digital television or computer display typically refers to the number of distinct pixels in each dimension that can be displayed. ... Windows Internet Explorer (formerly Microsoft Internet Explorer abbreviated MSIE), commonly abbreviated to IE, is a series of graphical web browsers developed by Microsoft and included as part of the Microsoft Windows line of operating systems starting in 1995. ... The World Wide Web Consortium (W3C) is a consortium that produces standards—recommendations, as they call them—for the World Wide Web. ... Web standards is a general term for the formal standards and other technical specifications that define and describe aspects of the World Wide Web. ... Modularity is a concept that has applications in the contexts of computer science, particularly programming, as well as cognitive science in investigating the structure of mind. ... Firefox may refer to: Firefox (novel), written by Craig Thomas, published in 1978 Firefox (film), the 1982 movie starring Clint Eastwood, based on the novel Firefox (arcade game), the laserdisc arcade game based on the movie Mozilla Firefox, a web browser The Red Fox or the Red Panda, based on... Opera is a web browser and Internet suite developed by the Norwegian Opera Software company. ...


Another restriction on webpage design is the use of different Image file formats. The majority of users can support GIF, JPEG, and PNG (with restrictions). Again Internet Explorer is the major restriction here, not fully supporting PNG's advanced transparency features, resulting in the GIF format still being the most widely used graphic file format for transparent images. Image file formats provide a standardized method of organizing and storing image data. ... GIF redirects here. ... JPG redirects here. ... PNG (Portable Network Graphics), sometimes pronounced as ping, is a relatively new bitmap image format that is becoming popular on the World Wide Web and elsewhere. ... Windows Internet Explorer (formerly Microsoft Internet Explorer abbreviated MSIE), commonly abbreviated to IE, is a series of graphical web browsers developed by Microsoft and included as part of the Microsoft Windows line of operating systems starting in 1995. ...


Many website incompatibilities go unnoticed by the designer and unreported by the users. The only way to be certain a website will work on a particular platform is to test it on that platform.


Recently the development teams who create new browser versions (Internet Explorer, Firefox etc..) have begun working toward more standards compliance. It was only in the beginning of 2008 that the developers of Internet Explorer 8 announced the new version of Internet Explorer (8.0)[4] will be standards compliant. As of today all widely used browsers in development are standards compliant.


Planning documentation

Documentation is used to visually plan the site while taking into account the purpose, audience and content, to design the site structure, content and interactions that are most suitable for the website. Documentation may be considered a prototype for the website – a model which allows the website layout to be reviewed, resulting in suggested changes, improvements and/or enhancements. This review process increases the likelihood of success of the website.


First, the content is categorized and the information structure is formulated. The information structure is used to develop a document or visual diagram called a site map. This creates a visual of how the web pages will be interconnected, which helps in deciding what content will be placed on what pages. There are three main ways of diagramming the website structure: Site tree redirects here. ...

  • Linear Website Diagrams will allow the users to move in a predetermined sequence;
  • Hierarchical structures (of Tree Design Website Diagrams) provide more than one path for users to take to their destination;
  • Branch Design Website Diagrams allow for many interconnections between web pages such as hyperlinks within sentences.

In addition to planning the structure, the layout and interface of individual pages may be planned using a storyboard. In the process of storyboarding, a record is made of the description, purpose and title of each page in the site, and they are linked together according to the most effective and logical diagram type. Depending on the number of pages required for the website, documentation methods may include using pieces of paper and drawing lines to connect them, or creating the storyboard using computer software. Storyboards are graphic organizers such as a series of illustrations or images displayed in sequence for the purpose of previsualizing a motion graphic or interactive media sequence, including website interactivity. ...


Some or all of the individual pages may be designed in greater detail as a website wireframe, a mock up model or comprehensive layout of what the page will actually look like. This is often done in a graphic program, or layout design program. The wireframe has no working functionality, only planning. In web design, wireframes are a basic visual guide used to suggest the layout and placement of fundamental design elements in the interface design. ... In advertising, a comprehensive, usually shortened to comp, is the layout of a proposed advertisement as initially presented by an advertising agency to a client, showing the relative positions of text and illustrations before the specific content of those elements has been decided on. ...


See also

ASP.NET logo ASP.NET is a web application framework marketed by Microsoft that programmers can use to build dynamic web sites, web applications and XML web services. ... A screenshot of the Yahoo Color Picker. ... A content delivery network or content distribution networks (CDNs) is a system of computers networked together across the Internet that cooperate transparently to deliver content (especially large media content) to end users. ... This article does not cite any references or sources. ... A faceted navigation is a navigation system which offers multiple facets of navigation to a single piece of information. ... Information architecture (IA) is the art and science of expressing a model or concept of information used in activities that require explicit details of complex systems. ... Interaction Design (IxD) is the discipline of defining the behavior of products and systems that a user can interact with. ... Java language redirects here. ... Knowledge Visualization is a sub discipline of Information Design and Instructional Message Design (pedagogy; didactics, pedagogical psychology). ... For other uses, see PHP (disambiguation). ... Progressive Enhancement is a label for a particular strategy for Web design that emphasizes accessibility, semantic markup, and external stylesheet and scripting technologies, in a layered fashion that allows all to access the basic content and functionality of a Web page, using any browser or Internet connection, while also enabling... Ruby on Rails is a free web application framework designed to make web development faster, simpler and more efficient. ... Server-side scripting is a web server technology in which a users request is fulfilled by running a script directly on the web server to generate dynamic HTML pages. ... A sitemap is a collection of hyperlinks that outlines a websites structure. ... Streaming media is multimedia that is continuously received by, and normally displayed to, the end-user while it is being delivered by the provider. ... Web style sheets are a form of separation of presentation and content for web design in which the markup (i. ... Unobtrusive JavaScript is an emerging paradigm in the JavaScript programming language, as used on the World Wide Web. ... This article or section does not cite its references or sources. ... A Tag cloud (constructed by Markus Angermeier) 1 presenting some of the themes of Web 2. ... Web colors are colors used in designing web pages, and the methods for describing and specifying those colors. ... Web indexing (or Internet indexing) includes back-of-book-style indexes to individual websites or an intranet, and the creation of keyword metadata to provide a more useful vocabulary for Internet or onsite search engines. ... // Web Integration Web integration is a process where an existing web site gets optimized in a structured way to share the features of a newly added component. ... AdesDesign. ... Web usability is the application of usability in those domains where web browsing can be considered as a general paradigm (or metaphor) for constructing a GUI. // General Web usability is a general approach: it is as much about the effectiveness of transferring information via the Internet, as it is about... Web mining and web usage mining is the application of data mining techniques to discover usage patterns from the Web in order to better understand and serve the needs of users or Web-based applications. ... Website architecture is an approach to the design and planning of websites which, like architecture itself involves technical, aesthetic and functional criteria. ... The internet industry has established various award schemes for websites, following the example of the Tony, Oscar, BAFTA, Cannes Film Festival and Emmy awards which are granted in the fields of theatre, cinema and television. ... Most web site builders are proprietary tools provided by web hosting companies which cater to people who wish to build their own websites without learning the technical aspects of web page production. ...

References

  1. ^ Berners-Lee on the read/write web. BBC News.
  2. ^ Flash and Shockwave Players: NPD Methodology.
  3. ^ Flash Player Statistics.
  4. ^ Web Usage Graphs and Charts.

External links

Wikiversity
At Wikiversity, you can learn about:
Image File history File links This is a lossless scalable vector image. ... Wikiversity logo Wikiversity is a Wikimedia Foundation beta project[1], devoted to learning materials and activities, located at www. ... The Open Directory Project (ODP), also known as dmoz (from , its original domain name), is a multilingual open content directory of World Wide Web links owned by Netscape that is constructed and maintained by a community of volunteer editors. ...

  Results from FactBites:
 
Web Design from Scratch - Free web design course, web basics, web page layout, free web design tutorials, design case ... (1253 words)
Web 2.0 design is not the same as star flashes and shiny table effects.
The fact is that most web design should help people quickly and easily find what they want, not stop them in their tracks with impressive graphical experiences.
Web hosting is now cheaper for everyone, but the difference between the best hosts and the rest is as great as ever.
Current style in web design (1346 words)
This is where I try to sum up the current state-of-the-art in graphic design for web pages, and identify the distinctive features that make a web page look fresh, appealing and easy to use.
What designers should learn from this trend is that it's not enough to design a blank page, to be stuffed with content later.
Design Melt Down - wonderful insight into all kinds of aspects of web design, with a focus on "2.0" style.
  More results at FactBites »

 
 

COMMENTARY     


Share your thoughts, questions and commentary here
Your name
Your comments

Want to know more?
Search encyclopedia, statistics and forums:

 


Press Releases |  Feeds | Contact
The Wikipedia article included on this page is licensed under the GFDL.
Images may be subject to relevant owners' copyright.
All other elements are (c) copyright NationMaster.com 2003-5. All Rights Reserved.
Usage implies agreement with terms, 1022, m