Hur webbplatser fungerar: ta reda på vad som finns under huven

Många tekniker används för att skapa webbplatser. Innehållshanteringssystem, ramverk, olika skript- och programmeringsspråk, betalningssystem… mycket!

Om du undrar hur din favoritwebbplats fungerar, eller vill se om en webbplats använder något skissartat, kommer den här artikeln att visa dig några sätt att titta under huven och se hur det fungerar.

Se webbplatsens kod

Om du inte är en utvecklare eller precis har börjat kommer du snart att lära dig hemligheten bakom bättre programmering. Titta på andras kod. Vi har visat dig hur du använder Chromes utvecklarverktyg för att göra just det.

ChromeDevTools hjälpa dig att granska koden HTML , JavaScript och css webbplats, ta reda på vilka källor de kan använda och hur du testar din webbplats laddningsprestanda i en webbläsare. Vissa versioner av utvecklarverktygen finns tillgängliga i alla större webbläsare.

BuiltWith.com är en resurs på professionell nivå som dyker djupt ner i webbplatser för att se all teknik de använder. De täcker för närvarande över 673 miljoner webbplatser och fortsätter att växa. Huvudidén bakom sajten var att hjälpa till att generera leads för människor i mjukvarubranschen.

Avancerade funktioner är endast tillgängliga med en betalprenumeration, men alla kan gå till webbplats BuiltWith.com(BuiltWith.com), ange en webbadress, tekniknamn eller nyckelord och få en detaljerad teknikprofil. Registrera(Sign) gratis konto och du kan göra fem detaljerade sökningar per dag.

Netcraft har varit en resurs för webbutvecklare sedan 1995. Deras 25 års erfarenhet återspeglas i det kostnadsfria Netcraft-verktyget webbplatsrapport. Den kombinerar en teknikrapport med en “vem äger sajten” bakgrundsrapport så att du får en fullständig överblick över sajten. Du kommer att veta var den finns och vem som äger den, samt lite domänhistorik.

Rapportera om Netcrafts webbplats(Netcraft Site Report) tillåter obegränsad sökning. Använd det dock bara när du verkligen behöver det. Det här är en gratis resurs och utvecklargemenskapen skulle vilja behålla det så.

W3Techs webbplatsinformationsverktyg fungerar lite annorlunda än de andra. De upprätthåller en databas med information, men bara på webbplatser som redan har sökts med verktyget. Om du kontrollerar en webbplats som inte har kontrollerats tidigare kommer den att genomsökas direkt.

Rapporten som tillhandahålls är mindre detaljerad än andra tjänster, men ändå informativ. Du får reda på vilken CMS programmeringsspråk, webbserver och värdleverantör använder webbplatsen. W3Techs tillhandahåller även webbläsartillägg för Firefox och Krom så att du kan kolla webbplatser med ett enda klick eller tryck.

Om du föredrar att använda en webbläsarplugin för att testa webbplatsteknik, Wappalyzer det finns plugins för Firefox, Chrome och Edge. Plugins är gratis, lätta att använda och har en lättläst design. Om du klickar på någon teknik i rapporten kommer du till dess förklaring, vilket är bra om du hittar något du inte har sett tidigare.

Wappalyzer erbjuder en unik funktion med möjligheten att skapa en varning för en webbplats. De kollar webbplatsen dagligen och skickar ett e-postmeddelande till dig om de hittar några ändringar. Varningen kräver att du skapar ett gratis konto på Wappalyzer och kostar 10 krediter per månad.

Men du får 50 krediter gratis varje månad, och varningen kostar bara 10 krediter för var 30:e dag. Så Wappalyzer-varningar är praktiskt taget gratis så länge du följer 5 webbplatser eller färre.

alla tjänster webbspotter , förutom en, betalas, men det är okej. Deras gratis Webspotter Chrome-tillägg kompenserar för detta. Förlängning webbspotter Liknande Wappalyzer , men har flera skillnader. Bredvid varje listad teknik finns länkar till statistik om tekniken, en lista över webbplatser som använder den tekniken och teknikens officiella webbplats.

En ännu mer spännande funktion är Webspotters förmåga att extrahera e-postkontakter, länkar till sociala medier, SEO-analyser och annan företagsinformation från en webbplats. Även om detta inte berättar hur sajten är gjord, kan den vara användbar för marknadsföring på nätet eller till och med jobbsökande.

Kanske är du inte särskilt intresserad av webbutveckling, men du bygger en hemsida på WordPress och vill inkludera funktioner som har setts på andra ställen. Ladda ner WordPress Theme Detector Chrome-plugin) .

WordPress temadetektor(WordPress Theme Detector) kommer inte bara att berätta vilket WordPress-tema som webbplatsen använder, utan det kommer också att berätta vilka WordPress-plugins den använder. Den visar dig också vem som skapat temat eller plugin-programmet och ger dig en länk där du kan få tag på det. Detta gör det enkelt att inkludera på din webbplats WordPress föremål som du har beundrat på andra webbplatser.

Lär dig hur webbplatser fungerar

Ja, det är så enkelt att gå till vilken webbplats som helst på Internet(Internet) och se vad den är gjord av. Försök att använda två eller flera av dessa verktyg, eftersom vissa av dem kommer att fånga upp saker som andra inte förstår. Det mesta av det du ser på webbplatsen visas faktiskt på din dator. Det är det som gör det lättare att se. Detta är också anledningen till att du behöver göra din webbplats så säker som möjligt. Njut av djupdykning och låt oss veta vad du hittade eller byggde.

Många tekniker används för att bygga webbplatser. Innehållshanteringssystem, ramverk, olika skript- och programmeringsspråk, betalningssystem … alla möjliga saker!

Om du är nyfiken på hur din favoritwebbplats fungerar, eller vill se om en webbplats använder något skissartat, kommer den här artikeln att visa dig flera sätt att titta under huven och se hur den är byggd.

Se webbplatsens kod

Om du inte är en utvecklare, eller precis har börjat, är du på väg att lära dig hemligheten bakom bättre programmering. Titta på andras kod. Vi har visat dig hur du använder Chromes utvecklarverktyg för att göra just det.

ChromeDevTools hjälper dig att se en webbplatss HTML-, JavaScript- och CSS-kod, ta reda på vilka källor de kan använda, samt hur du kontrollerar en webbplatss laddningsprestanda i webbläsaren. Alla större webbläsare har någon version av utvecklarens verktyg tillgängliga.

BuiltWith.com är en resurs på professionell nivå som går djupt in på webbplatser för att se all teknik de använder. För närvarande täcker de över 673 miljoner webbplatser och allt fler. Huvudidén bakom sajten var att hjälpa till att generera leads för personer inom mjukvaruförsäljning.

De avancerade funktionerna är endast tillgängliga genom ett betalabonnemang, men vem som helst kan gå till BuiltWith.com, ange en webbadress, tekniknamn eller nyckelord och få en detaljerad teknikprofil. Registrera dig för ett gratis konto så kan du göra fem detaljerade sökningar om dagen.

Netcraft har varit en resurs för webbutvecklare sedan 1995. Deras expertis under 25 år visar sig i Netcrafts kostnadsfria webbplatsrapportverktyg. Den kombinerar en teknikrapport med en bakgrundsrapport för “vem äger sajten”, så att du får en grundlig överblick över sajten. Du vet var den finns och vem som äger den, plus lite domänhistorik.

Netcraft Site Report verkar tillåta obegränsade uppslagningar. Ändå, använd den bara när du verkligen behöver den. Det är en gratis resurs och utvecklargemenskapen skulle vilja se att det förblir så.

W3Techs Sites Info-verktyg fungerar lite annorlunda än de andra. De håller en databas med information, men bara på webbplatser som redan har sökts igenom verktyget. Om du tittar på en webbplats som inte har kontrollerats tidigare kommer den att genomsöka webbplatsen direkt.

Den tillhandahållna rapporten är mindre djupgående än andra tjänster tillhandahåller, men ändå insiktsfull. Du får reda på vilket CMS, programmeringsspråk, webbserver och värdleverantör en webbplats använder. W3Techs tillhandahåller även webbläsartillägg för Firefox och Chrome så att du kan kolla webbplatser med bara ett klick eller ett tryck.

Om du föredrar att ha en webbläsarplugin för att kontrollera en webbplatss teknologi, har Wappalyzer plugins för Firefox, Chrome och Edge. Plugins är gratis, lätta att använda och är utformade i en lättläst design. Om du klickar på någon teknik i rapporten kommer du till en förklaring av den, vilket är bra om den hittar något du inte har sett tidigare.

Wappalyzer erbjuder en unik funktion med möjligheten att skapa en varning för en webbplats. De kollar webbplatsen dagligen och mailar dig om de upptäcker en förändring. Varningen kräver att du skapar ett gratis konto hos Wappalyzer och kostar 10 krediter per månad.

Men du får 50 krediter gratis varje månad och en varning kostar bara 10 krediter för var 30:e dag. Så Wappalyzer Alerts är i princip gratis om du övervakar 5 eller färre webbplatser.

Alla utom en tjänst hos Webspotter är en betaltjänst, men det är okej. Deras gratis Webspotter Chrome-tillägg kompenserar för det. Webspotter-tillägget liknar Wappalyzer, men det har några olika funktioner. Bredvid varje listad teknik finns länkar till statistik om tekniken, en lista över webbplatser som använder den tekniken och den officiella webbplatsen för tekniken.

En ännu mer spännande funktion är Webspotters förmåga att dra e-postkontakter, länkar till sociala medier, SEO-analyser och annan företagsinformation från en webbplats. Även om det inte berättar om hur sajten är gjord, kan den vara användbar för marknadsföring på nätet eller till och med jobbsökande.

Du kanske inte är så intresserad av webbutveckling men du håller på att skapa en WordPress-webbplats och skulle vilja inkludera funktioner som du har sett någon annanstans. Ladda ner WordPress Theme Detector Chrome-webbläsarplugin.

Inte bara kommer WordPress Theme Detector att berätta vilket WordPress-tema en webbplats använder, utan det kommer också att berätta vilka WordPress-plugins den använder. Den visar dig också vem som skapade temat eller plugin-programmet och ger en länk till var du kan få tag på dem. Det gör det så enkelt att integrera element i din WordPress-webbplats som du har beundrat på andra webbplatser.

Lär dig hur webbplatser fungerar

Ja, det är så enkelt att dyka in på vilken webbplats som helst på Internet och se vad den är gjord av. Försök att använda två eller flera av dessa verktyg, eftersom vissa kommer att ta upp saker som andra inte gör. Det mesta av det du ser på en webbplats renderas faktiskt på din dator. Det är det som gör det lätt att titta på. Det är också anledningen till att du måste göra din webbplats så säker som möjligt. Njut av din djupdykning och låt oss veta vad du hittar eller bygger.