The cleanliness, the amazing use of “white” (shades of gray) space is what caught my eye on this blog design. The bold reds bringing important elements out. This blog design allows the visitor to be able to navigate with ease thanks to it’s simple navigation and pretty standard layout structure. I think this blog’s ease of use approach is the best that I’ve seen in a while.
Source: RoqueAlonso.org
A nice way to incorporate the wild rainbow of colors while keeping it under control. Here they have a nice thick black border around the colorful text giving it a clean and crisp look. I like the main font and the position and treatment used on the word “design” at the bottom is also very nice. The stars as separators, make the whole logo pop. Very nice.
Source: MyBooDesign.com
So I got a message on Facebook that made me a bit upset. Here is what I posted on impulse:
WHAT?? Facebook snuck this in while most of us were just commenting on friend’s status(es) and pictures. The new Facebook ads now incorporate YOUR photos into the ads when they show on your friends’ Facebook pages. So your friends will think this is not an add, but something you posted. If this is not the most horrible case of SPAM, I don’t know what is. I guess the fact that they allow you to turn your photos off for this evil project but still if you do not know this is happening, having an option to turn it off, deep in your settings pages does not really help with this deceiving monetizing scheme.
I was really upsset when I found out about this. And Facebook of all places? That is too weird to beleive.
Ok, here is how you turn it off in your Facebook account:
++++++++
UPDATED!!
++++++++
Then thanks to Anon’s comment below this turns out to be untrue so I wanted to appologise and provide the information that explains Facebook’s policy.
Please read this over to understand what’s going on so you don’t go off and continue spreading a crazy rumor like I did.
Sorry about that again.
Wow! This amazing piece of work belongs on a canvas hanging on a wall somewhere with a $3,000 frame around it. The beautiful castle, with the under water workings, the vibrant colors, the detail. It’s just not often you find a design that just grabs your attention, stuns and amazes you that the only thing you can say is Wow! These guys have talent.
Source: CoolBrushDesign.com
The information superhighway spans across the globe, people who access your website come from all corners of the word and from various cultural influences. It is important to consider this when designing your web pages to ensure that the appeal of your objective speaks to the worldwide population and not one specific demographic.
Consider the following; you have no knowledge of how a user was able to access your page or their previous experiences in dealing with your company its products services and affiliations. There is no assurance of the path that the user took to arrive at the page, which links he used to arrive at the website or which search tool he utilized to research your information. These factors are helpful to consider when generating a design that is culturally neutral and is pleasing to all.
There is a chance that the user will connect at lower than ideal speeds. Sometimes users will even have a connection of .5kb for mobile phone access. It’s not just the nominal connection speed that is a modifier in the users transfer rate. A typical consumer on a standard modem will get a 3kb transfer rate but will even get slower as lines become busy. Minimizing the overall schematic of the web design and its size will greatly improve the access experience and speeds up loading time for pages.
Using ideas such as CSS will lower the render time. Building your pages in sequential chunks and avoiding pages wrapped in large tables will also help with loading time. It’s ideal to save imagery for content whenever possible and remember that important content should be CSS based and not image based. These factors which tell users where they are, what the functions are and where the site can direct them need to load first to maximize the user experience.
Computers will always have different fonts that they use. PC’s will have a different font list than a Mac. Some of the fonts that you think are universal might not be available for a lot of people. To be on the safe side, it is a wise option to design your website with a globally utilized font such as Verdana for windows based computers. Sans Serif or Helvetica, Arial are some other options that you can use to set the general body font of your design content. For aspects of your design that do not require mass readability such as headers you can use fixed-pitch fonts like Courier for snippet code.
Take into consideration that some computers will have less capacity in displaying full spectrum color. Some PC’s are so ancient out there that they can only display 256 colors. Remember that the color scheme can be different on a Mac compared to your regular PC. It is a wise practice to use white for background and choose universally present colors found in all color schemes. Use web safe colors for large portions of your content and accept the fact that the coloration will always be compromised for a small percentage of your users; this is a limitation of their machine.
If you plan to use the latest coding then provide links for browsers that can easily be downloaded to maximize the viewing capacity of your users. Some websites post recommendations of which browser will be compatible for the web content. There are numerous freeware browsers that identify and are updated to read and maximize the usage of current programming, it is advisable to provide a download link or mention the platform so that your users can take full advantage of your design.
For people just getting into the knack of designing web pages, choosing the right elements when It comes to your layout can be confusing. A lot of programmers make the mistake on making a generalized web design with no focus, this ends up in disaster because the web page does not carry a true function or tries to “gain the best of both worlds” by dabbling too much in all the elements. A web site that’s too visually oriented, coupled with an explosion of color where you have to read a ton of content on a single page is a failed one. This guide will provide you with some important steps to ensure a successful web design.
1. Define your Focal Point
Before you create your style sheet or post your test content, consider this: What makes your users different from others and what is the focus of your business? This is an important factor in ensuring the look, aesthetics and content reflect the true nature of your business or the message that the website is trying to convey. Remember that lack of focus will just jumble the message. Your users might be amazed at the design but might get lost at what the website is trying to make them do if you don’t put a focus for your design.
2. Simpler is most times better
When designing a website don’t try to impress with complicated design, flash animation, and other bells and whistles. Make the design simple and clean and impress with the content. Fill the website with the best quality content you can get your hands on. The majority of the visitors that will come to your site will be looking for information, not to see how cool your website it, so give them exactly what they want.
3. Sticking to your main objective
Specific web elements are meant to generate certain stimuli for its users. A content-based approach is intended for research and information purposes, where your design is largely based on content management and easy access to stored data for your users to analyze or study. Visually appealing sites are more geared towards provoking emotional stimuli, creating an impulse for customers or allowing them to feel a certain way. Product representation and websites that sell will benefit from this approach. Remember that when you design your pages it is crucial to stick to your objective. If you think that trying something new on one page to spruce things up is a bold and innovative choice, it isn’t. Creating wildcard pages not only sends mixed signals but conveys the work of an unprofessional designer.
4. Create designs that reflect you or your business
Marketing your website or your product is as important as designing the perfect page. Remember that as consumers browse your page, your personality is reflected on each design and will create a universal perception of how your users will define you. Try to create a design that makes you feel comfortable. Combine colors and a feeling of comfort when it comes to your design and layout, this is normally a good way to go in making sure that your website reflects your personality. If you’re not sure how to go about it or am scared that you might send the wrong message if you follow your personal choices then do some research and look at certain sites. If you find something appealing but speaks to you then bookmark the page and start your design concept by using the website as an inspiration.
5. Test and Measure your success
Remember that keeping an open line of communication between you and your users will be one of the best things to do to measure the effectiveness of your site. Allocate a specific portion of your site devoted to user feedback or provide an email address where users can voice out their opinion about your site. The best gauge to see if your site was able to deliver the goods is to hear from the people who use them.
It is a notable fact that our mind has sophisticated mechanisms in recognizing shape and form. We have the ability to associate spatial images with meaning. This is extremely helpful in identifying likeness to symbolism, allowing us to identify familiar and non familiar objects and what they mean to us. We use this skill on a day to day basis, especially when we’re on the computer, browsing through a website associating shapes with specific functions such as the help icons or directions in accessing web content. We can make decisions based on imprints of images and how we’ve associated with them previously, such as deciding to ignore an advertisement based on the shape and layout of the banner.
Patterns and Web Design
Our brain has the logic to spot associations among objects based on grouping, alignment and likeliness. This is a big help when determining where to focus or determining objects that provide continuity for a current task or a means to a desire. We employ this ability when we navigate a web site or open our emails and determine which ones we want to open or ignore.
When we associate function to patterns and shapes, we are able to determine points in an image that are to be ignored and focused on. This is part of the brain’s ability to filter out noise and concentrate on the task or objective. We use this skill when we look at a page or scan for likeness when we compare contrast of colors, determining whether the content that we are currently browsing will appeal or dissipate interest.
Using Cognitive Elements in Web Design
Tapping on the brain’s cognitive elements is an advantage when it comes to web design. It is important to consider what images are relatively stimulating to keep users’ focus on a site, and you can achieve this by using patterns or co-relationships among images that the brain will perceive as logical or pleasing.
Shape Correlation
Using theories on shape recognition will increase the site’s likeliness to convey desired objectives effectively. By using recognizable and familiar signs where appropriate, using the right tone and color relationships the user’s eye is directed towards important elements of the web design. This helps intensify the message and allows the brain to focus on the objective that the web design is trying to impart.
Pattern Recognition
Another important principle to consider is utilizing the brain’s pattern-recognition ability. This is achievable by employing techniques of linear proximity, alignment, pattern hierarchy and containment to properly deliver visual messages. Grouping specific elements and using specific measures to match their proximity is important. It makes it easier for the brain to distinguish certain elements if they are groups that relay the same objectives are proximal to each other. It helps to create a feel of distinguished elements when there is significant color contrast compared to the background, the size of the elements are enough for the human eye to discern and the presence of white space as a border to help define the shape and make it stand out. These techniques will help your website generate more focus and allow users to clearly distinguish aesthetics from features and overall website objectives.
Web accessibility is an influx of co-dependency on several factors. These elements must work under mutuality at all times, working hand in hand and creating improvements in specific aspects that substantially improve the access of web content. It is fundamental to familiarize yourself with text and infrastructure to generate a solid web access protocol for your design that will fit users with disabilities.
Web Access Primer
It is important that different components of web development and interactivity collaborate together and function in unison. This is particularly true for web accessibility for users with disabilities. The factors that you need to consider when conceptualizing accessibility designs should be of the following:
Content- Information in a web page or the applications it carry including inherent information such as graphics, sound, text code and markup must be provided in means that are available to different aspects of disability. It is important to use variable agents such as media players, independent form programming as well as audio sensitive scripts to cater to specific areas of access allowances.
Assistive Technology- breakthrough enhancements are a necessity, standalones such as screen reader compatibility scripts, alternative keyboards; compatibility with scanning software or voice recognition can be put in place depending on the structure and diversity of assist processes that you would like to integrate into the web design.
Developers and the use of Authoring and Evaluation tools will help progress your access protocols specific to disability needs, working with users who are disabled will allow the overall design to reach a holistic level by providing first hand feedback of most recommended accessibility tools such as software, HTML and CSS validators, etc.
These components relate in a cycle; web developers who structure the content and layout of a web page use authoring and evaluation tools to evaluate the strategic and functional assimilation of a web design, while the users who use elements factored into the design such as browsers, media players, assistive technology and user agents provide feedback when they reach the interaction stage with the posted content. The significant interdependence between these two is what makes a web design work to provide optimum accessibility.
Structural Deficiency and its Impact in design
In the event that an accessibility feature is unsuccessful within any of the major components, the motivation becomes inconsistent, resulting in lesser accessibility or a diminished user experience. For example, designers are less likely to implement an accessibility feature such as voice recognition if the authoring tools that are prescribed for the design have little or no support or furthermore if end media such as browsers do not follow through on implementation in a consistent manner. This in turn will provide an unsatisfactory user experience especially because in cases of disabled users, assistive technology and accessibility features are critical to maximize web content usage.
Guidelines for Various Components
W3C also known as the World Wide Web Consortium Web Accessibility Initiative (WAI) continues to develop accessibility measures for components that affect design and accessibility. The ATAG or Authoring Tool Accessibility guidelines provide a checklist on language protocols determined by function and use such as disability etc. Web Content Accessibility Guidelines take point on web content and is utilized by developers and accessibility evaluation tools developers. These controls help ensure that most design matrixes on the web that cater specifically to disabled users are provided with necessary tools to maximize accessibility with ease.
I mean, do you have the Hardware and Software to do the job right? It’s not just about Photoshop and Dreamweaver anymore, these days you need to have a fleet of computers with various operating systems and browser versions installed to make sure the website you just got done designing and programming does not win the #1 spot on the WebsitesThatSuck.com website.
With the new version 8 of the Internet Explorer out, now we have three IE-if-statements to include in head section of the pages. One more to worry about. That’s in addition to the two or more FireFox versions, Chrome, Opera, Safari and others. Seriously, if you are not a fairly large company, you might not even be able to afford so many computers to run these various versions of browsers and then different variations of OS/Browser combinations because they do behave differently, on Windows XP and Windows Vista for instance, IE 7 will sometimes need a kick in the pants.
Of course you have the choice to have the hard drive partitioned with various installations on the same computer but it is still more hassle that it should really be. Only if the companies would adhere to the standards, we would be happy campers and then everyone would become web designers and we’d have a different problem then.
That’s my rant for today. Please feel free to express your frustration in the comments. This will be the webdesigners’ therapy page. ;)
UAAG collectively known as the User Agent Accessibility Guideline is the errata that detail the importance as well as guidelines to establish in making user agents easily accessible to people that require specific elements in design content. This was developed with the particular purpose of increasing accessibility of Web Content. User agents include elements such as web browsers, assistive technology, media players and other types of software that the disabled use to interact with communication devices such as computers.
The UAAG is a portion of a collection of accessibility protocols, which include the Web Content Accessibility Guideline as well as the Authoring Tool Accessibility Guideline and Essential Components of Web Accessibility which explains the relationship between web elements that contribute to standard publication of web content.
UAAG was developed primarily for Web Browsers, Media Agents and technology created to provide ease of access in maximizing web content. Supporting resources as well as UAAg are intended to meet the needs of different target audiences which include policy generators, web content managers and others. People who wish to choose user accessibility agents for a specific web design may utilize UAAG protocols to determine if their infrastructure meets their user agent standards. Existing developers who have living design published may continue to use UAAG to re evaluate and generate recommendations to improve existing design in efforts to promote better accessibility. The UAAG details a comprehensive list of check and balances that cover specific points such as access to overall content. This includes content linked to trigger events such as a mouse or keystroke. It provides a worksheet of ideal user control mechanisms on how content is rendered. The UAAG also provides checkpoints on interfaces that render control over time sequences such as document accessibility features and download. It provides a set of conclusive markers that check the validity and effectiveness of programming interfaces that enable the design to interact with assistive technology liked to the overall layout of the page.
The UAAG white papers are technical documentation developed by an organization called the User Agent Accessibility Guidelines Working Group. They are a part of the World Wide Web Consortium Web Accessibility Initiative and have been the forefront in creating innovative markers to provide ease of access, promotion information influx for web elements included in its design.
When constituting a design for web layout several factors are considered but mostly the end user and its marketability in terms of value of access as well as terms. By employing the UAAG protocols the developers can test and ensure that markers determining accessibility of available information is measured. Most of the time there is an underestimate for assistive technology or use of specific policy measures in a web page. If this is overlooked and production is in place or there is a published layout, you can consider the structure a living document by subjecting it to UAAG markers. This makes the layout and content pass through a standardized review, making evaluation of mechanisms that dictate accessibility and performance vs. function issues measurable. With UAAG developers are able to provide an access appropriate design ; this creates an improved user experience.
