figma or adobe xd…

which do you prefer? Figma or Adobe XD?

I learned to love using Figma to do my design. At first I found it hard and as I keep using it it became easy and so much fun for me. The tools are very few and quick. Really you won’t find any unnecessary tools.

Sharing and exporting your work is also an easy task on Figma. Seriously this design and prototype app is just fun to use.

I have also tried the Adobe XD and to be honest I got frustrated exploring the app. It was difficult (for me) to start and what to do next. I don’t know if it was really just a little bit more complex to use than figma or maybe I just was not interested to learn it because I already have my heart set on using the other app I am comfortable using.

Grid talk…

-” to make an HTML element behave a grid container…”

As super easy as I find Float, I feel the opposite about positioning and a little bit about grid. Float is easy and short. Grid is a little longer than that and I feel like there is a bit much math included (I’m not really good with numbers).

GRID is a little hard and it’s taking me a little bit to understand but it is fun to learn and mess around with. I guess it’s just a matter of getting used to using it right? The more you practice the better you get.

Grid can totally replace floats and positioning. Grid layouts makes it easier to design web pages with rows and columns.

https://www.w3schools.com/css/css_grid.asp

Grid Container…

– “To make an HTML element behave as a grid container, you have to set the display property to grid or inline-grid.Grid containers consist of grid items, placed inside columns and rows.”

https://www.w3schools.com/css/css_grid_container.asp

Styling Images

https://www.w3schools.com/css/css3_images.asp

I’m sure everyone knows about styling images with CSS. I would still like to post a little something about it and a quick link to it. I know optimizing image is always ideal. My curiosity tho is, will it be ok to contain an image using CSS without optimizing it? I think it is possible, but even if we can style an image- a huge, unoptimized image (obviously that’ll also be a huge file size) into a thumbnail size image, if the file size is still huge it will take a long time for it to load in the browser. And maybe if we style it to be bigger than its original size it will stretch and pixilate. The image quality will be low.

let’s float a little…

It’s been a while since I last messed around with CSS and I have to say that it still gives me the same feeling. I still get excited and giddy relearning and learning new things about it.

The past few days I have been just digging around the internet and reading some articles and posts and tutorials about CSS. How to write them properly and what each terms are for. I have read things about flexbox, which if I remember correctly I actually had a hard time understanding.

My favorite was reading and learning more about float. I know we are not discussing both flexbox and float until next week but I went ahead and read and played with it styling my content.

https://www.w3schools.com/css/css_float.asp

Mostly I just stayed with W3Schools website. I saw a few posts, practices and try it yourself kind of thing from a few different websites.

Using inline-block to create nav links…

One of the common use for inline block is to align list items horizontally instead of vertically. I found this very useful to as I was trying to have my list content appear horizontally. It was a bit tricky for me tho because the letters ended up overlapping each other but I think I fixed it.

margin tricks…

I’m following this guy on youtube and watched a few of his videos. Some of his videos include styling with a timer and honestly it was nerve wracking (atleast for me) to watch. I have yet to watch this video but I’ll post it here now, maybe some of you will find it interesting too…