Eine Website für Online Portfolio-Webentwickler ist ein Muss, wenn Sie es ernst meinen, ein Webentwickler zu sein, die besten Kunden anziehen und aus der Ferne arbeiten möchten.
Ihre Portfolio-Website für Webentwickler ist Ihr persönlicher Online-Bereich, in dem Sie Ihre beste Webentwicklungsarbeit präsentieren und dafür eingestellt werden können. Sie riskieren, für Ihre Wunschkunden oder potenziellen Arbeitgeber völlig unsichtbar zu werden, wenn Sie es nicht haben.
Erfahren Sie, wie Sie ein ansprechendes professionelles Portfolio erstellen – und Kundenjobs sichern, indem Sie das tun, was Sie lieben – indem Sie weiterlesen.
Entwickler erstellen häufig persönliche Portfolio-Websites. Um ein effektives zu erstellen, überlegen Sie, warum Sie es erstellen und für wen Sie es erstellen. Soll es Ihnen wirklich helfen, Ihre Karriere voranzutreiben und Personalvermittler anzuziehen?
Was ist ein Portfolio?
Ein Webentwickler-Portfolio ist eine Online-Sammlung Ihrer größten Webentwicklungsprojekte, die Ihre Talente, Fähigkeiten und Arbeitsqualität angemessen darstellt. Es dient als kuratierte Sammlung Ihrer stolzesten Beispiele für professionelle Webentwicklung, die Sie potenziellen Unternehmen oder Kunden zur Anstellung zeigen können.
Was bringt es, einen zu haben?
Ein Portfolio Ihrer größten früheren Arbeiten wird oft benötigt, wenn Sie als Webentwickler angestellt werden. Ein Lebenslauf hat seinen Platz, aber in einem Portfolio zeigen Sie (anstatt zu sagen), was Sie wirklich können.
Eine Portfolio-Website für die Webentwicklung kann Ihnen dabei helfen, sich abzuheben, auch wenn dies nicht erforderlich ist. Es zeigt Ihre Hingabe, Ihre Arbeit auszustellen. Es ist auch eine Chance für Sie, Ihre Arbeit zu präsentieren und gleichzeitig Ihre Individualität zu zeigen.
Wo sollte Ihr Webentwicklungsportfolio gehostet werden?
Es gibt bereits bestehende Websites, auf denen Sie Ihr Webentwicklungsportfolio ohne großen Aufwand präsentieren können. Einige Fälle sind wie folgt:
- GitHub
- Behance
- Dribbling
- Portfolio in Adobe Photoshop
- CodePen
Es kann nicht schaden, Ihre Webentwicklungsarbeit auf einer dieser Websites zu platzieren. Aber eine selbst gehostete persönliche Website zu haben, um Ihre Webentwicklungstalente zu zeigen, kann Sie wirklich von anderen abheben.
Eine dedizierte Portfolio-Website ist Ihr persönlicher Online-Bereich, in dem Sie zusätzliche Informationen über sich selbst und Ihre Webentwicklungsarbeit teilen können. Sie können auch Links zu anderen Social-Media-Konten bereitstellen, die Sie haben, wie z. B. GitHub, StackOverflow, Quora, LinkedIn, Medium oder Twitter.
Wie sollten Sie vorgehen, um ein Webentwickler-Portfolio zu erstellen?
Bevor Sie mit irgendetwas beginnen, vergewissern Sie sich, dass Sie Folgendes verstanden haben:
- Sie können sich selbst als Front-End-Entwickler, Back-End-Entwickler oder Full-Stack-Entwickler bezeichnen, je nachdem, wie Sie sich selbst bewerben möchten.
- Websites, Web-Apps, API-Arbeit und andere Arten von Arbeiten, für die Sie beschäftigt werden möchten.
- Was zeichnet Sie aus – ein Designschwerpunkt, Know-how mit bestimmten Technologien, frühere Projekte mit bestimmten Firmen oder Kunden usw.
- Fügen Sie Projekte, die Ihr Fachwissen und Ihren Webentwicklungsstil angemessen zeigen, zu Ihren größten und unverwechselbarsten Arbeiten hinzu.
Gehen Sie danach eine Reihe von Webentwickler-Portfolios durch, um Ideen zu erhalten. Erstellen Sie eine Liste aller Designs und Layouts, die Ihnen gefallen oder nicht gefallen. Überlegen Sie, wie Sie das, was andere getan haben, auf Ihre eigene einzigartige Weise neu mischen können, um etwas Neues zu schaffen. Am Ende dieses Artikels gehen wir fünf Beispiele für innovative Webentwicklungsportfolios durch.
Es ist an der Zeit, Wireframes zu entwickeln, genau wie Sie es für einen Kunden tun würden, nachdem Sie entschieden haben, wie Sie sich präsentieren und wie Sie Ihre eigene Website organisieren und gestalten möchten.
Beginnen Sie mit einer grundlegenden MVP-Version (Minimum Viable Product) Ihrer Webentwickler-Portfolio-Website und fügen Sie nach und nach zusätzliche Informationen und Funktionen hinzu. Die Idee ist, Ihre Website so schnell wie möglich einzurichten und in Betrieb zu nehmen, damit Sie damit beginnen können, potenzielle Fernbeschäftigungen anzuziehen und Feedback zu Ihrem Portfolio zu erhalten.
Lassen Sie sich nicht in die Falle verwickeln, drei bis sechs Monate damit zu verbringen, eine protzige, professionelle Website mit allem Drum und Dran aufzubauen. Versenden Sie ein MVP und stellen Sie sich Ihre Website als einen lebenden Organismus vor.
Was sollte in Ihrem Online-Portfolio enthalten sein?
Sie müssen die folgenden sieben Elemente in Ihre Webentwickler-Portfolio-Site aufnehmen:
- Startseite
- Ihre Fähigkeiten
- Ihre Initiativen
- Über diese Seite
- Informationen zur Kontaktaufnahme
- Links anderer Plattformen zu Ihrer Arbeit
- Sie sollten Links zu Ihrem Lebenslauf und zu sozialen Netzwerken einfügen.
Lassen Sie uns einen genaueren Blick auf jeden einzelnen werfen und dann über eine schöne Ergänzung für Ihre eigene Website sprechen.
1. Homepage
Eine Webseite für Ihr Webentwicklungsportfolio sollte deutlich zeigen, wer Sie sind und was Sie tun. Wenn Sie ein Portrait von sich selbst hinzufügen, damit zukünftige Arbeitgeber oder Kunden sehen können, wie Sie aussehen, erhalten Sie Bonuspunkte.
2. Ihre vielfältigen Webentwicklungsfähigkeiten
Machen Sie eine Liste der genauen Fähigkeiten, die Sie haben, die für den Job, den Sie erreichen möchten, am relevantesten sind. Dies beinhaltet Folgendes:
- Sprachen zum Programmieren
- Frameworks und Bibliotheken sind zwei Arten von Frameworks.
- Technologien
- Tools und Programme (zB Figma, Sketch, VSCode)
Um diese Informationen leichter interpretieren zu können, sollten Sie Ihre Talente anhand von Prozentsätzen quantifizieren.
3. Frühere Projekte
Ihre Projekte sind der wichtigste Aspekt Ihres Webentwicklungsportfolios. Je nachdem, wie breit oder eingeschränkt Ihr Schwerpunkt ist, wählen Sie sechs bis zwölf Projekte mit Bedacht aus. Je mehr Projekte Sie präsentieren müssen, desto breiter wird Ihr Schwerpunkt sein. Versuchen Sie jedoch, sich auf Qualität statt Quantität zu konzentrieren.
Erstellen Sie für jedes Projekt eine Beschreibung mit den folgenden Informationen, um diesen Abschnitt Ihres beruflichen Portfolios optimal zu nutzen:
- Eine kurze Erläuterung des Projekts und seines Hintergrunds
- Die Anforderungen des Projekts
- Die Strategie, die Sie verwendet haben
- Verwendete Sprachen, Frameworks, Bibliotheken und Technologien
- Auf welche Hindernisse sind Sie gestoßen und wie haben Sie sie überwunden?
- Als die Arbeit beendet war,
- Screenshots des Endprodukts oder Links dazu
Fügen Sie, wo immer verfügbar, Links zum ursprünglichen Quellcode hinzu – zum Beispiel auf GitHub. Ermöglichen Sie zukünftigen Mitarbeitern und Kunden einen Blick hinter die Kulissen.
Erstellen Sie als Profi-Tipp kurze Videoclips, in denen Sie Ihr Projekt besprechen oder die wichtigsten Teile Ihres Codes besprechen.
4. Über diese Seite
Eine About-Seite für Ihre Webentwickler-Portfolio-Website sollte eine Geschichte darüber vermitteln, wer Sie sind und warum Sie tun, was Sie tun. Fügen Sie ein Porträtfoto hinzu, um sich zu personalisieren und potenziellen Arbeitgebern oder Kunden zu zeigen, mit wem sie zusammenarbeiten werden.
Um Ihre Persönlichkeit zu unterstreichen und einen bleibenden Eindruck zu hinterlassen, können Sie gerne einige persönliche Informationen (z. B. Hobbys oder humorvolle Erlebnisse) angeben.
5. Angaben zur Kontaktaufnahme
Wenn Sie sich die Zeit und Mühe genommen haben, eine persönliche Website für die Webentwicklung zu erstellen, ist es jetzt an der Zeit, aus Ihrer Arbeit Kapital zu schlagen. Machen Sie Ihren Website-Besuchern die Kontaktaufnahme so einfach wie möglich!
Wenn es nicht offensichtlich ist, wie Sie zu erreichen sind, werden die meisten potenziellen Arbeitgeber und Kunden nicht die Zeit oder Geduld haben, es herauszufinden. Stattdessen gehen sie höchstwahrscheinlich auf die Website eines Konkurrenten und kontaktieren ihn direkt.
Hier sind einige Strategien, um Menschen zu ermutigen, Sie über Ihre Website zu kontaktieren:
- Verwenden Sie dieses Formular, um uns zu kontaktieren.
- Um einen Anruf zu planen, verwenden Sie den Calendly-Link.
- Profile in sozialen Medien
- Live-Chat oder Chatbot
6. Links anderer Plattformen zu Ihrer Arbeit
Viele Webentwickler nutzen Portfolio-Sites wie GitHub, Behance, Dribbble, Adobe Portfolio, CodePen und andere, um ihre Arbeit zu präsentieren. Infolgedessen ist es wahrscheinlich, dass zukünftige Arbeitgeber und Kunden, die Ihre persönliche Website besuchen, auch Ihre Arbeit ansehen möchten.
Machen Sie ihr Leben einfacher und Ihre Initiativen auf anderen Plattformen besser auffindbar. So geht’s: Verlinken Sie von Ihrer persönlichen Website für die Webentwicklung einfach auf Ihre Profile auf anderen Portfolio-Websites.
7. Sie sollten Links zu Ihrem Lebenslauf und zu sozialen Netzwerken einfügen.
Selbst wenn Sie über ein Webentwicklungsportfolio verfügen, werden Arbeitgeber und Kunden mit ziemlicher Sicherheit Ihren Lebenslauf sehen wollen. Daher ist es eine gute Idee, einen klaren Link zu Ihrem Lebenslauf auf Ihrer Website zu haben.
Viele Webentwickler sind in sozialen Netzwerken aktiv und diskutieren dort über Themen rund um ihren Beruf. Wenn das auf Sie zutrifft, stellen Sie sicher, dass Ihre persönliche Website Links zu Ihren Social-Media-Plattformen enthält.
Wenn Ihre Social-Media-Konten für Ihren Job nicht relevant oder nicht arbeitsangemessen sind, verlinken Sie nicht darauf. Denken Sie jedoch daran, dass Rekrutierungsvorgesetzte mit ziemlicher Sicherheit Ihre Social-Media-Seiten durchsuchen werden. Erwägen Sie, soziale Konten privat zu halten oder möglicherweise anstößige Inhalte zu entfernen, wenn Sie nicht möchten, dass Kinder sie sehen. 🤓
Lassen Sie uns jetzt, nachdem wir die sieben wesentlichen Aspekte eines starken Webentwickler-Portfolios behandelt haben, einen Blick auf ein Nice-to-have für Ihre Website werfen.
Der Nachweis von Social Proof ist ein Nice-to-have im Portfolio eines Webentwicklers.
Wenn Sie den Einfluss eines Dritten nutzen, um potenzielle Verbraucher zu überzeugen, verwenden Sie soziale Beweise. Hier sind einige Beispiele dafür, wie Sie soziale Beweise in Ihre Portfolio-Website für Webentwickler integrieren können:
- Erfahrungsberichte zufriedener Kunden
- Arbeitgeberempfehlungen
- Links zu Medien oder Websites, die Ihre Arbeit hervorgehoben haben
- Sie wurden in den Medien erwähnt oder erhielten ein Podcast-Interview.
- Sie haben Auszeichnungen gewonnen oder sind auf irgendeine Weise anerkannt worden.
All dies trägt zu Ihrem professionellen Ruf bei – und es sieht gut aus!
Wo machen die meisten Webentwickler Portfolio-Fehler?
Wir haben viele der empfohlenen Vorgehensweisen für Webentwickler beim Aufbau eines Portfolios durchgesehen. Also haben wir entschieden, dass es genauso wichtig ist, Ihnen zu sagen, was Sie nicht tun sollen.
Das Folgende ist eine Liste der sieben größten Portfolio-Site-Fehler, die von Webentwicklern begangen wurden:
- Qualität geht vor Quantität.
- Es gibt keine Projektausschreibungen.
- Die Funktionalität ist kaputt.
- Designs, die ablenken
- Stock Fotografie wurde verwendet.
- Es sind keine benutzerdefinierten Domänen verfügbar.
- Die Seite bekommt keinen Traffic.
Schauen wir uns jeden genauer an.
1. Qualität geht vor Quantität.
Wenn Sie zu viele minderwertige Projekte in Ihr Portfolio aufnehmen, anstatt ein paar qualitativ hochwertige, kann dies Ihrer Karriere schaden. Erwägen Sie, einige hochwertige persönliche Projekte durchzuführen, um die Lücken in Ihrem beruflichen Portfolio zu füllen, wenn Sie nicht genug haben.
2. Es gibt keine Projektzuschreibungen.
Es reicht nicht aus, Ihre Arbeit nur in Ihr Portfolio aufzunehmen. Stellen Sie sicher, dass jedes Projekt sehr detailliert beschrieben wird. Diese Informationen sollten Folgendes beinhalten:
- Präsentieren Sie das Endergebnis des Projekts.
- Erklären Sie, wie Sie Webentwicklungsprojekte angehen und worauf Sie bei Kandidaten achten.
- Zeigen Sie, wie Sie vorgehen.
Ein potenzieller Kunde wird besser verstehen, wie Sie arbeiten und welchen einzigartigen Wert Sie auf diese Weise für ein zukünftiges Projekt bieten können!
Fügen Sie Einzelheiten zu jedem Teil jedes Webentwicklungsprojekts hinzu, wie wir zuvor im Abschnitt „Portfolio-Fähigkeiten“ besprochen haben:
- JavaScript, TypeScript, HTML5, CSS, PHP und weitere Programmiersprachen
- Laravel, AngularJS, jQuery, React, Node.js, Bootstrap und andere Frameworks und Bibliotheken
- SQL Server, JAMStack, Gatsby, Netlify, GitHub und andere Technologien
- Figma, Sketch, InVision, VS Code, Mockplus, Macaw, Dreamweaver und andere Programme und Tools
- WordPress, Wix, Weebly, Webflow, Shopify und weitere Website-Ersteller
3. Die Funktionalität ist unterbrochen.
Eine fehlerhafte Funktion auf Ihrer Portfolio-Website beeinträchtigt Ihre Chancen, das Vertrauen potenzieller Arbeitgeber und Kunden zu gewinnen, die versuchen, einen Remote-Webentwickler einzustellen. Sie müssen Ihre Website ständig überwachen und verwalten, um sicherzustellen, dass alle Links, Schaltflächen, Grafiken und Animationen ordnungsgemäß funktionieren.
Dazu gehört auch sicherzustellen, dass Ihre Website für Mobilgeräte optimiert ist. Um sicherzustellen, dass Ihre Website auf allen wichtigen Geräten reaktionsschnell ist, verwenden Sie ein Tool, um sie zu testen.
4. Designs, die ablenken
Sie glauben vielleicht, dass das Hinzufügen eines auffälligen Designs oder einer auffälligen Animation zu Ihrer Portfolio-Website Ihnen helfen würde, einen Job zu finden. Wenn das Design oder die Animation jedoch unverständlich, aufdringlich oder überflüssig ist, kann dies ein negatives Licht auf Sie als Webentwickler werfen.
Konzentrieren Sie sich darauf, eine positive Benutzererfahrung zu bieten. Gehen Sie im Zweifelsfall auf die Seite der Einfachheit, um die kognitive Belastung Ihrer Website-Besucher zu verringern.
5. Stock Fotografie wurde verwendet.
Stock-Fotografie wird auf einer großen Anzahl von Websites verwendet. Es hilft Ihnen nicht, sich abzuheben, wenn Sie es auf Ihrer Portfolio-Website verwenden. Vielmehr erweckt es den Eindruck, dass Sie knausern.
Erstellen Sie einzigartige Kunstwerke oder bezahlen Sie stattdessen einen Designer, um maßgeschneiderte Designs zu erstellen. Es ist Zeit, in Ihr professionelles Portfolio zu investieren!
6. Es sind keine benutzerdefinierten Domänen verfügbar.
Es kann bedeuten, dass Sie eine Neigung zum Abschneiden haben, ähnlich wie bei der Verwendung von Stock-Bildern. Sparen Sie nicht an diesem.
Wählen Sie eine vergleichbare und sinnvolle Domain, wenn keine eigene Domain mit Ihrem genauen Vor- und Nachnamen verfügbar ist. Es ist viel besser als eine Subdomain von einer Plattform wie WordPress oder Webflow.
7. Die Website erhält keinen Verkehr.
Leider reicht es nicht aus, nur eine Portfolio-Website zu erstellen. Wenn Sie möchten, dass potenzielle Mitarbeiter oder Kunden es sehen, lenken Sie den Verkehr dorthin.
Hier sind einige Websites, auf denen Ihre Website verlinkt werden könnte, um den Traffic zu erhöhen:
- Dein Lebenslauf für die Webentwicklung
- Ihr Anschreiben für einen Webentwickler
- Profile in sozialen Medien (z. B. LinkedIn, Twitter, Linktree)
- Signatur in einer E-Mail
- Profile auf Medium oder Quora
- Profile in Slack oder Discord
Sie können auch Blogging und SEO verwenden, um Besucher für Ihre Website zu generieren. Wenn Sie Ihre Fähigkeiten und Erkenntnisse in der Webentwicklung teilen, können mehr Menschen Ihre Website finden und Sie als Vordenker auf diesem Gebiet etablieren. Das ist eine Win-Win-Situation für Sie!
Wir haben uns jetzt mit den häufigsten Fehlern befasst, die Webentwickler in ihren Portfolios machen. Es ist an der Zeit, sich einige Beispiele für Portfolio-Websites anzusehen.
Das ist alles, was wir haben, und wir hoffen, dass die Aussicht, einen eigenen Online-Bereich einzurichten, zu dem Sie andere einladen können, Sie begeistert! Teilen Sie uns im Kommentarbereich unten mit, wenn Sie Fragen, Kritik oder Ratschläge zur Erstellung einer Portfolio-Website für Online-Webentwickler haben.
