Things to do before class, Aug. 29

No workshop hours this Friday, Aug. 25. But if you want to meet with me, just let me know. I can be available!

  1. Get the book and read all the things listed on the Course Schedule under the Week 2 heading.
  2. Videos: The titles of the videos correspond to the assigned reading. The videos are listed in order here: YouTube Playlist. Watch the videos before class — they are the lecture.
  3. Complete Quiz 1 before it expires (in Canvas) — Monday deadline!
  4. Download, install and run the text editor program Atom before you come to class. Here’s some help for getting started with Atom.
  5. Bring your laptop and power cord and headphones/earbuds to class on Tuesday. Be prepared to stay the entire three hours (unless you complete Assignment 1 in less time than that).

During class you will be doing Assignment 1. I don’t intend to lecture you. (The videos are the lectures in this course.) My role will be to answer your questions and help you if you get stuck.

Assignment 1 is available now in Canvas. You can certainly preview it before class, or even get started on it.

Chapters 1 and 2 in the assigned book are background and foundation material. People who work on digital stuff — apps, websites, games, etc. — know these fundamentals. I hope you will want to understand them.

Chapter 4 is your first introduction to HTML. NOTE: Skip pages 51 and 52. You are NOT using either one of those text editor programs!

The exercises in chapter 4 will be very helpful for you. Consider typing them out — not merely reading them. Learning what is in chapter 4 is essential to completing Assignment 1.

There’s a sidebar about XHTML on page 61. Ignore that. This is one of the few outdated things in this book — we don’t do XHTML at all nowadays. Now everything is HTML5.

Advertisements

Great advice about breakpoints

When you’re coding @media queries, you choose breakpoints. Many of you take the easy way out and write just one @media query. If you do that, and your max-width is small (600px), people with tablets and even small laptops might see a very bad-looking version of your page.

This article recommends using these numbers for @media queries: 600px, 900px, 1200px — “and 1800px if you plan on giving the giant-monitor people something special” (which you don’t have to do).

screen-shot-2016-11-22-at-9-15-54-am

I often code only one @media query (usually max-width: 800px) because I tend to be lazy, and I’m only making examples for you guys. But if I had a paying client, I would write two @media queries for any app — one for phones (max-width: 600px) and one for tablets (max-width: 900px). Lots of people do use tablets much of the time, so don’t forget about them.

I would also make sure my page layout does not get wider than 1200px (that way it doesn’t look stupid on a 27-inch iMac screen) — and I would do that with a container DIV, not a @media query.

Things to do before class, Aug. 30

No workshop hours this Friday, Aug. 26. But if you want to meet with me, just let me know. I can be available!

  1. Get the book and read all the things listed on the Course Schedule under the Week 2 heading.
  2. Videos: The titles of the videos correspond to the assigned reading. The videos are listed in order here: YouTube Playlist.
  3. Complete Quiz 1 before it expires (in Canvas) — Monday deadline!
  4. Download, install and run your text editor program before you come to class. Links to text editors are near the top of the Course Schedule page. (Atom is my favorite.)
  5. Bring your laptop and power cord and headphones/earbuds to class on Tuesday. Be prepared to stay the entire three hours (unless you complete Assignment 1 in less time than that).

During class you will be doing Assignment 1. I don’t intend to lecture you. (The videos are the lectures in this course.) My role will be to answer your questions and help you if you get stuck.

Assignment 1 is available now in Canvas. You can certainly preview it before class, or even get started on it.

Chapters 1 and 2 in the assigned book are background and foundation material. People who work on digital stuff — apps, websites, games, etc. — know these fundamentals. I hope you will want to understand them.

Chapter 4 is your first introduction to HTML. NOTE: Skip pages 51 and 52. You are NOT using either one of those text editor programs!

I think the exercises in chapter 4 will be very helpful for you. Consider typing them out — not merely reading them. Learning what is in chapter 4 is essential to completing Assignment 1.

There’s a sidebar about XHTML on page 61. Ignore that. This is one of the few outdated things in this book — we don’t do XHTML at all nowadays. Now everything is HTML5.

Tips after Assignment 2 (HTML)

How can you do better?

One great tip is to run your HTML through a validator. Robbins explains this on page 67 (chapter 4). The one I use is here — the HTML5 validator. Check the two options, select “Text Field,” delete the default in the field, and then paste in your entire HTML — from the DOCTYPE line at the top to the closing HTML tag at the bottom. Click Validate and see what happens.

Screen shot of HTML5 validator

Filenames and folder names: Professionals lowercase all filenames and folder names. Also, NO SPACES. Robbins says this explicitly on page 53. Your page will not validate if any image filenames have spaces in them, for example.

Making your content fit to be seen by others: A photo caption that says “Photo by Joe Blow” is okay (really that’s a photo credit). A photo caption that says “Original Photo Here” doesn’t look like something I would expect to see on a real website.

Choice of filenames: For any assignment, the main page in a folder can be index.html. For Assignment 2, recipe.html makes sense. Naming a file assignment2.html looks like homework. Think about your portfolio.

Text for the alt attribute value:Alternate text (also referred to as alt text) should serve as a substitute for the image content — serving the same purpose and presenting the same information” (Robbins, page 126). More here, from the W3C, keeper of all Web standards.

Editing a super-long URL: Any super-long URL is unwieldy, and also, it will often throw an error in the validator. I demonstrated how to fix this in the “Assignment 2 Part 2” walkthrough video, at 4:00 in the video. This editing is also recommended for links you click in social media, like this one:

See the question mark in the URL? That question mark and everything following it can be deleted:

That is a cleaner, shorter and better URL to share and to use on your Web pages. But a word to the wise: ALWAYS click the link on your page to double-check that it goes where you intended it to go.

Things to do before class, Sept. 1

UPDATE and ROOM CHANGE: Class will meet in Weimer 3032 (the large room at the end of the atrium wing, third floor) on Tuesday, Sept. 1. We will meet in this room every week — unless I tell you otherwise.

No workshop hours this Friday, Aug. 28. But if you want to meet with me, just let me know. I can be available!

  1. Get the book and read all the things listed on the Course Schedule under the Week 2 heading.
  2. Videos: The titles of the videos correspond to the assigned reading. The videos are listed in order here: YouTube Playlist.
  3. Complete Quiz 1 before it expires (in Canvas) — Monday!
  4. Install and run your text editor program before you come to class. Links to text editors are near the top of the Course Schedule page.
  5. Bring your laptop and power cord and headphones/earbuds to class on Tuesday. Be prepared to stay the entire three hours (unless you complete Assignment 1 in less time than that).

During class you will be doing Assignment 1. I don’t intend to lecture at all. My role will be to answer your questions and help you if you get stuck.

Assignment 1 is available now in Canvas. You can certainly preview it before class, or even get started on it.

Chapters 1 and 2 are background and foundation material. People who work on digital stuff — apps, websites, games, etc. — know these fundamentals. I hope you will want to understand them.

Chapter 4 is your first introduction to HTML. NOTE: Skip pages 51 and 52. You are NOT using either one of those text editor programs! I think the exercises will be very helpful for many of you, so consider typing them out — not merely reading them. Learning what is in chapter 4 is essential to Assignment 1.

There’s a sidebar about XHTML on page 61. Ignore that. This is one of the few outdated things in this book — we don’t do XHTML at all nowadays.

First class: Tuesday, August 25

I’m excited about this class! I hope you are too.

Make sure you arrive ON TIME for class on Tuesday. This is an important class meeting, and you should NOT miss it.

Bring your laptop.

You have an assignment due on Monday, August 31. You’ll want to hear more about that, I think.

I’ll also explain about the software you’ll need to download and install before the second class meeting.

Finding the classroom

Weimer 3219: We are on the third floor of Weimer Hall, but our room is NOT in the wing we call “the atrium.” It’s in the other wing, sometimes called “the Flanagan wing.”

To find the room, picture Weimer Hall as an L shape. The atrium is the bottom of the L, left to right. The Flanagan wing is the side of the L, top to bottom. The two wings meet at the bottom of the L. The top of the L is the part closest to the Florida Gym and Stadium Road. Our room, Weimer 3219, is in the top of the L.

Go to the third floor. Walk all the way to end of the third-floor hall in the Flanagan wing, past the Brechner Center for Freedom of Information — keep going! You’ll find it. If you came from the atrium, keep turning corners.

If you ask anyone for help, ask where the Brechner Center is. No one will know room 3219 by its number.

Weimer 3219

Getting a job in journalism code

All your fears and worries are not one bit strange or unusual.

The subtitle of this article is “Two recent grads want to calm your job search fears.”

Q: Whenever I see someone write code, it’s like they’ve got everything memorized. Do I have to memorize everything?

A: You do not need to memorize everything. Programmers know what to write next (like exact phrasing of CSS or Javascript functions) because of repetition, familiarity, and having looked it up time and time again. Trying to intentionally memorize programming language syntax is probably less productive than learning to Google what you need and passively memorizing the things you have to look up repeatedly.

There’s lots more good stuff in the post. Go read it.