maggiemcadvweb - Tumblr blog

[maggiemcadvweb]

The typography on this site is very nice and easy to read. The target areas for buttons are very large too just like my article said to do. I also really like the “how can we help?” feature right when the site pops up. Content is also organized very nicely. 

[maggiemcadvweb]

Although the design isn’t the most interesting, the content on this site is very nice. It uses an inviting tone of voice while teaching a user all about the disorder. I also think it’s a lot of information but it is organized very nicely. 

[maggiemcadvweb]

Accessibility for Vestibular Disorders

Facundo Corradini is a front-end developer and CSS specialist from Mar Del Plata, Argentina. While suffering from a bad case of vertigo he researched what it is really like to use the web with a vestibular disability. His findings have helped him take on an accessibility-first approach to design and development. He makes a good point when he mentions that if we designed everything around accessibility then the web would be better for everyone. I think when designing for Dynamic Dyslexia and accessibility-first approach is a great idea. Also, Facundo’s findings are very good advice that we should keep in mind as well. 

First, he mentions that vertical slants triggered his vertigo symptoms but horizontal slants wouldn’t. He explained that vertical slants reinforce the falling-from-height sensation and can make someone feel dizzy. So, it is best that we avoid them all together. While he was being treated for his vertigo he was prescribed cinnarizine. While under treatment on Cinnarizine, it had a negative side effect of affecting coordination and fine motor skills. He found that he would miss the button links a lot. He said that he would move the pointer past the link he intended to click, clicking before reaching it at all, or having to try multiple times to click on smaller targets. To fix this solution, we should make sure to make large target areas on all devices. This will benefit people with limited vision, users with mobility imparments such as hand tremors, and users with difficulty with fine motor skills. 

Facundo has an entire section dedicated to explaining fonts and readability in this article. He explains that, “I was experiencing something similar to users with mild forms of dyslexia or attention disorders: whenever I got to a website that didn’t follow good font styling, I would find myself reading the same line over and over again.” I think his whole list of font styling suggestions is something we should all follow on this website design: 

Keep line height to at least 1.5 times the font size (i.e., line-height: 1.5).

Set the spacing between paragraphs to at least 2.0 times the font size. We can do this by adjusting the margins using relative units such as em.

Letter spacing should be at least 0.12 times the font size. We can adjust this by using the letter-spacing CSS property, perhaps setting it in a relative unit.

Make sure to have good contrast between text and its background.

Keep font-weight at a reasonable level for the given font-family. Some fonts have thin strokes that make them harder to read. When using thinner fonts, try to improve contrast and font size accordingly, even more than what WCAG would suggest.

Choose fonts that are easy to read. There has been a large and still inconclusive debate on which font styles are better for users, but one thing I can say for sure is that popular fonts (as in fonts that the user might be already familiar with) are generally the least challenging for users with reading issues.

Animations or any form of movement can also trigger nausea and dizziness. Facundo says, “anything moving on the screen would instantly break my focus, and force me to start the paragraph all over. And I mean anything.” He emphasized a big issue with parallax scrolling and how that would trigger his vertigo immediately. He found himself turning these functions off with custom style sheets just to be able to look at the website without getting sick. He suggests that if you do incorporate any kind of animation that there should always be an option to turn it off, pause, or hide them for the viewer and still have the critical information display. 

Also, User reader mode can be extremely helpful for those that use a screen reader. Can we have a button that transforms the site into reader mode? Can there also be a button that turns off all animations too? I think both of those elements would benefit dyslexic users. 

While recovering from his vertigo he found that It was much better for him to read on a dark color mode scheme (light text on a dark background) due to experiencing photophobia where you are sensitive to light. Not all vestibular disorders have the photophobia symptoms, but some conditions can trigger it. We should have a way (maybe another button) that converts the site to a dark mode for people that may have this issue. 

Over all I found this article very helpful before beginning the Dynamic Dyslexia website design. I think if we all keep these tips in mind, we will end up designing very successful websites that Jaimee will be very impressed with!

[maggiemcadvweb]

Sticking to Your Process

“Sticking to Your Process” focuses on just that, following a continuous design process with every project. Clients sometimes don’t realize that there is more to design than just the visuals. As Kofi, Eve, and Joe have all taught us, research before a project begins is crucial. If you go into a project blind without a stable background of what you are working on there is no way you’ll be able to come up with something that best suits the clients needs. I thought it was interesting how much this article emphasized the importance of not letting the client persuade you into breaking your process. “Bending, not breaking” and sticking to your design plan will lead you to create great work. This also gives an opportunity to modify and improve this process every time you use it. I think a lot of the time, people that aren’t creative do not understand that there is a creative process that must be followed. From personal experience, people expect that you can just sit down and create some magic to come up with exactly what they want. Design takes time, and I agree that if the process that works for you is broken, you create work that you aren’t happy with. At my job now, I struggle with clients and co-workers constantly trying to break my process. I have explained numerous times that I need time to research and sketch before I can begin on the execution of a design. It can be frustrating when clients expect such a quick turn around because I know that means I won’t have time to go through my process and I end up quickly designing something just to get it done and I am never satisfied with the outcome. 

I liked the advice the article suggested that said, “tell the client you need 12 weeks to complete the project and that includes a week before and a week after.” I have learned that it is always a good idea to plan for more time than you need. The design process can sometimes have some unexpected forks in the road. Rushing leads to stupid mistakes. Although it is good to have a little pressure to get things done, I think rushing can overwhelm a designer and cause them to complete sub-par work. I do think that sometimes our design process is rushed. As students, we have a lot going on and it can be challenging to complete all of our daily assignments. I often feel overwhelmed when I have to rush to complete project research and I know that I am starting a project with poor foundation. Sometimes I think if we had time to fully complete a project before we began the next, it would allow for more time to focus on building a strong foundation for the next project. 

The advice about having good communication with clients was very helpful. Because the process can be so extensive, I think it is a good idea to stay connected with your clients and let them know the work you are putting in. Like Kofi said how he takes the client through his journey, I think that this makes the client feel more secure that they are getting their money's worth and the designer confident that they are doing everything they can to ensure for a good design outcome.

[maggiemcadvweb]

Responsive Web Design

This article was a very interesting read. It made me fully understand the concept of responsive web design and the process that should be followed when making a site responsive. Karen expressed the importance of keeping the same content on mobile, tablet, and desktop. I guess when some people think of responsive web design they think that content should be edited for a smaller screen like a phone, but Karen confirms that content needs to remain the same across each platform. She says, “We also insisted there’s no good reason to serve different content by platform.” This makes sense, the same information should be offered on every device or else people could become confused and information could be mixed up.

Karen also talks a lot about how responsive design won’t fix content problems, but content strategy will. She explains that taking an old website and turning it into a responsive one shouldn’t mean you just throw the same content together and make it work on a smaller screen size. This is a time to revise all the content on the site and make sure the most valuable information in being offered. One of the comments that related to this said, “Responsive is providing an open window for getting content and strategy in order. And a big thumbs-up to long-term maintenance plans. There is nothing worse than making poor content “responsive” and walking away.” This was good advice for our portfolio sites that we are in the process of redesigning. Although it is tempting to take the same content from our last site, it is important that we all take the time to make sure the content we are including is our very best work to show. The information that goes with the work should also be very valuable especially because the main purpose for these sites is to send it out to future employers that will determine if we land job interviews or not.

The advice that Karen provided for content strategy was very helpful. She explained that if you take the time to make informed and realistic decisions on what to focus on will help with planning, migration processes, and design decisions. For sites that are much larger than our portfolio sites the content that will be edited in the future needs to be thought about and taken into consideration before the design of a responsive site even begins. All of this talk about content makes me think about how larger websites need so much daily attention to keep them running. This summer working at The DA, I watched our web design guy redesign The DA website to ensure that it was responsive. I remember him mentioning the importance that multiple staff members had access to the website so they could update content daily. Going to the site now, I noticed that there is a lot of information to take in on the home page. However, the site is designed in color coded sections so that a user can easily scroll to the section of news they are most interested in. This also is organized so that the content can be easily revised. For example, the sports team can easily scroll to the sports section of the page and exchange images and titles. It is important that a big site like The DA organizes their content in such ways that are user friendly and friendly to the people behind the scenes that constantly have to update the information.

Overall, I think this article really helped me fully understand the importance of responsive web design. I think responsive web design is an opportunity to re-create a site to be more accessible to all devices while also providing the most necessary information. If this is overlooked, then re-designing a site just to be “squishy” but have the same poor content is basically a waste of time. Responsive web design may be setting some high standards for the world of websites.

[maggiemcadvweb]

This site has more of a symplistic approach but everything is very nicely laid out. I like how the home page is a grid display of all of his work where the color is the main source of attention. The color scheme of the site is amazing. He uses his 3 color logo as the palette for the whole site and the backgrounds change to the colors of the logo as you navigate through the site. It makes the different sections of the site easy to understand. The project pages all have a very nice title introduction making you want to scroll down to read more. It also sizes down to one column very nicely for mobile.

[maggiemcadvweb]

Lauren Hom does a very good job of branding herself. She has designed the whole site in the style of the work she produces. Also, the copy on this site also is very friendly and inviting. You can tell what her personality is like while she still sounds professional. She limited her color palette to 3 colors which gives the site a pop of color but it doesn’t over power her work being the main source of color. As far as responsive design, her 3 column grid design transfers very nicely to a one column for mobile. She doesn’t lose any of her elements as the site gets smaller.