Category Archives: Web Design

Web Design – week 14

Class

  1. Join class via Zoom
  2. Video of today’s class, Passcode: @4%e%A*q
  3. Presentations
  4. Continue discussion about HTML, CSS and WordPress websites
  5. Look at student sites

Assignments

  1. Put text and image content on your website

Wednesday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: 3HH%f0dX
  3. Presentations
  4. Here’s a cool “under construction” plugin
  5. Bootstrap UI Kits in XD
  6. Font packs
  7. Continue discussion about HTML, CSS and WordPress websites
  8. Look at student sites

Assignments

  • Continue to work on your WordPress site

Web Design – week 13

Class

  1. Join class via Zoom
  2. Video of today’s class, Passcode: ^6vz$azK
  3. Presentations
  4. Finish going over the CSS study guide so people can do the CSS take-home test.
  5. Note: I emailed the files I worked on today in class to you. The ones I placed on the website earlier had incorrect URLs.
  6. For advanced – my list of things you should know to do web design

Assignments

  1. Put text and image content on your website
  2. Reading assignment: learn about fonts.

Wednesday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: qpz!Q14+
  3. Presentations
  4. How to create anchor links in Adobe XD
  5. Things Every Web Designer Should Know
  6. Continue discussion about HTML, CSS and WordPress websites
  7. Look at student sites

Assignments

  • Continue to work on your WordPress site

Web Design – week 12

Class

Monday – finish CSS test walk through next week

  1. Join class via Zoom
  2. Video of today’s class, Passcode: m3^baxp3
  3. Presentations
  4. Go over the CSS study guide

Assignments

  1. Put text and image content on your website
  2. Reading assignment: learn about fonts.

Wednesday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: GC?F0kkI
  3. Presentations
  4. CSS cheat sheet
  5. HTML cheat sheet
  6. Refer to this CSS study guide when doing this CSS take-home test which I would like you to do and return i in two weeks (ignore the due date on the test). I will go over how to do this with you. Dreamweaver is the best program to use but you can do the take-home test in any word processor.
  7. Continue discussion about HTML, CSS and WordPress websites
  8. Look at student sites
  9. For advanced – start making the list students need to enter the workforce

Assignments

  • Continue to work on your WordPress site

Web Design – week 11

Class

Monday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: !7t8p%lF
  3. Presentations
  4. Reset existing WP sites with the WP-Reset plugin (see this article) or create new sites for people who need them
  5. Go over the CSS study guide

Assignments

  1. Put text and image content on your website
  2. Reading assignment: learn about fonts. Read from this page to this page and do the exercises and examples

Wednesday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: X0jg9$%1
  3. Presentations
  4. Look at and download this resource folder
  5. Continue to talk about CSS study guide
  6. Talk about next project: partner with someone in class who can give you constructive criticism about your website
  7. Talk about when people can finish the first website project
  8. Continue discussion about HTML, CSS and WordPress websites, including the 5 pages students were asked to look at on w3schools.com
  9. Look at student sites
  10. For advanced – start making the list students need to enter the workforce
  11. Talk about platforms:
    1. WordPress (27+ Million Live Websites)
    2. Wix (3.8+ Million Live Websites)
    3. Squarespace (2.2+ Million Live Websites)
    4. Joomla! (1.5+ Million Live Websites)
    5. Shopify (1.4+ Million Live Websites)
    6. Progress Sitefinity (1.4+ Million Live Websites)
    7. GoDaddy Website Builder (1.2+ Million Live Websites)
    8. Weebly (935+ Thousand Live Websites)
    9. Drupal (562+ Thousand Live Websites)
    10. Blogger (459+ Thousand Live Websites)

Assignments

  • Continue to work on your WordPress site
  • Read from this page to this page and do the exercises and examples

Web Design – week 9

Class

Monday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: #hhu02qC
  3. Talk about how a website goes from an idea to a published site:
    1. Domain name – domain name registrar
    2. Web hosting – Dreamhost, Siteground, etc.
    3. CMS – WordPress, Wix, Squarespace, Shopify. Choose and customize themes, plugins, create/add content
    4. E-commerce – Woocommerce
    5. SEO – Google web tools, Yoast
    6. Publicize site – social media – Facebook, Twitter, Instagram
    7. Analytics – Google analytics
  4. Continue discussions about basic HTML and CSS via W3schools site
  5. Check in on everyone’s websites

Assignments

  1. Put text and image content in your website site
  2. Please go to W3schools.com and read from this page to this page

Wednesday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: d#6A8N3j
  3. Discuss web design agreement
  4. Talk about when people can finish the first website project
  5. Continue discussion about HTML, CSS and WordPress websites, including the 5 pages students were asked to look at on w3schools.com
  6. If theres’ time, show how to make a custom template for WordPress
  7. Look at student sites

Assignments

  • Continue to work on your WordPress site

Web Design – week 8

Class

Monday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: $&C+1VZZ
  3. Continue discussions about basic HTML and CSS
  4. Check in on everyone’s websites
  5. We will take a look at these awesome plugins
    1. Tablepress
    2. Social Warfare
    3. Modula
    4. Vaultpress
    5. WP Project Manager (show Basecamp)
    6. Learndash – look at this site
  6. Here are some of my favorites:
    1. WordFence, Login Lockdown, Sucuri – security
    2. Contact Form 7
    3. Akismet – anti-spam
    4. bbpress – forum
    5. Broken Link Checker
    6. Classic editor – removes the dreaded “blocks” interface
    7. Elementor
    8. One-click child theme
    9. Updraft Plus – backup/restore
    10. Yoast, All-in-one SEO – SEO
    11. Yoast Duplicate Post – cloning tool for posts
    12. Mailchimp

Assignments

  1. Put text and image content in your website site
  2. Please go to W3schools.com and read from this page to this page

Wednesday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: yk$^e17d
  3. Continue discussion about HTML, CSS and WordPress websites, including the 5 pages students were asked to look at on w3schools.com
  4. Finish talking about plugins:
    1. Broken Link Checker
    2. Classic editor – removes the dreaded “blocks” interface
    3. One-click child theme
    4. Updraft Plus – backup/restore
    5. Yoast Duplicate Post – cloning tool for posts
    6. Mailchimp
  5. Look at student sites

Assignments

  • Continue to work on your WordPress site

Web Design – week 7

Class

Monday

  1. Join class via Zoom
  2. Video of class, Passcode: 1k+mbf.I
  3. Talk about the next 5 pages of the web tutorial and continue discussions about basic HTML and CSS
  4. Check in on everyone’s websites

Assignments

  1. Put text and image content in your website site

Wednesday

  1. Join class via Zoom
  2. Video of class, Passcode: iEHStH%7
  3. Continue discussion about HTML, CSS and WordPress websites
  4. We will take a look at these awesome plugins
    1. Tablepress
    2. Social Warfare
    3. Modula
    4. Vaultpress
    5. WP Project Manager (show Basecamp)
    6. Learndash – look at this site
  5. Here are some of my favorites:
    1. WordFence, Login Lockdown, Sucuri – security
    2. Contact Form 7
    3. Akismet – anti-spam
    4. bbpress – forum
    5. Broken Link Checker
    6. Classic editor – removes the dreaded “blocks” interface
    7. Elementor
    8. One-click child theme
    9. Updraft Plus – backup/restore
    10. Yoast, All-in-one SEO – SEO
    11. Yoast Duplicate Post – cloning tool for posts
    12. Mailchimp

Assignments

  • Continue to work on your WordPress site

Web Design – week 6

Class

Monday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: i$?+Vf2H
  3. Talk about the first 5 pages of the web tutorial and continue discussions about basic HTML and CSS
  4. Check in on everyone’s websites and talk about a deadline for this project
  5. Use Dreamweaver to make a sample web page (students can use a text editor program if they don’t have Dreamweaver)

Assignments

  1. Put text and image content in your website site

Wednesday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: #hcFn0mC
  3. Demo how to use image map to make Marlene’s balloons buttons
  4. Imagemapper plugin
  5. Continue discussion we started earlier this week about WordPress websites

Assignments

  • Continue to work on your WordPress site

Web Design – week 5

Class

Monday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: y6=&NX^.
  3. Show how to use Media Encoder to shrink video size
  4. Do more demonstrations using Elementor
  5. Talk about the first 5 pages of the web tutorial and continue discussions about basic HTML and CSS – use Dreamweaver to make a sample web page

Assignments

  1. Put text and image content in your website site

Wednesday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: %?^hYUC1
  3. Continue discussion we started earlier this week about WordPress websites

Assignments

  • Continue to work on your WordPress site

Web Design – week 4

Class

Monday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: A=6HxgQi
  3. Look at and discuss any homepage mockups
  4. Discuss themes people want to use
  5. Show how to install plugins: Elementor, Astra theme, starter templates, show how the Astra WordPress template can be used to import an entire site
  6. Talk about the first 5 page of the web tutorial
  7. Intro to HTML and CSS using Dreamweaver

Assignments

  1. Start working with the theme to figure out how to use it. Start putting text and image content in the site

Wednesday

  1. Join class via Zoom
  2. Video of today’s class, Passcode: xE.$bW8u
  3. Continue discussion we started earlier this week about WordPress websites

Assignments

  • Continue to work on your WordPress site

Web Design – week 3

Class

Monday

  1. Join class via Zoom
  2. Please take a look at this article
  3. Look at and discuss homepage mockups
  4. Introduce WordPress
  5. Show how the Astra WordPress template can be used to import an entire site
  6. Talk about the differences between graphic and web design (static v. dynamic)
  7. Talk about the first 5 page of the web tutorial
  8. Intro to HTML and CSS using Dreamweaver

Assignments

  1. Get your WordPress site up and running and install the theme you want to use
  2. Start working with the theme to figure out how to use it. Start putting text and image content in the site and show us what you’ve done next week

Wednesday

  1. Join class via Zoom
  2. Video of the class, Passcode: $!R1DGQ=
  3. A presentation schedule for this class has been posted here
  4. Look at and discuss homepage mockups
  5. Discuss themes people want to use
  6. Show how to install plugins: Elementor, Astra theme, starter templates, show how the Astra WordPress template can be used to import an entire site
  7. Do a demo of how to take a Marlene’s .jpg into WordPress homepage
  8. If there’s time, we will talk about the first 5 page of the web tutorial

Assignments

  • Continue to work on website layout mockups
  • Begin to explore your WordPress site

Web Design – Week 2

Classroom

Wednesday

    1. Join class via Zoom
    2. Video of today’s class, Passcode: !77r+a%j
    3. Attendance, introductions, and review syllabus
    4. Go over Adobe login
    5. Discuss presentations
    6. Create a Google Drive folder called “DAR256 your name” and share it with me (gjloumeau@pima.edu).
    7. Intro to HTML and CSS using Dreamweaver
    8. Intro to Adobe XD

Beginning

Resources for you to check out on your own time:

Advanced – DAR257

  • Discuss your website project with me – you will be doing self-directed projects

Assignments

Beginning

  1. Do first five pages of this beginning HTML tutorial
  2. Make an Adobe Photoshop or XD mockup of a website homepage

Advanced

    1. Make an Adobe  XD mockup of a website homepage and any other pages you have time to make
    2. Find at least 3 WP themes you would consider using on your site, and be prepared to talk about why you think they would work