Schedule
Subscribe to this calendar | Download this calendarClass 1 - Intro
Welcome! Intros and goals
Code Academy: Intro to HTML
In Code Academy's Introduction to HTML course complete the following sections:
Learn HTML: Elements and Structure
Learn HTML: Tables
HTML/CSS Icon Graphic
Create a graphic related to a news story you are working on.
- Your graphic should include the following elements:
- Headline.
- Dateline and byline.
- At least four icons that represent some important facet of your story.
- Write a short paragraph that conveys an important data point attached to each icon as it relates to the news story.
- Build the graphic using ONLY HTML and CSS.
- Use pre-designed, royalty-free icons (font awesome!).
- Include a link to your data at the bottom of your page.
- You MUST use the design principles we’ve discussed — pay attention to font, hierarchy, spacing and color.
Class 2 - Intro to HTML
HTML powers every webpage you use.
Find 5 news sites you find appealing
Find 5 news sites you find appealing and write a paragraph about what you like and dislike about the site's design and user experience.
NO CLASS
Class 3 - Design principles
Think about the best visual experience for your users before you code!
Learn CSS: Selectors and Visual Rules
Complete Part 1 of Code Academy's CSS lesson:
CSS Setup and Selectors
CSS Visual Rules
Learn CSS: The Box Model & CSS Display and Positioning
Complete Part 2 of Code Academy's CSS lesson
The Box Model
CSS Display and Positioning.
Class 4 - Intro to CSS
Colors, sizes, spaces, fonts -- all of the things that make your site look good are powered by CSS
Complete your about me page
Below is the criteria for the about me page:
- One <h1> tag
- At least one <h2> tag in a proper section.
- At least one <h3> tag in a proper section.
- One Unordered List or One Ordered List.
- A brief bio that uses at least four <p> tags.
- At least one <img> tag.
- At least two <a> tags.
Build a CSS robot
General Assembly's DASH online learning program has a great exercise to help you learn the relationship between CSS and HTML. Go to https://dash.generalassemb.ly/projects, set up an account and then do Project 4: Build a CSS Robot. You do not need to do projects 1-3. This is a fun but lengthy exercise. Please take a screen grab of the completed product (of your entire screen) when you're done and email it to me along with the HTML from the exercise. It's ok if the HTML doesn't work outside of DASH, I just need it for review. The metadata of the screen grab and other elements will be inspected to prevent plagiarism.
Class 5 - Finding the story in the data
Data tells a story -- sometimes it's on reporters to find out what that is.
Class 6 - Finding the story in the data, part II
Class 7 - Maps
Class 8 - Data visualizations
Pivot tables, charts and graphs -- some of the core visualizations we can tap into to help our users understand the more complicated points of our stories.
Class 9 - Data visualizations, part 2
Class 10 - Free tools to help you visualize
There are some great platforms and libraries that will help you churn out a visualization in minutes. Even if it's not refined, it can still help journalists with analysis.
NO CLASS
Class 11 - Mapping workshop
Class 12 - Workshop
Class 13 - Workshop
Class 14 - Final presentations
Policies
Attendance
If circumstances prevent your attending class, the instructor must be informed by phone or email on or before the day of class or within 24 hours afterward.
Deadlines in Journalism Matter
You must meet Deadlines by filing your assignments no later than due date and time. Missing a deadline results in an automatic half-grade reduction. Your grade will continue to drop by half a grade for each subsequent day after the deadline until you file your assignment. Plan ahead and remember that in journalism: done is better than perfect. It will always be better to hand in something than nothing. If you are having trouble with your assignment let me know immediately, do not wait until it is too late.
Plagiarism
It is a serious ethical violation to take any material created by another person and represent it as your own original work. Any such plagiarism will result in serious disciplinary action, including possible dismissal from the CUNY J-School. Plagiarism may involve copying text from a book or magazine without attributing the source, or lifting words, photographs, videos, or other materials from the Internet and attempting to pass them off as your own. Student work may be analyzed electronically for plagiarized content. Please use comments in your HTML/CSS/JS to attribute code snippets you have found on support forums or elsewhere. For example:
Sample markup happens here
Communication
You can email me at [email protected]. The class also has a slack team you must sign up for using your journalism.cuny.edu email address.