Responsive Web Design
Creating responsive designs can be confusing at first, mostly because of the radical change in thinking that’s required. For some that means letting go of strict control of pixel-fixed dimensions in your layout and approaching interfaces in a more fluid way. As time goes on, responsive web design is drifting away from the pool of […] Read more – ‘Responsive Web Design’.
Twitter’s Bootstrap Framework
Now that you’ve learned about how to write basic HTML & CSS we’re going to look at a tool that will make the job of building cross-browser and multiple device-friendly websites a lot easier. The good folks at Twitter have created and shared the Twitter Bootstrap. Here’s a introductory video that helps explains how to […] Read more – ‘Twitter’s Bootstrap Framework’.
Publishing to the Web (FTP)
It’s thrilling to finally publish your work to the web, imagine the whole world can now view it.  For most beginners, the step of uploading that content to your hosting server seems to involve some magic.  Don’t worry, this step is incredibly easy, once you understand what’s going on. The first thing you will need is […] Read more – ‘Publishing to the Web (FTP)’.
HTML III: layout
These days we use the div tag to establish areas of content in an HTML document. For a while there, we were using the Table tags to help us align and position elements on web pages, but it was a bit of a hack and thankfully some standards were introduced. The div (division) tag is […] Read more – ‘HTML III: layout’.
Images for the Web
Four main considerations for optimizing images for the web 1. Colour – images need to be in a standard monitor colour -sRGB 2. Resolution – images must be 72 ppi (pixels per inch) and it is important to consider the pixel dimensions of any image. 3. Actual File Size – optimizing images for the best […] Read more – ‘Images for the Web’.
Read more – ‘Sitemaps’.
Information Architecture
Here are a few definitions of information architecture (IA): The combination of organization, labeling and navigation schemes within an information system. The structural design of an information space to facilitate task completion and intuitive access to content. The art and science of classifying web sites and intranets to help people find and manage information. A […] Read more – ‘Information Architecture’.
Web Design Process
Plan a. brief goal, intended audience, what b. research content gathering competitive analysis target audience research: i) demographic: age, gender, language, ii) psychographic: culture, slang, interests iii) technical: device, screen size, browser Design Information Architecture (illustrator) – Sitemap – hierarchy (prioritization), structure, user-flow – wireframe diagrams Mockup – Photoshop – colour, typography, motives, layout, grid Read more – ‘Web Design Process’.
Principles of Designing for the Screen
1. Dynamic Document Content for the screen should be dynamic, taking advantage of who is viewing it and their context. 2. Two Way Communication The online medium encourages a dialog between the producer and the audience. 3. Rapid Publication The speed of the online medium is unsurpassed. 4. Multimedia Using image, text, sound and motion […] Read more – ‘Principles of Designing for the Screen’.
ISMA 205: Resources
About Face 3. The Essentials of Interaction Design by Alan Cooper, Robert Reimann and David Cronin ISBN: 978-0470084113 Don’t Make Me Think. A Common Sense Approach to Web Usability by Steve Krug ISBN: 978-0321344755 Designing Interactions by Bill Moggridge ISBN: 978-0262134743 Designing with Web Standards (3rd Edition) [Paperback] Jeffrey Zeldman (Author), Ethan Marcotte (Author) ISBN: […] Read more – ‘ISMA 205: Resources’.