Categories
Langara Outlines

WMADD 4835 Outline

  WMADD 4835 HTML / CSS 2 Credits: 3 Rooms: B014 Contact Info: Kevin McMillan Office A247b 604.323.5941 Days & Times: Spring 2017 Mondays, Jan 09 – April 03 1:30-230 (A247 lecture) 2:30–4:30 (A247 lecture) 430-630 (A110 lab) Office hours by appointment SKIP to Class Content This class will cover HTML & CSS design and development, continuing on […]

Categories
Tools & Generators

Online Color Pickers

Adobe Color CC. Create, save, download or browse palettes. Material Palette: Pick two colors. App generates palette. Coolors: Similar to Adobe Color. Coleure: Some useful comparison features.

Categories
Tools & Generators

Emmet Lab Exercise

As you work your way through this exercise, it will give you a sense of the power that tools like Emmet can give you. Emmet is available for most good web text editors—including Sublime Text, Atom, and Brackets. If you’re using Visual Studio Code, it’s built in. Using the official Emmet documentation and (especially) cheatsheet, do […]

Categories
Tools & Generators

Emmet Exercise Answer Key

Note: on this web page, some lines in the answers will wrap to the next line. They are still one uninterrupted line of code each, however. Note, also, that WordPress made smart quotation marks in my code. On other pages on the site, this is fixed by a plugin, but this content was made before I installed […]

Categories
HTML

Image Sources

Here is a list of potential sources for Creative Commons, Public Domain, etc licenses. Remember to read each site’s (and sometimes each image’s) licensing terms in order to determine whether you are legally allowed to use such images in your work. Don’t get sued. Unsplash: very high quality images. Copyright free: No restrictions on usage. […]

Categories
HTML

Sublime Formating Exercise

This exercise is meant for you to examine ways to use Sublime Text, ATOM, or Visual Studio Code as efficiently as possible. Download this file. If the zip archive doesn’t unpack automatically, double click it to get it do so. The result will be a single HTML file. Open that in ATOM or Sublime Text. In […]

Categories
Langara Outlines

WMDD 4815 Assignments

Assignment One: HTML/CSS Resumé For assignment one, I want you to make an HTML resumé. This will be a single page. It will list: your education your employment history your skills your interests your contact info anything else you think is worth including this could include a picture, or references, links to work you have […]

Categories
HTML

Chrome Developer Tools Exercise

In this exercise, you will learn how to use the Chrome Developer Tools to examine the html & css of a web page. In Chrome, go to https://guardian.co.uk. Control-click (right-click on Windows) on any element in the page to open the Inspector. As of September 20, 2015, there is a message at the top of […]

Categories
Cheatsheets

Atom Text Editor Shortcuts & Tutorials

Video Tutorials Free LevelUpTuts Atom Editor Tutorial Series Keyboard Shortcuts SELECTIONS command-shift-L: Split into Lines: Turns a single multi-line selection into multiple single-line selections. Exceptionally useful. command-right-arrow Takes you to end of line command-left-arrow Takes you to beginning of line command-shift-right-arrow Selects to the end of the line. command-shift-left-arrow Selects to the beginning of the line. command-click Multiple cursors. One […]

Categories
WordPress WordPress Templates

Useful WordPress Snippets: Gravatars

AUTHORS To display author name as a link to the posts by that author:<?php the_author_posts_link() ?> To display author name, non-linked:<?php the_author(); ?> To GET an AVATAR for your author, sized to 96px by 96px<?php echo get_avatar( get_the_author_meta(’email’), ’96’ ); ?> To GET an AVATAR for your author, wrapped in a link to the AUTHOR […]