#how to learn html and css for beginners
Explore tagged Tumblr posts
Text
Learn HTML and CSS: A Comprehensive Guide for Beginners
Introduction to HTML and CSS
HTML (HyperText Markup Language) and CSS (Cascading Style Sheets) are the core technologies for creating web pages. HTML provides the structure of the page, while CSS defines its style and layout. This guide aims to equip beginners with the essential knowledge to start building and designing web pages.
Why Learn HTML and CSS?
HTML and CSS are fundamental skills for web development. Whether you're looking to create personal websites, start a career in web development, or enhance your current skill set, understanding these technologies is crucial. They form the basis for more advanced languages and frameworks like JavaScript, React, and Angular.
Getting Started with HTML and CSS
To get started, you need a text editor and a web browser. Popular text editors include Visual Studio Code, Sublime Text, and Atom. Browsers like Google Chrome, Firefox, and Safari are excellent for viewing and testing your web pages.
Basic HTML Structure
HTML documents have a basic structure composed of various elements and tags. Here’s a simple example:
html
Copy code
<!DOCTYPE html>
<html>
<head>
<title>My First Web Page</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<h1>Welcome to My Web Page</h1>
<p>This is a paragraph of text on my web page.</p>
</body>
</html>
: Declares the document type and HTML version.
: The root element of an HTML page.
: Contains meta-information about the document.
: Connects the HTML to an external CSS file.
: Contains the content of the web page.
Essential HTML Tags
HTML uses various tags to define different parts of a web page:
to : Headings of different levels.
: Paragraph of text.
: Anchor tag for hyperlinks.
: Embeds images.
: Defines divisions or sections.
: Inline container for text.
Creating Your First HTML Page
Follow these steps to create a simple HTML page:
Open your text editor.
Write the basic HTML structure as shown above.
Add a heading with the tag.
Add a paragraph with the tag.
Save the file with a .html extension (e.g., index.html).
Open the file in your web browser to view your web page.
Introduction to CSS
CSS is used to style and layout HTML elements. It can be included within the HTML file using the <style> tag or in a separate .css file linked with the <link> tag.
Basic CSS Syntax
CSS consists of selectors and declarations. Here’s an example:
css
Copy code
h1 {
color: blue;
font-size: 24px;
}
Selector (h1): Specifies the HTML element to be styled.
Declaration Block: Contains one or more declarations, each consisting of a property and a value.
Styling HTML with CSS
To style your HTML elements, you can use different selectors:
Element Selector: Styles all instances of an element.
Class Selector: Styles elements with a specific class.
ID Selector: Styles a single element with a specific ID.
Example:
html
Copy code
<!DOCTYPE html>
<html>
<head>
<title>Styled Page</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<h1 class="main-heading">Hello, World!</h1>
<p id="intro">This is an introduction paragraph.</p>
</body>
</html>
In the styles.css file:
css
Copy code
.main-heading {
color: green;
text-align: center;
}
#intro {
font-size: 18px;
color: grey;
}
CSS Layout Techniques
CSS provides several layout techniques to design complex web pages:
Box Model: Defines the structure of an element’s content, padding, border, and margin.
Flexbox: A layout model for arranging items within a container, making it easier to design flexible responsive layouts.
Grid Layout: A two-dimensional layout system for more complex layouts.
Example of Flexbox:
css
Copy code
.container {
display: flex;
justify-content: space-around;
}
.item {
width: 100px;
height: 100px;
background-color: lightblue;
}
Best Practices for Writing HTML and CSS
Semantic HTML: Use HTML tags that describe their meaning clearly (e.g., , , ).
Clean Code: Indent nested elements and use comments for better readability.
Validation: Use tools like the W3C Markup Validation Service to ensure your HTML and CSS are error-free and standards-compliant.
Accessibility: Make sure your website is accessible to all users, including those with disabilities, by using proper HTML tags and attributes.
Free Resources to Learn HTML and CSS
W3Schools: Comprehensive tutorials and references.
MDN Web Docs: Detailed documentation and guides for HTML, CSS, and JavaScript.
Codecademy: Interactive courses on web development.
FreeCodeCamp: Extensive curriculum covering HTML, CSS, and more.
Khan Academy: Lessons on computer programming and web development.
FAQs about Learning HTML and CSS
Q: What is HTML and CSS? A: HTML (HyperText Markup Language) structures web pages, while CSS (Cascading Style Sheets) styles and layouts the web pages.
Q: Why should I learn HTML and CSS? A: Learning HTML and CSS is essential for creating websites, understanding web development frameworks, and progressing to more advanced programming languages.
Q: Do I need prior experience to learn HTML and CSS? A: No prior experience is required. HTML and CSS are beginner-friendly and easy to learn.
Q: How long does it take to learn HTML and CSS? A: The time varies depending on your learning pace. With consistent practice, you can grasp the basics in a few weeks.
Q: Can I create a website using only HTML and CSS? A: Yes, you can create a basic website. For more complex functionality, you'll need to learn JavaScript.
Q: What tools do I need to start learning HTML and CSS? A: You need a text editor (e.g., Visual Studio Code, Sublime Text) and a web browser (e.g., Google Chrome, Firefox).
Q: Are there free resources available to learn HTML and CSS? A: Yes, there are many free resources available online, including W3Schools, MDN Web Docs, Codecademy, FreeCodeCamp, and Khan Academy.
#how to learn html and css#html & css course#html & css tutorial#html and css#html course#html css tutorial#html learn#html learn website#learn html#learn html and css#html and css course#html and css full course#html and css online course#how to learn html and css for beginners
3 notes
·
View notes
Text
i need to learn 3d modelling so that more than anything my power to mod persona 4 golden can grow
#rambles#modding#the thing is i'm SO BAD at following tutorials#i've always learned better by doing my own thing. messing around with whatever tool it is until it works#but that isn't really something i can do with 3d modelling.#or at least it's not something i can do at a total beginner level. i imagine it'll be kinda like how i learned coding#(did a couple free online classes and once i learned the very basics/got bored i just did my own thing)#but i started THAT when i was like 14. i wanna be as good at blender as i am with html/css NOW!!!!!!#<- is not even that good w html#<- because of the aforementioned ''hates taking classes on this kind of thing'' thing
3 notes
·
View notes
Text
felt like i was going crazy yesterday trying to set up a login system for this website 😭 it was like i was back in college again!
#im using supabase for auth and i was like someone pls...show me how to do this...with just vanilla js#every tutorial is with like react or next#im trying to do this site with just html css and js (and php)#so i can learn#and later if i wanna move things to a framework i wont be completely lost if something breaks!#but yea i pretty much settled on like using react for part of the website so i can get this login set up#i found some videos and articles so im pretty sure its possible#other options is to use the archived js example i finally found for supabase auth but#it scares me that its archived#fingers crossed next time i code this works#i think this has to be the hardest part of the coding#i wish i could do my own auth thing but thats super dangerous as a beginner#anyways if i get stuck again ill just try the archived js example#and if im still stuck...#idk find another auth thing to use ig#BF RALLY WILL HAPPEN IT WILL#if it doesnt it means i died or someshit lol#but yea im mainly just like ugh about react cause i seriously dont need all those libraries added rn#this sites not supposed to be that complicated imo like yea its dynamic but its like a neopets like thing#the partial react thing doesnt rely on installing a bunch of stuff (i think)#so maybe we r good#????#web development#webdev#coding#codebreakers#if someone has the magic video to hand hold me through these pls send lol
2 notes
·
View notes
Text
Free Secure Web Hosting for Students or Individuals for Learning Purposes
दोस्त आज मैं आपको बहोत ही खास जानकारी देना चाहता हूँ जो शायद अभी तक आपको इसके बारे में पता नहीं होगा और इसीलिए आप इस आर्टिकल में आये है, अगर आपके पास होस्टिंग और डोमेन खरीदने के पैसे नहीं हैं, तो घबराने की जरूरत नहीं है। आज के इस आर्टिकल में मैं आपको बताऊंगा कि कैसे आप Free Resources का इस्तेमाल करके ब्लॉगिंग, वेबसाइट डिजाइनिंग, और वेब डेवेलपमेंट जैसी Skills को बिना पैसे खर्च किए सीख सकते…
#best free hosting#best free hosting providers#blogging for beginners#blogging tips in Hindi#educational hosting#free domain#free domain for students#free hosting for students#free hosting resources#free web hosting#free web hosting and domain#free web hosting css#free web hosting for students#free web hosting html#free web hosting javascipt#free web hosting with cpanel#free website hosting for education#free wordpress hosting#google free website hosting#how to start blogging without money#learn web development#lifetime free web hosting#website designing free#wordpress free hosting
1 note
·
View note
Text
YOU MUST MAKE A WEBSITE
Oh wow, look at that! YET ANOTHER post urging you to make a webbed site! What a completely new thing that people haven't made a thousand masterposts for already!!
• Making a website might look scary. It is Not.
At first, I too thought making a website was too much work. It really isn't! It turns out that all you need is
an HTML file,
a web hosting service and
w3schools tutorials,
and that's about it!
This post will point you towards these resources, and others I found useful while figuring out how to make a website.
• VERY QUICK EXPLANATIONS:
What's HTML and CSS?
HTML is the content of your webpage, the skeleton of it. What shows up in a webpage is what's written in the HTML file!
CSS is the way the HTML is styled; the colour of the background and the letters, the size of elements, the font, all that!
Do I absolutely NEED JavaScript for a website?
Not at all! You don't need to worry about learning it before getting started.
• What do I make a website for? What do I put in there?
ANYTHING AND ALMOST EVERYTHING. Here's some ideas for pages from a post of mine were I was very normal about websites:
You can make a page that's only pictures of your pets.
You can make an interactive adventure.
You can make your own academic blog full of your own essays or articles.
You can just post a ton of art or make a full music page.
You can make a blog and infodump eternally, give book reccs and reviews. You can host a thousand virtual pets and nothing else.
Upload entire books in a single html file. Make a wikipedia for your ocs. Make a fake site for a random fictional place (restaurant, hotel, whatever). You can make a thousand fanpages/shrines about your favorite media. You can upload your own webcomic and make it all like a fancy website and shit.
I could keep going but, for the sake of "brevity", I won't.
• WEBSITE EXAMPLES!
If I started listing the websites I know, this post would be bottomless. Here's only seven:
https://publictransit.neocities.org/ - A webbed site, for sure
https://ribo.zone/ - A personal site
https://leusyth.neocities.org/ - An art archive
https://solaria.neocities.org/ - Personal website with A Lot of stuff (it'll come up in a bit, because it offers web making resources)
https://hog.neocities.org/ - The Hogsite
https://thegardenofmadeline.neocities.org/ - Another personal site! It also has a web resources page and has made another masterpost like this one (but better)
https://spiders.neocities.org/ - My own website, which must be weird to see in mobile . sorry
• You've convinced me. I want a webbed site. Where do I start?
https://neocities.org/
FIRST OF ALL: Neocities. It is a free web hosting service, and it's the one I and the sites I linked use!
When I first started, my website was a black page with red letters and a drawing, and nothing else! It was like that for a month, till i started picking up on how to do things.
Here's what helped me get an idea of how to make things work:
https://sadgrl.online/learn/articles/beginners-guide-neocities
An absolute beginners guide to neocities -- while when you make an account there you get a tutorial page from the site, this one's extra support for that.
https://www.w3schools.com/
Learn HTML, CSS, JavaScript and MANY other coding things for free. All the tutorial/reference pages have live testing windows for you to mess with!! helped me a LOT while figuring this stuff out!
https://htmlcheatsheet.com/
https://htmlcheatsheet.com/css/
Cheatsheets for HTML and CSS, respectively. It includes a JavaScript one too!
https://sadgrl.online/webmastery/
Sadgrl's webmastery resources! Also includes the next resource listed here:
https://sadgrl.online/projects/layout-builder/
Sadgrl's layout builder; not a lot of customization at a first glance, but I've seen wildly different websites all using it as a base, plus it works using CSS Flexbox, so it generates a responsive layout!
(basically, a responsive layout is one that translates well in different sized screens)
https://www.tumblr.com/fysa/728086939730919424/wikitable-code?source=share
Tumblr user fysa made this layout imitating a wiki page!
https://brackets.io/
At some point, you might want to do things outside the Neocities code editor and get one outside the site. I recommend Brackets, because my old as fuck computer can run that and absolutely nothing else apparently, and it works wonderfully! Though I recommend either turning off the code autocomplete or using it after a good while of already using the Neocities code editor, so you get used to coding on your own.
http://www.unit-conversion.info/texttools/text-to-html/
Turn your text into HTML code! i use this kind of pages for my lengthy blog entries that I don't feel like formatting myself.
https://imagecompressor.com/
COMPRESS YOUR IMAGES.
The heavier an image is, the more your site weighs and the more time your page will spend loading. You don't want that, specially if your site is heavy on graphics. This might help!
https://solaria.neocities.org/guides
Some CSS, JavaScript and Accessibility guides! Worth checking out!
https://eloquentjavascript.net/
This is a free, interactive book for learning JavaScript! NOTE: It is very intuitive, but JavaScript is HARD!! I still haven't learned much of it, and my website does fine without so don't worry if you end up not doing much with it. It's still useful + the exercises are fun.
And now, accessories!
• Silly stuff for your page :]
https://gifypet.neocities.org/
Make a virtual pet, copy the code and paste it in your HTML file! You'll get a little guy in your webbed site :]
https://www.wikplayer.com/
Music player for your website!
http://www.mf2fm.com/rv/
JavaScript silly effects for your site :]
https://blinkies.neocities.org/geoblinkies
Blinkie search engine!
https://www.cbox.ws/
Add a chatbox to your site!!
https://momg.neocities.org/
Infinite gallery of gifs. i've spent hours in there looking at moving pictures and out of them all, the ONLY gif i actually ended up using on my site was a rotating tomato slice. it is still there. trapped.
https://wrender.neocities.org/tarotinstructions
A widget that gives you a random tarot card!
https://www.websudoku.com/widget.php
Sudoku widget!
That's about it for now! I don't know how to end this!!! Remember to have fun and google everything you don't know :]
620 notes
·
View notes
Note
how did you learn to code IF? i really want to learn how to code twine games, i've used choicescript before but everything i have found about twine/sugarcube is so confusing and i don't know where to start. any tutorial recs or general advice would be so so amazing :)
Hi! I’m a big fan of Twine, which offers several story formats. I’ve found Sugarcube to be the most robust and extensive, but it’s also the most difficult to learn. I started on Twine Chapbook and I recommend it for beginners; it’s more limiting but easier to learn. Viatica is built in Chapbook if you’re curious how it looks.
Benefits to Chapbook:
It’s a complete, out-of-the-box format that requires no previous HTML or CSS knowledge. You don’t ever have to touch the style sheet like you do Sugarcube.
Chapbook is designed to be used on a variety of devices, especially mobile ones. It uses responsive design to adapt its page layout so that it's readable on any type of device without having to zoom in or scroll unnecessarily. Again, it’s already done for you.
There’s a single, easy to follow, comprehensive guide that tells you everything you need to know.
However, Chapbook doesn’t allow for a sidebar with characters stats, a codex, or multiple save slots. If you want those I’d recommend learning Sugarcube. There’s several guides and templates out there. The ones I found most helpful I have linked on my itch page.
I hope that helps! Good luck!
72 notes
·
View notes
Note
how did you make your own website? & how long did it take you to make it? i am interested in web dev,,, do you have any tips or any helpful sites for beginners/ intermediate? (sorry for asking so many questions!)
hey no problem, asking is a great way to learn always!!
i started on my portfolio site i think around september 2022, forgot about it because of work, then went back to it and deployed it around march 2023! i learned a lot at work, so i just applied what i learned from working in web dev to my own personal site
regarding how to start, if you're a complete beginner, i'd suggest playing around with HTML/CSS first since it's kind of the basic building blocks for doing frontend stuff -- for the first few projects you could try copying simple sites like Google's home page :) there are little interactive tutorials you can find online too like flexbox froggy that can help teach diff concepts in a fun way!
after feeling comfortable with it, i'd suggest playing around with ReactJS when starting out with web dev; it's easy to get into because of its extensive documentation and its large community! there are step-by-step guides into setting it up and several tutorials (both video/article)
if you decide to get into actually deploying your stuff and connecting it to APIs, you can start looking into other frameworks like NextJS/GatsbyJS etc.
getting yourself into a web dev project, like maybe making a small notes/checklist web app or your own portfolio site is a fun way to experiment!! the hardest part is always finding the motivation to start them imo :) wishing u the best on ur web dev journey!!!!! 💗
188 notes
·
View notes
Text
learning to code!
When I was 9 years old, I learned enough html to code neopets pages, my own geocities websites, and I even made forums on my own sites so my friends could all roleplay together or rant together lol. And then? I forgot so much. I no longer no how to make a forum, or even a 'next page' button - so even the dream of just making a simple blog or webnovel site feels like a huge hurdle now. (9 year old me could probably figure it out in 2 hours).
So I'm relearning! I figured this would be a fun post to place resources I find for coding, since there's coding languages, and I figure maybe if you like running you're blog then you also might be interested in tools for making blogs!
First, for those of you who miss the old geocities and angelfire type of sites to make your own free site on: neocities.org
You can make free sites you can code yourself, the way 9 year old me did. A lot of people have made SUCH amazing sites, it's baffling my mind trying to figure out how they did, I definitely wish I could make an art portfolio site even a fourth as cool as some of the sites people have made on here.
And for those pressed for time, who aren't about to learn coding right now: wix.com is the place I recommend for building a site, it requires no coding skill and is fairly straightforward about adding pages or features by clicking buttons. I used it to make my art portfolio site, I am testing out using it for my webnovel - the alternative is Wordpress, but wix.com is letting me basically make a wordpress blog Inside my own site. It's very beginner friendly in terms of "how the fuck do I set up a 'sign up for updates' message and have my site actually email these people my novel updates?" and "I need a 4x20 grid of my art down the page, that lets people click the art to see it's information and make it bigger."
I did neocities.org's little html tutorial today, it's the part of html I DID remember (links, paragraphs, headers).
My next step is to go through htmldog.com's tutorials. They go from beginner, to intermediate, to CSS. Unlike many a coding tutorial I've seen, they explain what program on your computer you need to WRITE the code in and then how to save it and how to open it. (You'd think this isn't a big deal but I've been looking into how to learn Python for months and I can't find a tutorial explaining what fucking program to write my python in... notepad? do I need something else? I don't fucking know!! My dad finally gave me a printed textbook which supposedly tells you what to download to start... I learned C++ in college and for that you needed Visual Basic to code C++, so I figured I needed Something to Write the fucking python IN.)
#coding#rant#wooh my new CODING TAG#learning to code#i feel very. odd if im honest?#i genuinely knew how to build full fucking forum websites as a child including user sign ups#and i studied Computer Science Engineering in college so i did everything with C++ we were asked to and got As#and then i promptly BLOCKED IT OUT because i#HATED studying c++ SO fucking much. i hated my whole major. i did not like Engineering. i hated it. i was so mentally destroyed#by my college major that when i graduated i got a DIFFERENT job#and do NOTHING related to my major#i want to get into a more tech focused career eventually...since that is what my fucking degree is in#but i've been looking into something with less coding OR trying to teach myself#to like coding as long as its not fucking c++ again... i cant do it. too many bad memories#i think cybersecurity sounds like a fun job.#but u know me. im a person who likes knowing the BASICS#so i feel like i need to Relearn to code and learn python decently#before i try to study cybersecurity specific shit
36 notes
·
View notes
Note
I’m a complete beginner when it comes to any coding and I’m not sure if you are or not, but was it easy to begin making the site using rarebit?
I'm a complete beginner as well! I've only coded a navigation bar back in middle school for an assignment and then never again, so Rarebit was overwhelming when I started.
However, you'll realize that it's pretty straightforward the more you read the code over and over again. I suggest opening up the Rarebit folder in an external terminal that isn't Neocities like Visual Studio Code and download the Live Preview plug-in from Microsoft. This let's you see your website in live time and not have to code blindly like in Neocities.
HTML is extremely straightforward and easy to grasp. It's CSS you have to learn and worry about since it's what makes your website look like your website.
I haven't touched Javascript yet, that's a bit more complex, but nothing a YouTube video or a forum can't help with.
It just takes time and patience like any other skill to learn!
I recently learnt how to use flexbox!

#asks#anon#idk it's just fun!#and more rewarding to create an experience for the readers to explore than to upload it on webtoon or tapas#like it reminds people that comics are a craft and aren't just content to consume#there's an experience to it
97 notes
·
View notes
Note
Do you have any advice for someone who wants to start learning how to make games? I have limited programming skills and am only really familiar with html/css…
This really depends on the types of games you want to make! A lot of engines today make it really easy to assemble what you have in mind like renpy or rpg maker or gbstudio without needing to know a lot of programming. If you have something more complex in mind you might want to look into something like godot? (I hesitate to recommend unity or unreal these days) I've found the godot programming language pretty understandable for beginners.
Another general tip is to really keep your first projects small. If you follow a few tutorials, and then are lost on your big project, you should shrink your scope, some of the best practice you can get making games is to finish something, so you're not spending so much time sinking into it when you're not totally sure how you're going to progress. A small project is one that you can plan out your complete route on in advance.
Sorry I don't have too much more advice for this lately, making my own games recently have been a very slow process because of my job.
13 notes
·
View notes
Note
Hi flipse! I know you don't teach but what advice would you give to start making themes?
Apparently a hot take, but: Make it responsive.
Learn how to do that, it's so simple. hell my tumblr basecode has eveything in it already for you to use!! (don't need to use it just learn from it at least!)
There's this weird thing with Tumblr that seem to be stuck in 2014 where no themes were responsive. Like, we all have different screen sizes, it's such an insane thing to only make it work for like 20% of people.
Also good place to start: https://www.htmlforpeople.com/
and HTML and CSS course for absolute beginners on youtube
12 notes
·
View notes
Text
After taking a "blog break," I’m excited to start sharing some of the projects I’ve been working on during my time away! One of the highlights is a custom widget I created for Notion—a photocard featuring my favorite band, PLAVE. This widget is perfect for fellow PLAVE fans (Plli), allowing them to display a "fanmade" photocard of their favorite band members right on their Notion pages.
I began this project not only to celebrate my love for PLAVE but also to dive deeper into the world of Notion widgets and explore what’s possible.
Let’s dive into the details of how I built it and the creative process behind it!
I started this project back in May, right after I discovered PLAVE in April! Around that time, I started following a 'photocard editor' on Twitter who creates these fantastic 'unofficial' collectible photocards of PLAVE. I fell in love with her edits immediately. I was also using Notion extensively to keep my Korean studies organized, so I thought, why not combine my passion for Korean learning with my love for PLAVE?
I wanted to create a public widget that other PLAVE fans could easily add into their own Notion pages. To be respectful and ensure proper credit, I reached out to the editor, Jane, to ask if I could use her edits in my widget. I explained my project idea and shared some Figma wireframes to show how the widget would look and function. Jane was excited about the concept and gave me her blessing to move forward. I didn’t start any programming until I had her approval!
For this project, I needed to create two main components: the widget itself and a webpage with information and installation instructions. Surprisingly, the info and installation page turned out to be more challenging than developing the widget! I’m a bit of a perfectionist, so I wanted to ensure the page was user-friendly, responsive, and easy to navigate. It was tougher than I wished for!
As for the widget, it was relatively straightforward to develop and only took me about two days. However, I did face some issues with broken links that I still need to fix, and I’m not quite sure why they’re not working. Usually, I’m a ReactJS enthusiast, but since this was a smaller project, I decided to use my "beginner combo": HTML, CSS (including SCSS), and JavaScript. I quickly realized how accustomed I’ve become to ReactJS because I kept writing code that didn’t work in Vanilla JavaScript—talk about a wake-up call!
In the end, I completed the project to a point where it was ready to present to both the PLLIs (PLAVE fans) and Jane. I found myself eagerly awaiting Jane’s feedback because her artwork was integral to the project. If she wasn’t happy with the outcome, I would have felt the same. Thankfully, she loved it! I officially posted the widget on Twitter/X, and Jane shared it as well. Although most of the users were Korean, reading their translated positive comments made me genuinely happy.
Who knows? Maybe in the future, I’ll work on another PLAVE-themed project. I really enjoyed creating this one!
Feel free to check out the project and try installing the widget on your Notion page:
The official tweet about the project
The installation page
The widget in template Notion page
fyi, it still needs work, I will get to it eventually~~~!
#xc: project logs#codeblr#coding#progblr#programming#studyblr#studying#comp sci#coding project#programming project#notion#PLAVE#plave#plli
33 notes
·
View notes
Text
unironically carrd is actually a really good introduction to HTMLCSS. it teaches you about container divs, anchors, padding, margin, etc. i had a much easier time learning at the beginning because of my experience with carrd.
if you know how to make carrds, you really should look into learning HTMLCSS. its really not that hard and you already have a lot of the basic construction knowledge, plus youll have learned an actually impressive skill that you can show off. you can do so much more with it than you can with carrd, and you can use sites like neocities or nekoweb, both are completely free and have cool communities.
theres a million posts out there with lists of links to places to start learning HTML, w3schools is probably the most popular but you can literally just look up “html/css beginners guide” and take your pick. theres a whole world of creative opportunity out there and you’re limiting yourself by sticking to carrd, join the neocities army.
20 notes
·
View notes
Text
How to Build Software Projects for Beginners
Building software projects is one of the best ways to learn programming and gain practical experience. Whether you want to enhance your resume or simply enjoy coding, starting your own project can be incredibly rewarding. Here’s a step-by-step guide to help you get started.
1. Choose Your Project Idea
Select a project that interests you and is appropriate for your skill level. Here are some ideas:
To-do list application
Personal blog or portfolio website
Weather app using a public API
Simple game (like Tic-Tac-Toe)
2. Define the Scope
Outline what features you want in your project. Start small and focus on the minimum viable product (MVP) — the simplest version of your idea that is still functional. You can always add more features later!
3. Choose the Right Tools and Technologies
Based on your project, choose the appropriate programming languages, frameworks, and tools:
Web Development: HTML, CSS, JavaScript, React, or Django
Mobile Development: Flutter, React Native, or native languages (Java/Kotlin for Android, Swift for iOS)
Game Development: Unity (C#), Godot (GDScript), or Pygame (Python)
4. Set Up Your Development Environment
Install the necessary software and tools:
Code editor (e.g., Visual Studio Code, Atom, or Sublime Text)
Version control (e.g., Git and GitHub for collaboration and backup)
Frameworks and libraries (install via package managers like npm, pip, or gems)
5. Break Down the Project into Tasks
Divide your project into smaller, manageable tasks. Create a to-do list or use project management tools like Trello or Asana to keep track of your progress.
6. Start Coding!
Begin with the core functionality of your project. Don’t worry about perfection at this stage. Focus on getting your code to work, and remember to:
Write clean, readable code
Test your code frequently
Commit your changes regularly using Git
7. Test and Debug
Once you have a working version, thoroughly test it. Look for bugs and fix any issues you encounter. Testing ensures your software functions correctly and provides a better user experience.
8. Seek Feedback
Share your project with friends, family, or online communities. Feedback can provide valuable insights and suggestions for improvement. Consider platforms like GitHub to showcase your work and get input from other developers.
9. Iterate and Improve
Based on feedback, make improvements and add new features. Software development is an iterative process, so don’t hesitate to refine your project continuously.
10. Document Your Work
Write documentation for your project. Include instructions on how to set it up, use it, and contribute. Good documentation helps others understand your project and can attract potential collaborators.
Conclusion
Building software projects is a fantastic way to learn and grow as a developer. Follow these steps, stay persistent, and enjoy the process. Remember, every project is a learning experience that will enhance your skills and confidence!
3 notes
·
View notes
Text
USEFUL TIPS FOR ANYONE USING NEOCITIES
So, I saw this super awesome post called BEGINNERS GUIDE TO BLUESKY and it more or less inspired me to make a post of my own pertaining to the the likes of Neocities.
What is Neocities?
Long story short, it is an open-source web hosting service that is both F2U (1 GB storage/200 GB bandwidth) and P2U (50 GB storage/3000 GB bandwidth). It's kinda sorta a spiritual successor to the now defunct GeoCities.
Why Use Neocities?
HELPFUL LINKS
Neocities has a full on Tutorials Page to help people wanting to learning how to code. Though I will say that I'm a bit surprised they don't have W3 Schools on there.
CREATIVE FREEDOM
If you Browse on Neocities, you will see how vastly different all of the websites look. That being said, you have an enormous amount of creative freedom when it comes to making your website. You can build it from scratch or look up some pre-made templates from websites such as templatemo, HTML5 Templates, TEMPLATED, template4all, and many more.
Now it is important to note that Neocities doesn't allow certain things such as jQuery, PHP, Python, SQL, etc. In fact, the only things allowed on Neocities are HTML, CSS, and JavaScript! Though I do think it is important to note that you can turn your website into a blog using Zonelets, have a Guestbook/Comments Section with Guestbooks, embed your Bluesky feed with Embed Bsky, embed your Twitter/X feed with Twitter Publish, and much more!
What Do People Use Neocities For?
Some people use it for blogging & portfolio & educational purposes. Some people use it to share their writings & artwork & music. Some people use it to help people with finding neat things. Some people use it for shits and giggles. There are legitimately a number of reasons people use it and you know what? That's 100% a-okay!
Are Any Programs Required To Use Neocities?
Technically, no. The reason I say this is because Neocities has a built-in HTML Editor. However, I don't like using it unless if I absolutely have to (which is next to never). Instead, I use Brackets. It's very user-friendly and it legit lets you know if there's a goof somewhere in your code. Legit 10 out of 10 recommend. Though I will say that some people use Notepad++.
#pvposeur's tutorial#pvposeur's tutorials#pvposeur's how tos#pvposeur's how to#pvposeur's psa#pvposeur's public service announcements#pvposeur's public service announcement#tutorial#tutorials#how to#how tos#psa#public service announcements#public service announcement#neocities#free to reblog
2 notes
·
View notes
Text
How to get into Coding!
Coding is very important now and in the future. Technology relies on coding and in the future you will need to know how to code to get a high-paying job. Many people consider having Computer Science field-related jobs, especially in AI. What if you are interested it in general or as a hobby? What if you don't know what you want to do yet for college?
Pick a language you want to learn: Personally, I started out with HTML and CSS. I recommend if you want to do web design HTML and CSS are good languages to start with. Otherwise, start with JavaScript or Python.
2. Find Resources: Basically you want to look at videos on YouTube, and take classes that have coding like AP CSP, AP CS A (harder class), Digital Information Technology, etc. You can also attend classes outside in the summer like CodeNinjas and use websites like code.org, freeCodeCamp, and Codecademy. Also, ask your friends for help too! You can find communities on Reddit and Discord as well.
3. Start Practicing: Practice slowly by doing small projects like making games for websites and apps. You can work with friends if you are still a beginner or need help. There's also open-source coding you can do!
4. Continue coding: If you don't continue, you will lose your skills. Be sure to always look up news on coding and different coding languages.
5. Certifications: If you are advanced in coding or want to learn more about technology, you can do certifications. This can cost a lot of money depending on what certification you are doing. Some school districts pay for your certification test. But if you take the test and pass, you can put it on your resume, and job recruiters/interviewers will be impressed! This can help with college applications and show initiative if you want a computer science degree. This shows you are a "master" of the language.
#tech#coding#learning#education#hobby#fun#jobs#high school#college#university#youtube#reddit#certification#javascript#java#python#html css#css#html#ap classes#ap csp#information technology#technology#computer science#programming#software engineering#web design#web development#discord chat#discord server
10 notes
·
View notes