Homework due April 14 is to complete the work started in class on the 7th.
Engagement team: Your goal for this class is to bring as many readers as possible to this article. You will achieve this aim via several tactics:
3) Social media
For next week your focus will be on SEO:
Review all of the content (posted on the mural) and make recommendations for keyword targets for each piece (but note that the story will most likely be only one page). Use the keyword research tool to support your decisions. Make sure you get information from Andrea, Sharon, and Lily about who the ideal and intended audiences are for the story. Document your ideas and post a link to the document in the comments for this assignment.
Development team: Your goal for this class is to build a responsive feature story. It will probably be one page with several content areas. By next week, mark up the content in HTML. Use placeholder images to indicate where the interactive features will be. Look for interactive tools such as storymapsJS or timelineJS that you could use to add interactivity to the graphics. Document your ideas and post a link to the document in the comments for this assignment.
Visual design team: Collect at least 5 examples each (total of 15 for the group) of:
1) Excellent typography on the web
2) Unusual visual approaches to infographics
3) Excellent use of color in a one page website
(These are purposely open ended, but be prepared to explain why the typography is excellent, the approach unusual, the color use excellent.)
Post these to a collaborative Pinterest board or to the mural near the style-tiles and moodboards
Create a style tile and mood boards for site using photoshop and Mural.ly
Mark up story in HTML
Show how you would tell the interactive parts of the story using tools you know about such as storymaps.js. Try to include these elements in your HTML.
Next week, we will review and winnow down to one direction and then split up into teams to complete the feature.
HERE IS THE CONTENT MURAL.LY link (http://mrl.li/1fW3Kaf) – at the bottom left, you’ll see Andrea, Eric and Sarah’s files.
Create a column for yourself on the mural and add your style tiles and moodboards there.
Assigned: Feb 17 | Due: Feb 24
Estimated hours to complete: 7-11
Days between classes: 7
Do the homework in order. You may collaborate to solve the problems.
I) Start by completing both the Basic and Box model sections of the CSS course on W3Schools: 2 HOURS
II) Download the starter files and edit the index.html file and the main.css files to achieve the following: 5-9 HOURS
- Change the h1 color and size
- Change the text color
- Change the background color of the entire page
- Add a div with a paragraph inside of it to the page. (A div is an HTML tag.) Use CSS to:
- put a border on the div,
- make the background a different color from the rest of the page
- make the p text inside of the div different
- Change the hover color of the links in the navigation area
- Add an image that you can click on to get to another website. (Hint: this is an img inside of an a tag)
Post your site files (the whole folder to Dropbox or Google Drive and put the link in the comments for this assignment)
Assigned: Feb 10 | Due: Feb 17
Estimated hours to complete: 7-12
Days between classes: 7
Watch: Web Design Fundamentals on Lynda.com 3 hours
or read Learning Web Design by Jennifer Niederst Robbins (link points to Marquette’s online bookshelf. You’ll need to be on campus or access it through the VPN. )
Learn Basic HTML to complete the exercise below. 2 hours
Post your file to your mural and add link to the comments below, bring your file to class, or if you’re really amazing, upload your file to your own website.
Exercise – 2 hours:
Using any software you like. Mac users could try TextWrangler, Windows users try the default text editor on your machine – I think it’s Notepad. Create a simple HTML page with the following items:
- link to an external website (e.g. marquette.edu)
- image (that exists on another website)
- it also needs to have the basic elements of a page (html, head, body)
- unordered list (bullets)
- ordered list (numbers)
- bold text
- italic text
Bonus if you write a short piece on why you want to be a journalist and use that content for your HTML exercise.
Review any of the materials from class if needed. Your goal is to understand how the web works and to create a very simple HTML page.
Assigned: Jan 27 | Due: Feb 3
Estimated hours to complete: 8-12
Days between classes: 7
Watch Foundations of Typography video on Lynda.com – 2.5 hours
Explore the Typography for News Design self directed course Poynter – 1 hour
Learn any Illustrator skills that you don’t already have – 3 hours if you don’t know any of the skills
Read: The science behind fonts (and how they make you feel) – 15 minutes
Typography exercise – 20 minutes
Use Illustrator to design a text-only flyer with the content in this file. You may change the font, the text size and the order of the text but don’t use any images or color. This exercise comes from another Ina Saltz title on Lynda.com, Foundations of Typography: Hierarchy and Navigation. But please, don’t peek at Saltz’s solutions until you’ve completed the exercise – see how many different ways you can come up with to lay out the text in 20 minutes. Post screenshots of your solution to to a new mural in mural.ly and add the link to the comments in this post. Remember to share the link so it will be public.