web design – Page 3 – Learning Journal

Lisa’s Learning Journal: Week 6

Let’s talk about Flex!

Oh boy. We finally made it to flexbox. For some reason, I never cared for the flexbox layout during AAD85. I thought, “Heck, I can do this whole HTML and CSS thing without it”. I don’t know why I hated flexbox so much. Though, it is most likely because learning flexbox involves change, and change is scary.

What I learned about CSS?

First month of the course has been so exciting and productive on this web development journey. Practicing more semantic HTML has been an eye-opener. Understanding the importance of structuring content in a meaningful way not only makes the code cleaner but also improves accessibility for all users. It’s incredible how a few well-placed tags can make such a big difference.

Lisa’s Learning Journal: Week 4

This is just the beginning.

I’m not sure why, but it’s wild to think that we are already creating functioning websites. I think back to AAD85 quite often and think about how long it took to understand HTML and CSS and what they do. By this time in that class, I believe we were still trying to recognize the differences between IDs and classes. It was definitely a struggle, but I think it’s almost funny now.

AAD-0086 wk4 – Learning Journal

This is a summary of our topics of concentration for weeks three and four in Intermediate Web Design.

Web Design AAD86 – Weeks 3 & 4

These last two weeks have been fun as we’ve started out re-introduction to CSS, which is what allows us to style and design our HTML pages.

From Learning to Experimentation

I can best describe coding as a love/hate relationship for me. I love the details. I hate the details. I resist it because I become laser focused and I can’t step away. But I get to say that it’s such a great feeling to be in this class this semester.

Lisa’s Learning Journal: Week 2

How does HTML work again??

It’s been a while since I last worked with HTML, so I feel a little rusty. I took AAD85 with Natalie Rishe, and I’m so thankful she made us document everything we did in her class. I am able to refer back to a simpler time when I remember what the heck is going on.

Final proposal

As the class is coming to an end the final project for the class, I’m working on right now were going to be developing our own website to a target audience and my audience will be anyone who is interest in the fantasy of the comic book world to see and understand some interesting and some non-interesting characters from the Marvel and DC universe’s. I’m excited to find and create the research for this project it’s something I’m interested in and also watched and read all the movies and comic books.

Parallax: What is it?

Parallax- an interesting name for an interesting design tool! Using parallax in your designs allow for an engaging and interactive experience for users, causing an illusion and offering some great creative design opportunities. Here’s a fun guide of resources to help you explore this world!

ADDING MEDIA QUERIES

This week were learning how to put our websites to fit into mobile devices, tablet, desktop, anything to show to it will look on the screen whether its straight, vertical, and horizontal.

This is the code in adding media queries for websites @media only screen and (min-width:700px){ } then input where it says “700px” and put the size of the website you want people to be viewing and add different styles for each viewing for if its a mobile devices, tablet, or a desktop.

CSS Media Queries for Beginners: Breakpoints, Max-Width, Min-Width, and More – YouTube I was referred to watch this video to get use to media queries and how to properly use them.

Absolute Figma Basics

I tried learning Figma in a couple hours I thought I was doing well until I needed to add another section. Most of the tutorials I found were based on a multiple page website or just one page with one section so after a few hours I figured out how to design the website in figma file. So here is some absolute basic starting things to know:

Templates for beginners

while in class were doing our final rough drafts of the website of our choosing to create about a certain topic, mine is a lawyer website and a tool that helped me use HTML and CSS to create my page and now a helpful tool for me to reference new code or refresh on the basics.

CSS Navigation Bar (w3schools.com)

Here you can look up what you’re trying to create, and it will show you how it should look like in code and in another browser window to show a live code view of how it can look on a website screen.

Responsa What? Understanding Responsive Design

Layouts can be tricky. It feels so nice to finally have a design that looks good and works well… until you take a look at it on a different device. What happened to your design?! How can you fix that? The answer…. Responsive Design! Let’s take a look at what it is and some of the basic things to know surrounding responsive design. Let’s go!

Adobe XD A Lesson In Simplicity

If you have been Adobe products for a little while now you are probably used to a certain set of tools and where to find them across almost all of their applications. Adobe XD pairs down tools to the basics and forces you to rely on your design skills instead of the advanced tools you are used to.

ADOBE XD

Is Adobe XD easy to use for the first time? This week we had to create an outline for our Mid-Term Projects. I was debating whether to use Adobe XD or Illustrator.

WHAT IS CSS?

CSS stands for Cascading Style Sheets its a declarative language and its a great way to organize the content by changing the layout, adding color, and changing fonts.

update on HTML

In class we have been learning the basics of HTML and CSS of assembling it on Dreamweaver. The basic elements of creating the specific code we want as in <header> <p> <a href> <h1> <body> , etc to create and become familiar in the basics of setting up the code for a website. Also learning how to transfer files on an FTP I use FileZilla, to make our sites live has really been exciting. We are also setting up a portal page to link our projects for this semester.

here’s a little video I found that was interesting for typography

Typography: Here’s some things you need to know

Typography is such a critical element in all that we do… and yet, it’s such an overlooked thing in our day and age, when typography is being utilized more than ever. Here are some things you need to know to level up your typography skills and create better designs for the web.

Typography Guidelines For Website Usability

Typography is the detail and the presentation of a story. It represents the voice of an atmosphere, or historical setting of some kind. It can do a lot of things. (Cyrus Highsmith)

How do I do that? Image Optimization in Adobe Photoshop

Optimizing images for the web is an important part of building websites. Poorly optimized images means large files and longer loading times. Here’s how to optimize your image in Adobe Photoshop and insert those images into your HTML code.