I always wondered why people waste their time and energy on just designing for their small websites instead of writing the code directly. But now I understand.
I think that's everyone's thought process. Even when I work with clients, you can see the though of wire framing it out first irritates them, because they want to hit the deadline faster. If you want to go to a whole other level, it's also important to do plan out folder structure, what's going to be in each file, and what's the users journey with sequence diagrams. Every company/client is different, but designing first is super important.
Also more boring, saying that as a UI designer with 10 years of commercial experience. Dev is a lot of fun until you have a well structured design. Then it becomes a boring copy-pasting activity 😅
Just a reminder that design means overall design of website. To many people design means visual design. Design means decode task to semantics which is converted to structured html and css and thus easy to change.
I love that you take the extra time and effort to explain things for those with less experience in certain technical domains - Like how you explain concretely what you mean by CSS and code editor. As a software engineer, I wish other educational content would do the same for the programming rabbit holes I fall into while debugging. Too many assumptions about their audience are made by educators
This blew my mind, it's 3am, I got tired from a personal project here but after watching, I look foward to just send my current files to the bin and go to figma and start it over, and right (maybe?). Thanks for making myself want to fail again by driving my to believe I can learn from it, like u said you did. Great work, editing and direction on the video, congrats! ❤
Never felt so rewarded for sticking around till the end of a video. Mans felt like an Avenger at 10:55 Thank you, Sajid. You are clearly a super-Saiyan-tier of codurr
You're my go-to guide when building a website from scratch now. I love your straight-to-the-point, UX-focused approach on these, and would love to see other videos diving deeper into each one of these steps. Keep up the great work!
Should be mandatory to watch. Nowadays I hardly touch a computer when building the structure of a website and its pages, just pen, paper and sticky notes. Here are my two cents: - If you create wireframes keep it simple: just focus on what section goes on what page, on each section write down the purpose and if there's a cta or link provide that as well. Something like "hero title" with description "in the homepage hero section we will have the main value proposition followed by a main call to action button towards page so and so" followed by "button". That's it, you are only structuring your website and its pages, so focus on it. No need to add images, colums, sliders, etc to the sections because if you show it to the client they often get confused and think it's already the design. - Do you really need that fancy animation, goofy slider and sparkling glitter following your mouse cursor or are you just trying to show off? That's right, keep it simple and if it doesn't add value get rid of it.
Full stack dev here of 15 years. Really enjoyed your video, you've put down in a short clip lessons I've learned the hard way or now intuitively follow without really thinking about why.
Possibly the best video I have watched recently regarding Website development and design. A real reason to stop and try and approach it differently and better. Thank you needed this :)
Your video is phenomenal. I have been watching coding videos forever, and yet this was still such a fresh perspective. with world class quality. You are the best!
Just watched your two most recent videos. I’m in awe at how it explains things which I didn’t know how I wanted them to be explained. The topics and level of technicality is just right. Thank you for these! I’m really excited to see what I can get out of them! 😃
While writing code I was always thinking what if I had something like blueprint of what I want to build? Then I see the power of planning before writing code, it is timetaking but worth it, because coding is easy but solving problem is hard. This video is just introduction to website-building guideline, but it is wonderful and powerful. Sajid, if possible make video on you use the approach to build website of your clients, and discuss other approaches as well.
Loving these videos, man! Keep them up. I like how direct and straightforward they are. I do suggest do be a little more enthusiastic with the way you speak but that's just me.
Me too. I want to learn Front development but I decided to begin with a solid course on UX/UI to save money, time, and increase efficiency. And to also rapidly test new ideas.
A man in the hot desert truly values drops of water highly. I am in the same situation. I just woke up one day and started building a portfolio website without any plan, and now I am stuck somewhere. Finally I had to abandon this and that and go thru a lot of stress to make things work. I really felt like I made a mistake not to plan... Oh God, I wish I watched this video long before... Thank you for the amazing content... ♥
What an absolutely fire 🔥 video. From start to finish you gave A1 advice. After building some short projects I’ve found out that when you design first, before jumping right in, when it comes time to code you are able to explore new avenues and create experiences uniquely tailored for a specific goal and/or meet client’s needs. Simply put, you begin to have fun discovering something new in your skills set, while achieving the primary goal, and much faster. Thanks for the awesome tips at the end as well. Each tip you’ll commonly find on professional websites, liked and subbed. 💪🏾
It's a bit strange saying "WordPress" to describe no code editors, considering most professional WordPress developers will build their websites/themes with code, and WordPress is a whole CMS not just a no code editor
Good point. But generally people use WordPress as a no code/low code tool. But yeah. It's a whole CMS, not just a no code editor. Anyway the video is not about WordPress or no code tools.
just a correction. WordPress can be used as No code, but also you can use it as a coding framework, and believe me is amazing! You can also build Restful APIs by writing code inside your own theme or plugin. Belive me I was a hater since I ve learned to code for WordPress. So WordPress applies to both categories. For the rest, I totally agree with you!!!!!
I am a recent web developer grad. I love your intake and view. I always have hard time to designing and trying to attract users engagement. Your video helped me alot. Please dont stop making videos, this video is a pure gem thank you. I find front-end much harder than backend honestly 😂😂. Your artistic view and experience is really valuable for me. My Only criticism i could give only for video ascpet is give more pause time for us when you going through slides, kinda annoying to pause at exact time to see where in css or html code you pointing at, beside that i love the flow, visual aspect and straight to the point. Thank you for publishing and making this video
I’m trying to be a ui/ux engineer( fancy term for a person who does design + code + graphic design, it is position im most tech companies in my country) I was stuck in tutorial hell. Your videos showed me a way. Just do it. Thank you
I thought it was a million views video til I noticed the actual views Such a high quality and well made content, no bs, no stupid music bg Just straight to the point answering questions, keep the content up!
I spent years learning front-end design, but I always ended up quitting. Why? because I always felt the frustration of not being able to design, always felt like I lack creativity and that is what made me stop HTML and CSS. But after watching this video, I certainly know the way forward and will actually implement it. thanks💯
Now I know what I lack when creating a website, I always stuck at a scenario where I don't have any Idea on what I would create or don't know where to start
![[柴犬ASMR]曼玉Manyu&小白Bai 毛发护理Spa asmr](http://i.ytimg.com/vi/0TsXQ7z2Dh4/mqdefault.jpg)
I always wondered why people waste their time and energy on just designing for their small websites instead of writing the code directly. But now I understand.
Plus, adjusting things is easier in design phase. You don't have to re-write a lot of code to make few layout or design changes.
@@whosajid Thanks for letting me know that too!
@@mshl114 My pleasure
So that you'll not end up wasting time to rewrite code if the design you're thinking is not aligning to the one you've visioned.
I think that's everyone's thought process. Even when I work with clients, you can see the though of wire framing it out first irritates them, because they want to hit the deadline faster. If you want to go to a whole other level, it's also important to do plan out folder structure, what's going to be in each file, and what's the users journey with sequence diagrams. Every company/client is different, but designing first is super important.
Bro this is gold. No fluff, just straight to the point. Thank you sir.
Glad it was helpful.
yes
I can’t stress that enough. The design part is the most important part. It makes the coding part so much simpler.
Should've told me this 2weeks ago
Found out in the hard way 🤣
Also more boring, saying that as a UI designer with 10 years of commercial experience. Dev is a lot of fun until you have a well structured design. Then it becomes a boring copy-pasting activity 😅
Just a reminder that design means overall design of website. To many people design means visual design. Design means decode task to semantics which is converted to structured html and css and thus easy to change.
UA-cam algo ahs blessed me again. The design approach is a game changer.
Yeah, it really is.
Infact the best video on UA-cam. You planned and designed this video well that's why you attracted me quick. You earned yourself a subscriber bro
The snap scrolling and scale really did "THE THING" for me.
ly brother, u earned urself a sub.
Happy to hear that. lyt bro
I teach engineering design in college. Wish all my students saw this before the semester! Nice job.
Make it the first assignment on week 0 to watch this video 👀
no music needed, pure gold information. u deserve my subs
I love that you take the extra time and effort to explain things for those with less experience in certain technical domains - Like how you explain concretely what you mean by CSS and code editor. As a software engineer, I wish other educational content would do the same for the programming rabbit holes I fall into while debugging. Too many assumptions about their audience are made by educators
This blew my mind, it's 3am, I got tired from a personal project here but after watching, I look foward to just send my current files to the bin and go to figma and start it over, and right (maybe?).
Thanks for making myself want to fail again by driving my to believe I can learn from it, like u said you did.
Great work, editing and direction on the video, congrats! ❤
You can do it ❤️
the scroll snapping and scale I didn’t know! Excellent tips.
I have this gut feeling that this channel is gonna 3xpl0de in terms of viewers. Quality content brother.
Never felt so rewarded for sticking around till the end of a video. Mans felt like an Avenger at 10:55
Thank you, Sajid. You are clearly a super-Saiyan-tier of codurr
This was a crash course in 10 mins. I got a lot from this! Thank you so much.
This is my last bus stop. Masterclass content.
Thank you
Sajid
Thanks for writing such a nice comment. I am glad the video was helpful.
You're my go-to guide when building a website from scratch now. I love your straight-to-the-point, UX-focused approach on these, and would love to see other videos diving deeper into each one of these steps. Keep up the great work!
Yeah, I am thinking of diving deeper. Longer and more useful videos.
Should be mandatory to watch. Nowadays I hardly touch a computer when building the structure of a website and its pages, just pen, paper and sticky notes. Here are my two cents:
- If you create wireframes keep it simple: just focus on what section goes on what page, on each section write down the purpose and if there's a cta or link provide that as well. Something like "hero title" with description "in the homepage hero section we will have the main value proposition followed by a main call to action button towards page so and so" followed by "button". That's it, you are only structuring your website and its pages, so focus on it. No need to add images, colums, sliders, etc to the sections because if you show it to the client they often get confused and think it's already the design.
- Do you really need that fancy animation, goofy slider and sparkling glitter following your mouse cursor or are you just trying to show off? That's right, keep it simple and if it doesn't add value get rid of it.
Full stack dev here of 15 years. Really enjoyed your video, you've put down in a short clip lessons I've learned the hard way or now intuitively follow without really thinking about why.
Possibly the best video I have watched recently regarding Website development and design. A real reason to stop and try and approach it differently and better. Thank you needed this :)
Best video I’ve seen this year. Straight to the point.
One of the best videos on this topic I have seen in a LOOONG time. Thanks for posting!
Your video is phenomenal. I have been watching coding videos forever, and yet this was still such a fresh perspective. with world class quality. You are the best!
your videos are so simple, straight forward, knowledgable i like it alot please keep going!
For font sizes I use clamp, it’s basically min and max put together with one more parameter in the middle to be the “preferred” size :)
yep 😎
Your input is straight to the point. I love this kind of content since im also into web dev. You got a new subscriber. Keep it up
Such a great content I have ever seen in single video.
Just watched your two most recent videos. I’m in awe at how it explains things which I didn’t know how I wanted them to be explained. The topics and level of technicality is just right. Thank you for these! I’m really excited to see what I can get out of them! 😃
I am glad the videos were helpful.
Dude I love your channel. Straight to the point and doesn't go into technical details 👍👍👍.
'If I have an hour to solve a problem, I'll spent 55 minutes thinking, and 5 minutes thinking about the solution'
- Albert Einstein
Amazing content, nice sense of humor editing. Liked and subed without a second thought!
SO thankful to youtube algo to show ur vid in suggestions today!! Thanks !!
While writing code I was always thinking what if I had something like blueprint of what I want to build?
Then I see the power of planning before writing code, it is timetaking but worth it, because coding is easy but solving problem is hard.
This video is just introduction to website-building guideline, but it is wonderful and powerful.
Sajid, if possible make video on you use the approach to build website of your clients, and discuss other approaches as well.
Noted. Will work on it.
Wow this is the best! no story telling straigth to the point! thank you so much!
Loving these videos, man! Keep them up. I like how direct and straightforward they are. I do suggest do be a little more enthusiastic with the way you speak but that's just me.
this dude is LEGIT I actually went through this myself and got into this conclusion my guy knows wassup. I completely agree with him
Wait your content is really good wtf.. really appreciated the tips part at last.. love the pure and straight forward content man.. keep it up fr.. ❤
Your comment is really good. Really appreciate it. Keep them coming...
This channel is going to be big, deserved. Awesome content.
Bro your content is so helpful and unique. Keep it up. I'm so glad I found your channel right on time.
Couldn’t imagine jumping into code right away without at least a quick mockup in Figma
Me too. I want to learn Front development but I decided to begin with a solid course on UX/UI to save money, time, and increase efficiency. And to also rapidly test new ideas.
I really like that way of your explanation, you put it all simple ❤
One of the best video I have witnessed.. Thanks bro 😮
A man in the hot desert truly values drops of water highly. I am in the same situation. I just woke up one day and started building a portfolio website without any plan, and now I am stuck somewhere. Finally I had to abandon this and that and go thru a lot of stress to make things work. I really felt like I made a mistake not to plan...
Oh God, I wish I watched this video long before...
Thank you for the amazing content...
♥
Thanks, this was very helpful. I'm halfway into my programming journey, and I've been wondering about design elements. Subscribed
Damn man, this video is pure gold for people who are begginers like me.
Just with the tips trcks at the end of the video you saved my life.
Man, you’re really being a big help🔥✨
Short n crisp, LOVED it thanks. Now im more motivated to make a website.
One of the best web dev videos on UA-cam
Nahhh this might be the best web development video I've ever seen omg
Instant subscribe
the most awaited video for me , it solved my core problem just like u said , design and having a clear plan of what we builiding is important .
Underrated UA-cam channel, you made me realized my mistakes. Thank you. You earned a subscriber.
Wow, thanks
What an absolutely fire 🔥 video. From start to finish you gave A1 advice.
After building some short projects I’ve found out that when you design first, before jumping right in, when it comes time to code you are able to explore new avenues and create experiences uniquely tailored for a specific goal and/or meet client’s needs.
Simply put, you begin to have fun discovering something new in your skills set, while achieving the primary goal, and much faster.
Thanks for the awesome tips at the end as well. Each tip you’ll commonly find on professional websites, liked and subbed. 💪🏾
You got it 💪
It's a bit strange saying "WordPress" to describe no code editors, considering most professional WordPress developers will build their websites/themes with code, and WordPress is a whole CMS not just a no code editor
Good point. But generally people use WordPress as a no code/low code tool.
But yeah. It's a whole CMS, not just a no code editor.
Anyway the video is not about WordPress or no code tools.
Great stuff man! I used to start coding directly. The website turned out ok but not great. And it took a very long time to build.
This is actually such a good video bro. Thank you so much.
Straight to the point 🎯
Subbed! Never expected such a content quality from a new channel 👏
Glad you enjoy it!
In my experience in coding, it is better to build the user interface first and then code the functionality behind that interface.
This is so well done.
Sajid, going good bro. I have experience in this field for 7 years. I love your explanation. It's up to the mark ❣️
Awesome video. It applies to newbies and pros🎉
You've earned a sub!
Don't you think my career seems 50 times easier now?
This is soooo necessary. Great job
It was very much informative. Hard to imagine this is for free. Thanks for the valuable information
Thank you for these great lessons
This feels like youtube premium content. Subscribed.
Thank you for making it quite clear I need to design first.
Good knowing this in the beginning of my web journey.
just a correction. WordPress can be used as No code, but also you can use it as a coding framework, and believe me is amazing! You can also build Restful APIs by writing code inside your own theme or plugin. Belive me I was a hater since I ve learned to code for WordPress. So WordPress applies to both categories. For the rest, I totally agree with you!!!!!
One of the best videos about website design I ever watch.👍
I am a recent web developer grad. I love your intake and view. I always have hard time to designing and trying to attract users engagement. Your video helped me alot. Please dont stop making videos, this video is a pure gem thank you. I find front-end much harder than backend honestly 😂😂. Your artistic view and experience is really valuable for me. My Only criticism i could give only for video ascpet is give more pause time for us when you going through slides, kinda annoying to pause at exact time to see where in css or html code you pointing at, beside that i love the flow, visual aspect and straight to the point. Thank you for publishing and making this video
Yeah, Still working out the pacing. Will improve by time.
Top notch content! Need more like this.
This was very useful man. Thanks. Appreciate your work.
This is super, freaking, insane helpful. Thanks you. Im watching this for the third time 🎉
I’m trying to be a ui/ux engineer( fancy term for a person who does design + code + graphic design, it is position im most tech companies in my country) I was stuck in tutorial hell. Your videos showed me a way. Just do it. Thank you
Brilliant video. Thank you so much for sharing your wisdom Sajid.
dayummm. so good straight to the point.
sweet. thanks for making it quick
I’m saving this for everyday reference. Thanks man 🎉
Glad it helped
I thought it was a million views video til I noticed the actual views
Such a high quality and well made content, no bs, no stupid music bg
Just straight to the point answering questions, keep the content up!
So glad to hear that. The quality will only go up from here.
Im glad to start my web developing career with your guides!
Thankyou bro i have 7 years of experience but still your content is valuable for me
Damn…
Thank you for sharing all of these mate❤️
Great content. Thank you so much.
God bless you for dumbing this down for everyone to understand, and for including the chapters 👏
The chapters are auto generated. But Thanks:)
I spent years learning front-end design, but I always ended up quitting. Why? because I always felt the frustration of not being able to design, always felt like I lack creativity and that is what made me stop HTML and CSS.
But after watching this video, I certainly know the way forward and will actually implement it. thanks💯
Bro you are a LEGEND!
The only quality content a developer wanted 🔥
man amazingly impressive !
Great video, thank you for taking the time to make this video. Subscribed!
Minimalist and intelligent explanation!
Thank you I needed this.
great helpful video. this one got up a new sub. thank you very much! 🙏
Now I know what I lack when creating a website, I always stuck at a scenario where I don't have any Idea on what I would create or don't know where to start
This video is so rich 🎉🎉🎉🎉🎉🎉 bro you are a professor and you have just won a subscriber,
this channel has a big future 💜
I didn't know you can use CSS that way. Thank you so much!
Simple, easy, effective and all of this is wrap in less than 11 min. Thx bro
Glad to hear that
So great, to the point, excellent!!! I agreed with all that you said!!!
you make me mindblow if building a website is shit simple if you know how to do that, like what you explained, thanks dude❤
Great advice man i thought you had like a 100k subs i was suprised to see only 743 subs.The video was so well made and very informative.
I appreciate that!
What a great video. Simple. Concise. Useful. 🙏
Beautifully put together 👏