This document provides guidance on web design fundamentals, including site planning, goals, audience analysis, competition analysis, resources, site mapping, and visual design elements. It discusses determining site goals and guidelines, analyzing the intended audience and competition, mapping the current site structure, and designing a new site structure. It also covers visual design fundamentals like composition, grids, balance, white space, color, fonts, motion, and examples of these concepts. Testing designs with users and maintaining sites over time are also addressed.
This document provides guidance on improving website usability through good design, content, and storytelling. It discusses organizing content so it is easy to scan, using headlines, white space and chunking. Key points include focusing on the user's goals, using concise and scannable writing, and measuring success through analytics. Storytelling with images and examples can help engage users.
The document discusses usability best practices for websites. It provides examples of both good and bad usability, highlighting key principles like clear navigation, scannable content, and using design to enhance the user experience. It emphasizes measuring success through analytics and testing with users.
Information Architecture - Tasks & Tools for Web DesignersDennis Deacon
We may not realize we're doing it, but Information Architecture is being performed transparently as part of our web projects.This presentation highlights the key aspects of this trade and provides some best practices.
Roberto Hortal Seamless Website Journey Increase User-friendliness and Acces...Roberto Hortal
The document discusses the relationship between design and functionality in website design. It argues that websites should have both visual appeal and strong functionality. The ideal design sits on the boundary between being highly functional and highly aesthetic. It also emphasizes the importance of clear, user-friendly content and layout to improve accessibility and the user experience on a website. Accessibility is important both for legal compliance and business reasons like reaching a wider audience and easier maintenance of the site.
This presentation covered basics of interaction design and strategy. It began with an introduction to the speaker and his clients. The presentation then reviewed key UX principles like scent of information, progressive disclosure, information clustering and hierarchy. It discussed grids, projects, user journeys, responsive design, and included exercises for teams to design a responsive homepage and mobile app. The goal was for attendees to learn UX principles, responsive design, and practice designing through team exercises.
Breakout session from Illinois Webcon 2019
How do you create an effective and engaging marketing experience for prospective students, while still keeping current students, staff, parents, and alumni happy? And how do you do this while making your website clean, coherent, and simple to both manage and navigate?
In this presentation, we will dive into examples from past clients to see how refreshing (or entirely restructuring!) your sitemap and creating a sitemap-based navigation scheme can improve your user's experience and maintain your website's longevity.
You will learn:
- Best practices for structuring your website's architecture, whether you have a lot or a little time to spend
- Sound principles for directing users around your website, including traditional navigation schemes and navigating via page content
- How to help all kinds of audiences find what they need, when they need it, without sacrificing a coherent site structure
The document provides guidelines for effective web design based on how users interact with websites. It discusses how users scan pages rather than read linearly, are impatient and want instant gratification, and follow intuitions rather than optimal paths. It provides examples of websites that exemplify principles like reducing cognitive load and unnecessary questions, exposing key features visually, using concise writing, and prioritizing simplicity over complexity. The overall message is that web design should minimize cognitive effort for users and focus their attention on important content.
This document provides guidance on improving website usability through good design, content, and storytelling. It discusses organizing content so it is easy to scan, using headlines, white space and chunking. Key points include focusing on the user's goals, using concise and scannable writing, and measuring success through analytics. Storytelling with images and examples can help engage users.
The document discusses usability best practices for websites. It provides examples of both good and bad usability, highlighting key principles like clear navigation, scannable content, and using design to enhance the user experience. It emphasizes measuring success through analytics and testing with users.
Information Architecture - Tasks & Tools for Web DesignersDennis Deacon
We may not realize we're doing it, but Information Architecture is being performed transparently as part of our web projects.This presentation highlights the key aspects of this trade and provides some best practices.
Roberto Hortal Seamless Website Journey Increase User-friendliness and Acces...Roberto Hortal
The document discusses the relationship between design and functionality in website design. It argues that websites should have both visual appeal and strong functionality. The ideal design sits on the boundary between being highly functional and highly aesthetic. It also emphasizes the importance of clear, user-friendly content and layout to improve accessibility and the user experience on a website. Accessibility is important both for legal compliance and business reasons like reaching a wider audience and easier maintenance of the site.
This presentation covered basics of interaction design and strategy. It began with an introduction to the speaker and his clients. The presentation then reviewed key UX principles like scent of information, progressive disclosure, information clustering and hierarchy. It discussed grids, projects, user journeys, responsive design, and included exercises for teams to design a responsive homepage and mobile app. The goal was for attendees to learn UX principles, responsive design, and practice designing through team exercises.
Breakout session from Illinois Webcon 2019
How do you create an effective and engaging marketing experience for prospective students, while still keeping current students, staff, parents, and alumni happy? And how do you do this while making your website clean, coherent, and simple to both manage and navigate?
In this presentation, we will dive into examples from past clients to see how refreshing (or entirely restructuring!) your sitemap and creating a sitemap-based navigation scheme can improve your user's experience and maintain your website's longevity.
You will learn:
- Best practices for structuring your website's architecture, whether you have a lot or a little time to spend
- Sound principles for directing users around your website, including traditional navigation schemes and navigating via page content
- How to help all kinds of audiences find what they need, when they need it, without sacrificing a coherent site structure
The document provides guidelines for effective web design based on how users interact with websites. It discusses how users scan pages rather than read linearly, are impatient and want instant gratification, and follow intuitions rather than optimal paths. It provides examples of websites that exemplify principles like reducing cognitive load and unnecessary questions, exposing key features visually, using concise writing, and prioritizing simplicity over complexity. The overall message is that web design should minimize cognitive effort for users and focus their attention on important content.
Information architecture (IA) is the art and science of organizing and structuring information in a way that optimizes findability and understanding. It involves developing navigation systems, labeling schemes, and content organization to help users easily find desired information. Key aspects of IA include navigation and labeling systems, content organization, and information storage and retrieval structures. Proper IA helps users intuitively understand a website's information hierarchy and structure, improving the user experience and supporting better search engine optimization.
Thoughtful, user-friendly design starts with your website, an opportunity to demonstrate
how much you value the needs of your clients. We provide clear examples to help you create a site that satisfies esthetically and functionally.
This document provides an overview and summary of key points from a book about writing and designing for the web. The book introduces important concepts like rhetoric, web languages like HTML and CSS, and challenges related to accessibility, usability and sustainability. It explains that the goal is not to teach everything about web design, but to provide foundational knowledge to get started. Sections of the book cover topics such as determining your writing purpose, addressing your target audience, and strategies for success. Overall, the document summarizes that the book presents an introduction to combining writing skills with technical web knowledge for effective information design online.
Basics of Interaction Design & Strategy - 4/9/16Robert Stribley
The document provides an overview of a workshop on basics of interaction design and strategy held at the School of Visual Arts. It includes details about the speaker's background and clients, goals and agenda for the workshop, and principles that will be covered including scent of information, progressive disclosure, information clustering and hierarchy, removing paths not taken, the tyranny of consistency, death of the homepage, knowing your audience, grids, and responsive design. The group will work on a project to design a responsive website and mobile app experience for the Museum of Modern Art that utilizes user journeys and personas.
Alt means alternative text. A look at how to write it, thinking about audience, content, context.
These slides are from the Accessibility Summit, 2014. Register for access to recorded sessions:
http://environmentsforhumans.com/2014/accessibility-summit
An introduction to designing for accessibility. For designers, product managers and business analysts. Understand the need for accessibility and cover off some accessibility basics.
Do the right thing: accessibility and inclusive design (with Drupal)cspin
What developers, designers, content managers, and stakeholders need to know about the current state of web accessibility, the laws in Ontario enforcing accessibility by January 2014, and how Drupal can help.
This document provides an overview of 10 web design trends for 2013 based on an e-book on web and mobile design trends. The trends discussed include:
1) Prioritizing content over design and ensuring a consistent user experience across devices.
2) Simplicity in design and interaction through minimalism, clear layouts, and focus on typography.
3) User-centered design through storytelling, personality in style, and focus on the user's purpose over design specifics.
What is user experience and why does it matterSarah Horton
Many factors influence decision-making when producing websites, applications, and apps. In many cases, decision-making is focused on addressing the values of the producer, and the most important factor is overlooked: the consumer. People are loyal to products and services that satisfy their needs and provide content and features that they value. Providing a good user experience benefits both consumer and producer.
In this session we will look at user experience broadly, and then through the lens of accessibility, as a way of bringing into focus the value of providing accessible and enjoyable user experiences.
Presented as part of Harvard's Digital Content Connect, June 12, 2014: http://hwpi.harvard.edu/digital-content-connect
Understanding Visual Hierarchy in Web DesignHashem Zahran
Visual hierarchy is one of the most important principles behind effective web design. This session will examine why developing a visual hierarchy is crucial on the web, the theory behind it, and how you can use some very basic exercises in your own designs to put these principles into practice.
This document summarizes a presentation about psychology behind good web design. It discusses why good design is important for sales, customer relationships, and virality. It covers key differences between content and design. It also discusses how people learn from websites visually, auditorily, and through experience. Consistency, simplicity, curiosity, and minimizing mistakes are presented as important principles for good design. Specific techniques like navigation menus, sparking curiosity and rewarding it are also covered.
Designing and evaluating web sites using universal design principles notesHoward Kramer
This document summarizes a presentation on designing and evaluating websites using universal design principles. The presentation focuses on integrating usability and accessibility to achieve universal design. It will review concepts of universal design and best practices for web design, and have exercises to identify when sites incorporate universal design principles and when they do not. The presenter advocates taking a universal design approach rather than just an accessibility approach to ensure sites are usable and accessible for all users, including those with disabilities.
Introduction to Information Architecture & Design - 2/14/15Robert Stribley
The document provides an introduction to an information architecture and design workshop. It includes an agenda for the workshop that covers topics such as background on information architecture, the design process, user research including card sorting and competitive reviews, conceptual site maps and navigation, and sketching and wireframing. Personas for an events website are presented to illustrate how user research can be synthesized into representative user profiles. The document emphasizes that information architecture follows principles of organization, labeling, and navigation to help users efficiently find and manage information.
This document provides an overview and agenda for a "Publishing 102" training session. It includes dates and objectives for upcoming online publishing trainings. The Publishing 102 agenda covers industry trends in 4D publishing, peer review using tools like Crocodoc and BackBoard, publishing and critiquing student work, and types of online publishing for personal and professional audiences. Guidelines are provided on making peer review effective and dos and don'ts for online publishing. Participants are encouraged to bring materials to an upcoming hands-on session on Web 2.0 tools and coaching days are scheduled for individual meetings. Contact information is provided for the presenter, Karen Brooks.
The Top Ten Elements Your Noprofit's Strategic Website Should Haveguidecreative
@keljar @guidecreative Your website is more than just a pretty picture. It should be created for your unique audience as a tool to engage, and ultimately inspire action. Artistic talent alone is not enough, you need a web design rooted in a clear strategy and driven by results.
Good systems development often depends on multiple data management disciplines. One of these is metadata. While much of the discussion around metadata focuses on understanding metadata itself along with associated technologies, this comprehensive issue often represents a typical tool-and-technology focus, which has not achieved significant results. A more relevant question when considering pockets of metadata is whether to include them in the scope of organizational metadata practices. By understanding metadata practices, you can begin to build systems that allow you to exercise sophisticated data management techniques and support business initiatives.
Learning Objectives:
How to leverage metadata in support of your business strategy
Understanding foundational metadata concepts based on the DAMA DMBOK
Guiding principles & lessons learned
This document provides an overview of metadata and discusses its various types and uses. It defines metadata as data that describes other data, similar to street signs or maps that communicate information. There are three main types of metadata: descriptive, structural, and administrative. Descriptive metadata is used to describe resources for discovery and identification, structural metadata defines relationships between parts of a resource, and administrative metadata provides technical and management information. The document provides many examples of metadata usage and notes that metadata is key to the functioning of libraries, the web, software, and more. It is truly everywhere.
Information architecture (IA) is the art and science of organizing and structuring information in a way that optimizes findability and understanding. It involves developing navigation systems, labeling schemes, and content organization to help users easily find desired information. Key aspects of IA include navigation and labeling systems, content organization, and information storage and retrieval structures. Proper IA helps users intuitively understand a website's information hierarchy and structure, improving the user experience and supporting better search engine optimization.
Thoughtful, user-friendly design starts with your website, an opportunity to demonstrate
how much you value the needs of your clients. We provide clear examples to help you create a site that satisfies esthetically and functionally.
This document provides an overview and summary of key points from a book about writing and designing for the web. The book introduces important concepts like rhetoric, web languages like HTML and CSS, and challenges related to accessibility, usability and sustainability. It explains that the goal is not to teach everything about web design, but to provide foundational knowledge to get started. Sections of the book cover topics such as determining your writing purpose, addressing your target audience, and strategies for success. Overall, the document summarizes that the book presents an introduction to combining writing skills with technical web knowledge for effective information design online.
Basics of Interaction Design & Strategy - 4/9/16Robert Stribley
The document provides an overview of a workshop on basics of interaction design and strategy held at the School of Visual Arts. It includes details about the speaker's background and clients, goals and agenda for the workshop, and principles that will be covered including scent of information, progressive disclosure, information clustering and hierarchy, removing paths not taken, the tyranny of consistency, death of the homepage, knowing your audience, grids, and responsive design. The group will work on a project to design a responsive website and mobile app experience for the Museum of Modern Art that utilizes user journeys and personas.
Alt means alternative text. A look at how to write it, thinking about audience, content, context.
These slides are from the Accessibility Summit, 2014. Register for access to recorded sessions:
http://environmentsforhumans.com/2014/accessibility-summit
An introduction to designing for accessibility. For designers, product managers and business analysts. Understand the need for accessibility and cover off some accessibility basics.
Do the right thing: accessibility and inclusive design (with Drupal)cspin
What developers, designers, content managers, and stakeholders need to know about the current state of web accessibility, the laws in Ontario enforcing accessibility by January 2014, and how Drupal can help.
This document provides an overview of 10 web design trends for 2013 based on an e-book on web and mobile design trends. The trends discussed include:
1) Prioritizing content over design and ensuring a consistent user experience across devices.
2) Simplicity in design and interaction through minimalism, clear layouts, and focus on typography.
3) User-centered design through storytelling, personality in style, and focus on the user's purpose over design specifics.
What is user experience and why does it matterSarah Horton
Many factors influence decision-making when producing websites, applications, and apps. In many cases, decision-making is focused on addressing the values of the producer, and the most important factor is overlooked: the consumer. People are loyal to products and services that satisfy their needs and provide content and features that they value. Providing a good user experience benefits both consumer and producer.
In this session we will look at user experience broadly, and then through the lens of accessibility, as a way of bringing into focus the value of providing accessible and enjoyable user experiences.
Presented as part of Harvard's Digital Content Connect, June 12, 2014: http://hwpi.harvard.edu/digital-content-connect
Understanding Visual Hierarchy in Web DesignHashem Zahran
Visual hierarchy is one of the most important principles behind effective web design. This session will examine why developing a visual hierarchy is crucial on the web, the theory behind it, and how you can use some very basic exercises in your own designs to put these principles into practice.
This document summarizes a presentation about psychology behind good web design. It discusses why good design is important for sales, customer relationships, and virality. It covers key differences between content and design. It also discusses how people learn from websites visually, auditorily, and through experience. Consistency, simplicity, curiosity, and minimizing mistakes are presented as important principles for good design. Specific techniques like navigation menus, sparking curiosity and rewarding it are also covered.
Designing and evaluating web sites using universal design principles notesHoward Kramer
This document summarizes a presentation on designing and evaluating websites using universal design principles. The presentation focuses on integrating usability and accessibility to achieve universal design. It will review concepts of universal design and best practices for web design, and have exercises to identify when sites incorporate universal design principles and when they do not. The presenter advocates taking a universal design approach rather than just an accessibility approach to ensure sites are usable and accessible for all users, including those with disabilities.
Introduction to Information Architecture & Design - 2/14/15Robert Stribley
The document provides an introduction to an information architecture and design workshop. It includes an agenda for the workshop that covers topics such as background on information architecture, the design process, user research including card sorting and competitive reviews, conceptual site maps and navigation, and sketching and wireframing. Personas for an events website are presented to illustrate how user research can be synthesized into representative user profiles. The document emphasizes that information architecture follows principles of organization, labeling, and navigation to help users efficiently find and manage information.
This document provides an overview and agenda for a "Publishing 102" training session. It includes dates and objectives for upcoming online publishing trainings. The Publishing 102 agenda covers industry trends in 4D publishing, peer review using tools like Crocodoc and BackBoard, publishing and critiquing student work, and types of online publishing for personal and professional audiences. Guidelines are provided on making peer review effective and dos and don'ts for online publishing. Participants are encouraged to bring materials to an upcoming hands-on session on Web 2.0 tools and coaching days are scheduled for individual meetings. Contact information is provided for the presenter, Karen Brooks.
The Top Ten Elements Your Noprofit's Strategic Website Should Haveguidecreative
@keljar @guidecreative Your website is more than just a pretty picture. It should be created for your unique audience as a tool to engage, and ultimately inspire action. Artistic talent alone is not enough, you need a web design rooted in a clear strategy and driven by results.
Good systems development often depends on multiple data management disciplines. One of these is metadata. While much of the discussion around metadata focuses on understanding metadata itself along with associated technologies, this comprehensive issue often represents a typical tool-and-technology focus, which has not achieved significant results. A more relevant question when considering pockets of metadata is whether to include them in the scope of organizational metadata practices. By understanding metadata practices, you can begin to build systems that allow you to exercise sophisticated data management techniques and support business initiatives.
Learning Objectives:
How to leverage metadata in support of your business strategy
Understanding foundational metadata concepts based on the DAMA DMBOK
Guiding principles & lessons learned
This document provides an overview of metadata and discusses its various types and uses. It defines metadata as data that describes other data, similar to street signs or maps that communicate information. There are three main types of metadata: descriptive, structural, and administrative. Descriptive metadata is used to describe resources for discovery and identification, structural metadata defines relationships between parts of a resource, and administrative metadata provides technical and management information. The document provides many examples of metadata usage and notes that metadata is key to the functioning of libraries, the web, software, and more. It is truly everywhere.
This document discusses the pros of using metadata over folders for organizing files in SharePoint. It lists 14 reasons why folders are problematic, including issues with usability, long URLs, file duplication, limited views, rigidity of structure, and high administrative costs. Metadata is presented as a better solution as it allows for advanced filtering, sorting, flexible changes, and ensures data integrity. The document encourages using folders only for small, informal projects, and metadata for larger implementations where advanced file management is needed.
La Dictadura de Porfirio Díaz se refiere al período histórico entre 1876 y 1911 en el que Porfirio Díaz ejerció el control del poder en México. Formado en la Guerra de Reforma y durante la Intervención Francesa, Porfirio Díaz triunfó militarmente contra el presidente Lerdo de Tejada y luego ganó la presidencia a través del Plan de Tuxtepec en 1876, gobernando de forma casi ininterrumpida hasta 1911 cuando renunció y abandonó México.
The document compares the performance of overground and underground tanks for seasonal storage of thermal energy from solar energy. An experimental setup was designed to charge both tanks simultaneously using a simulated solar energy source. Results showed that the underground tank maintained temperature levels better and had higher storage efficiency than the overground tank under different loading patterns. The underground tank was also found to be less sensitive to ambient temperature variations after charging/discharging.
EFI CONVERSION KITS- Manual attached - psiconversion.com
Shop ONLINE @ http://secure.ultracart.com/catalog/PSI/
This harness is designed to be a complete wiring harness for the fuel injection system on General Motors 05-07 LS2 24x fuel injected engines with Drive By Wire Throttle Body and 4L60E or 4L80E transmission.
This harness is constructed with GM Delphi Connectors and Terminals with GXL/TXL (600 volt polyethylene cross-linked) wire which is professionally assembled and 100% quality inspected prior to shipping. This harness includes all wiring that is needed by the PCM to run and control the fuel injection system and transmission.
Your #1 Resource for:
efi conversions
lt1 wiring
ls2 swap kit
lt1 tuning
ls1 harness rework
ls2 drive by wire
efi wiring harness
vortec conversion
t56 wiring
ls1 wiring harness modification
BQA is an accounting firm based in Ho Chi Minh City, Vietnam that provides accounting, tax, consulting and software services to small and medium companies. It has a staff of 20 professionals and offices in Ho Chi Minh City and Can Tho City. BQA offers a range of services including accounting, tax consulting, legal services, import/export services, internal controls implementation, and enterprise software implementation and support. It serves over 60 Vietnamese companies and about 20 foreign companies with 100% capital.
Valentine day with Google, Seems another update is underway –Google Updaterahulchoudhary88
The document discusses exploring the website of the owner of the #2 search result for the term "SEO" on Google.co.in to discover what strategies they used to achieve that ranking, such as obtaining links from popular sites like barackobama.com or using other black hat SEO techniques since Ahrefs and Google do not reference their site. It wishes Google a happy Valentine's Day for no longer behaving like a bachelor in its search results.
This document appears to be a website domain for a company called xeedesign. The domain www.xeedesign.com likely belongs to a design firm or individual designer. Unfortunately there is no other context or information provided in the given text to form a more descriptive summary.
This document summarizes the services provided by Aman Travels Limited, a 21-year-old travel and tourism company with an annual turnover of Rs. 150 crores. It offers a wide range of travel products and services through four outlets in Delhi and Mumbai. It has a team of 125 professionals and 10 resident marketing managers stationed across India and abroad. The company operates an online B2B portal with over 150,000 hotel listings and has ties with several international tourism boards. It provides flights, hotels, packages, MICE services, visa/passport services, currency exchange and overseas insurance. Customers can book travel through a user-friendly online portal and interface.
The document discusses the importance of choosing positive traits like honesty, kindness, integrity, patience, respect, fairness and citizenship. It provides examples of demonstrating these traits such as helping others who are struggling, being there for friends, and treating people with politeness. The document contrasts good behaviors like controlling anger and doing acts of kindness with bad behaviors like attacking others and being rude. It emphasizes that demonstrating good character leads to positive outcomes like success, pride and making your family proud, while bad choices result in losing friends and trust and preventing achievement.
An articulation, also known as a joint, is a connection between two or more bones that allows some degree of movement. There are over 100 types of arthritis, which is an inflammation of the joints and can affect people of all ages. The major classifications of arthritis are inflammatory, infectious, and metabolic arthritis.
1 : https://www.eeoc.gov/eeoc/newsroom/release/10-7-19.cfm
2 : https://www.eeoc.gov/eeoc/newsroom/release/11-29-17c.cfm
3: https://www.eeoc.gov/eeoc/newsroom/release/10-2-19b.cfm
4: https://www.eeoc.gov/eeoc/newsroom/release/12-5-19a.cfm
5: https://www.eeoc.gov/eeoc/newsroom/release/10-22-19.cfm
6: https://www.eeoc.gov/eeoc/newsroom/release/10-2-18c.cfm
7: https://www.eeoc.gov/eeoc/newsroom/release/12-30-19.cfm
8: https://www.eeoc.gov/eeoc/newsroom/release/11-19-18.cfm
9: https://www.eeoc.gov/eeoc/newsroom/release/10-25-16.cfm
Usability Test Template
1. Create a document with the following areas. You will use your document during the usability test next week.
2. Goal of the site:
Explain the goal of your site in 2-3 sentences.
3. User testing detail:
Name, phone, age, employment, special interests, and any other items you are interested in.
4. Pre-test questions:
Create three questions to ask your tester prior to the test. These questions should be aimed to gather information regarding your test as a potential user of the site.
5. Test tasks and schedule
· Write a series of steps for the user to follow in using your site. At a minimum the user should be able to navigate the site, check out the specials and subscribe to the newsletter.
· Attempt to gain information regarding how the user feels about the site.
· Use the “Talk Aloud” method of gaining user feedback.
6. Post-test debrief:
Come up with 3 questions to ask the user regarding their input about the site
7. Usability Scale
Use these items to rate your test’s feeling about the site. You may use the items as questions in the post-test debrief.
· Learnability: How easy is it for users to accomplish basic tasks the first time they encounter the design?
· Efficiency: Once users have learned the design, how quickly can they perform tasks?
· Memorability: When users return to the design after a period of not using it, how easily can they reestablish proficiency?
· Errors: How many errors do users make, how severe are these errors, and how easily can they recover from the errors?
· Satisfaction: How pleasant is it to use the design?
Design Principles
Some content from:
The Principles of Beautiful Web Design
(Jason Beaird and James George)
Principles of Web Design
(Joel Sklar)
1
Learning Outcomes
apply user-centred design principles and methods
understand and be able to follow a suitable design process
appreciate the design principles that make a “good” website
be able to apply these principles at a basic level
2
Design Process
somewhere between art, science, and problem solving
the process of creating a design comp
can be boiled down to:
discovery
exploration
implementation
3
What's a comp?
the word comp is an abbreviation of the phrase “comprehensive dummy” –
a term that comes from the print design world.
complete simulation of a printed layout created before the layout goes to press.
in Web design, a comp is an image of a layout that’s created before we ...
The document discusses best practices for web design, including considering users rather than just designers, and planning the site structure before development. It recommends prototyping designs, getting feedback, and reiterating. Specific guidelines covered include using accessible color combinations, clear navigation, flexible formatting, alternative text for images, proper semantic HTML, and "skip to" links. The document also provides examples of good and bad web design examples to demonstrate these principles.
The document provides guidance on developing a website, including planning content by brainstorming with key individuals, assigning roles like project manager and designer, creating prototypes like site maps and wireframes, developing initial design templates, getting feedback, iterating the design, building the HTML, adding CSS style sheets, testing the site, and following guidelines for launching on a school or district server. It also includes links to additional resources for storyboarding, wireframing, design, and CSS.
The document discusses the differences between information, instruction, and learning. It describes how hypermedia can be used as an instructional tool to link information in a nonlinear way using various multimedia formats. However, hypermedia also presents challenges for learning, as learners must independently manage their navigation of content. The goal of instructional designers is to create systems that integrate information, learning principles, and instructional strategies to enhance learning.
The document discusses planning and developing an effective organizational website. It covers assessing audience and goals, choosing a site design type, assigning staff roles, common mistakes to avoid, and qualities of good websites. Staffing considerations include matching tasks to skills and potentially hiring outside consultants. The document emphasizes starting simply, focusing on clear goals and content, and maintaining the site over time.
Applying information architecture to university web sitesKeith Instone
The document discusses applying information architecture principles to university websites. It provides examples from IBM's website to illustrate concepts like audience views, organizational structure, faceted browsing, and navigation design. These concepts are then discussed in the context of designing effective university websites.
The document discusses various aspects of web design, including:
1. Four steps to user-centered design: focus on the user's goals, provide intuitive pathways, follow conventions, and test designs.
2. Four types of web conventions: navigation systems, icons, placement on the page, and color.
3. Factors to consider when designing for different systems like platforms, browsers, and monitor capabilities.
4. Six common ways to organize a website, such as by category, task, user, language, date, or corporate department.
November 2016 - ECN - You're Speaking Drupalese to MeEric Sembrat
The document provides an overview of best practices and tools for building event websites. It discusses writing content for specific audiences, organizing content logically into pages and menus, and using available tools like WordPress, Google Docs/Forms, Eventbrite, YouTube, and Trello. The presentation emphasizes determining audience needs, reusing existing resources when possible, and creating clear information architecture over custom design work. Attendees are encouraged to ask questions throughout.
The document provides tips and guidelines for planning and designing an effective website. It discusses analyzing site goals, audience, and competition. Key aspects to consider include available resources, site structure, content, and design. The tips recommend creating a template with navigation and content areas, optimizing load time, using tables for layout, clear navigation, cross-browser compatibility, and readability.
Promote Education Web Design Things To Consider When Designing A WebsiteZoaib Mirza
The document provides guidance on various aspects of web design, including things to consider when designing a website, making webpages, design issues, navigation, color, graphics and typography. It emphasizes key principles like alignment, proximity, repetition, contrast and legibility. It also covers testing a site, uploading files, registering the site with search tools and additional resources for web design basics.
The document discusses fundamentals of web design including influences on design such as technology, content, budget, and usability objectives. It emphasizes that good design is understandable, interesting, easy to use, and consistent. While an ad-hoc process can work for small temporary sites, a methodical process including planning, testing, and stakeholder feedback is better for most sites as it results in fewer problems and a site that is more effective and easier to use over time. Accessibility, maintenance, and continual improvement are also important considerations for web design.
This document discusses accessibility in web design from concept to implementation. It begins by defining accessibility and outlining who benefits from accessible design, including users, clients, and search engines. It then provides examples of real-life situations where accessibility is important and guidelines for understanding audience needs. The document outlines trends in accessibility like adhering to web standards and standards harmonization. It offers guidance for wireframing, designing, and creating accessible content, forms, images, tables, lists and more. The conclusion emphasizes that accessibility is an ongoing process rather than a single product.
The document discusses conventions and expectations for website design. It explains that users expect websites to work in predictable ways, so conventions have developed over time through cultural norms, technology limitations, familiarity from other media, ease of use, advertising, common platforms, and trends. It then outlines some basic components that are found on most websites, such as a header, feature area, body/content, sidebar, and footer. Finally, it discusses the standard web development process and where graphic/UI designers fit within the planning and design stages.
The document discusses principles of web design, including describing HTML and browser compatibility issues, considering connection speeds and screen resolutions, and addressing operating system issues. It covers using CSS for styling, variables in web design like browser compatibility and connection speeds, testing download times, coding for multiple resolutions, and operating system issues. The objectives are outlined for planning a site, analyzing audiences, creating storyboards and navigation, using tables for templates, introducing CSS, using graphics and color, and working with forms. The last section discusses publishing, testing, refining, and promoting a website.
Many people can intuitively categorize a website as good or bad,.docxhealdkathaleen
This document provides an overview of key principles and best practices for web design, usability, and accessibility. It discusses design patterns, navigation, information architecture, writing for the web, search engine optimization, and guidelines for ensuring websites are accessible for people with disabilities or special needs. The document is intended as supplementary information for understanding how to design professional websites that meet standards of usability, accessibility, and search engine optimization.
Fundamentals of Design. Improve the visual competency of any website or application by keeping design in mind. Learn the fundamental design principles of typography, color, and layout.
Designing for web & beyond – don’t get caught with your browser down finalcleanDuaneClare
The document discusses strategies for designing modern, responsive websites. It emphasizes the importance of progressive, adaptive, and responsive (PAR) design principles to ensure a great customer experience across different devices. PAR involves using modern web standards, semantic HTML5 and CSS3, responsive layouts, and optimizing for performance and usability on any device. The document also highlights challenges like working across silos and relying too heavily on rigid processes. It promotes techniques like lean UX, early iteration, and understanding user needs to build intuitive, enjoyable experiences.
The document provides guidance for new employees on how to succeed in a new work environment. It recommends researching the company culture beforehand, prioritizing safety, respecting all colleagues, being punctual and sincere, saying yes to additional responsibilities, avoiding complaints, demonstrating innovation, confidence and challenging oneself, separating personal and work life, and dressing appropriately for the position. The tips are meant to help new hires integrate smoothly and make a strong first impression.
The document discusses web offset printing. Web offset printing uses a continuous roll of paper fed through the printing press. There are two methods of drying - heat set uses forced air heating to dry ink rapidly, while cold set relies on natural evaporation and absorption to dry ink more slowly. The document focuses on web offset printing, describing characteristics like high printing speeds up to 900 meters per minute and applications including books, magazines, newspapers, and catalogs.
This document provides an introduction to modern printing technologies. It begins with an overview of major printing processes like relief, intaglio, offset and screen printing. It then discusses specific processes in more detail and provides illustrations. The document outlines flexography and gravure printing presses. It also discusses digital printing technologies like inkjet printing and their applications to textile printing. The document aims to inform students taking a course on modern printing technologies.
Screen printing originated in China during the Song Dynasty and later spread to other Asian countries and Europe. It was first patented in England in 1907 and used mainly for wallpaper printing. In the 1960s, Andy Warhol popularized screen printing in the US with depictions of Marilyn Monroe. Screen printing involves forcing ink through a porous fabric with a stencil design to produce an image. It can print on many substrates and is used commercially and in fine arts. The key tools and processes include frames, screens, stencils, inks, and squeegees.
The document discusses light and color, including:
- How light carries information through fiber optic networks.
- The speed of light is approximately 300 million meters per second.
- The human eye sees color via red, green, and blue cone receptors in the retina which send signals to the brain.
- Objects appear colored due to light being either emitted from or reflected off the object.
The document discusses the history and evolution of flexography, a modern letterpress printing technique. Originally developed in England using aniline oil-based inks, flexography was initially used for food packaging printing. Since the 1990s, advances in platemaking and inks have improved print quality and expanded flexography's applications. Modern flexography uses photopolymer plates instead of rubber plates, and water-based or UV-curing inks instead of traditional solvent-based inks, reducing air pollution. Flexography is commonly used today for printing labels, food containers, flexible packaging, and corrugated boxes.
This document presents information about Platon presses and offset printing presses. It was prepared by MD. Ali Hossain, a junior instructor at the Government Graphic Arts Institute. The document discusses different types of offset presses including web fed presses, sheet fed presses, and perfecting presses. It also provides figures and descriptions of offset press components like the feeding system, registration system, and control systems for ink, dampening, and registration. The document aims to inform readers about various aspects of Platon presses and offset printing technology.
This document provides an overview of flexography, a modern letterpress printing technique. It discusses the history of flexography, including the development of the first flexography press in England. It describes how flexography has evolved since 1990 with advances in platemaking and inks, allowing it to rival offset printing quality. The document outlines the modern flexography printing process, including photopolymer plates, water-based inks, and various types of flexographic presses. It concludes by discussing common flexography applications in labels, food packaging, and other flexible packaging.
1. The document discusses different types of joints and welding techniques used in construction. It describes riveted, welded and bolted joints. It also explains gas welding and electric arc welding processes.
2. Issues like loose joints, cracks in welds and corrosion can cause joints to fail over time. Proper design, materials and maintenance are needed to ensure joints last.
3. Different factors that can lead to joint failure are discussed, along with their solutions. Maintaining quality control is important for structural integrity.
This document provides an overview of flexography, a modern letterpress printing technique. It discusses the history of flexography, which began in England using aniline oil-based inks. Over time, advances were made in platemaking and inks, allowing flexography to rival offset printing quality. Modern flexography uses photopolymer plates instead of rubber plates, and water-based inks have replaced traditional inks containing ammonia and alcohol. The document also outlines the flexography printing process and applications in food and flexible packaging industries.
The document discusses different printing techniques, including screen printing, which is used for t-shirts and billboards. Digital printing uses inkjet or laser printing without plates. Engraving creates raised surfaces on paper using a metal die. Flexography uses flexible plates to print on packaging materials like bags and cups. Gravure and letterpress are older techniques, while offset lithography uses plates to transfer images to paper. Reprographics involves duplicating images electronically or mechanically. Thermography applies powder to adhere ink in stationery printing.
This document provides information about a design methodology and technology academic student guide published by ProsoftTraining. It includes sections on the course description, objectives, system requirements, and copyright information. The document was created by Jeffrey Brown and edited by Susan M. Lane and David Oberman. It is copyrighted by ProsoftTraining.
This document provides an introduction to web design. It begins with an overview of the workshop objectives which are to review Sacramento State's web guidelines, understand the web publishing process, organize a sample website, learn how to evaluate a website, and find web design resources. It then discusses understanding the world wide web by explaining HTML, web browsers, and how browsers display web pages. It covers Sacramento State's web guidelines including accessibility and copyright. It provides details on organizing a website including file naming conventions and site structure. It also discusses working with images such as acquiring, formatting, sizing and locating images. It concludes by introducing web editors such as Adobe Dreamweaver and explaining how to move files to a web server.
The document discusses how to embed different types of multimedia content in HTML pages, including audio, video, images and animations. It provides code examples for playing audio and video files in different formats like WAV, MP4, SWF and WMV using elements like <object> and <embed>. YouTube videos can be embedded using <iframe> or <object> tags. Multimedia files have specific file extensions depending on their format, like .gif, .png, .jpg, .swf, .wav and .mp4.
The document discusses HTML frames and their attributes. It provides syntax for adding an iframe, describes attributes like frameborder, scrolling, and noresize. It also shows examples of using <frameset> tags to divide pages into multiple frames with attributes like rows, cols, and src to specify dimensions and linked pages.
The document provides information about HTML forms and form elements. It defines a form as an area that can contain input elements like text fields, checkboxes, radio buttons, and select lists. The <form> tag is used to enclose these elements and submit the user-entered data to a server using either GET or POST methods. Common form input elements are described, including text, checkbox, radio, submit, reset, hidden, and select elements. Their attributes and usage are explained.
This document contains information about HTML elements, tags, attributes and other basic building blocks of HTML. It discusses common elements like <head>, <body>, <title>, <p>, <h1> and their purpose. It also covers attributes, colors, lists, links, images and how to format text. The document is a tutorial for someone learning HTML basics.
The document provides information about Cascading Style Sheets (CSS) including:
- CSS is a style sheet language used to determine formatting of HTML documents like font properties, color, and positioning.
- CSS versions include CSS1 from 1996, CSS2 from 1998, and CSS3 still in development since 2005 which added new capabilities.
- CSS fixes issues with older HTML where all formatting was embedded directly and helped create more manageable website designs.
The document contains information about Md. Ali Hossain including his contact details and role as a web designer and junior instructor. It also includes basic information on the world wide web and its history, requirements for building a basic website, different types of websites, and technologies used in web development.
The document provides an overview of the key elements needed to plan and build a website, including domain names, hosting, development, content management systems, and technologies. It discusses static and dynamic websites and their advantages.
Epistemic Interaction - tuning interfaces to provide information for AI supportAlan Dix
Paper presented at SYNERGY workshop at AVI 2024, Genoa, Italy. 3rd June 2024
https://alandix.com/academic/papers/synergy2024-epistemic/
As machine learning integrates deeper into human-computer interactions, the concept of epistemic interaction emerges, aiming to refine these interactions to enhance system adaptability. This approach encourages minor, intentional adjustments in user behaviour to enrich the data available for system learning. This paper introduces epistemic interaction within the context of human-system communication, illustrating how deliberate interaction design can improve system understanding and adaptation. Through concrete examples, we demonstrate the potential of epistemic interaction to significantly advance human-computer interaction by leveraging intuitive human communication strategies to inform system design and functionality, offering a novel pathway for enriching user-system engagements.
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdfPaige Cruz
Monitoring and observability aren’t traditionally found in software curriculums and many of us cobble this knowledge together from whatever vendor or ecosystem we were first introduced to and whatever is a part of your current company’s observability stack.
While the dev and ops silo continues to crumble….many organizations still relegate monitoring & observability as the purview of ops, infra and SRE teams. This is a mistake - achieving a highly observable system requires collaboration up and down the stack.
I, a former op, would like to extend an invitation to all application developers to join the observability party will share these foundational concepts to build on:
“An Outlook of the Ongoing and Future Relationship between Blockchain Technologies and Process-aware Information Systems.” Invited talk at the joint workshop on Blockchain for Information Systems (BC4IS) and Blockchain for Trusted Data Sharing (B4TDS), co-located with with the 36th International Conference on Advanced Information Systems Engineering (CAiSE), 3 June 2024, Limassol, Cyprus.
In the rapidly evolving landscape of technologies, XML continues to play a vital role in structuring, storing, and transporting data across diverse systems. The recent advancements in artificial intelligence (AI) present new methodologies for enhancing XML development workflows, introducing efficiency, automation, and intelligent capabilities. This presentation will outline the scope and perspective of utilizing AI in XML development. The potential benefits and the possible pitfalls will be highlighted, providing a balanced view of the subject.
We will explore the capabilities of AI in understanding XML markup languages and autonomously creating structured XML content. Additionally, we will examine the capacity of AI to enrich plain text with appropriate XML markup. Practical examples and methodological guidelines will be provided to elucidate how AI can be effectively prompted to interpret and generate accurate XML markup.
Further emphasis will be placed on the role of AI in developing XSLT, or schemas such as XSD and Schematron. We will address the techniques and strategies adopted to create prompts for generating code, explaining code, or refactoring the code, and the results achieved.
The discussion will extend to how AI can be used to transform XML content. In particular, the focus will be on the use of AI XPath extension functions in XSLT, Schematron, Schematron Quick Fixes, or for XML content refactoring.
The presentation aims to deliver a comprehensive overview of AI usage in XML development, providing attendees with the necessary knowledge to make informed decisions. Whether you’re at the early stages of adopting AI or considering integrating it in advanced XML development, this presentation will cover all levels of expertise.
By highlighting the potential advantages and challenges of integrating AI with XML development tools and languages, the presentation seeks to inspire thoughtful conversation around the future of XML development. We’ll not only delve into the technical aspects of AI-powered XML development but also discuss practical implications and possible future directions.
Full-RAG: A modern architecture for hyper-personalizationZilliz
Mike Del Balso, CEO & Co-Founder at Tecton, presents "Full RAG," a novel approach to AI recommendation systems, aiming to push beyond the limitations of traditional models through a deep integration of contextual insights and real-time data, leveraging the Retrieval-Augmented Generation architecture. This talk will outline Full RAG's potential to significantly enhance personalization, address engineering challenges such as data management and model training, and introduce data enrichment with reranking as a key solution. Attendees will gain crucial insights into the importance of hyperpersonalization in AI, the capabilities of Full RAG for advanced personalization, and strategies for managing complex data integrations for deploying cutting-edge AI solutions.
Generative AI Deep Dive: Advancing from Proof of Concept to ProductionAggregage
Join Maher Hanafi, VP of Engineering at Betterworks, in this new session where he'll share a practical framework to transform Gen AI prototypes into impactful products! He'll delve into the complexities of data collection and management, model selection and optimization, and ensuring security, scalability, and responsible use.
Essentials of Automations: The Art of Triggers and Actions in FMESafe Software
In this second installment of our Essentials of Automations webinar series, we’ll explore the landscape of triggers and actions, guiding you through the nuances of authoring and adapting workspaces for seamless automations. Gain an understanding of the full spectrum of triggers and actions available in FME, empowering you to enhance your workspaces for efficient automation.
We’ll kick things off by showcasing the most commonly used event-based triggers, introducing you to various automation workflows like manual triggers, schedules, directory watchers, and more. Plus, see how these elements play out in real scenarios.
Whether you’re tweaking your current setup or building from the ground up, this session will arm you with the tools and insights needed to transform your FME usage into a powerhouse of productivity. Join us to discover effective strategies that simplify complex processes, enhancing your productivity and transforming your data management practices with FME. Let’s turn complexity into clarity and make your workspaces work wonders!
Maruthi Prithivirajan, Head of ASEAN & IN Solution Architecture, Neo4j
Get an inside look at the latest Neo4j innovations that enable relationship-driven intelligence at scale. Learn more about the newest cloud integrations and product enhancements that make Neo4j an essential choice for developers building apps with interconnected data and generative AI.
Climate Impact of Software Testing at Nordic Testing DaysKari Kakkonen
My slides at Nordic Testing Days 6.6.2024
Climate impact / sustainability of software testing discussed on the talk. ICT and testing must carry their part of global responsibility to help with the climat warming. We can minimize the carbon footprint but we can also have a carbon handprint, a positive impact on the climate. Quality characteristics can be added with sustainability, and then measured continuously. Test environments can be used less, and in smaller scale and on demand. Test techniques can be used in optimizing or minimizing number of tests. Test automation can be used to speed up testing.
GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...Neo4j
Leonard Jayamohan, Partner & Generative AI Lead, Deloitte
This keynote will reveal how Deloitte leverages Neo4j’s graph power for groundbreaking digital twin solutions, achieving a staggering 100x performance boost. Discover the essential role knowledge graphs play in successful generative AI implementations. Plus, get an exclusive look at an innovative Neo4j + Generative AI solution Deloitte is developing in-house.
Securing your Kubernetes cluster_ a step-by-step guide to success !KatiaHIMEUR1
Today, after several years of existence, an extremely active community and an ultra-dynamic ecosystem, Kubernetes has established itself as the de facto standard in container orchestration. Thanks to a wide range of managed services, it has never been so easy to set up a ready-to-use Kubernetes cluster.
However, this ease of use means that the subject of security in Kubernetes is often left for later, or even neglected. This exposes companies to significant risks.
In this talk, I'll show you step-by-step how to secure your Kubernetes cluster for greater peace of mind and reliability.
Pushing the limits of ePRTC: 100ns holdover for 100 daysAdtran
At WSTS 2024, Alon Stern explored the topic of parametric holdover and explained how recent research findings can be implemented in real-world PNT networks to achieve 100 nanoseconds of accuracy for up to 100 days.
How to Get CNIC Information System with Paksim Ga.pptxdanishmna97
Pakdata Cf is a groundbreaking system designed to streamline and facilitate access to CNIC information. This innovative platform leverages advanced technology to provide users with efficient and secure access to their CNIC details.
How to Get CNIC Information System with Paksim Ga.pptx
Web authoring design-basics
1. Web Design
Fundamentals
What to do, why to do it on the
Web
1
Before we get started…
What sites are you working on?
What’s the purpose of your site?
What audience(s) are you trying to reach?
2
Site Planning
Determine site goals
Analyze your audience
Analyze the “competition”
Know your own abilities and resources
Map the current site
Design your new site
3
1
2. Site Goals and Guidelines
Why are you creating this site?
What does the site owner hope to achieve with
this site?
What action does the site owner want the
audience to take as a result of visiting?
What restrictions or guidelines must be followed
when designing the site?
Accessibility guidelines (Kansas)
http://da.state.ks.us/itec/WASPriorities112001.htm
Style guidelines (for a sub-site)
4
Audience Analysis
Who are you trying to reach?
Age
Language and Culture
Level of education
Access to the Web (High-speed? Dial-in?)
Familiarity with the Web
Barriers to access?
What are they looking for at your site?
Information
Services
Community
Are there multiple
audiences?
5
How do I find out about the audience?
Ask the site owners
Look at current site’s logs and stats
Talk to people who “fit the bill”
Students who are in the program (but were once
prospective students)
People in the same demographic groups
Review published research
Build feedback capability into your site
Know how audiences deal with the web in
general
6
2
3. Analyze the “Competition”
Look for sites with similar contents, purpose
Within KU
At other universities
At other organizations
In the private sector
What are the trends and precedents?
Where do they excel or fall short?
Does your site need to “match” a parent site?
7
Know Resources & Abilities
What technical knowledge do you have?
What tools, resources, and time do you have
access to (now AND later)?
Software
Web authoring tools
Image editing and tools
Animation tools
Think long-term!
Hardware
Camera (video and/or still)
Scanner (flatbed or slide)
Be sure you have the
resources (human and
technical) to maintain the
site once you’ve created it.
Other people
8
Site Map
All the pages, all the links of the current site
Boxes for pages, lines for links
Shows how “deep” your site is
External Links
Feb
Events
Home
March
May
April
June
Members
Profile – John Q. Public
Site
Contact
Profile – Jane Doe
Profile – John Doe
Profile – Mr. Smith
Profile – Ms. Jones
9
3
4. More on site “depth”
Depth and “click-throughs”
Deep and narrow
Few links on each page, many “levels” of pages
Shallow and broad
Many links on a page (especially the main page),
often fewer levels of pages
Once again, consider your audience and
content
NIH.gov: deep
Fool.com: broad
10
Design (or redesign) the site
Review audience needs/wants with site owner
Determine the site structure (site map)
Gather content (visuals, information)
Mock up a visual design
Build the site in a “test” mode
Perform (user) testing and make changes
Put the site into production
Maintain and update the site
Communicate with the site
owner at each of these stages!
11
A few words on usability testing
The testers should…
Reflect your audience demographics
Be (relatively) uncoached
The test should…
Have clearly defined goals
“Find out how many computers are in the Budig Media lab.”
“Sign up for the next Access: Introduction workshop.”
Be observed in some way
Ask for tester feedback
Notes
Post-test interviews
12
4
5. Visual Design
What looks good? Why?
13
Before we get started…
Consistency is a
good goal for any design.
14
Elements of Visual Design
Composition
Rule of Thirds (and Rule of Three)
Grids
Balance
White space
Color
Fonts
Motion
Examples
15
5
6. Grids and the Rule of Thirds
For image composition
Web Grids (the “page”)
16
More Rule of Thirds
Image “flows” up
and in
Sight-line points
towards the middle
of the image
17
Grouping Objects/Balance
Symmetrical Balance:
(Can be seen as static and dull in some
Western cultures, but common in the East
and in Native American cultures.)
18
6
7. Grouping Objects/Balance
Asymmetrical Balance:
Both halves
balance, but are
not the same.
(Most frequently used in Western art and design.)
19
Grouping Objects/Balance
Radial Balance:
(For example, mandalas and other Eastern designs.)
20
Screen/Page Layout
Where do you
normally see page
navigation?
Where are page
titles/headings?
Where do graphic
elements go?
What about screen
real estate?
What about scrolling?
(Do users scroll?)
21
7
8. White Space
What is it? Why is it a good thing?
Absence of “visual clutter”
Helps readers scan/find info quickly
Avoids “information overload” syndrome
How do you create it?
Examples
ACS Site
ACSess Site
ACS Training Site
22
Color
Color Theory
What does color mean?
What does that color mean?
Warm/cool
Cultural definitions
Combining colors
“Safe” Colors
What’s it all about?
Palette Man
Light backgrounds with dark text or vice versa?
23
Fonts (aka typography)
Keep it simple
Limit number of fonts per page and per site
Use the same fonts consistently throughout the site
Make good font choices
Sans serif vs. serif
Commonly installed fonts
Mood
Readability
USE CAPITALIZATION SPARINGLY
24
8
9. Font Moods
What mood does this font evoke for
you?
What about this one? Is it formal? Casual?
Would this font give your page a professional
look? Why or why not?
W hat assum pti
ons about the content
w oul you m ake f
d
rom thi f
s ont?
Can you even read what this says? If you had to read a whole page of
this, how would you feel?
25
More Font Moods
8-Pin Matrix Font
PUNCH LABEL FONT
Font for the Dumped
Specialty fonts like these are NOT intended for
body text, but can be used for headings or other
special uses to great effect.
Since they aren’t likely to be installed on your
visitor’s computers, though, you’ll have to create
image files using the text you want to display.
26
Motion
Coolness factor vs. “dancing bologna”
Plug-ins, plug-ins, plug-ins
Bandwidth/download time
Content is king
Examples:
KU Theatre
lookandfeel new media
KU Endowment (by look and feel)
Julia Childs on PBS
27
9
11. Web Design Fundamentals
All the Links
Site Planning
Kansas Web Accessibility Guidelines: da.state.ks.us/itec/WASPriorities112001.htm
Site Map – Generic Site example: www.ku.edu/acs/docs/wkshop/webdesign
Visual Design
Space and White Space
The browser grid from WPDFD: www.wpdfd.com/browsergrid.htm
White space usage examples:
•
www.ku.edu/acs
•
www.ku.edu/acs/news
•
www.ku.edu/acs/train
Color
Color Theory from Poynter.org: www.poynter.org/special/colorproject/colorproject/color.html
Cultural color meanings from About.com: webdesign.about.com/library/weekly/aa070400c.htm
Color study resources from Sanford: www.sanford-artedventures.com/study/g_color.html
Webmonkey on the Colorsafe Palette: hotwired.lycos.com/webmonkey/00/37/index2a.html
Paletteman’s color-combining tool: www.paletteman.com
Example of a site with light text and a dark background: www.ku.edu/~tv14
Example of a site with dark text and a light background: www.kansan.com
Fonts
Basic typography info from Fonts.com: www.fonts.com/fontent/fontent_home.asp?con=type101
Motion
KU Theatre: www.ku.edu/~theatre
lookandfeel new media: www.lookandfeel.com
KU Endowment: www.kuendowment.org
Julia Child on PBS: www.pbs.org/juliachild
General Design Examples
News/Informational Site: www.fool.com
Theatre/Arts Site: www.unicorntheatre.org
KU Sites:
www.ku.edu
www.kuathletics.com
www2.lib.ku.edu/anschutzlib/govdocs/
www.kumc.edu
www.ku.edu/~jschool
www.socwel.ku.edu
12. Web Design Fundamentals
A (Somewhat) Annotated Bibliography
Brinck, Tom, Darren Gergle, and Scott Wood. “Web Design From the Trenches.”
Proceedings of the Conference on Chi 98 Summary : Human Factors in
Computing Systems. New York: ACM Press, 1998. 133-34.
“Most website design projects involve small to medium-sized sites consisting of
between ten and fifty pages. Such projects require designers to operate on a
tight schedule and a very limited budget. With tightly constrained resources, how
can we maintain a high standard of design and create usable and useful
products? This tutorial presents a practical approach to applying usability
techniques in website design. Our design process includes techniques for project
management, dealing with clients, sketching and comping techniques for quickly
producing high-quality alternatives, and a set of website design guidelines.”
http://doi.acm.org/10.1145/286498.286579
Chak, Andrew. "Effective Info Architecture." Web Techniques Oct 2001: 15-17.
Cruickshank, Alex. "How to Add Dhtml to Your Site." Internet Magazine Jan
2002: 96-98.
“Are you tired of static HTML pages on your Web site and spending hours
updating them after you've done a little redesign? Want to add dynamic,
interactive features that won't put your site's server under strain? Then DHTML's
for you, as Alex Cruickshank explains.”
Deaton, Mary. Guerilla Usability. 2001. Builder.com. Available:
http://builder.com.com/article.jhtml?id=u00120010820gcn01.htm. 3/22
2002.
Fleming, Jennifer. Web Navigation: Designing the User Experience. Sebastopol,
CA: O'Reilly & Associates, 1998.
Available through netlibrary at KU:
http://www.netlibrary.com/ebook_info.asp?product_id=24653
Fogg, B. J., et al. "What Makes Web Sites Credible?: A Report on a Large
Quantitative Study." Proceedings of the Sigchi Conference on Human
Factors in Computing Systems. Seattle, Washington, 2001. 61-68.
“The credibility of web sites is becoming an increasingly important area to
understand. To expand knowledge in this domain, we conducted an online study
that investigated how different elements of Web sites affect people's perception
of credibility. Over 1400 people participated in this study, both from the U.S. and
Europe, evaluating 51 different Web site elements. The data showed which
elements boost and which elements hurt perceptions of Web credibility. Through
analysis we found these elements fell into one of seven factors. In order of
impact, the five types of elements that increased credibility perceptions were
“real-world feel”, “ease of use”, “expertise”, “trustworthiness”, and “tailoring”. The
two types of elements that hurt credibility were “commercial implications&rdquo
;and “amateurism”. This large-scale study lays the groundwork for further
research into the elements that affect Web credibility. The results also suggest
implications for designing credible Web sites.”
http://doi.acm.org/10.1145/365024.365037
-2-
13. Web Design Fundamentals
A (Somewhat) Annotated Bibliography
Grady, Helen M. "Web Site Design: A Case Study in Usability Testing Using
Paper Prototypes." Proceedings of Ieee Professional Communication
Society International Professional Communication Conference and Acm
Special Interest Group on Documentation Conference on Technology &
Teamwork. Piscataway, NJ: IEEE Educational Activities Department,
2000. 39-45.
“Paper prototypes are a low-tech, low-cost, but highly effective, form of usability
testing for web site design. Creating a web site is relatively easy, given the
technology and tools now available. All too often, web site developers tend to be
enamored with the technology and forget the needs of end user. As a result,
many web site developers delay usability testing until their web site is completely
designed, only to uncover significant interface, content, or structural problems
with the site once the customers try to use it. Significant redesign may be
impossible due to time, cost, or personnel constraints.This paper discusses the
benefits of using paper prototypes to conduct usability testing of a web site for
Mercer University's School of Engineering Center for Excellence in Engineering
Education (CE3).”
Holzschlag, Molly E. "The Fear of X - What Web Designers Should Know About
Xml and Xhtml." PC Magazine August 1 2001: 1-3.
---. "Clean up, Flatten Out." Web Techniques August 2001: 26-27.
“Eschew multimedia clutter, and smooth the bumps out of your pages. Simple
design makes more sense than ever as new platforms emerge.”
---. "14 Ways to Talk Clients out of Runing Their Sites: Temper Your Clients'
Enthusiasm with the Wisdom of Experience." Web Techniques Dec 2001:
24-26.
“Every design shop has dealt with a client who "knows better" than the designer.
Combine an aggressive client with an overly accommodating designer, and the
resulting site can become a primer for mistakes to avoid.
“The best shops work closely with clients to teach them the tenets of solid Web
design. But there are still plenty of novices out there. I've compiled 14 of the most
common client-driven site design errors. Learning to address these issues
diplomatically will mean successful sites for your customers, and an improved
reputation for your shop.”
---. "Raise Your Standards: Knowing the Rules Gives You Freedom to Break
Them and the Skills to Make Your Content More Powerful." Web
Techniques 7.2 (2002): 20-21.
-3-
14. Web Design Fundamentals
A (Somewhat) Annotated Bibliography
Ivory, Melody Y., Rashmi R. Sinha, and Marti A. Hearst. "Empirically Validated
Web Page Design Metrics." Proceedings of the Sigchi Conference on
Human Factors in Computing Systems. New York: ACM Press, 2001. 5360.
“A quantitative analysis of a large collection of expert-rated web sites reveals that
page-level metrics can accurately predict if a site will be highly rated. The
analysis also provides empirical evidence that important metrics, including page
composition, page formatting, and overall page characteristics, differ among web
site categories such as education, community, living, and finance. These results
provide an empirical foundation for web site design guidelines and also suggest
which metrics can be most important for evaluation via user studies.”
http://doi.acm.org/10.1145/365024.365035
Mach, Michelle. "The Service of Server-Side Includes." Information Technology
and Libraries 20.4 (2001): 213-19.
“The use of server-side includes (SSI) simplifies Web site maintenance by
generating Web pages on-the-fly, rather than creating static HTML pages. This
article provides examples and instructions for common uses of SSIs, including
displaying environmental variables, inserting file information, and using the
advanced capabilities of extended SSI (XSSI). Potential concerns including
security, WYSIWYG (what-you-see-is-what-you-get) editors, filename
extensions, and server load are discussed, as are the advantages and
disadvantages of SSI over more well-known tools like CGL JavaScript, or Active
Server Pages (ASP).”
Marcus, Aaron, and Emilie West Gould. "Crosscurrents: Cultural Dimensions and
Global Web User-Interface Design." interactions 7.4 (2000): 32-46.
http://doi.acm.org/10.1145/345190.345238
McManus, Sean. "How to Avoid Web Design Crimes." Internet Magazine Jan
2002: 92-94.
McManus, Sean. "Improve Your Web Site's Navigation." Internet Magazine Nov
2001: 90-93.
Newman, Mark W., and James A. Landay. "Sitemaps, Storyboards, and
Specifications: A Sketch of Web Site Design Practice." Conference
proceedings on Designing interactive systems : processes, practices,
methods, and techniques. New York, 2000. 263 - 74.
“Through a study of web site design practice, we observed that designers employ
multiple representations of web sites as they progress through the design
process, and that these representations allow them to focus on different aspects
of the design. Designers also employ multiple tools during the course of a
project, including graphic design, web development, presentation, and word
processing software, as well as pen and paper. Sketching on paper is especially
important during the design exploration phase of a project, when designers wish
to explore many design possibilities quickly without focusing on low-level details.
Web site design tools intended to support the early phases of the design process
should employ informal interaction techniques, should support multiple site
representations, and should integrate well with other applications that designers
use regularly.”
http://portal.acm.org/citation.cfm?doid=347642.347758
-4-
15. Web Design Fundamentals
A (Somewhat) Annotated Bibliography
Niederst, Jennifer. Web Design in a Nutshell. O'Reilly, 2001.
The O’Reilly books are very popular in the computing world, because they tend
to offer accurate content in a readable, understandable format, without
dummying down the material (a la the “For Dummies,” “Idiots,” etc.).
Nielsen, Jacob. Designing Web Usability. Indianapolis, Ind.: New Riders, 2000.
This book has become one of the most widely used and cited works on designing
usable web pages, and Jacob Nielson is the premiere expert on usability. If there
is a must-read on the topic, this is it. You might also check out www.useit.com,
Nielsen’s site, for columns and articles on web usability.
Otto, Joseph C. "Building a Great Web Site." T H E Journal (Technological
Horizons In Education) 29.7 (2002): 40-42.
Slocombe, Mike. "How to Plan a Great Web Site." Internet Magazine August
2001: 86-88.
Smart, Karl L., Judy Cossell Rice, and Larry E. Wood. "Meeting the Needs of
Users: Toward a Semiotics of the Web." Proceedings of Ieee Professional
Communication Society International Professional Communication
Conference and Acm Special Interest Group on Documentation
Conference on Technology & Teamwork. Cambridge, Massachusetts:
IEEE Educational Activities Department Piscataway, NJ, USA, 2000. 593605.
“The tremendous growth of the Internet has brought a heightened awareness of
the importance of designing information to meet customers' needs. Although we
may never develop universal design standards that apply to every situation, we
need more empirically supported guidelines to inform design decisions.
Guidelines must be based on commonly shared semiology of Web conventions.
A semiotics of the Web can help us determine how meaning is derived from Web
pages and the Web, and in turn how to better design sites to convey intended
and desired meanings. This article identifies six categories or dimensions of
design issues relating to the Web that serves as a beginning of a Web semiotics.
Each dimension is explained, with various research issues and questions
suggested.”
Spool, Jared. Web Site Usability. Morgan Kaufmann, 1998.
Another usability expert worth consulting; another place to look is his consulting
company’s web site, User Interface Engineering (http://www.uie.com/).
Sullivan, Terry. User Testing Techniques - a Reader-Friendliness Checklist.
9/12/96 1996. All Things Web. Available:
http://www.pantos.org/atw/35317.html. 3/22 2002.
“Periodic user testing is an important element in developing and maintaining a
reader-friendly Website. But formal usability tests are expensive and timeconsuming -- often prohibitively so. Happily, inspection-based user testing
methods, ranging from a free-form site review to more structured approaches,
provide a cost-effective means of assessing (and thus improving) the usability of
almost any Website.
-5-
16. Web Design Fundamentals
A (Somewhat) Annotated Bibliography
“One of the most effective forms of inspection-based user testing involves the
use of a "usability checklist." Checklist-based user testing is extremely
inexpensive to implement, and requires a surprisingly small number of testers to
be effective. It's also easy to schedule; it can be used at virtually any time
throughout the development cycle, from the earliest prototype screens to a fullblown Website.”
Tufte, Edward R. The Visual Display of Quantitative Information. Cheshire,
Conn.: Graphics Press, 1983.
---. Envisioning Information. Cheshire, Conn.: Graphics Press, 1990.
---. Visual Explanations: Images and Quantities, Evidence and Narrative.
Cheshire, Conn.: Graphics Press, 1997.
Williams, Robin. The Non-Designer’S Design Book: Design and Typographic
Principles for the Visual Novice. Berkeley: Peachpit Press, 1994.
Zimmermann, Beverly B. "Applying Tufte's Principles of Information Design to Creating
Effective Web Sites." Proceedings of the 15th Annual International Conference
on Computer Documentation. New York: ACM Press, 1997. 309-17.
http://doi.acm.org/10.1145/263367.263406
-6-