PSD to HTML conversion

Hello I would like a lot of help to this…
Could you help me?
I have a psd and I need to convert it . I would like to learn how to do it

Hello! Welcome to the community :partying_face:!

You want to automatically convert it? If so, search online for tools that can do that. Keep in mind that these tools usually don’t work as the designer expects to (you’ll see).

If you want to develop the website, then you need to learn HTML, CSS and, possibly, JavaScript. You can start here: https://www.freecodecamp.org/learn/responsive-web-design/basic-html-and-html5/.

1 Like

Hello I know html, css, js… just want to help me with the skeleton… for example could you help me with the header if I show you the image… how you would do it with code?
Its the login button that confuses me

Στις Πέμ, 29 Οκτ 2020, 6:58 μ.μ. ο χρήστης Nicolas Mancilla via The freeCodeCamp Forum <freecodecamp@discoursemail.com> έγραψε:

Oh, I see!

I can help with that, show me what you’re required to do.

Well I need to convert this (see image: testaki.jpg)

I uploaded the zip file to see what I have done (https://drive.google.com/file/d/1KpncPKEhBzmUxSJDJ-U7PcwerekxsZXZ/view?usp=sharing).

  1. First of all, I need to place the login button next to menu

  2. I need to set the header as fixed (I have tried many ways and I can not manage to do it)

  3. I have used slick slider (this slider I have to use) and I do not know how to make it responsive

1 & 2 are more important!

Do you also have any instant messenger?

  1. There are many ways to accomplish that, but I would go with flex. Take a look at this tutorial: https://www.freecodecamp.org/news/flexbox-the-ultimate-css-flex-cheatsheet/
  2. You just need to set the header to fixed and add a top and left of 0.
  3. The slick demo shows you how to accomplish that: https://kenwheeler.github.io/slick/. There’s one specific demo for responsiveness.